@enact/sandstone/Checkbox/Checkbox.d.ts

Large-screen/TV support library for Enact, containing a variety of UI components.

// Type definitions for sandstone/Checkbox

import { ToggleableProps as ui_Toggleable_ToggleableProps } from "@enact/ui/Toggleable";
import { SkinnableProps as sandstone_Skinnable_SkinnableProps } from "@enact/sandstone/Skinnable";
import { SpottableProps as spotlight_Spottable_SpottableProps } from "@enact/spotlight/Spottable";
import { IconProps as sandstone_Icon_IconProps } from "@enact/sandstone/Icon";
import * as React from "react";

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type Merge<M, N> = Omit<M, Extract<keyof M, keyof N>> & N;

export interface CheckboxBaseProps extends sandstone_Icon_IconProps {
  /**
   * The icon displayed when  `selected` .
   *
   * May be specified as either:
   * *  A string that represents an icon from the   ,
   * *  An HTML entity string, Unicode reference or hex value (in the form '0x...'),
   * *  A URL specifying path to an icon image, or
   * *  An object representing a resolution independent resource (See   )
   */
  children?: string | object;
  /**
 * Customizes the component by mapping the supplied collection of CSS class names to the
corresponding internal elements and states of this component.
 * 
 * The following classes are supported:
 * *  `checkbox`  - The root class name
 * *  `selected`  - Applied when the  `selected`  prop is true
 */
  css?: object;
  /**
   * Disables Checkbox and becomes non-interactive.
   */
  disabled?: boolean;
  /**
 * Enables the "indeterminate" state.
 * 
 * An indeterminate, mixed, or half-selected state is typically used in a hierarchy or group
to represent that some, not all, children are selected.
 * 
 * NOTE: This does not prevent updating the  `selected`  state. Applications must control this
property directly.
 */
  indeterminate?: boolean;
  /**
   * The icon to be used in the  `indeterminate`  state.
   *
   * May be specified as either:
   * *  A string that represents an icon from the   ,
   * *  An HTML entity string, Unicode reference or hex value (in the form '0x...'),
   * *  A URL specifying path to an icon image, or
   * *  An object representing a resolution independent resource (See   )
   */
  indeterminateIcon?: string;
  /**
   * Sets whether this control is in the 'on' or 'off' state.  `true`  for 'on',  `false`  for 'off'.
   */
  selected?: boolean;
}
/**
 * A checkbox component, ready to use in Sandstone applications.
 * 
 * `Checkbox`  may be used independently to represent a toggleable state but is more commonly used as
part of   .
 * 
 * Usage:
 * ```
<Checkbox selected />
```
 */

export class CheckboxBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, CheckboxBaseProps>
> {}

export interface CheckboxDecoratorProps
  extends Merge<
    Merge<ui_Toggleable_ToggleableProps, sandstone_Skinnable_SkinnableProps>,
    spotlight_Spottable_SpottableProps
  > {}
export function CheckboxDecorator<P>(
  Component: React.ComponentType<P> | string,
): React.ComponentType<P & CheckboxDecoratorProps>;

export interface CheckboxProps
  extends Merge<CheckboxBaseProps, CheckboxDecoratorProps> {}
/**
 * A Sandstone-styled checkbox component.
 * 
 * `Checkbox`  will manage its  `selected`  state via    unless set
directly.
 */

export class Checkbox extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, CheckboxProps>
> {}

export default Checkbox;