@enact/ui/ToggleIcon/ToggleIcon.d.ts

A collection of simplified unstyled cross-platform UI components for Enact

// Type definitions for ui/ToggleIcon

import * as React from "react";
import { ForwardRefProps as ui_ForwardRef_ForwardRefProps } from "@enact/ui/ForwardRef";
import { ToggleableProps as ui_Toggleable_ToggleableProps } from "@enact/ui/Toggleable";
import { TouchableProps as ui_Touchable_TouchableProps } from "@enact/ui/Touchable";

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 ToggleIconBaseProps {
  /**
   * The icon to use for this component.
   */
  children?: string | object;
  /**
 * Called with a reference to the root component.
 * 
 * When using   , the  `ref`  prop is forwarded to this component
as  `componentRef` .
 */
  componentRef?: object | Function;
  /**
 * 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:
 * *  `toggleIcon`  - The root class name
 * *  `icon`  - The background node of the button
 * *  `selected`  - Applied to a  `selected`  button
 */
  css?: object;
  /**
   * Disables  `ToggleIcon` .
   */
  disabled?: boolean;
  /**
   * CSS classes to be used on the Icon component
   */
  iconClasses?: string;
  /**
   * The component used to render the icon.
   */
  iconComponent?: string | React.ComponentType;
  /**
   * Sets whether this control is in the 'on' or 'off' state.  `true`  for 'on',  `false`  for 'off'.
   */
  selected?: boolean;
}
/**
 * Represents a Boolean state, and can accept any icon to toggle.
 */

export class ToggleIconBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ToggleIconBaseProps>
> {}

export interface ToggleIconDecoratorProps
  extends Merge<
    Merge<ui_ForwardRef_ForwardRefProps, ui_Toggleable_ToggleableProps>,
    ui_Touchable_TouchableProps
  > {}
/**
 * Adds support for the  `onToggle`  prop callback to be fired when the  `onTap`  (touch-safe  `onClick` )
event executes.
 */

export class ToggleIconDecorator extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ToggleIconDecoratorProps>
> {}

export interface ToggleIconProps
  extends Omit<
    Merge<ToggleIconBaseProps, ToggleIconDecoratorProps>,
    "componentRef"
  > {
  /**
   * The handler to run when the component is toggled.
   */
  onToggle?: Function;
}
/**
 * Represents a Boolean state, and can accept any icon to toggle.
 */

export class ToggleIcon extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ToggleIconProps>
> {}

export default ToggleIcon;