diff options
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r-- | packages/instant/src/components/retry_button.tsx | 17 | ||||
-rw-r--r-- | packages/instant/src/components/secondary_button.tsx | 28 |
2 files changed, 30 insertions, 15 deletions
diff --git a/packages/instant/src/components/retry_button.tsx b/packages/instant/src/components/retry_button.tsx index 5e36506d0..28547ce54 100644 --- a/packages/instant/src/components/retry_button.tsx +++ b/packages/instant/src/components/retry_button.tsx @@ -1,24 +1,11 @@ import * as React from 'react'; -import { ColorOption } from '../style/theme'; - -import { Button, Text } from './ui'; +import { SecondaryButton } from './secondary_button'; export interface RetryButtonProps { onClick: () => void; } export const RetryButton: React.StatelessComponent<RetryButtonProps> = props => { - return ( - <Button - backgroundColor={ColorOption.white} - borderColor={ColorOption.lightGrey} - width="100%" - onClick={props.onClick} - > - <Text fontColor={ColorOption.primaryColor} fontWeight={600} fontSize="16px"> - Try Again - </Text> - </Button> - ); + return <SecondaryButton text="Try Again" onClick={props.onClick} />; }; diff --git a/packages/instant/src/components/secondary_button.tsx b/packages/instant/src/components/secondary_button.tsx new file mode 100644 index 000000000..e073f6061 --- /dev/null +++ b/packages/instant/src/components/secondary_button.tsx @@ -0,0 +1,28 @@ +import * as _ from 'lodash'; +import * as React from 'react'; + +import { ColorOption } from '../style/theme'; + +import { Button, ButtonProps } from './ui/button'; +import { Text } from './ui/text'; + +export interface SecondaryButtonProps extends ButtonProps { + text: string; +} + +export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = props => { + const buttonProps = _.omit(props, 'text'); + return ( + <Button + backgroundColor={ColorOption.white} + borderColor={ColorOption.lightGrey} + width="100%" + onClick={props.onClick} + {...buttonProps} + > + <Text fontColor={ColorOption.primaryColor} fontWeight={600} fontSize="16px"> + {props.text} + </Text> + </Button> + ); +}; |