// Type definitions for agate/TabGroup

import * as React from "react";
import { SkinnableProps as agate_Skinnable_SkinnableProps } from "@enact/agate/Skinnable";
import { SlottableProps as ui_Slottable_SlottableProps } from "@enact/ui/Slottable";

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 TabGroupBaseProps {}
/**
 * A Tab Group component.
 */

export class TabGroupBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, TabGroupBaseProps>
> {}

export interface TabGroupDecoratorProps
  extends Merge<agate_Skinnable_SkinnableProps, ui_Slottable_SlottableProps> {}
export function TabGroupDecorator<P>(
  Component: React.ComponentType<P> | string
): React.ComponentType<P & TabGroupDecoratorProps>;

export interface TabGroupProps
  extends Merge<TabGroupBaseProps, TabGroupDecoratorProps> {}
/**
 * An Tab Group component, ready to use in Agate applications.
 * 
 * Usage:
 * ```
<TabGroup
  tabPosition={'before'}
  tabs={[
    {title: 'Home', icon: 'home'},
    {title: 'Settings', icon: 'setting'},
    {title: 'Theme', icon: 'display'}
  ]}
/>
```
 */

export class TabGroup extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, TabGroupProps>
> {}

export default TabGroup;
