| 532 | } |
| 533 | |
| 534 | const SecondaryCheckbox: React.FC<CheckboxProps> = ({id, children, ...props}) => { |
| 535 | const checkboxId = useId(id) |
| 536 | const {selectionVariant} = React.useContext(SelectPanelContext) |
| 537 | |
| 538 | // Checkbox should not be used with instant selection |
| 539 | invariant( |
| 540 | selectionVariant !== 'instant', |
| 541 | 'Sorry! SelectPanel.SecondaryAction with variant="checkbox" is not allowed inside selectionVariant="instant"', |
| 542 | ) |
| 543 | |
| 544 | return ( |
| 545 | <Box sx={{display: 'flex', alignItems: 'center', gap: 2}}> |
| 546 | <Checkbox id={checkboxId} sx={{marginTop: 0}} {...props} /> |
| 547 | <InputLabel htmlFor={checkboxId} sx={{fontSize: 0}}> |
| 548 | {children} |
| 549 | </InputLabel> |
| 550 | </Box> |
| 551 | ) |
| 552 | } |
| 553 | |
| 554 | export type SelectPanelSecondaryActionProps = {children: React.ReactNode} & ( |
| 555 | | ({variant: 'button'} & Partial<Omit<ButtonProps, 'variant'>>) |