@stratakit/bricks/dist/Switch.d.ts

Small, modular components for StrataKit

import type { CheckboxProps as AkCheckboxProps } from "@ariakit/react/checkbox";
import type { FocusableProps } from "@stratakit/foundations/secret-internals";
type InputBaseProps = Omit<FocusableProps<"input">, "defaultValue" | "value" | "onToggle">;
type CheckboxOwnProps = Pick<AkCheckboxProps, "value" | "defaultChecked" | "checked" | "onChange">;
interface SwitchProps extends InputBaseProps, CheckboxOwnProps {
    /** The default checked state of the toggle switch. */
    defaultChecked?: boolean;
    /** The controlled checked state of the toggle switch. */
    checked?: boolean;
}
/**
 * A toggle switch element, typically used for enabling or disabling a feature.
 *
 * Use with the `Field` components to automatically handle ID associations for
 * labels and descriptions:
 * ```tsx
 * <Field.Root>
 *   <Field.Label>Enable feature</Field.Label>
 *   <Field.Control render={<Switch />} />
 * </Field.Root>
 * ```
 *
 * Without the `Field` components you will need to manually associate labels,
 * descriptions, etc.:
 * ```tsx
 * <Switch id="dark-mode" />
 * <Label htmlFor="dark-mode">Dark mode</Label>
 * ```
 *
 * Underneath, it's an HTML checkbox, i.e. `<input type="checkbox">`, so it supports the same props,
 * including `value`, `defaultChecked`, `checked`, and `onChange`.
 */
declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLElement | HTMLInputElement>>;
export default Switch;