import type { Meta, StoryObj } from '@storybook/react';
import { Label } from './label';
import { Input } from './input';

const meta = {
    title: 'UI/Label',
    component: Label,
    tags: ['autodocs'],
    argTypes: {
        children: { control: 'text' },
    },
    args: {
        children: 'Email Address',
    }
} satisfies Meta<typeof Label>;

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

export const Default: Story = {};

export const WithInput: Story = {
    render: (args) => (
        <div className="grid w-full max-w-sm items-center gap-1.5">
            <Label htmlFor="email" {...args} />
            <Input type="email" id="email" placeholder="Email" />
        </div>
    ),
};