1 files changed, 17 insertions, 0 deletions
diff --git a/packages/instant/src/components/progress_bar.tsx b/packages/instant/src/components/progress_bar.tsx
new file mode 100644
index 000000000..b89c56ed5
--- /dev/null
+++ b/packages/instant/src/components/progress_bar.tsx
@@ -0,0 +1,17 @@
+import * as React from 'react';
+
+import { ColorOption } from '../style/theme';
+
+import { Container } from './ui/container';
+import { Text } from './ui/text';
+
+export interface ProgressBarProps {
+    percentageDone: number;
+}
+export const ProgressBar: React.StatelessComponent<ProgressBarProps> = props => (
+    <Container width="100%" backgroundColor={ColorOption.white}>
+        <Container width={`${props.percentageDone}%`} backgroundColor={ColorOption.black}>
+            <Text fontColor={ColorOption.white}>{props.percentageDone}%</Text>
+        </Container>
+    </Container>
+);