import {fn} from 'storybook/test'

import {QuantitySelector} from '../components/commerce/quantity-selector'

import type {Meta, StoryObj} from '@storybook/react-vite'

type QuantitySelectorProps = React.ComponentProps<typeof QuantitySelector>

const meta: Meta<QuantitySelectorProps> = {
  title: 'Commerce/QuantitySelector',
  component: QuantitySelector,
  parameters: {},
  tags: ['autodocs'],
  argTypes: {
    quantity: {
      control: 'number',
      description: 'Current quantity value',
    },
    onQuantityChange: {
      action: 'quantity changed',
      description: 'Callback fired when quantity changes',
    },
    maxQuantity: {
      control: 'number',
      description: 'Maximum allowed quantity',
    },
    minQuantity: {
      control: 'number',
      description: 'Minimum allowed quantity',
    },
    disabled: {
      control: 'boolean',
      description: 'Whether the selector is disabled',
    },
  },
  args: {
    onQuantityChange: fn(),
  },
} satisfies Meta<QuantitySelectorProps>

export default meta
type Story = StoryObj<typeof meta>

export const Default: Story = {
  args: {
    quantity: 2,
    maxQuantity: 10,
    minQuantity: 1,
    disabled: false,
  },
}

export const AtMinimum: Story = {
  args: {
    quantity: 1,
    maxQuantity: 10,
    minQuantity: 1,
    disabled: false,
  },
}

export const AtMaximum: Story = {
  args: {
    quantity: 10,
    maxQuantity: 10,
    minQuantity: 1,
    disabled: false,
  },
}

export const Disabled: Story = {
  args: {
    quantity: 3,
    maxQuantity: 10,
    minQuantity: 1,
    disabled: true,
  },
}
