import { Input } from "./input.js";
/**
 * The `Input` component is a basic HTML `input` component that allows users to enter text.
 * It has the standard `input` HTML element attributes and design system styles.
 */
const meta = {
    title: "UI/Input",
    component: Input,
    parameters: {
        layout: "centered",
        chromatic: {
            disableSnapshot: true,
        },
    },
    tags: ["autodocs"],
    argTypes: {
        className: {
            control: "text",
        },
        placeholder: {
            control: "text",
        },
        disabled: {
            control: "boolean",
        },
        value: {
            control: "text",
        },
    },
};
export default meta;
export const Default = {
    args: {
        placeholder: "Type something...",
    },
};
export const WithValue = {
    args: {
        value: "Hello World",
    },
};
export const Empty = {
    args: {},
};
export const Placeholder = {
    args: {
        placeholder: "Enter your text here",
    },
};
export const Focused = {
    args: {
        placeholder: "This input is focused",
        autoFocus: true,
    },
    parameters: {
        pseudo: { focus: true },
    },
};
export const Disabled = {
    args: {
        placeholder: "This input is disabled",
        disabled: true,
    },
};
export const WithCustomWidth = {
    args: {
        className: "w-[50px]",
    },
};
//# sourceMappingURL=input.stories.js.map