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

const meta = {
  title: "Elements/Input/PasswordInput",
  component: PasswordInput,
  tags: ["autodocs"],
  args: {
    label: "Password",
    placeholder: "Enter your password",
  },
  parameters: componentDoc("PasswordInput", { barrel: "input" }),
} satisfies Meta<typeof PasswordInput>

export default meta
type Story = StoryObj<typeof meta>

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

export const WithToggle: Story = {
  args: { label: "Password", togglePasswordVisibility: true },
}

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

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

export const WithHelpText: Story = {
  args: {
    label: "Password",
    togglePasswordVisibility: true,
    helpText: "Must be at least 8 characters.",
  },
}

export const WithErrors: Story = {
  args: {
    label: "Password",
    togglePasswordVisibility: true,
    errors: ["Must be at least 8 characters.", "Must include a number."],
  },
}
