Consolidate Breaking Changes in Tonic UI v3

[cheton]

Breaking Changes in Tonic UI v3

This issue will address the breaking changes introduced in Tonic UI v3.

Use slots and slotProps to replace Component and ComponentProps

Inner element overrides

https://mui.com/material-ui/migration/migrating-from-deprecated-apis/#inner-element-overrides for details

The slots and slotProps APIs are in the process of being standardized. The analogous APIs—components, componentsProps, <SlotName>Component, and <SlotName>Props—are going to be deprecated and eventually removed. This improves the developer experience through consistency, predictability, and reduced cognitive load.

Affected components

The following components are affected by this change:

Name	Components	Deprecated Props
accordion	AccordionContent	TransitionComponent TransitionProps
date-pickers	DatePickerContent	PopperComponent PopperProps TransitionComponent TransitionProps
drawer	DrawerContent	TransitionComponent TransitionProps
drawer	DrawerOverlay	TransitionComponent TransitionProps
menu	MenuContent	PopperComponent PopperProps TransitionComponent TransitionProps
menu	SubmenuContent	PopperComponent PopperProps TransitionComponent TransitionProps
modal	ModalContent	TransitionComponent TransitionProps
modal	ModalOverlay	TransitionComponent TransitionProps
popover	PopoverContent	PopperComponent PopperProps PopoverArrowComponent PopoverArrowProps TransitionComponent TransitionProps
toast	ToastManager	TransitionComponent TransitionProps
tooltip	Tooltip	PopperComponent PopperProps TooltipArrowComponent TooltipArrowProps TransitionComponent TransitionProps
tooltip	TooltipContent	PopperComponent PopperProps TooltipArrowComponent TooltipArrowProps TransitionComponent TransitionProps
tree	TreeItem	TransitionComponent TransitionProps

AccordionContent

TransitionComponent

The AccordionContent's TransitionComponent was deprecated in favor of slots.transition:

 <AccordionContent
-  TransitionComponent={CustomTransition}
+  slots={{ transition: CustomTransition }}
 />

TransitionProps

The AccordionContent's TransitionProps was deprecated in favor of slotProps.transition:

 <AccordionContent
-  TransitionProps={{ unmountOnExit: true }}
+  slotProps={{ transition: { unmountOnExit: true } }}
 />

Component Updates

DatePicker

• closeOnSelect: The default value has been updated from false to true, so the date picker will now automatically close when a date is selected.