@hypothesis/frontend-shared/lib/components/input/Checkbox.d.ts

Shared components, styles and utilities for Hypothesis projects

import type { JSX, Ref } from 'preact';
import type { CompositeProps, IconComponent } from '../../types';
type ComponentProps = {
    /** Current checked state. Used when the Checkbox is controlled. */
    checked?: boolean;
    /**
     * Default checked state. Used to set initial state when the Checkbox is not
     * controlled.
     */
    defaultChecked?: boolean;
    /** Custom icon to show when input is unchecked */
    icon?: IconComponent;
    /** Custom icon to show when input is checked */
    checkedIcon?: IconComponent;
    /** type is always `checkbox` */
    type?: never;
    /** Optional extra CSS classes appended to the container's className */
    containerClasses?: string | string[];
    /** Ref associated with the component's container */
    containerRef?: Ref<HTMLLabelElement | undefined>;
};
export type CheckboxProps = CompositeProps & ComponentProps & Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'size' | 'icon'>;
/**
 * Render a labeled checkbox input. The checkbox is styled with two icons:
 * one for the unchecked state and one for the checked state. The input itself
 * is positioned exactly on top of the icon, but is non-visible.
 */
export default function Checkbox({ checked, defaultChecked, icon, checkedIcon, onChange, ...rest }: CheckboxProps): JSX.Element;
export {};