Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix(form): useIndeterminateChecked supports MenuItemCheckbox with new…
… option
  • Loading branch information
mlaursen committed Jul 3, 2021
1 parent 2d20848 commit 9ab67bf
Show file tree
Hide file tree
Showing 2 changed files with 242 additions and 95 deletions.
Expand Up @@ -25,38 +25,27 @@ const labels = {
d: "Label 4",
} as const;

function toCheckedChange<P extends { onChange(): void }>({
onChange,
...props
}: P): Omit<P, "onChange"> & { onCheckedChange(): void } {
return {
...props,
onCheckedChange: onChange,
};
}

export default function MenusWithFormControls(): ReactElement | null {
const [bold, setBold] = useState(false);
const [italic, setItalic] = useState(false);
const [decoration, setDecoration] = useState<Decoration>("none");
const [checked, setChecked] = useState(false);
const { rootProps, getProps } = useIndeterminateChecked(values);
const { rootProps, getProps } = useIndeterminateChecked(values, {
menu: true,
});

return (
<DropdownMenu
id="some-id"
items={[
<MenuItem id="item-1">Item 1</MenuItem>,
<MenuItemCheckbox
id="some-group-id-root"
{...toCheckedChange(rootProps)}
>
<MenuItemCheckbox id="some-group-id-root" {...rootProps}>
Toggle All
</MenuItemCheckbox>,
...values.map((value, i) => (
<MenuItemCheckbox
id={`some-group-id-${i + 1}`}
{...toCheckedChange(getProps(value))}
{...getProps(value)}
key={value}
>
{labels[value]}
Expand Down

0 comments on commit 9ab67bf

Please sign in to comment.