Button.stories.ts 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. import type { Meta, StoryObj } from '@storybook/react';
  2. import { Button } from './Button';
  3. // More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
  4. const meta: Meta<typeof Button> = {
  5. title: 'Example/Button',
  6. component: Button,
  7. parameters: {
  8. // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout
  9. layout: 'centered',
  10. },
  11. // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
  12. tags: ['autodocs'],
  13. // More on argTypes: https://storybook.js.org/docs/api/argtypes
  14. argTypes: {
  15. backgroundColor: { control: 'color' },
  16. },
  17. };
  18. export default meta;
  19. type Story = StoryObj<typeof Button>;
  20. // More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
  21. export const Primary: Story = {
  22. args: {
  23. primary: true,
  24. label: 'Button',
  25. },
  26. };
  27. export const Secondary: Story = {
  28. args: {
  29. label: 'Button',
  30. },
  31. };
  32. export const Large: Story = {
  33. args: {
  34. size: 'large',
  35. label: 'Button',
  36. },
  37. };
  38. export const Small: Story = {
  39. args: {
  40. size: 'small',
  41. label: 'Button',
  42. },
  43. };