aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-11-10 03:15:32 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-11-10 03:15:32 +0800
commitdaa011f7cbbc6719d99eef251d07f552e23c21fb (patch)
treeda1af3c83e7ed8677228714a18d67ea97147119a /packages/instant/src/components
parent239eada7d92e27ab5aa81d3364ffe5d83d0680a7 (diff)
downloaddexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar.gz
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar.bz2
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar.lz
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar.xz
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.tar.zst
dexon-sol-tools-daa011f7cbbc6719d99eef251d07f552e23c21fb.zip
feat: implement CurrentStandardSlidingPanel and put it in the main container
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/animations/slide_animation.tsx2
-rw-r--r--packages/instant/src/components/sliding_error.tsx3
-rw-r--r--packages/instant/src/components/sliding_panel.tsx4
-rw-r--r--packages/instant/src/components/standard_sliding_panel.tsx28
-rw-r--r--packages/instant/src/components/zero_ex_instant_container.tsx4
5 files changed, 36 insertions, 5 deletions
diff --git a/packages/instant/src/components/animations/slide_animation.tsx b/packages/instant/src/components/animations/slide_animation.tsx
index 9adb1c674..5992bcba7 100644
--- a/packages/instant/src/components/animations/slide_animation.tsx
+++ b/packages/instant/src/components/animations/slide_animation.tsx
@@ -1,10 +1,10 @@
import * as React from 'react';
import { OptionallyScreenSpecific } from '../../style/media';
+import { SlideAnimationState } from '../../types';
import { PositionAnimation, PositionAnimationSettings } from './position_animation';
-export type SlideAnimationState = 'slidIn' | 'slidOut' | 'none';
export interface SlideAnimationProps {
animationState: SlideAnimationState;
slideInSettings: OptionallyScreenSpecific<PositionAnimationSettings>;
diff --git a/packages/instant/src/components/sliding_error.tsx b/packages/instant/src/components/sliding_error.tsx
index a8d4e391c..b59e2a905 100644
--- a/packages/instant/src/components/sliding_error.tsx
+++ b/packages/instant/src/components/sliding_error.tsx
@@ -3,9 +3,10 @@ import * as React from 'react';
import { ScreenSpecification } from '../style/media';
import { ColorOption } from '../style/theme';
import { zIndex } from '../style/z_index';
+import { SlideAnimationState } from '../types';
import { PositionAnimationSettings } from './animations/position_animation';
-import { SlideAnimation, SlideAnimationState } from './animations/slide_animation';
+import { SlideAnimation } from './animations/slide_animation';
import { Container } from './ui/container';
import { Flex } from './ui/flex';
diff --git a/packages/instant/src/components/sliding_panel.tsx b/packages/instant/src/components/sliding_panel.tsx
index bb1049a31..44bc8edb3 100644
--- a/packages/instant/src/components/sliding_panel.tsx
+++ b/packages/instant/src/components/sliding_panel.tsx
@@ -2,14 +2,14 @@ import * as React from 'react';
import { ColorOption } from '../style/theme';
import { zIndex } from '../style/z_index';
+import { SlideAnimationState } from '../types';
import { PositionAnimationSettings } from './animations/position_animation';
-import { SlideAnimation, SlideAnimationState } from './animations/slide_animation';
+import { SlideAnimation } from './animations/slide_animation';
import { Container } from './ui/container';
import { Flex } from './ui/flex';
import { Icon } from './ui/icon';
-import { Text } from './ui/text';
export interface PanelProps {
onClose?: () => void;
diff --git a/packages/instant/src/components/standard_sliding_panel.tsx b/packages/instant/src/components/standard_sliding_panel.tsx
new file mode 100644
index 000000000..6d31f3e3a
--- /dev/null
+++ b/packages/instant/src/components/standard_sliding_panel.tsx
@@ -0,0 +1,28 @@
+import * as React from 'react';
+
+import { SlideAnimationState, StandardSlidingPanelContent, StandardSlidingPanelSettings } from '../types';
+
+import { SlidingPanel } from './sliding_panel';
+
+export interface StandardSlidingPanelProps extends StandardSlidingPanelSettings {
+ onClose: () => void;
+}
+
+export class StandardSlidingPanel extends React.Component<StandardSlidingPanelProps> {
+ public render(): React.ReactNode {
+ const { animationState, content, onClose } = this.props;
+ return (
+ <SlidingPanel animationState={animationState} onClose={onClose}>
+ {this._getNodeForContent(content)}
+ </SlidingPanel>
+ );
+ }
+ private readonly _getNodeForContent = (content: StandardSlidingPanelContent): React.ReactNode => {
+ switch (content) {
+ case StandardSlidingPanelContent.InstallMetaMask:
+ return 'Install MetaMask';
+ default:
+ return null;
+ }
+ };
+}
diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 47fd75d25..b5f974cbe 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -1,6 +1,7 @@
import * as React from 'react';
import { AvailableERC20TokenSelector } from '../containers/available_erc20_token_selector';
+import { CurrentStandardSlidingPanel } from '../containers/current_standard_sliding_panel';
import { LatestBuyQuoteOrderDetails } from '../containers/latest_buy_quote_order_details';
import { LatestError } from '../containers/latest_error';
import { SelectedAssetBuyOrderProgress } from '../containers/selected_asset_buy_order_progress';
@@ -8,8 +9,8 @@ import { SelectedAssetBuyOrderStateButtons } from '../containers/selected_asset_
import { SelectedAssetInstantHeading } from '../containers/selected_asset_instant_heading';
import { ColorOption } from '../style/theme';
import { zIndex } from '../style/z_index';
+import { SlideAnimationState } from '../types';
-import { SlideAnimationState } from './animations/slide_animation';
import { CSSReset } from './css_reset';
import { SlidingPanel } from './sliding_panel';
import { Container } from './ui/container';
@@ -59,6 +60,7 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
>
<AvailableERC20TokenSelector onTokenSelect={this._handlePanelClose} />
</SlidingPanel>
+ <CurrentStandardSlidingPanel />
</Container>
</Container>
</React.Fragment>