/components/input/email

import { input } from "@hedia/hexui/components/input";
import { chevRightOutlineIcon, mailOutlineIcon } from "@hedia/iconly/outline";

export default {
  Default,
  WithError,
  Disabled,
};

export function Default() {
  return [
    input({
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
    }),
    input({
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
      value: "email@hedia.com",
    }),
  ];
}

export function WithError() {
  return [
    input({
      error: true,
      errorText: "Email is required",
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
    }),
    input({
      error: true,
      errorText: "Email is already in use",
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
      value: "email@hedia.com",
    }),
  ];
}

export function Disabled() {
  return [
    input({
      disabled: true,
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
    }),
    input({
      disabled: true,
      leadingIcon: mailOutlineIcon(),
      name: "email",
      placeholder: "Email",
      trailingIcon: chevRightOutlineIcon(),
      type: "email",
      value: "email@hedia.com",
    }),
  ];
}