@enact/moonstone/LabeledIconButton/LabeledIconButton.d.ts

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

// Type definitions for moonstone/LabeledIconButton

import { LabeledIconDecoratorProps as ui_LabeledIcon_LabeledIconDecoratorProps } from "@enact/ui/LabeledIcon";
import { SkinnableProps as moonstone_Skinnable_SkinnableProps } from "@enact/moonstone/Skinnable";
import { LabeledIconBaseProps as ui_LabeledIcon_LabeledIconBaseProps } from "@enact/ui/LabeledIcon";
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 LabeledIconButtonBaseProps
  extends ui_LabeledIcon_LabeledIconBaseProps {
  /**
 * 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:
 * *  `labeledIconButton`  - The root component class
 * *  `icon`  - The icon component class
 * *  `label`  - The label component class
 * *  `large`  - Applied to a  `size='large'`  button
 * *  `selected`  - Applied to a  `selected`  button
 * *  `small`  - Applied to a  `size='small'`  button
 */
  css?: object;
  /**
   * Disables voice control.
   */
  "data-webos-voice-disabled"?: boolean;
  /**
   * The voice control group label.
   */
  "data-webos-voice-group-label"?: string;
  /**
   * The voice control intent.
   */
  "data-webos-voice-intent"?: string;
  /**
   * The voice control label.
   */
  "data-webos-voice-label"?: string;
  /**
   * Flip the icon horizontally, vertically or both.
   */
  flip?: "both" | "horizontal" | "vertical";
  /**
   * The icon displayed within the button.
   */
  icon?: string;
  /**
 * Selects the component.
 * 
 * Setting  `selected`  may be useful when the component represents a toggleable option. The
visual effect may be customized using the
   prop.
 */
  selected?: boolean;
}
/**
 * An icon button component with a label.
 */

export class LabeledIconButtonBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, LabeledIconButtonBaseProps>
> {}

export interface LabeledIconButtonDecoratorProps
  extends Merge<
    ui_LabeledIcon_LabeledIconDecoratorProps,
    moonstone_Skinnable_SkinnableProps
  > {}
export function LabeledIconButtonDecorator<P>(
  Component: React.ComponentType<P> | string,
): React.ComponentType<P & LabeledIconButtonDecoratorProps>;

export interface LabeledIconButtonProps
  extends Merge<LabeledIconButtonBaseProps, LabeledIconButtonDecoratorProps> {}
/**
 * A Moonstone-styled icon button component with a label.
 * 
 * Usage:
 * ```
<LabeledIconButton icon="star" labelPosition="after">
  Favorite
</LabeledIconButton>
```
 */

export class LabeledIconButton extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, LabeledIconButtonProps>
> {}

export default LabeledIconButton;