import { h } from "@stencil/core";
import { LeadInputFieldView, } from "./sqm-lead-input-field-view";
export default {
  title: "Components/Lead Form Input Field",
};
const defaultProps = {
  states: {
    leadFormState: {
      validationErrors: {},
      loading: false,
      disabled: false,
      initialData: {},
    },
  },
  content: {
    fieldName: "firstName",
    fieldLabel: "First Name",
    fieldType: "text",
    optionalLabel: "(Optional)",
    requiredFieldErrorMessage: "Please {fieldAction} a {fieldLabel}",
    fieldOptional: false,
  },
};
export const Default = () => h(LeadInputFieldView, Object.assign({}, defaultProps));
export const WithError = () => (h(LeadInputFieldView, Object.assign({}, defaultProps, { states: {
    ...defaultProps.states,
    leadFormState: {
      ...defaultProps.states.leadFormState,
      validationErrors: {
        firstName: "Please enter a first name",
      },
    },
  } })));
export const Disabled = () => (h(LeadInputFieldView, Object.assign({}, defaultProps, { states: {
    ...defaultProps.states,
    leadFormState: {
      ...defaultProps.states.leadFormState,
      disabled: true,
    },
  } })));
export const WithInitialValue = () => (h(LeadInputFieldView, Object.assign({}, defaultProps, { states: {
    ...defaultProps.states,
    leadFormState: {
      ...defaultProps.states.leadFormState,
      initialData: {
        firstName: "Jane",
      },
    },
  } })));
