// Type definitions for moonstone/ToggleItem

import { ToggleItemDecoratorProps as moonstone_UiToggleItem_ToggleItemDecoratorProps } from "@enact/moonstone/UiToggleItem";
import { SpottableProps as spotlight_Spottable_SpottableProps } from "@enact/spotlight/Spottable";
import { MarqueeDecoratorProps as moonstone_Marquee_MarqueeDecoratorProps } from "@enact/moonstone/Marquee";
import { SkinnableProps as moonstone_Skinnable_SkinnableProps } from "@enact/moonstone/Skinnable";
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 ToggleItemBaseProps {
  /**
   * The content to be displayed as the main content of the toggle item.
   */
  children: React.ReactNode;
  /**
 * The icon component 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;
  /**
 * 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;
  /**
 * Overrides the icon of the  `iconComponent`  component.
 * 
 * This accepts any string that the    component supports,
provided the recommendations of  `iconComponent`  are followed.
 */
  icon?: string;
}
/**
 * A Moonstone-styled toggle    without any behavior.
 */

export class ToggleItemBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ToggleItemBaseProps>
> {}

export interface ToggleItemDecoratorConfig extends Object {
  /**
 * Invalidate the distance of marquee text if any property (like 'inline') changes.
Expects an array of props which on change trigger invalidateMetrics.
 */
  invalidateProps?: string[];
}
export interface ToggleItemDecoratorProps
  extends Merge<
    Merge<
      Merge<
        moonstone_UiToggleItem_ToggleItemDecoratorProps,
        spotlight_Spottable_SpottableProps
      >,
      moonstone_Marquee_MarqueeDecoratorProps
    >,
    moonstone_Skinnable_SkinnableProps
  > {}
export function ToggleItemDecorator<P>(
  config: ToggleItemDecoratorConfig,
  Component: React.ComponentType<P> | string,
): React.ComponentType<P & ToggleItemDecoratorProps>;

export function ToggleItemDecorator<P>(
  Component: React.ComponentType<P> | string,
): React.ComponentType<P & ToggleItemDecoratorProps>;

export interface ToggleItemProps
  extends Merge<ToggleItemBaseProps, ToggleItemDecoratorProps> {
  /**
 * 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;
}
/**
 * A Moonstone-styled item with built-in support for toggling, marqueed text, and  `Spotlight`  focus.
 * 
 * This is not intended to be used directly, but should be extended by a component that will
customize this component's appearance by supplying an  `iconComponent`  prop.
 */

export class ToggleItem extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ToggleItemProps>
> {}

export default ToggleItem;