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

const meta = {
  title: "Elements/Input/TextareaInput",
  component: TextareaInput,
  tags: ["autodocs"],
  args: {
    label: "Bio",
    placeholder: "Tell us about yourself...",
    rows: 3,
  },
  parameters: componentDoc("TextareaInput", { barrel: "input" }),
} satisfies Meta<typeof TextareaInput>

export default meta
type Story = StoryObj<typeof meta>

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

export const TallerRows: Story = {
  args: { label: "Long description", rows: 8 },
}

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

export const Disabled: Story = {
  args: { label: "Description", disabled: true, modelValue: "Read-only content." },
}

export const WithHelpText: Story = {
  args: {
    label: "Bio",
    helpText: "Plain text, up to 280 characters.",
    maxlength: 280,
  },
}

export const WithErrors: Story = {
  args: {
    label: "Bio",
    errors: ["Bio is required."],
  },
}

export const WithDefaultValue: Story = {
  args: {
    label: "Bio",
    modelValue: "Stephen builds platforms.",
  },
}
