FPKIT

button.stories.tsx

import React from 'react'
import COMPONENT_NAME from './component-name'

import { ComponentStory, ComponentMeta } from "@storybook/react"
import { BADGE } from '@geometricpanda/storybook-addon-badges';

export default {
  title: 'Elements/COMPONENT_NAMEs',
  component: COMPONENT_NAME,
  argTypes: {
    children: { control: 'text' },
    type: { control: 'select', options: ['button', 'submit', 'reset'] },
    disabled: { control: 'boolean' },
  },
  parameters: {
    badges: [BADGE.BETA]
  }
} as ComponentMeta<typeof COMPONENT_NAME>

const Template: ComponentStory<typeof COMPONENT_NAME> = (args) => (<COMPONENT_NAME { ...args } />)

export const DefaultCOMPONENT_NAME = Template.bind({})
DefaultCOMPONENT_NAME.args = {
  children: 'Default COMPONENT_NAME',
  onClick: () => console.log('Clicked Default COMPONENT_NAME')
}