'use strict';

const index = require('./index-8277cbb3.js');
const global = require('./global-b7b1b8fe.js');
const JSS = require('./JSS-8503a151.js');
const mixins = require('./mixins-4761d472.js');

const style = {
  ErrorStyle: mixins.ErrorStyles,
  FieldContainer: {
    "margin-bottom": "var(--sl-spacing-medium)",
  },
};
const vanillaStyle = `
:host {
  margin: 0 auto;
  width: 100%;
  display: block;
}
`;
JSS.jss.setup(JSS.create());
const sheet = JSS.jss.createStyleSheet(style);
const styleString = sheet.toString();
function LeadInputFieldView(props) {
  var _a, _b, _c, _d, _e, _f;
  const { states, content } = props;
  const getRequiredFieldErrorMessage = ({ fieldLabel, }) => global.intl.formatMessage({
    id: `requiredFieldErrorMessage-${fieldLabel}`,
    defaultMessage: content.requiredFieldErrorMessage,
  }, {
    fieldLabel,
  });
  return (index.h("div", { class: sheet.classes.FieldContainer, part: "sqm-base" },
    index.h("style", { type: "text/css" },
      vanillaStyle,
      styleString),
    index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", name: `/${content.fieldName}`, type: content.fieldType, label: `${content.fieldLabel}${content.fieldOptional ? ` ${content.optionalLabel}` : ""}` }, (!content.fieldOptional ? { required: true } : []), { disabled: ((_a = states.leadFormState) === null || _a === void 0 ? void 0 : _a.loading) || ((_b = states.leadFormState) === null || _b === void 0 ? void 0 : _b.disabled), validationError: ({ value }) => {
        if (!value && !content.fieldOptional) {
          return getRequiredFieldErrorMessage({
            fieldLabel: content.fieldLabel,
          });
        }
      } }, (((_d = (_c = states.leadFormState) === null || _c === void 0 ? void 0 : _c.validationErrors) === null || _d === void 0 ? void 0 : _d[content.fieldName]) ? {
      class: sheet.classes.ErrorStyle,
      helpText: ((_f = (_e = states.leadFormState) === null || _e === void 0 ? void 0 : _e.validationErrors) === null || _f === void 0 ? void 0 : _f[content.fieldName]) ||
        content.requiredFieldErrorMessage,
    }
      : [])))));
}

exports.LeadInputFieldView = LeadInputFieldView;
