mirror of
https://github.com/yu-i-i/overleaf-cep.git
synced 2026-06-06 23:59:01 +02:00
Add Button variants story (#30491)
GitOrigin-RevId: 98d0cd965832de79de493d46ef9c989daff7be9b
This commit is contained in:
@@ -0,0 +1,44 @@
|
||||
import { Meta, StoryObj } from '@storybook/react'
|
||||
import OLButton from '@/shared/components/ol/ol-button'
|
||||
import { ButtonProps } from '@/shared/components/types/button-props'
|
||||
|
||||
export default {
|
||||
title: 'Shared / Components / Button',
|
||||
component: OLButton,
|
||||
} satisfies Meta
|
||||
|
||||
type Story = StoryObj<typeof OLButton>
|
||||
|
||||
const variants: ButtonProps['variant'][] = [
|
||||
'primary',
|
||||
'secondary',
|
||||
'ghost',
|
||||
'danger',
|
||||
'danger-ghost',
|
||||
'premium',
|
||||
'premium-secondary',
|
||||
'link',
|
||||
]
|
||||
|
||||
export const Variants: Story = {
|
||||
render() {
|
||||
return (
|
||||
<div className="d-flex flex-column gap-2">
|
||||
{variants.map(variant => (
|
||||
<div key={variant} className="d-flex gap-2">
|
||||
<OLButton variant={variant}>Button</OLButton>
|
||||
<OLButton variant={variant} isLoading>
|
||||
Button
|
||||
</OLButton>
|
||||
<OLButton variant={variant} disabled>
|
||||
Button
|
||||
</OLButton>
|
||||
<OLButton variant={variant} size="sm">
|
||||
Button
|
||||
</OLButton>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
Reference in New Issue
Block a user