overleaf/services/web/frontend/stories/ui/button.stories.tsx
Rebeka Dekany fa3f51fb2e Merge pull request #17806 from overleaf/rd-bootstrap-button2
[web] - Updating the Account Settings page with the Button and Icon Button wrappers

GitOrigin-RevId: 135c4ddaa64d009d3ab8cdfef9cff899fd77669c
2024-04-17 08:05:10 +00:00

52 lines
1.1 KiB
TypeScript

import Button from '@/features/ui/components/bootstrap-5/button'
import { Meta } from '@storybook/react'
type Args = React.ComponentProps<typeof Button>
export const NewButton = (args: Args) => {
return <Button {...args} />
}
export const ButtonWithLeadingIcon = (args: Args) => {
return <Button leadingIcon="add" {...args} />
}
export const ButtonWithTrailingIcon = (args: Args) => {
return <Button trailingIcon="add" {...args} />
}
export const ButtonWithIcons = (args: Args) => {
return <Button trailingIcon="add" leadingIcon="add" {...args} />
}
const meta: Meta<typeof Button> = {
title: 'Shared / Components / Bootstrap 5 / Button',
component: Button,
args: {
children: 'A Bootstrap 5 Button',
disabled: false,
isLoading: false,
},
argTypes: {
size: {
control: 'radio',
options: ['small', 'default', 'large'],
},
variant: {
control: 'radio',
options: [
'primary',
'secondary',
'ghost',
'danger',
'danger-ghost',
'premium',
],
},
},
parameters: {
bootstrap5: true,
},
}
export default meta