import type { Meta, StoryObj } from "@storybook/vue3-vite"
import NumberInput from "./NumberInput.vue"
import { componentDoc } from "@/lib/storybook"

const meta = {
  title: "Elements/Input/NumberInput",
  component: NumberInput,
  tags: ["autodocs"],
  args: {
    label: "Field label",
    placeholder: "Enter a number...",
  },
  parameters: componentDoc("NumberInput", { barrel: "input" }),
} satisfies Meta<typeof NumberInput>

export default meta
type Story = StoryObj<typeof meta>

export const Default: Story = {
  args: { label: "Quantity" },
}

export const WithBounds: Story = {
  args: { label: "Age", min: 0, max: 120, step: 1 },
}

export const WithDefaultValue: Story = {
  args: { label: "Count", modelValue: 42 },
}

export const Required: Story = {
  args: { label: "Required quantity", required: true },
}

export const Disabled: Story = {
  args: { label: "Disabled", disabled: true, modelValue: 10 },
}

export const Readonly: Story = {
  args: { label: "Readonly", readonly: true, modelValue: 10 },
}

export const WithHelpText: Story = {
  args: {
    label: "Quantity",
    helpText: "Must be between 1 and 100.",
    min: 1,
    max: 100,
  },
}

export const WithErrors: Story = {
  args: {
    label: "Quantity",
    errors: ["Must be a positive number."],
  },
}
