From fd12683a84f4f8daedbbb4ed8247cd56615b032c Mon Sep 17 00:00:00 2001
From: Joakim Unge <ashba@unge.se>
Date: Fri, 31 Jan 2020 23:28:26 +0100
Subject: [PATCH] refactor: update type definitions for react-router-tabs
 (#41998)

* feat: update types for react-router-tabs

* test: rewrite tests with jsx

* refactor: change NavTab type
---
 types/react-router-tabs/index.d.ts            | 24 +++++++------------
 .../react-router-tabs-tests.ts                |  4 ----
 .../react-router-tabs-tests.tsx               | 23 ++++++++++++++++++
 types/react-router-tabs/tsconfig.json         |  3 ++-
 4 files changed, 34 insertions(+), 20 deletions(-)
 delete mode 100644 types/react-router-tabs/react-router-tabs-tests.ts
 create mode 100644 types/react-router-tabs/react-router-tabs-tests.tsx

diff --git a/types/react-router-tabs/index.d.ts b/types/react-router-tabs/index.d.ts
index 55a4129d58..9f4d00125d 100644
--- a/types/react-router-tabs/index.d.ts
+++ b/types/react-router-tabs/index.d.ts
@@ -3,24 +3,17 @@
 // Definitions by: Joakim Unge <https://github.com/joakimunge>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 
-import { Route, Link, RouteProps } from 'react-router-dom';
-import { ReactNode } from 'react';
+import { Route, Link, RouteProps, LinkProps, NavLinkProps } from 'react-router-dom';
+import { ReactNode, ComponentType } from 'react';
 
 export type AriaCurrent = 'page' | 'step' | 'location' | 'date' | 'time' | 'true';
 
-export interface NavTabProps {
-    to: string | object;
-    replace?: boolean;
-    exact?: boolean;
-    strict?: boolean;
-    activeClassName?: string;
-    className?: string;
-    activeStyle?: object;
-    style?: object;
-    'aria-current'?: AriaCurrent;
+export interface NavTabProps extends NavLinkProps {
+    style?: React.CSSProperties;
     disabled?: boolean;
+    allowClickOnActive?: boolean;
+    'aria-current'?: AriaCurrent;
 }
-
 export interface RoutedTabsProps {
     startPathWith?: string;
     className?: string;
@@ -32,5 +25,6 @@ export interface RoutedTabsProps {
     children?: ReactNode;
 }
 
-export function NavTab(props: NavTabProps): Route;
-export function RoutedTabs(props: RoutedTabsProps): ReactNode;
+export const NavTab: ComponentType<NavTabProps>;
+
+export const RoutedTabs: ComponentType<RoutedTabsProps>;
diff --git a/types/react-router-tabs/react-router-tabs-tests.ts b/types/react-router-tabs/react-router-tabs-tests.ts
deleted file mode 100644
index 2a16b067d6..0000000000
--- a/types/react-router-tabs/react-router-tabs-tests.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { NavTab, RoutedTabs } from 'react-router-tabs';
-
-NavTab({ to: 'path' }); // $ExpectType Route<RouteProps>
-RoutedTabs({}); // $ExpectType ReactNode
diff --git a/types/react-router-tabs/react-router-tabs-tests.tsx b/types/react-router-tabs/react-router-tabs-tests.tsx
new file mode 100644
index 0000000000..693d4e6bc4
--- /dev/null
+++ b/types/react-router-tabs/react-router-tabs-tests.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+
+import { NavTab, RoutedTabs } from 'react-router-tabs';
+
+const NavTabTest: React.FC = () => {
+    return (
+        <div>
+            <NavTab to="/home">Home</NavTab>
+        </div>
+    );
+};
+
+const RoutedTabsTest: React.FC = () => {
+    return (
+        <RoutedTabs startPathWith="/testbed">
+            <NavTab to="/home">Home</NavTab>
+            <NavTab to="/about">About</NavTab>
+            <NavTab to="/contact">Contact</NavTab>
+        </RoutedTabs>
+    );
+};
+
+export { NavTabTest, RoutedTabsTest };
diff --git a/types/react-router-tabs/tsconfig.json b/types/react-router-tabs/tsconfig.json
index 11da3efbc1..823002fe89 100644
--- a/types/react-router-tabs/tsconfig.json
+++ b/types/react-router-tabs/tsconfig.json
@@ -2,6 +2,7 @@
     "compilerOptions": {
         "module": "commonjs",
         "lib": ["es6"],
+        "jsx": "react",
         "noImplicitAny": true,
         "noImplicitThis": true,
         "strictFunctionTypes": true,
@@ -12,5 +13,5 @@
         "noEmit": true,
         "forceConsistentCasingInFileNames": true
     },
-    "files": ["index.d.ts", "react-router-tabs-tests.ts"]
+    "files": ["index.d.ts", "react-router-tabs-tests.tsx"]
 }