import { jsx as _jsx } from "react/jsx-runtime";
import { Icon } from "@powerhousedao/design-system";
import { FormInput } from "./form-input.js";
const meta = {
    title: "Connect/Components/Form Input",
    component: FormInput,
};
export default meta;
const Template = {
    args: {
        name: "driveName",
        icon: _jsx(Icon, { name: "Drive" }),
        placeholder: "Enter value",
    },
    decorators: [
        (Story) => (_jsx("div", { className: "grid h-48 w-96 place-items-center bg-white", children: _jsx(Story, {}) })),
    ],
};
export const Default = {
    ...Template,
};
export const WithValue = {
    ...Template,
    args: {
        ...Template.args,
        value: "hello I am a value",
    },
};
export const Email = {
    ...Template,
    args: {
        ...Template.args,
        type: "email",
        placeholder: "you@powerhouse.io",
    },
};
export const Password = {
    ...Template,
    args: {
        ...Template.args,
        type: "password",
        placeholder: "YourPassword123",
    },
};
export const WithLengthLimits = {
    ...Template,
    args: {
        ...Template.args,
        minLength: 2,
        maxLength: 3,
    },
};
export const WithRegexPattern = {
    ...Template,
    args: {
        ...Template.args,
        pattern: "[a-c]{3}",
    },
};
export const Required = {
    ...Template,
    args: {
        ...Template.args,
        required: true,
    },
};
//# sourceMappingURL=form-input.stories.js.map