aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components/amount_placeholder.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components/amount_placeholder.tsx')
-rw-r--r--packages/instant/src/components/amount_placeholder.tsx32
1 files changed, 32 insertions, 0 deletions
diff --git a/packages/instant/src/components/amount_placeholder.tsx b/packages/instant/src/components/amount_placeholder.tsx
new file mode 100644
index 000000000..29ce8fafb
--- /dev/null
+++ b/packages/instant/src/components/amount_placeholder.tsx
@@ -0,0 +1,32 @@
+import * as React from 'react';
+
+import { ColorOption } from '../style/theme';
+
+import { Pulse } from './animations/pulse';
+
+import { Text } from './ui/text';
+
+interface PlainPlaceholder {
+ color: ColorOption;
+}
+const PlainPlaceholder: React.StatelessComponent<PlainPlaceholder> = props => (
+ <Text fontWeight="bold" fontColor={props.color}>
+ &mdash;
+ </Text>
+);
+
+export interface AmountPlaceholderProps {
+ color: ColorOption;
+ isPulsating: boolean;
+}
+export const AmountPlaceholder: React.StatelessComponent<AmountPlaceholderProps> = props => {
+ if (props.isPulsating) {
+ return (
+ <Pulse>
+ <PlainPlaceholder color={props.color} />
+ </Pulse>
+ );
+ } else {
+ return <PlainPlaceholder color={props.color} />;
+ }
+};