Add affirmative and destructive secondary button variants
This commit is contained in:
parent
0555ef0a1e
commit
95482fbf31
6 changed files with 72 additions and 136 deletions
|
@ -11,49 +11,25 @@ const story = storiesOf('Components/Button', module);
|
|||
|
||||
story.add('Kitchen sink', () => (
|
||||
<>
|
||||
<p>
|
||||
<Button onClick={action('onClick')} variant={ButtonVariant.Primary}>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
<p>
|
||||
<Button
|
||||
onClick={action('onClick')}
|
||||
variant={ButtonVariant.Primary}
|
||||
disabled
|
||||
>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<Button onClick={action('onClick')} variant={ButtonVariant.Secondary}>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
<p>
|
||||
<Button
|
||||
onClick={action('onClick')}
|
||||
variant={ButtonVariant.Secondary}
|
||||
disabled
|
||||
>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<Button onClick={action('onClick')} variant={ButtonVariant.Destructive}>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
<p>
|
||||
<Button
|
||||
onClick={action('onClick')}
|
||||
variant={ButtonVariant.Destructive}
|
||||
disabled
|
||||
>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
{[
|
||||
ButtonVariant.Primary,
|
||||
ButtonVariant.Secondary,
|
||||
ButtonVariant.SecondaryAffirmative,
|
||||
ButtonVariant.SecondaryDestructive,
|
||||
ButtonVariant.Destructive,
|
||||
].map(variant => (
|
||||
<React.Fragment key={variant}>
|
||||
<p>
|
||||
<Button onClick={action('onClick')} variant={variant}>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
<p>
|
||||
<Button disabled onClick={action('onClick')} variant={variant}>
|
||||
Hello world
|
||||
</Button>
|
||||
</p>
|
||||
</React.Fragment>
|
||||
))}
|
||||
</>
|
||||
));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue