import { default as React } from 'react';
import { default as ICheckboxProps } from './ICheckboxProps';
/**
 * Checkbox component with custom styling and functionality
 *
 * @param props {@link ICheckboxProps} - The component props
 * @returns The rendered checkbox component
 *
 * @example
 * ```tsx
 * // Basic usage
 * function App() {
 *   const [checked, setChecked] = useState<boolean>(false);
 *
 *   return (
 *     <Checkbox label="Accept terms and conditions" description="This is a description" value={checked} onChange={setChecked} />
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Checkbox with indeterminate state
 * const App = () => {
 *   type Fruit = 'apple' | 'banana' | 'orange';
 *   type FruitChecked = { [key in Fruit]: boolean };
 *
 *   const [checkedAll, setCheckedAll] = useState<boolean>(false);
 *   const [checkedIndeterminate, setCheckedIndeterminate] = useState<boolean>(false);
 *   const [fruits, setFruits] = useState<FruitChecked>({
 *     apple: false,
 *     banana: false,
 *     orange: false,
 *   });
 *
 *   // Handle click to cycle through states
 *   const handleClickCheckAll = () => {
 *     if (checkedAll) {
 *       setCheckedAll(false);
 *       setCheckedIndeterminate(false);
 *       setFruits({
 *         apple: false,
 *         banana: false,
 *         orange: false,
 *       });
 *     } else if (checkedIndeterminate) {
 *       setCheckedAll(true);
 *       setCheckedIndeterminate(false);
 *       setFruits({
 *         apple: true,
 *         banana: true,
 *         orange: true,
 *       });
 *     } else {
 *       setCheckedAll(true);
 *       setCheckedIndeterminate(false);
 *       setFruits({
 *         apple: true,
 *         banana: true,
 *         orange: true,
 *       });
 *     }
 *   };
 *   const selectFruits = (fruit: Fruit, checked: boolean) => {
 *     const newFruits = { ...fruits };
 *     newFruits[fruit] = checked;
 *     setFruits(newFruits);
 *     setCheckedAll(Object.values(newFruits).every(value => value));
 *     setCheckedIndeterminate(Object.values(newFruits).some(value => value) && !Object.values(newFruits).every(value => value));
 *   };
 *   return (
 *     <Box className="flex flex-col gap-6">
 *       <Text>List of fruits:</Text>
 *       <Checkbox
 *         {...args}
 *         label="Select all"
 *         value={checkedAll}
 *         indeterminate={checkedIndeterminate}
 *         onChange={handleClickCheckAll}
 *       />
 *       <Separator />
 *       <Checkbox label="Apple" value={fruits.apple} onChange={checked => selectFruits('apple', checked)} />
 *       <Checkbox label="Banana" value={fruits.banana} onChange={checked => selectFruits('banana', checked)} />
 *       <Checkbox label="Orange" value={fruits.orange} onChange={checked => selectFruits('orange', checked)} />
 *     </Box>
 *   );
 * }
 * ```
 */
declare const Checkbox: React.FC<ICheckboxProps>;
export default Checkbox;