import type { Meta, StoryObj } from '@storybook/svelte';
import TextInput from './TextInput.svelte';

const meta = {
  title: 'UI/TextInput',
  component: TextInput,
  tags: ['autodocs'],
  parameters: {
    docs: {
      description: {
        component: 'Textfeld mit Label, optionaler Hilfetext- und Fehleranzeige. Unterstützt type (text, email, password, search), required, disabled.',
      },
    },
  },
  argTypes: {
    type: {
      control: 'select',
      options: ['text', 'email', 'password', 'search'],
    },
  },
} satisfies Meta<TextInput>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = {
  args: {
    label: 'E-Mail',
    type: 'email',
    placeholder: 'ihre@email.de',
    required: true,
    helpText: 'Wir geben Ihre Daten nicht weiter.',
  },
};

export const WithError: Story = {
  args: {
    label: 'E-Mail',
    type: 'email',
    value: 'ungueltig',
    error: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
    invalid: true,
  },
};

export const Disabled: Story = {
  args: {
    label: 'Deaktiviert',
    value: 'Nur Lesen',
    disabled: true,
  },
};
