-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[DataGrid] Allow to pass props to the TrapFocus
inside the panel wrapper
#7733
Conversation
These are the results for the performance tests:
|
MUIStyledCommonProps<Theme> {} | ||
|
||
const GridPanelWrapper = React.forwardRef<HTMLDivElement, GridPanelWrapperProps>( | ||
function GridPanelWrapper(props, ref) { | ||
const { className, ...other } = props; | ||
const { className, TrapFocusProps: TrapFocusPropsProps, ...other } = props; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I wonder about the convention used in this context. Would it make more sense with?
const { className, TrapFocusProps: TrapFocusPropsProps, ...other } = props; | |
const { className, slotProps, ...other } = props; |
It would become:
<DataGrid
componentsProps={{ filterPanel: { slotProps: { trapFocus: { disableRestoreFocus: true } } } }}
/>
const rootProps = useGridRootProps(); | ||
const ownerState = { classes: rootProps.classes }; | ||
const classes = useUtilityClasses(ownerState); | ||
|
||
return ( | ||
<TrapFocus open disableEnforceFocus isEnabled={isEnabled}> | ||
<TrapFocus open disableEnforceFocus isEnabled={isEnabled} {...slotProps}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To support the example usage from #7733 (comment), we need to spread slotProps.trapFocus
instead.
<TrapFocus open disableEnforceFocus isEnabled={isEnabled} {...slotProps}> | |
<TrapFocus open disableEnforceFocus isEnabled={isEnabled} {...slotProps.trapFocus}> |
You also need to do slotProps = {}
when extracting the prop from props
above.
TrapFocus
inside panel wrapper
TrapFocus
inside panel wrapperTrapFocus
inside the panel wrapper
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I pushed 408bb8b fixing the remaining errors. Thanks!
…apper (mui#7733) Co-authored-by: Matheus Wichman <matheushw@outlook.com>
Workaround for #7044