useCheckboxGroup

function useCheckboxGroup<V extends string>(
  options: CheckboxGroupOptions<V>
): CombinedCheckboxGroupReturnValue<V>;

export interface CheckboxGroupOptions<V> {
  /**
   * A `name` to apply to all the checkboxes within the group. This is required
   * if the {@link menu} option is set to `true`.
   */
  name?: string;

  /**
   * Set this to `true` if using the `MenuItemCheckbox` component instead of the
   * `Checkbox` so the correct props can be provided.
   *
   * @defaultValue `false`
   */
  menu?: boolean;

  /**
   * This prop **must** be defined to enable the indeterminate checkbox feature
   * from the hook and should be a list of all the possible checkbox values in
   * the group. This will be used to select all values when the indeterminate
   * checkbox is checked and determine if all the checkboxes have manually be
   * selected.
   */
  values?: readonly V[];

  /**
   * Set this to a list of checkbox values that should be checked by default.
   *
   * @defaultValue `[]`
   */
  defaultCheckedValues?: UseStateInitializer<readonly V[]>;
}

const OPTIONS = [
  { label: "First", value: "a" },
  { label: "Second", value: "b" },
  { label: "Third", value: "c" },
] as const;
const VALUES = OPTIONS.map(({ value }) => value) as const;

const { getCheckboxProps, getIndeterminateProps, checkedValues } =
  useCheckboxGroup({ name: "group", values: VALUES });

export interface CombinedCheckboxGroupReturnValue<V extends string> {
  reset: () => void;
  checkedValues: ReadonlySet<V>;
  setCheckedValues: UseStateSetter<ReadonlySet<V>>;
  getCheckboxProps: (value: V) => {
    name?: string;
    value?: V;
    checked: boolean;
    onChange?: () => void;
    onCheckedChange?: () => void;
  };
  getIndeterminateProps?: () => {
    "aria-checked": "mixed" | undefined;
    name?: string;
    checked: boolean;
    indeterminate: boolean;
    onChange?: () => void;
    onCheckedChange?: () => void;
  };
}