text: import React from "react";
  
  export default {
    title: 'Forms/<input>/type="email"',
    argTypes: {
      disabled: {
        type: { name: "boolean", required: false },
        table: {
          type: { summary: "boolean" },
          defaultValue: { summary: "false" },
        },
      },
      readOnly: {
        name: "readonly",
        type: { name: "boolean", required: false },
        table: {
          type: { summary: "boolean" },
          defaultValue: { summary: "false" },
        },
      },
      required: {
        type: { name: "boolean", required: false },
        table: {
          type: { summary: "boolean" },
          defaultValue: { summary: "false" },
        },
      },
      placeholder: {
        type: { name: "string", required: false },
        table: {
          type: { summary: "string" },
          defaultValue: { summary: "" },
        },
      },
      defaultValue: {
        name: "value",
        type: { name: "string", required: false },
        table: {
          type: { summary: "string" },
          defaultValue: { summary: "" },
        },
      },
    },
  };
  
  const Template = (args) => <input type="email" {...args} />;
  
  export const email = Template.bind({});
  
  email.storyName = 'type="email"';
  
  export const placeholder = Template.bind({});
  
  placeholder.storyName = "placeholder";
  placeholder.args = {
    placeholder: "placeholder@example.com",
  };
  
  export const value = Template.bind({});
  
  value.storyName = "value";
  value.args = {
    defaultValue: "example@example.com",
  };
  
  export const disabled = Template.bind({});
  
  disabled.storyName = "disabled";
  disabled.args = {
    defaultValue: "disabled@example.com",
    disabled: true,
  };
  
  export const readonly = Template.bind({});
  
  readonly.storyName = "readonly";
  readonly.args = {
    defaultValue: "readonly@example.com",
    readOnly: true,
  };
  
  export const requiredEmpty = Template.bind({});
  
  requiredEmpty.storyName = "required empty";
  requiredEmpty.args = {
    required: true,
  };
  
  export const requiredFilled = Template.bind({});
  
  requiredFilled.storyName = "required filled";
  requiredFilled.args = {
    defaultValue: "required-filled@example.com",
    required: true,
  };
  