Add 'radix-ui' to default optimizePackageImports configuration

[sauravsid]

Goals

1. Automatically optimize bundle size for applications using Radix UI components
2. Eliminate the need for manual optimizePackageImports configuration when using radix-ui
3. Prevent entire Radix UI module from being included in final bundle when only specific components are imported
4. Align Radix UI optimization with other pre-configured UI libraries in Next.js

Background

Radix UI has consolidated their component library into a single package 'radix-ui', moving away from separate packages for each component. However, without proper optimization, importing individual components like import { Dialog, DropdownMenu } from 'radix-ui' results in the entire 'radix-ui' modules being included in the final bundle, significantly increasing bundle size.

Currently, developers must manually configure optimizePackageImports: ['radix-ui'] in their next.config.js to enable tree-shaking. This manual step is often overlooked, leading to unnecessarily large bundles in production applications using Radix UI.

Proposal

Add 'radix-ui' to the default optimizePackageImports array in Next.js, similar to how other popular UI libraries. This would automatically enable tree-shaking for Radix UI imports without requiring any developer configuration and ensure only the imported components and their dependencies are included in the final bundle, rather than the entire Radix UI library.