import type { Meta, StoryObj } from '@storybook/react-vite';

import { PhoneInput } from './PhoneInput';

const meta: Meta<typeof PhoneInput> = {
  title: 'UI kit/Form/Inputs/PhoneInput',
  component: PhoneInput,
  tags: ['autodocs'],
  parameters: {
    layout: 'centered',
  },
};

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

export const Default: Story = {
  args: {
    placeholder: 'Enter phone number',
    label: 'Phone number',
  },
};

export const WithValue: Story = {
  args: {
    value: '+1 (555) 123-4567',
    placeholder: 'Enter phone number',
    label: 'Phone number',
  },
};

export const WithPlaceholder: Story = {
  args: {
    placeholder: 'Enter your phone number',
    label: 'Phone number',
  },
};

export const Error: Story = {
  args: {
    value: '123',
    placeholder: 'Enter phone number',
    label: 'Phone number',
    error: true,
  },
};

export const Warning: Story = {
  args: {
    value: '555-1234',
    placeholder: 'Enter phone number',
    label: 'Phone number',
    warning: true,
  },
};

export const Disabled: Story = {
  args: {
    value: '+1 (555) 123-4567',
    placeholder: 'Enter phone number',
    label: 'Phone number',
    disabled: true,
  },
};

export const WithMaxLength: Story = {
  args: {
    placeholder: 'Max 15 digits',
    label: 'Phone number',
    maxLength: 15,
  },
};