From 00c2a4dd291b099d00458927a8e572eaad47b223 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] StatusIndicator

Summary: _typescript_

Reviewed By: priteshrnandgaonkar

Differential Revision: D16830064

fbshipit-source-id: 947a7af91e4bdffedc321db369d79da4584d64f7
---
 .../{StatusIndicator.js => StatusIndicator.tsx}      | 12 ++++++------
 src/ui/index.js                                      |  2 +-
 2 files changed, 7 insertions(+), 7 deletions(-)
 rename src/ui/components/{StatusIndicator.js => StatusIndicator.tsx} (67%)

diff --git a/src/ui/components/StatusIndicator.js b/src/ui/components/StatusIndicator.tsx
similarity index 67%
rename from src/ui/components/StatusIndicator.js
rename to src/ui/components/StatusIndicator.tsx
index b2fb99638..e874086d2 100644
--- a/src/ui/components/StatusIndicator.js
+++ b/src/ui/components/StatusIndicator.tsx
@@ -6,16 +6,16 @@
  */
 
 import {colors, styled} from 'flipper';
-import type {Element} from 'react';
+import {BackgroundColorProperty, HeightProperty} from 'csstype';
 
 type Props = {
-  statusColor: string,
-  diameter?: number | string,
-  title?: string,
+  statusColor: BackgroundColorProperty;
+  diameter?: HeightProperty<number>;
+  title?: string;
 };
 
-const StatusIndicator: Props => Element<'div'> = styled('div')(
-  ({statusColor, diameter = 10, title}) => ({
+const StatusIndicator = styled('div')(
+  ({statusColor, diameter = 10, title}: Props) => ({
     alignSelf: 'center',
     backgroundColor: statusColor,
     border: `1px solid ${colors.blackAlpha30}`,
diff --git a/src/ui/index.js b/src/ui/index.js
index 205fb8c90..4991576a8 100644
--- a/src/ui/index.js
+++ b/src/ui/index.js
@@ -133,7 +133,7 @@ export {default as ModalOverlay} from './components/ModalOverlay.tsx';
 export {default as Tooltip} from './components/Tooltip.js';
 export {default as TooltipProvider} from './components/TooltipProvider.js';
 export {default as ResizeSensor} from './components/ResizeSensor.tsx';
-export {default as StatusIndicator} from './components/StatusIndicator.js';
+export {default as StatusIndicator} from './components/StatusIndicator.tsx';
 
 // typography
 export {default as HorizontalRule} from './components/HorizontalRule.js';