diff options
author | eleanor-park <eleanor_park@brown.edu> | 2025-01-08 11:15:25 -0500 |
---|---|---|
committer | eleanor-park <eleanor_park@brown.edu> | 2025-01-08 11:15:25 -0500 |
commit | 8283499ca247da4f283f220d368e5e178c4d79a1 (patch) | |
tree | fbf39aa81c7d8e82dd9844d6e14392e6ad78e22d /packages/components/src/components/Button/Button.stories.tsx | |
parent | 45e22be891331e2d6a381e988c7abd29af3e1399 (diff) | |
parent | 2f7d1f0073943e1eb9e0f34c4459bc0176377697 (diff) |
Merge branch 'eleanor-gptdraw' of https://github.com/brown-dash/Dash-Web into eleanor-gptdraw
Diffstat (limited to 'packages/components/src/components/Button/Button.stories.tsx')
-rw-r--r-- | packages/components/src/components/Button/Button.stories.tsx | 94 |
1 files changed, 94 insertions, 0 deletions
diff --git a/packages/components/src/components/Button/Button.stories.tsx b/packages/components/src/components/Button/Button.stories.tsx new file mode 100644 index 000000000..3893d9ded --- /dev/null +++ b/packages/components/src/components/Button/Button.stories.tsx @@ -0,0 +1,94 @@ +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' + +export default { + title: 'Dash/Button', + component: Button, + argTypes: {}, +} as Meta<typeof Button> + +const Template: Story<IButtonProps> = (args) => <Button {...args} /> + +export const Primary = Template.bind({}) +Primary.args = { + onClick: () => {}, + text: 'Primary', + type: Type.PRIM, + style: { + fontWeight: 600 + }, + tooltip: 'Primary button' +} + +export const Secondary = Template.bind({}) +Secondary.args = { + onClick: () => {}, + text: 'Secondary', + type: Type.SEC, + tooltip: 'Secondary button' +} + +export const Tertiary = Template.bind({}) +Tertiary.args = { + onClick: () => {}, + text: 'Tertiary', + type: Type.TERT, + size: Size.SMALL, +} + +export const Small = Template.bind({}) +Small.args = { + onClick: () => {}, + text: 'Small', + type: Type.PRIM, + size: Size.SMALL, +} + +export const Medium = Template.bind({}) +Medium.args = { + onClick: () => {}, + text: 'Medium', + type: Type.PRIM, + size: Size.MEDIUM, +} + +export const Large = Template.bind({}) +Large.args = { + onClick: () => {}, + text: 'Large', + type: Type.PRIM, + size: Size.LARGE, +} + +export const ButtonWithLeftIcon = Template.bind({}) +ButtonWithLeftIcon.args = { + onClick: () => {}, + text: 'New', + icon: <bi.BiPlus />, + iconPosition: 'left', + type: Type.PRIM, +} + +export const ButtonWithRightIcon = Template.bind({}) +ButtonWithRightIcon.args = { + onClick: () => {}, + text: 'More', + iconPosition: 'right', + icon: <bi.BiMobile />, + type: Type.PRIM, +} + +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 |