// Type definitions for ui/ToggleItem import * as React from "react"; import { ForwardRefProps as ui_ForwardRef_ForwardRefProps } from "@enact/ui/ForwardRef"; import { TouchableProps as ui_Touchable_TouchableProps } from "@enact/ui/Touchable"; import { ToggleableProps as ui_Toggleable_ToggleableProps } from "@enact/ui/Toggleable"; type Omit = Pick>; type Merge = Omit> & N; export interface ToggleItemBaseProps { /** * The main content of the toggle item. */ children: React.ReactNode; /** * The type of component to use to render as root element. * * This receives the `css` prop for theme extension and therefore must be a custom component and not a simple HTML DOM node. Recommended component or themed derivative: */ component: React.ComponentType; /** * The `Icon` to render in this item. * * This component receives the `selected` prop and value, and must therefore respond to it in some way. It is recommended to use for this. */ iconComponent: React.ComponentType | JSX.Element; /** * 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: * * `toggleItem` - The root class name */ css?: object; /** * Applies a disabled visual state to the toggle item. */ disabled?: boolean; /** * An optional prop that lets you override the icon of the `iconComponent` component. * * This accepts any string that the component supports, provided the recommendations of `iconComponent` are followed. */ icon?: string | object; /** * Specifies on which side ( `'before'` or `'after'` ) of `children` the icon appears. */ iconPosition?: "before" | "after"; /** * An additional customizable icon component. * * Supports more granular positioning rules. This should only be used _after_ specifying the `icon` property, as the positioning for this offers the ability to place this in front of or behind the existing `icon` . See `itemIconPosition` for options. */ itemIcon?: React.ReactNode; /** * Specifies where `itemIcon` appears. * * `'before'` - first element in the item * * `'beforeChildren'` - before `children` . If `iconPosition` is `'before'` , `icon` will be before `itemIcon` * * `'afterChildren'` - after `children` . If iconPosition `is` 'after' `, ` icon `will be after` itemIcon` * * `'after'` - the last element in the item */ itemIconPosition?: "before" | "beforeChildren" | "afterChildren" | "after"; /** * Called when the toggle item is toggled. Developers should generally use `onToggle` instead. */ onTap?: Function; /** * Called when the toggle item is toggled. */ onToggle?: Function; /** * Applies the provided `icon` . */ selected?: boolean; /** * The value that will be sent to the `onToggle` handler. */ value?: any; } /** * A minimally styled toggle item without any behavior, ripe for extension. */ export class ToggleItemBase extends React.Component< Merge, ToggleItemBaseProps> > {} export interface ToggleItemDecoratorProps extends Merge< Merge, ui_Toggleable_ToggleableProps > {} export function ToggleItemDecorator

( Component: React.ComponentType

| string ): React.ComponentType

; export interface ToggleItemProps extends Omit< Merge, "componentRef" > {} /** * An unstyled item with built-in support for toggling. * * Example: * ``` Toggle Me ``` */ export class ToggleItem extends React.Component< Merge, ToggleItemProps> > {} export default ToggleItem;