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

const meta = {
  title: "Elements/Picker/DataModelPicker",
  component: DataModelPicker,
  tags: ["autodocs"],
  args: {
    label: "Field name",
    dataModelKeys: [
      "first_name",
      "last_name",
      "email",
      "role",
      "company.name",
      "starts_at",
      "ends_at",
    ],
  },
  parameters: componentDoc("DataModelPicker", { barrel: "picker" }),
  decorators: [
    () => ({
      template: '<div class="w-96 p-4"><story /></div>',
    }),
  ],
} satisfies Meta<typeof DataModelPicker>

export default meta
type Story = StoryObj<typeof meta>

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

export const WithKeys: Story = {
  args: {
    label: "Field name",
    dataModelKeys: ["first_name", "last_name", "email", "role"],
  },
}

export const WithValue: Story = {
  args: { label: "Field name", modelValue: "starts_at" },
}

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

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