diff options
author | sharkiecodes <lanyi_stroud@brown.edu> | 2025-06-13 10:17:46 -0400 |
---|---|---|
committer | sharkiecodes <lanyi_stroud@brown.edu> | 2025-06-13 10:17:46 -0400 |
commit | fbf768dd4c7734cfdcca38fd1dc1ecf63c64d985 (patch) | |
tree | 1c267a3762543b469805d0e08e13f9d311e6a036 /packages/components/src/components/Button/Button.stories.tsx | |
parent | 2c947f1ba7785ccbb705c0dce7e6bd64821da99d (diff) | |
parent | a7a7a5a75845d40f835a38a3af24f000db50009b (diff) |
Merge branch 'master' into lanyi-branch
Diffstat (limited to 'packages/components/src/components/Button/Button.stories.tsx')
-rw-r--r-- | packages/components/src/components/Button/Button.stories.tsx | 149 |
1 files changed, 76 insertions, 73 deletions
diff --git a/packages/components/src/components/Button/Button.stories.tsx b/packages/components/src/components/Button/Button.stories.tsx index 3893d9ded..9e7e8cb05 100644 --- a/packages/components/src/components/Button/Button.stories.tsx +++ b/packages/components/src/components/Button/Button.stories.tsx @@ -1,94 +1,97 @@ -import { Meta, Story } from '@storybook/react' -import React from 'react' -import * as bi from 'react-icons/bi' -import { Button, IButtonProps } from '..' -import { Colors, Size } from '../../global/globalEnums' -import { Type , getFormLabelSize } from '../../global' +import { Meta, Story } from '@storybook/react'; +import React from 'react'; +import * as bi from 'react-icons/bi'; +import { Button, IButtonProps } from '..'; +import { Type } from '../../global'; +import { Size } from '../../global/globalEnums'; export default { - title: 'Dash/Button', - component: Button, - argTypes: {}, -} as Meta<typeof Button> + title: 'Dash/Button', + component: Button, + argTypes: {}, +} as Meta<typeof Button>; -const Template: Story<IButtonProps> = (args) => <Button {...args} /> +const Template: Story<IButtonProps> = args => <Button {...args} />; -export const Primary = Template.bind({}) +export const Primary = Template.bind({}); Primary.args = { - onClick: () => {}, - text: 'Primary', - type: Type.PRIM, - style: { - fontWeight: 600 - }, - tooltip: 'Primary button' -} + onClick: () => {}, + text: 'Primary', + type: Type.PRIM, + style: { + fontWeight: 600, + }, + tooltip: 'Primary button', +}; -export const Secondary = Template.bind({}) +export const Secondary = Template.bind({}); Secondary.args = { - onClick: () => {}, - text: 'Secondary', - type: Type.SEC, - tooltip: 'Secondary button' -} + onClick: () => {}, + text: 'Secondary', + type: Type.SEC, + tooltip: 'Secondary button', + color: 'green', + background: 'yellow', +}; -export const Tertiary = Template.bind({}) +export const Tertiary = Template.bind({}); Tertiary.args = { - onClick: () => {}, - text: 'Tertiary', - type: Type.TERT, - size: Size.SMALL, -} + onClick: () => {}, + text: 'Tertiary', + type: Type.TERT, + size: Size.SMALL, + background: 'yellow', +}; -export const Small = Template.bind({}) +export const Small = Template.bind({}); Small.args = { - onClick: () => {}, - text: 'Small', - type: Type.PRIM, - size: Size.SMALL, -} + onClick: () => {}, + text: 'Small', + type: Type.PRIM, + size: Size.SMALL, +}; -export const Medium = Template.bind({}) +export const Medium = Template.bind({}); Medium.args = { - onClick: () => {}, - text: 'Medium', - type: Type.PRIM, - size: Size.MEDIUM, -} + onClick: () => {}, + text: 'Medium', + type: Type.PRIM, + size: Size.MEDIUM, +}; -export const Large = Template.bind({}) +export const Large = Template.bind({}); Large.args = { - onClick: () => {}, - text: 'Large', - type: Type.PRIM, - size: Size.LARGE, -} + onClick: () => {}, + text: 'Large', + type: Type.PRIM, + size: Size.LARGE, +}; -export const ButtonWithLeftIcon = Template.bind({}) +export const ButtonWithLeftIcon = Template.bind({}); ButtonWithLeftIcon.args = { - onClick: () => {}, - text: 'New', - icon: <bi.BiPlus />, - iconPosition: 'left', - type: Type.PRIM, -} + onClick: () => {}, + text: 'New', + icon: <bi.BiPlus />, + iconPosition: 'left', + type: Type.PRIM, +}; -export const ButtonWithRightIcon = Template.bind({}) +export const ButtonWithRightIcon = Template.bind({}); ButtonWithRightIcon.args = { - onClick: () => {}, - text: 'More', - iconPosition: 'right', - icon: <bi.BiMobile />, - type: Type.PRIM, -} + onClick: () => {}, + text: 'More', + iconPosition: 'right', + icon: <bi.BiMobile />, + type: Type.PRIM, +}; -export const Label = Template.bind({}) +export const Label = Template.bind({}); Label.args = { - onClick: () => {}, - text: 'Label', - type: Type.PRIM, - style: { - fontWeight: 600 - }, - tooltip: 'Label button' -}
\ No newline at end of file + onClick: () => {}, + text: 'Label', + type: Type.PRIM, + style: { + fontWeight: 600, + }, + tooltip: 'Label button', +}; |