diff --git a/packages/ui/src/ui/input/index.js b/packages/ui/src/ui/input/index.ts
similarity index 100%
rename from packages/ui/src/ui/input/index.js
rename to packages/ui/src/ui/input/index.ts
diff --git a/packages/ui/src/ui/input/input.jsx b/packages/ui/src/ui/input/input.jsx
deleted file mode 100644
index 6b6c4d18cd..0000000000
--- a/packages/ui/src/ui/input/input.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import PropTypes from 'prop-types';
-
-import css from './input.module.css';
-
-export const Input = ({ className, size, ...restProps }) => {
- const rootClassName = cx(css.root, className, css[size]);
- return ;
-};
-
-Input.propTypes = {
- className: PropTypes.string,
- size: PropTypes.oneOf(['small', 'medium', 'large']),
-};
-
-Input.defaultProps = {
- className: '',
- size: 'medium',
-};
diff --git a/packages/ui/src/ui/input/input.stories.jsx b/packages/ui/src/ui/input/input.stories.tsx
similarity index 78%
rename from packages/ui/src/ui/input/input.stories.jsx
rename to packages/ui/src/ui/input/input.stories.tsx
index 7ba2770a82..4d589094c8 100644
--- a/packages/ui/src/ui/input/input.stories.jsx
+++ b/packages/ui/src/ui/input/input.stories.tsx
@@ -10,4 +10,4 @@ export default {
};
export const Default = () => ;
-export const WithSize = () => ;
+export const WithSize = () => ;
diff --git a/packages/ui/src/ui/input/input.tsx b/packages/ui/src/ui/input/input.tsx
new file mode 100644
index 0000000000..c81db08a3d
--- /dev/null
+++ b/packages/ui/src/ui/input/input.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+import cx from 'classnames';
+
+import css from './input.module.css';
+
+interface InputProps {
+ size?: 'small' | 'medium' | 'large';
+}
+
+export const Input = (props: InputProps & Omit, 'size'>) => {
+ const { className = '', size = 'medium', ...restProps } = props;
+
+ const rootClassName = cx(css.root, className, css[size]);
+
+ return ;
+};