Signal-Desktop/ts/components/Button.stories.tsx

53 lines
1.4 KiB
TypeScript

// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React from 'react';
import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import { Button, ButtonSize, ButtonVariant } from './Button';
const story = storiesOf('Components/Button', module);
story.add('Kitchen sink', () => (
<>
{[ButtonSize.Medium, ButtonSize.Small].map(size => (
<React.Fragment key={size}>
{[
ButtonVariant.Primary,
ButtonVariant.Secondary,
ButtonVariant.SecondaryAffirmative,
ButtonVariant.SecondaryDestructive,
ButtonVariant.Destructive,
].map(variant => (
<React.Fragment key={variant}>
<p>
<Button onClick={action('onClick')} size={size} variant={variant}>
Hello world
</Button>
</p>
<p>
<Button
disabled
onClick={action('onClick')}
size={size}
variant={variant}
>
Hello world
</Button>
</p>
</React.Fragment>
))}
</React.Fragment>
))}
</>
));
story.add('aria-label', () => (
<Button
aria-label="hello"
className="module-ForwardMessageModal__header--back"
onClick={action('onClick')}
/>
));