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

const meta = {
  title: "Elements/OptionSelect/AutoCompleteOption",
  component: AutoCompleteOption,
  tags: ["autodocs"],
  args: {
    label: "City",
    placeholder: "Search cities…",
    options: [
      { label: "Amsterdam", value: "AMS" },
      { label: "Berlin", value: "BER" },
      { label: "Copenhagen", value: "CPH" },
      { label: "Dublin", value: "DUB" },
    ],
  },
  parameters: componentDoc("AutoCompleteOption", { barrel: "option-select" }),
} satisfies Meta<typeof AutoCompleteOption>

export default meta
type Story = StoryObj<typeof meta>

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

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

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

export const WithMinSearchLength: Story = {
  args: { label: "City", minSearchLength: 2 },
}

export const WithHelpText: Story = {
  args: { label: "City", helpText: "Start typing to filter." },
}

export const WithErrors: Story = {
  args: { label: "City", errors: ["Please choose a city."] },
}
