[Feature]: Improve threeshaking with webpack

[chuckmah]

Describe the feature

Currently , the bundling of the lib make it impossible for webpack to properly treeshake. When importing a single primitive the resulting webpack bundle contain all the code from all components and deps of the lib which is like 75kb minified. I guess this is related to an other feature request (#808)

From my investigation this is probably due to vitejs/vite#5174. I patched a radix-vue version using the solution proposed in vitejs/vite#5174 (comment) and I had proper treeshaking from webpack 5

Here's a snippet of my final patched vite.config.ts file

[... rest of the file]
    rollupOptions: {
      // make sure to externalize deps that shouldn't be bundled
      // into your library (Vue)
      external: ['vue', '@floating-ui/vue', '@internationalized/date', '@internationalized/number'],
      output: {
        preserveModules: true,

        // Provide global variables to use in the UMD build
        // for externalized deps
        globals: {
          'vue': 'Vue',
          '@floating-ui/vue': '@floating-ui/vue',
          '@internationalized/date': '@internationalized/date',
          '@internationalized/number': '@internationalized/number',
        },
        assetFileNames: (chunkInfo) => {
          if (chunkInfo.name === 'style.css')
            return 'index.css'
          return chunkInfo.name as string
        },
      },
    },

i'm not proposing this a proper PR because it probably break other bundler just posting for reference.

Thanks for this great lib

Additional information

• I intend to submit a PR for this feature.
• I have already implemented and/or tested this feature.

[zernonia]

Thanks for the ticket and provided solution! Feel free to create a PR for this 😁