import { Meta, StoryObj } from "@storybook/react"
import React, { useState } from "react"
import { QuantityInput, QuantityInputProps } from "./QuantityInput"

type Story = StoryObj<typeof QuantityInput>

const meta: Meta<typeof QuantityInput> = {
  title: "Design System/QuantityInput",
  component: QuantityInput,
  args: {
    placeholder: "0",
  },
}

export default meta

const Template = (args: QuantityInputProps) => {
  const [value, setValue] = useState<number | null>(null)

  return <QuantityInput {...args} value={value} onValueChange={setValue} />
}

export const Default: Story = {
  render: Template,
}

export const WithMinMax: Story = {
  render: Template,
  args: {
    min: 0,
    max: 10,
  },
}

export const Disabled: Story = {
  render: Template,
  args: {
    disabled: true,
  },
}