feat: Add typescript typings to repo

index.d.ts

@@ -0,0 +1,49 @@
+import { FunctionComponent, HTMLProps } from 'react';
+
+export interface TabsProps
+  extends Omit<HTMLProps<HTMLDivElement>, 'className' | 'onSelect' | 'ref'> {
+  className?: string | string[] | { [name: string]: boolean } | undefined;
+  defaultFocus?: boolean | undefined;
+  defaultIndex?: number | undefined;
+  direction?: 'rtl' | 'ltr' | undefined;
+  disabledTabClassName?: string | undefined;
+  disableUpDownKeys?: boolean | undefined;
+  domRef?: ((node?: HTMLElement) => void) | undefined;
+  environment?: Window | undefined;
+  focusTabOnClick?: boolean | undefined;
+  forceRenderTabPanel?: boolean | undefined;
+  onSelect?:
+    | ((index: number, last: number, event: Event) => boolean | void)
+    | undefined;
+  selectedIndex?: number | undefined;
+  selectedTabClassName?: string | undefined;
+  selectedTabPanelClassName?: string | undefined;
+}
+
+export interface TabListProps
+  extends Omit<HTMLProps<HTMLUListElement>, 'className'> {
+  className?: string | string[] | { [name: string]: boolean } | undefined;
+}
+
+export interface TabProps
+  extends Omit<HTMLProps<HTMLLIElement>, 'className' | 'tabIndex'> {
+  className?: string | string[] | { [name: string]: boolean } | undefined;
+  disabled?: boolean | undefined;
+  disabledClassName?: string | undefined;
+  selectedClassName?: string | undefined;
+  tabIndex?: string | undefined;
+}
+
+export interface TabPanelProps
+  extends Omit<HTMLProps<HTMLDivElement>, 'className'> {
+  className?: string | string[] | { [name: string]: boolean } | undefined;
+  forceRender?: boolean | undefined;
+  selectedClassName?: string | undefined;
+}
+
+export const Tabs: FunctionComponent<TabsProps>;
+export const TabList: FunctionComponent<TabListProps>;
+export const Tab: FunctionComponent<TabProps>;
+export const TabPanel: FunctionComponent<TabPanelProps>;
+
+export declare function resetIdCounter(): void;

package.json

@@ -4,6 +4,7 @@
   "description": "An accessible and easy tab component for ReactJS",
   "main": "lib/index.js",
   "module": "esm/index.js",
+  "typings": "index.d.ts",
   "scripts": {
     "clean:commonjs": "rimraf lib",
     "clean:umd": "rimraf dist",
@@ -36,7 +37,8 @@
     "esm",
     "lib",
     "style",
-    "src"
+    "src",
+    "index.d.ts"
   ],
   "homepage": "https://github.com/reactjs/react-tabs",
   "keywords": [

src/components/Tab.js

@@ -25,14 +25,14 @@ const propTypes = {
     PropTypes.object,
   ]),
   disabled: PropTypes.bool,
-  tabIndex: PropTypes.string,
   disabledClassName: PropTypes.string,
   focus: PropTypes.bool, // private
   id: PropTypes.string, // private
   panelId: PropTypes.string, // private
   selected: PropTypes.bool, // private
   selectedClassName: PropTypes.string,
-  tabRef: PropTypes.func,
+  tabIndex: PropTypes.string,
+  tabRef: PropTypes.func, // private
 };
 
 const Tab = (props) => {

src/components/Tabs.js

@@ -12,24 +12,24 @@ const MODE_CONTROLLED = 0;
 const MODE_UNCONTROLLED = 1;
 const propTypes = {
   children: childrenPropType,
-  direction: PropTypes.oneOf(['rtl', 'ltr']),
   className: PropTypes.oneOfType([
     PropTypes.string,
     PropTypes.array,
     PropTypes.object,
   ]),
   defaultFocus: PropTypes.bool,
   defaultIndex: PropTypes.number,
+  direction: PropTypes.oneOf(['rtl', 'ltr']),
   disabledTabClassName: PropTypes.string,
   disableUpDownKeys: PropTypes.bool,
   domRef: PropTypes.func,
+  environment: PropTypes.object,
   focusTabOnClick: PropTypes.bool,
   forceRenderTabPanel: PropTypes.bool,
   onSelect: onSelectPropType,
   selectedIndex: selectedIndexPropType,
   selectedTabClassName: PropTypes.string,
   selectedTabPanelClassName: PropTypes.string,
-  environment: PropTypes.object,
 };
 const defaultProps = {
   defaultFocus: false,