[RFC] Drop the component prop from all Base UI components

[mnajdova]

Summary 💡

Currently, there are two different APIs for setting the root slot in Base UI (using the component prop and using the slots.root prop).

The difference between these two APIs is that the component prop makes the component polymorphic, which means that you can propagate the root component's props on the unstyled component directly, without getting typescript issues. However, this has shown to have big performance implications when doing the type checks (see some existing issues for the Material UI's components).

Progress 🚧

This is the list of components that should be changed with this proposal:

• Badge [Badge][base] Drop component prop #37028
• Button [Button][base] Drop component prop #36677
• FormControl [FormControl][base] Drop component prop #37031
• Input [Input][base] Drop component prop #37057
• MenuItem [MenuItem][base] Drop component prop #37032
• Menu [Menu][base] Drop component prop #37033
• Modal [Modal][base] Drop component prop #37058
• OptionGroup [OptionGroup][base] Drop component prop #37055
• Option [Option][base] Drop component prop #37052
• Popper [Popper][base] Drop component prop #37084
• Select [Select][base] Drop component prop #37035
• Slider [Slider][base] Drop component prop #37056
• Snackbar [Snackbar][base] Drop component prop #37041
• Switch [Switch][base] Drop component prop #37053
• TablePagination [TablePagination] Drop component prop #37059
• TabPanel [TabPanel] drop component prop #37054
• TabsList [TabsList] Drop component prop #37042
• Tabs [Tabs][base] Drop component prop #36770
• Tab [Tab][base] Drop component prop #36768

[sai6855]

Not sure if it's relevant to this issue - I've opened a PR while back which fixes typescript issues when using component prop in material UI components. #35924.

I'm just wondering relevance of the PR as component is being removed from Base UI package

[nicolas-ot]

I am working on the Snackbar component

PR: #37041

[nicolas-ot]

I am working on the TextareaAutosize component

edit: TextareaAutosize doesn't have slots nor component props, so I think it's irrelevant here

[nicolas-ot]

I am working on the Popper component

PR: #37060

[hbjORbj]

thanks.. I will update the descriptions

[sai6855]

i'll pick up tablepagination

[hbjORbj]

@sai6855 @nicolas-ot
Hey! Please check out this comment: #37028 (comment)

[sai6855]

@hbjORbj addressed in #37059, #36770. didn't addressed in remaining PR's (#37054, #37042, #36768) because they didn't have dedicated documentaion page

[hbjORbj]

@sai6855 Reviewed them. All looks ready :)

[nicolas-ot]

@sai6855 @nicolas-ot Hey! Please check out this comment: #37028 (comment)

updated #37060 and #37041

[hbjORbj]

@nicolas-ot @sai6855 We got the job done! The changes will be included in today's release. Appreciate a lot for your amazing contributions.. :)