Add TS types for EuiTab/EuiTabs/EuiTabbedContent (#1288)

* Add TS types for EuiTab/EuiTabs/EuiTabbedContent

* Fixes

* Add CHANGELOG entry

* Update CHANGELOG.md

CHANGELOG.md

@@ -1,6 +1,7 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `4.8.0`.
+**Bug fixes**
+- Added TypeScript definitions for tab components ([#1288](https://github.com/elastic/eui/pull/1288))
 
 ## [`4.8.0`](https://github.com/elastic/eui/tree/v4.8.0)
 

src/components/tabs/index.d.ts

@@ -0,0 +1,37 @@
+/// <reference path="../common.d.ts" />
+
+declare module '@elastic/eui' {
+  import { MouseEventHandler, ReactNode, SFC, HTMLAttributes } from 'react';
+
+  type TAB_SIZES = 's' | 'm';
+
+  type EuiTabProps = {
+    onClick: MouseEventHandler<HTMLButtonElement>;
+    isSelected?: boolean;
+    disabled?: boolean;
+  };
+
+  type EuiTabsProps = {
+    size?: TAB_SIZES;
+    expand?: boolean;
+  };
+
+  export interface EuiTabbedContentTab {
+    id: string;
+    name: string;
+    content: ReactNode;
+  }
+
+  type EuiTabbedContentProps = {
+    tabs: EuiTabbedContentTab[];
+    onTabClick?: (tab: EuiTabbedContentTab) => void;
+    selectedTab?: EuiTabbedContentTab;
+    initialSelectedTab?: EuiTabbedContentTab;
+    size?: TAB_SIZES;
+    expand?: boolean;
+  }
+
+  export const EuiTab: SFC<EuiTabProps & CommonProps & HTMLAttributes<HTMLDivElement>>;
+  export const EuiTabs: SFC<EuiTabsProps & CommonProps & HTMLAttributes<HTMLDivElement>>;
+  export const EuiTabbedContent: SFC<EuiTabbedContentProps & CommonProps & HTMLAttributes<HTMLDivElement>>;
+}

src/components/text/index.d.ts

@@ -9,7 +9,7 @@ declare module '@elastic/eui' {
    * @see './text.js'
    * @see './text_color.js'
    */
-  type SIZES = 's' | 'xs';
+  type TEXT_SIZES = 's' | 'xs';
 
   type COLORS =
     | 'default'
@@ -22,7 +22,7 @@ declare module '@elastic/eui' {
 
   type EuiTextProps = CommonProps &
     HTMLAttributes<HTMLDivElement> & {
-      size?: SIZES;
+      size?: TEXT_SIZES;
       color?: COLORS;
       grow?: boolean;
     };