diff options
author | bobzel <zzzman@gmail.com> | 2025-03-10 16:13:04 -0400 |
---|---|---|
committer | bobzel <zzzman@gmail.com> | 2025-03-10 16:13:04 -0400 |
commit | b7989dded8bb001876de6cbca59bf77935f0daf7 (patch) | |
tree | 0dba0665674db7bb84770833df0a4100d0520701 /packages/components/src/components/Button/Button.stories.tsx | |
parent | 4979415d4604d280e81a162bf9a9d39c731d3738 (diff) | |
parent | 5bf944035c0ba94ad15245416f51ca0329a51bde (diff) |
Merge branch 'master' into alyssa-starter
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 |