// Type definitions for moonstone/SlotItem

import { SlotItemDecoratorProps as moonstone_UiSlotItem_SlotItemDecoratorProps } from "@enact/moonstone/UiSlotItem";
import { ToggleableProps as ui_Toggleable_ToggleableProps } from "@enact/ui/Toggleable";
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";
import { SlotItemBaseProps as moonstone_UiSlotItem_SlotItemBaseProps } from "@enact/moonstone/UiSlotItem";
import { ItemBaseProps as moonstone_Item_ItemBaseProps } from "@enact/moonstone/Item";

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 SlotItemBaseProps
  extends Omit<
    Merge<moonstone_UiSlotItem_SlotItemBaseProps, moonstone_Item_ItemBaseProps>,
    "component"
  > {
  /**
 * 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:
 * *  `slotItem`  - The root class name
 */
  css?: object;
}
/**
 * A moonstone-styled SlotItem without any behavior.
 */

export class SlotItemBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, SlotItemBaseProps>
> {}

export interface SlotItemDecoratorProps
  extends Merge<
    Merge<
      Merge<
        Merge<
          moonstone_UiSlotItem_SlotItemDecoratorProps,
          ui_Toggleable_ToggleableProps
        >,
        spotlight_Spottable_SpottableProps
      >,
      moonstone_Marquee_MarqueeDecoratorProps
    >,
    moonstone_Skinnable_SkinnableProps
  > {}
export function SlotItemDecorator<P>(
  Component: React.ComponentType<P> | string,
): React.ComponentType<P & SlotItemDecoratorProps>;

export interface SlotItemProps
  extends Merge<SlotItemBaseProps, SlotItemDecoratorProps> {}
/**
 * A Moonstone-styled item with built-in support for overlays.
 * ```
<SlotItem autoHide="both">
	<slotBefore>
		<Icon>flag</Icon>
		<Icon>star</Icon>
	</slotBefore>
	An Item that will show some icons before and after this text when spotted
	<Icon slot="slotAfter">trash</Icon>
</SlotItem>
```
 */

export class SlotItem extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, SlotItemProps>
> {}

export default SlotItem;