From 537d3c1655c8f0616a1938e5e55002d779341caf Mon Sep 17 00:00:00 2001
From: Anup Bhatkhande <36146754+anupbui@users.noreply.github.com>
Date: Sun, 30 Aug 2020 14:26:54 +0530
Subject: [PATCH] Add Types for package react-otp-input (#47108)

* Add Types for package react-otp-input

* ReactOTPInput -New line added and extra lines removed

* Add react-otp-input to package.json

* Add react-otp-input test import modified

* Change in export OTPInput

* Change in import OTPInput

* Remove path from tsconfig.json

* Change types for style props

* Remove minor version from top definitions

* Revert package.json
---
 types/react-otp-input/index.d.ts              | 23 ++++++++++++
 .../react-otp-input/react-otp-input-tests.tsx | 35 +++++++++++++++++++
 types/react-otp-input/tsconfig.json           | 25 +++++++++++++
 types/react-otp-input/tslint.json             |  3 ++
 4 files changed, 86 insertions(+)
 create mode 100644 types/react-otp-input/index.d.ts
 create mode 100644 types/react-otp-input/react-otp-input-tests.tsx
 create mode 100644 types/react-otp-input/tsconfig.json
 create mode 100644 types/react-otp-input/tslint.json

diff --git a/types/react-otp-input/index.d.ts b/types/react-otp-input/index.d.ts
new file mode 100644
index 0000000000..a1e22e052f
--- /dev/null
+++ b/types/react-otp-input/index.d.ts
@@ -0,0 +1,23 @@
+// Type definitions for react-otp-input 2.0
+// Project: https://github.com/devfolioco/react-otp-input
+// Definitions by: Anup Bhatkhande <https://github.com/anupbui>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+import * as React from 'react';
+
+export interface OTPInputProps {
+    value: number | string;
+    onChange: any;
+    numInputs: number;
+    separator?: JSX.Element;
+    isDisabled?: boolean;
+    shouldAutoFocus?: boolean;
+    hasErrored?: boolean;
+    isInputNum?: boolean;
+    containerStyle?: string | React.CSSProperties;
+    inputStyle?: string | React.CSSProperties;
+    focusStyle?: string | React.CSSProperties;
+    disabledStyle?: string | React.CSSProperties;
+    errorStyle?: string | React.CSSProperties;
+}
+
+export default class extends React.Component<OTPInputProps> { }
diff --git a/types/react-otp-input/react-otp-input-tests.tsx b/types/react-otp-input/react-otp-input-tests.tsx
new file mode 100644
index 0000000000..eafed31096
--- /dev/null
+++ b/types/react-otp-input/react-otp-input-tests.tsx
@@ -0,0 +1,35 @@
+import * as React from "react";
+import OTPInput from "react-otp-input";
+
+interface InputOtpProps {
+    inputCount: number;
+}
+
+interface OtpInputState {
+    otp: number;
+}
+
+class OtpInputPage extends React.Component<InputOtpProps, OtpInputState> {
+    state = {
+        otp: 123456
+    };
+
+    handleChange = (otp: number) => {
+        this.setState({ otp });
+    }
+
+    render() {
+        const { otp } = this.state;
+
+        return (
+            <>
+                <OTPInput
+                    value={otp}
+                    onChange={this.handleChange}
+                    numInputs={6}
+                    separator={<span>-</span>}
+                />
+            </>
+        );
+    }
+}
diff --git a/types/react-otp-input/tsconfig.json b/types/react-otp-input/tsconfig.json
new file mode 100644
index 0000000000..24cc174232
--- /dev/null
+++ b/types/react-otp-input/tsconfig.json
@@ -0,0 +1,25 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": [
+            "es6",
+            "dom"
+        ],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "baseUrl": "../",
+        "jsx": "react",
+        "typeRoots": [
+            "../"
+        ],
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": [
+        "index.d.ts",
+        "react-otp-input-tests.tsx"
+    ]
+}
diff --git a/types/react-otp-input/tslint.json b/types/react-otp-input/tslint.json
new file mode 100644
index 0000000000..f93cf8562a
--- /dev/null
+++ b/types/react-otp-input/tslint.json
@@ -0,0 +1,3 @@
+{
+    "extends": "dtslint/dt.json"
+}