From e4c93791cd5a706d3b98bd644f89ef68657aa64e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20B=C3=BCchele?= <danielbuechele@fb.com>
Date: Tue, 20 Aug 2019 03:18:32 -0700
Subject: [PATCH] Input

Summary: _typescript_

Reviewed By: bnelo12

Differential Revision: D16830541

fbshipit-source-id: ee8b25fae3f553823d4b63e1a963a005f21df7a6
---
 src/ui/components/{Input.js => Input.tsx}           | 6 +++---
 src/ui/components/data-inspector/DataDescription.js | 2 +-
 src/ui/components/searchable/Searchable.js          | 2 +-
 src/ui/index.js                                     | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)
 rename src/ui/components/{Input.js => Input.tsx} (83%)

diff --git a/src/ui/components/Input.js b/src/ui/components/Input.tsx
similarity index 83%
rename from src/ui/components/Input.js
rename to src/ui/components/Input.tsx
index e48caf611..3737f1a2a 100644
--- a/src/ui/components/Input.js
+++ b/src/ui/components/Input.tsx
@@ -5,8 +5,8 @@
  * @format
  */
 
-import styled from '../styled/index.js';
-import {colors} from './colors.tsx';
+import styled from 'react-emotion';
+import {colors} from './colors';
 
 export const inputStyle = (compact: boolean) => ({
   border: `1px solid ${colors.light15}`,
@@ -24,7 +24,7 @@ export const inputStyle = (compact: boolean) => ({
   },
 });
 
-const Input = styled('input')(({compact}) => ({
+const Input = styled('input')(({compact}: {compact?: boolean}) => ({
   ...inputStyle(compact),
   padding: compact ? '0 5px' : '0 10px',
 }));
diff --git a/src/ui/components/data-inspector/DataDescription.js b/src/ui/components/data-inspector/DataDescription.js
index 086ac196e..36c29d37d 100644
--- a/src/ui/components/data-inspector/DataDescription.js
+++ b/src/ui/components/data-inspector/DataDescription.js
@@ -12,7 +12,7 @@ import {SketchPicker} from 'react-color';
 import {Component, Fragment} from 'react';
 import Popover from '../Popover.tsx';
 import {colors} from '../colors.tsx';
-import Input from '../Input.js';
+import Input from '../Input.tsx';
 
 const NullValue = styled('span')({
   color: 'rgb(128, 128, 128)',
diff --git a/src/ui/components/searchable/Searchable.js b/src/ui/components/searchable/Searchable.js
index 59dc99833..2b7534265 100644
--- a/src/ui/components/searchable/Searchable.js
+++ b/src/ui/components/searchable/Searchable.js
@@ -10,7 +10,7 @@ import type {TableColumns} from '../table/types';
 import {PureComponent} from 'react';
 import Toolbar from '../Toolbar.tsx';
 import FlexRow from '../FlexRow.js';
-import Input from '../Input.js';
+import Input from '../Input.tsx';
 import {colors} from '../colors.tsx';
 import Text from '../Text.tsx';
 import FlexBox from '../FlexBox.js';
diff --git a/src/ui/index.js b/src/ui/index.js
index 16f26e2c0..575516f21 100644
--- a/src/ui/index.js
+++ b/src/ui/index.js
@@ -71,7 +71,7 @@ export {default as Tabs} from './components/Tabs.tsx';
 export {default as Tab} from './components/Tab.tsx';
 
 // inputs
-export {default as Input} from './components/Input.js';
+export {default as Input} from './components/Input.tsx';
 export {default as Textarea} from './components/Textarea.tsx';
 export {default as Select} from './components/Select.tsx';
 export {default as Checkbox} from './components/Checkbox.js';