import type { ComponentPropsWithoutRef, ElementType } from "react"; import type { CommandOptions } from "../command/command.tsx"; import type { Props } from "../utils/types.ts"; import type { CheckboxStore } from "./checkbox-store.ts"; declare const TagName = "input"; type TagName = typeof TagName; /** * Returns props to create a `Checkbox` component. If the element is not a * native checkbox, the hook will return additional props to make sure it's * accessible. * @see https://ariakit.com/components/checkbox * @example * ```jsx * const props = useCheckbox({ render:
}); * Accessible checkbox * ``` */ export declare const useCheckbox: import("../utils/types.ts").Hook<"input", CheckboxOptions<"input">>; /** * Renders an accessible checkbox element. If the underlying element is not a * native checkbox, this component will pass additional attributes to make sure * it's accessible. * @see https://ariakit.com/components/checkbox * @example * ```jsx * }>Accessible checkbox * ``` */ export declare const Checkbox: (props: CheckboxProps) => import("react").ReactElement>; export interface CheckboxOptions extends CommandOptions { /** * Object returned by the * [`useCheckboxStore`](https://ariakit.com/reference/use-checkbox-store) * hook. If not provided, the closest * [`CheckboxProvider`](https://ariakit.com/reference/checkbox-provider) * component's context will be used. Otherwise, the component will fall back * to an internal store. * * Live examples: * - [Checkbox as button](https://ariakit.com/examples/checkbox-as-button) */ store?: CheckboxStore; /** * The native `name` attribute. * * Live examples: * - [MenuItemCheckbox](https://ariakit.com/examples/menu-item-checkbox) */ name?: string; /** * The value of the checkbox. This is useful when the same checkbox store is * used for multiple [`Checkbox`](https://ariakit.com/reference/checkbox) * elements, in which case the value will be an array of checked values. * * Live examples: * - [Checkbox group](https://ariakit.com/examples/checkbox-group) * - [MenuItemCheckbox](https://ariakit.com/examples/menu-item-checkbox) * @example * ```jsx "value" * * * * * * ``` */ value?: ComponentPropsWithoutRef["value"]; /** * The default checked state of the checkbox. This prop is ignored if the * [`checked`](https://ariakit.com/reference/checkbox#checked) or the * [`store`](https://ariakit.com/reference/checkbox#store) props are provided. */ defaultChecked?: "mixed" | boolean; /** * The checked state of the checkbox. This will override the value inferred * from [`store`](https://ariakit.com/reference/checkbox#store) prop, if * provided. This can be `"mixed"` to indicate that the checkbox is partially * checked. */ checked?: "mixed" | boolean; /** * A function that is called when the checkbox's checked state changes. */ onChange?: ComponentPropsWithoutRef["onChange"]; } export type CheckboxProps = Props>; export {};