@cling-se/widget 0.14.4 → 0.14.6

package/dist/ClientModal-CVZFb1Br.js

@@ -0,0 +1,625 @@
+import { C as v } from "./ClientAutocomplete-BKKc_br6.js";
+import { E as p, a9 as y, I as C, n as u, b as l, d as b, c as _, g as c, aa as $, y as w } from "./main-CQBEuZk9.js";
+import { w as f } from "./CDropdownItem-CXJ4xD8W.js";
+import { v as r } from "./index-BDMI4NVY.js";
+import { m as g, b as x, a as k } from "./vuex.esm-DKGl8mcw.js";
+import { o as N } from "./omit-BWy0Zhd3.js";
+function h(a) {
+  if (typeof a > "u")
+    throw Error("Missing param inputParam");
+  let e = a;
+  Number.isInteger(e) && (e = e.toString());
+  let t = 0;
+  const i = e.length, n = i % 2;
+  let s, o;
+  for (s = 0; s < i; s += 1)
+    o = parseInt(e.charAt(s), 10), s % 2 === n && (o *= 2), o > 9 && (o -= 9), t += o;
+  return t % 10 === 0;
+}
+function m(a) {
+  let e = a.replace(/ /g, "");
+  return e = e.replace(/-/g, ""), !h(e) || (e = [e.slice(0, 6), "-", e.slice(6)].join(""), !e.match(/^(\d{6})-(\d{4})$/)) ? !1 : e;
+}
+function d(a) {
+  if (typeof a > "u" || a === null || a === "")
+    return !1;
+  let e = a.trim().replace(/[^0-9]+/g, "");
+  if (e.length !== 10 && e.length !== 12)
+    return !1;
+  if (e.length === 10) {
+    const n = e.substring(0, 2), s = (/* @__PURE__ */ new Date()).getFullYear(), o = parseInt(
+      s.toString().substring(2, 2),
+      10
+    );
+    parseInt(n, 10) === 19 || parseInt(n, 10) === 20 || (parseInt(n, 10) >= 0 && parseInt(n, 10) <= o ? e = `20${e}` : e = `19${e}`);
+  }
+  return (/* @__PURE__ */ new Date()).getFullYear() - parseInt(e.substring(0, 4), 10) < 16 ? !1 : h(e.substring(2)) ? e : !1;
+}
+const I = {
+  sv: {
+    title: "Mottagare",
+    updateButton: "Spara mottagare",
+    individual: "Privatperson",
+    reference: "Referens",
+    workAddressSubLabel: "Där arbetet utförs",
+    showMore: "Visa fler fält",
+    seperateWorkAddress: {
+      false: "Arbetsadress som ovan",
+      true: "Annan"
+    },
+    placeholders: {
+      name: "Mottagarens namn",
+      companyName: "Företagets namn",
+      socialNo: "10 eller 12 siffror",
+      orgNo: "Företagets org-nr",
+      reference: "Er referens",
+      cellphone: "Mobilnummer",
+      address: "Gatuadress"
+    },
+    validations: {
+      name: {
+        required: "Vem är din kund?"
+      },
+      orgNo: {
+        personalNumber: "Personnumret är inte giltigt"
+      },
+      realOrgNo: {
+        realOrgNo: "Organisationsnumret är inte giltigt"
+      },
+      reference: {
+        required: "Vem är din referens?"
+      },
+      email: {
+        required: "E-post saknas",
+        email: "E-posten är ogiltig"
+      }
+    },
+    signMethod: {
+      button: {
+        title: "Standard - knapptryck",
+        content: "Bevisnivå: IP-adress, tidpunkt och enhet."
+      },
+      bankId: {
+        title: "BankId",
+        content: "Samma säkerhetsgrad som bankerna har."
+      },
+      signature: {
+        title: "Standard",
+        content: "Bevisnivå: IP-adress, tidpunkt och enhet."
+      },
+      inPerson: {
+        title: "Fysisk underskrift",
+        content: "Signatur på utskrivet dokument"
+      }
+    }
+  },
+  en: {
+    title: "Recipient",
+    updateButton: "Save recipient",
+    individual: "Individual",
+    reference: "Contact",
+    workAddressSubLabel: "Where work is going to be performed",
+    showMore: "Show additional fields",
+    seperateWorkAddress: {
+      false: "Work address same as above",
+      true: "Other"
+    },
+    placeholders: {
+      name: "Recipient name",
+      companyName: "Company name",
+      socialNo: "10 or 12 numbers",
+      orgNo: "Company registration number",
+      reference: "Name",
+      cellphone: "Cellphone",
+      address: "Street"
+    },
+    validations: {
+      name: {
+        required: "Who's your contact person?"
+      },
+      orgNo: {
+        personalNumber: "Invalid social security number"
+      },
+      realOrgNo: {
+        realOrgNo: "Invalid organisation number"
+      },
+      reference: {
+        required: "Missing contact name"
+      },
+      email: {
+        required: "Email missing",
+        email: "Invalid email"
+      }
+    },
+    signMethod: {
+      button: {
+        title: "Standard - button",
+        content: "Level of proof: IP address, timestamp and device."
+      },
+      bankId: {
+        title: "BankID",
+        content: "Same level of proof as the banks use."
+      },
+      signature: {
+        title: "Signature",
+        content: "Level of proof: IP address, timestamp and device."
+      },
+      inPerson: {
+        title: "In person",
+        content: "Signature on print document"
+      }
+    }
+  }
+}, { mapFields: S } = p({
+  getterType: "forms/getField",
+  mutationType: "forms/updateField"
+}), F = {
+  name: "FormClient",
+  i18nOptions: {
+    namespaces: "formClient",
+    messages: I
+  },
+  components: {
+    ClientAutocomplete: v,
+    Animation: y
+  },
+  mixins: [f],
+  props: {
+    requireReference: {
+      type: Boolean,
+      default: !0
+    },
+    searchEnabled: {
+      type: Boolean,
+      default: !1
+    },
+    validateOrgNo: {
+      type: Boolean,
+      default: !1
+    },
+    simpleForm: {
+      type: Boolean,
+      default: !1
+    },
+    inputFocusOnMount: {
+      type: String,
+      default: ""
+    },
+    // Optional field with prop sync, if within the context of documents
+    documentRole: {
+      type: String,
+      default: ""
+    },
+    // Optional field with prop sync, if within the context of documents
+    answerMethod: {
+      type: Object,
+      default: null
+    },
+    signOptions: {
+      type: Array,
+      default: () => []
+    },
+    isPublicForm: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  validations() {
+    return [
+      this.name,
+      this.orgNo,
+      this.reference,
+      this.email,
+      this.cellphone
+    ].some((e) => !!e) ? {
+      orgNo: {
+        personalNumber(e) {
+          return !this.validateOrgNo || !e ? !0 : this.isIndivid ? d(e) : m(e) || d(e);
+        }
+      },
+      reference: {
+        required: r.requiredIf((e) => e.requireReference && !e.isIndivid)
+      },
+      email: {
+        email: r.email
+      }
+    } : {
+      name: {
+        required: r.required
+      },
+      orgNo: {
+        required: r.requiredIf((e) => e.type === "company")
+      },
+      cellphone: {
+        required: r.requiredIf((e) => !e.isIndivid)
+      },
+      reference: {
+        required: r.requiredIf((e) => !e.isIndivid)
+      },
+      email: {
+        required: r.requiredIf((e) => !e.isIndivid)
+      }
+    };
+  },
+  computed: {
+    ...S({
+      id: "endCustomer.id",
+      type: "endCustomer.customerType",
+      name: "endCustomer.name",
+      realOrgNo: "endCustomer.org_no",
+      reference: "endCustomer.reference",
+      email: "endCustomer.email",
+      street: "endCustomer.street",
+      zip: "endCustomer.zip",
+      city: "endCustomer.city",
+      cellphone: "endCustomer.cellphone",
+      cellphoneRegion: "endCustomer.cellphoneRegion",
+      separateWorkAddress: "endCustomer.separateWorkAddress",
+      workStreet: "endCustomer.workStreet",
+      workZip: "endCustomer.workZip",
+      workCity: "endCustomer.workCity",
+      reverseVat: "endCustomer.reverseVat",
+      doUpdateEndCustomer: "endCustomer.doUpdateEndCustomer"
+    }),
+    ...g({
+      isPosting: "endCustomers/isPosting",
+      companyRegion: "application/companyRegion",
+      feature: "application/feature"
+    }),
+    messages() {
+      return {
+        name: {
+          required: this.$t("validations.name.required")
+        },
+        orgNo: {
+          personalNumber: this.$t("validations.orgNo.personalNumber")
+        },
+        realOrgNo: {
+          personalNumber: this.$t("validations.realOrgNo.realOrgNo")
+        },
+        reference: {
+          required: this.$t("validations.reference.required")
+        },
+        email: {
+          required: this.$t("validations.email.required"),
+          email: this.$t("validations.email.email")
+        }
+      };
+    },
+    orgNo: {
+      get() {
+        return this.realOrgNo;
+      },
+      set(a) {
+        const e = this.isIndivid ? d(a) : m(a) || d(a);
+        return this.validateOrgNo && e ? (this.realOrgNo = e, !0) : (this.realOrgNo = a, !0);
+      }
+    },
+    isIndivid() {
+      return this.type === "individual";
+    }
+  },
+  watch: {
+    type(a) {
+      C.setItem("defaultClientType", a);
+    }
+  },
+  mounted() {
+    this.$refs[this.inputFocusOnMount] ? this.$refs[this.inputFocusOnMount].$el.querySelector("input").focus() : this.$refs.name.$el.querySelector("input").focus();
+  },
+  methods: {
+    validateForm() {
+      return this.$v.$touch(), this.$v.$invalid ? !1 : (this.$emit("submit", !0), !0);
+    }
+  }
+};
+var M = function() {
+  var e = this, t = e._self._c;
+  return t("div", { staticClass: "form-client" }, [e.simpleForm ? t("form", { on: { submit: function(i) {
+    return i.preventDefault(), e.validateForm.apply(null, arguments);
+  } } }, [t("div", { staticClass: "space-between flex flex-wrap items-center pb-6" }, [t("div", { staticClass: "flex-grow", staticStyle: { "font-weight": "600", "font-size": "20px" } }, [e._v(" " + e._s(e.$t("_common:recipient").capitalize()) + " ")]), t("div", { staticClass: "type-toggle" }, [t("div", { staticClass: "type-toggle-button", class: { active: e.type === "individual" }, on: { click: function(i) {
+    e.type = "individual";
+  } } }, [e._v(" " + e._s(e.$t("individual")) + " ")]), t("div", { staticClass: "type-toggle-button", class: { active: e.type === "company" }, on: { click: function(i) {
+    e.type = "company";
+  } } }, [e._v(" " + e._s(e.$t("_common:company").capitalize()) + " ")])])]), t("CField", { staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { label: e.isIndivid ? e.$t("_common:name").capitalize() : e.$t("_common:company").capitalize(), validator: e.$v.name, messages: e.messages.name, "label-position": "inside" } }, [t("ClientAutocomplete", { ref: "name", attrs: { placeholder: e.isIndivid ? e.$t("placeholders.name") : e.$t("placeholders.companyName"), "search-enabled": e.searchEnabled, "show-loading": !0 }, on: { setClient: function(i) {
+    return e.$emit("setClient", i);
+  } }, model: { value: e.name, callback: function(i) {
+    e.name = i;
+  }, expression: "name" } })], 1), t("Animation", [e.isIndivid ? e._e() : t("CField", { staticClass: "pb-4", attrs: { validator: e.$v.reference, messages: e.messages.reference, label: e.$t("reference").capitalize(), "label-position": "inside" } }, [t("CInput", { ref: "reference", attrs: { placeholder: e.$t("placeholders.reference") }, model: { value: e.reference, callback: function(i) {
+    e.reference = i;
+  }, expression: "reference" } })], 1)], 1), t("CField", { staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { validator: e.$v.email, messages: e.messages.email, label: e.$t("_common:email").capitalize(), "label-position": "inside" } }, [t("CInput", { ref: "email", attrs: { placeholder: e.$t("_common:email").capitalize() }, model: { value: e.email, callback: function(i) {
+    e.email = typeof i == "string" ? i.trim() : i;
+  }, expression: "email" } })], 1), t("CPhoneInput", { ref: "cellphone", staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { label: e.$t("_common:cellphone").capitalize(), placeholder: e.$t("placeholders.cellphone"), region: e.cellphoneRegion, "default-region": e.companyRegion, "label-position": "inside" }, on: { "update:region": function(i) {
+    e.cellphoneRegion = i;
+  } }, model: { value: e.cellphone, callback: function(i) {
+    e.cellphone = i;
+  }, expression: "cellphone" } }), e.documentRole ? t("CDropdown", { staticStyle: { "margin-bottom": "calc(1 * var(--rem))" }, attrs: { expanded: "" } }, [t("CButton", { staticClass: "is-left", staticStyle: { width: "100%" }, attrs: { slot: "trigger", "dropdown-icon": !0, "icon-props": {
+    stroke: "hsl(0, 0%, 50%)"
+  }, "icon-left": e.documentRole === "signee" ? "pen-tool" : "eye", type: "none", pattern: "secondary" }, slot: "trigger" }, [t("div", { staticStyle: { "line-height": "1.25", padding: "4px 0" } }, [t("div", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.documentRole}.description`)) + " ")]), t("div", { staticStyle: { "font-size": "12px", opacity: "0.7" } }, [e._v(" " + e._s(e.$t(`_common:documentRole.${e.documentRole}.label`)) + " ")])])]), e._l(["signee", "recipient", "approver"], function(i) {
+    return t("CDropdownItem", { key: i, attrs: { "icon-left": i === "signee" ? "pen-tool" : "eye", "icon-props": {
+      stroke: "hsl(0, 0%, 50%)"
+    } }, on: { click: function(n) {
+      return e.$emit("update:document-role", i);
+    } } }, [t("div", { staticStyle: { "line-height": "1.25", padding: "4px 0" } }, [t("div", [e._v(e._s(e.$t(`_common:documentRole.${i}.description`)))]), t("div", { staticStyle: { "font-size": "12px", opacity: "0.7" } }, [e._v(" " + e._s(e.$t(`_common:documentRole.${i}.label`)) + " ")])])]);
+  })], 2) : e._e(), t("CButton", { attrs: { type: "secondary", pattern: "tertiary", size: "small", "icon-left": "arrow-right" }, on: { click: function(i) {
+    return e.$emit("show-more");
+  } } }, [e._v(" " + e._s(e.$t("showMore").capitalize()) + " ")]), t("CButton", { staticClass: "mt-4", staticStyle: { padding: "16px", "border-radius": "8px", height: "100%", "font-size": "14px", "font-weight": "600", "box-shadow": "0 2px 4px -1px rgba(0, 0, 0, 0.1)" }, attrs: { loading: e.isPosting, "native-type": "submit", type: "secondary", wide: "", size: "medium" } }, [e._v(" " + e._s(e.$t("updateButton")) + " ")])], 1) : t("div", { class: { "column-only": e.windowWidth <= 600 } }, [t("div", { staticClass: "flex items-center justify-center", staticStyle: { "margin-bottom": "calc(2.5 * var(--rem))" } }, [t("div", { staticClass: "type-toggle" }, [t("div", { staticClass: "type-toggle-button", class: { active: e.type === "individual" }, on: { click: function(i) {
+    e.type = "individual";
+  } } }, [e._v(" " + e._s(e.$t("individual")) + " ")]), t("div", { staticClass: "type-toggle-button", class: { active: e.type === "company" }, on: { click: function(i) {
+    e.type = "company";
+  } } }, [e._v(" " + e._s(e.$t("_common:company").capitalize()) + " ")])])]), t("CField", { staticClass: "flex", attrs: { grouped: "" } }, [t("CField", { attrs: { label: e.isIndivid ? e.$t("_common:name").capitalize() : e.$t("_common:company").capitalize(), validator: e.$v.name, messages: e.messages.name, "label-position": "inside", expanded: "" } }, [t("ClientAutocomplete", { ref: "name", attrs: { placeholder: e.isIndivid ? e.$t("placeholders.name") : e.$t("placeholders.companyName"), "show-loading": !0, "search-enabled": e.searchEnabled }, on: { setClient: function(i) {
+    return e.$emit("setClient", i);
+  } }, model: { value: e.name, callback: function(i) {
+    e.name = i;
+  }, expression: "name" } })], 1), t("CField", { attrs: { label: e.isIndivid ? e.$t("_common:socialNo").capitalize() : e.$t("_common:orgNoShort").capitalize(), validator: e.$v.orgNo, messages: e.isIndivid ? e.messages.orgNo : e.messages.realOrgNo, "label-position": "inside", expanded: "" } }, [t("CInput", { ref: "orgNo", attrs: { placeholder: e.isIndivid ? e.$t("placeholders.socialNo") : e.$t("placeholders.orgNo") }, model: { value: e.orgNo, callback: function(i) {
+    e.orgNo = i;
+  }, expression: "orgNo" } })], 1)], 1), t("Animation", [e.type && !e.isIndivid ? t("CField", { staticClass: "pb-4", attrs: { validator: e.$v.reference, messages: e.messages.reference, label: e.$t("_common:reference").capitalize(), "label-position": "inside" } }, [t("CInput", { ref: "reference", attrs: { placeholder: e.$t("placeholders.reference") }, model: { value: e.reference, callback: function(i) {
+    e.reference = i;
+  }, expression: "reference" } })], 1) : e._e(), e.type && !e.isIndivid && e.feature("reverseVat") && e.feature("regionSE") ? t("CField", { staticStyle: { "padding-left": "0.5em", "margin-bottom": "calc(2 * var(--rem))" } }, [t("CCheckbox", { attrs: { size: "normal" }, model: { value: e.reverseVat, callback: function(i) {
+    e.reverseVat = i;
+  }, expression: "reverseVat" } }, [e._v(" " + e._s(e.$t("_common:vat.reverseVat")) + " ")])], 1) : e._e()], 1), t("CField", { staticClass: "flex", attrs: { grouped: "" } }, [t("CField", { staticClass: "flex-1", attrs: { validator: e.$v.email, messages: e.messages.email, label: e.$t("_common:email").capitalize(), "label-position": "inside", expanded: "" } }, [t("CInput", { ref: "email", attrs: { placeholder: e.$t("_common:email").capitalize() }, model: { value: e.email, callback: function(i) {
+    e.email = typeof i == "string" ? i.trim() : i;
+  }, expression: "email" } })], 1), t("CPhoneInput", { staticClass: "flex-1", staticStyle: { "margin-bottom": "calc(1.5 * var(--rem))" }, attrs: { label: e.$t("_common:cellphone").capitalize(), placeholder: e.$t("placeholders.cellphone"), region: e.cellphoneRegion, "default-region": e.companyRegion, "label-position": "inside" }, on: { "update:region": function(i) {
+    e.cellphoneRegion = i;
+  } }, model: { value: e.cellphone, callback: function(i) {
+    e.cellphone = i;
+  }, expression: "cellphone" } })], 1), t("CField", { attrs: { label: e.$t("_common:address").capitalize(), "label-position": "inside" } }, [t("CInput", { ref: "street", attrs: { placeholder: e.$t("placeholders.address") }, model: { value: e.street, callback: function(i) {
+    e.street = i;
+  }, expression: "street" } })], 1), t("CField", { staticClass: "force-two flex", attrs: { grouped: "" } }, [t("CField", { attrs: { expanded: "" } }, [t("CInput", { ref: "zip", attrs: { placeholder: e.$t("_common:zip").capitalize() }, model: { value: e.zip, callback: function(i) {
+    e.zip = i;
+  }, expression: "zip" } })], 1), t("CField", { attrs: { expanded: "" } }, [t("CInput", { ref: "city", attrs: { placeholder: e.$t("_common:city").capitalize() }, model: { value: e.city, callback: function(i) {
+    e.city = i;
+  }, expression: "city" } })], 1)], 1), t("CField", { staticClass: "flex" }, [t("CRadio", { staticStyle: { "margin-bottom": "0.5em" }, attrs: { "native-value": !1, type: "secondary", size: "small" }, model: { value: e.separateWorkAddress, callback: function(i) {
+    e.separateWorkAddress = i;
+  }, expression: "separateWorkAddress" } }, [e._v(" " + e._s(e.$t("seperateWorkAddress.false")) + " ")]), t("CRadio", { staticStyle: { "margin-bottom": "0.5em" }, attrs: { "native-value": !0, type: "secondary", size: "small" }, model: { value: e.separateWorkAddress, callback: function(i) {
+    e.separateWorkAddress = i;
+  }, expression: "separateWorkAddress" } }, [e._v(" " + e._s(e.$t("seperateWorkAddress.true")) + " ")])], 1), t("Animation", [e.type && e.separateWorkAddress ? t("div", [t("CField", { attrs: { label: e.$t("_common:addressWork").capitalize() + ` ( ${e.$t("workAddressSubLabel")} )` } }, [t("CInput", { ref: "workStreet", attrs: { placeholder: e.$t("placeholders.address") }, model: { value: e.workStreet, callback: function(i) {
+    e.workStreet = i;
+  }, expression: "workStreet" } })], 1), t("CField", { staticClass: "force-two flex", attrs: { grouped: "" } }, [t("CField", { attrs: { expanded: "" } }, [t("CInput", { ref: "workZip", attrs: { placeholder: e.$t("_common:zip").capitalize(), expanded: "" }, model: { value: e.workZip, callback: function(i) {
+    e.workZip = i;
+  }, expression: "workZip" } })], 1), t("CField", { attrs: { expanded: "" } }, [t("CInput", { ref: "workCity", attrs: { placeholder: e.$t("_common:city").capitalize(), expanded: "" }, model: { value: e.workCity, callback: function(i) {
+    e.workCity = i;
+  }, expression: "workCity" } })], 1)], 1)], 1) : e._e()]), e.documentRole || e.answerMethod ? t("CField", { staticClass: "flex pt-4", attrs: { grouped: "" } }, [e.documentRole ? t("div", { staticClass: "dropdown-field-wrapper flex min-w-0 flex-col" }, [t("div", { staticClass: "my-1 text-sm text-gray-600" }, [e._v(" " + e._s(e.$t("_common:documentRole.title")) + " ")]), t("CDropdown", { staticStyle: { "margin-bottom": "calc(1 * var(--rem))" }, attrs: { expanded: "" } }, [t("CButton", { staticClass: "is-left", attrs: { slot: "trigger", "dropdown-icon": !0, "icon-props": {
+    stroke: "hsl(0, 0%, 50%)"
+  }, "icon-left": e.documentRole === "signee" ? "pen-tool" : "eye", type: "none", pattern: "secondary", expanded: "" }, slot: "trigger" }, [t("div", { staticClass: "py-1 leading-5" }, [t("div", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.documentRole}.description`)) + " ")]), t("div", { staticClass: "text-xs opacity-70" }, [e._v(" " + e._s(e.$t(`_common:documentRole.${e.documentRole}.label`)) + " ")])])]), e._l(["signee", "recipient", "approver"], function(i) {
+    return t("CDropdownItem", { key: i, attrs: { "icon-left": i === "signee" ? "pen-tool" : "eye", "icon-props": {
+      stroke: "hsl(0, 0%, 50%)"
+    } }, on: { click: function(n) {
+      return e.$emit("update:document-role", i);
+    } } }, [t("div", { staticStyle: { "line-height": "1.25", padding: "4px 0" } }, [t("div", [e._v(e._s(e.$t(`_common:documentRole.${i}.description`)))]), t("div", { staticStyle: { "font-size": "12px", opacity: "0.7" } }, [e._v(" " + e._s(e.$t(`_common:documentRole.${i}.label`)) + " ")])])]);
+  })], 2)], 1) : e._e(), e.answerMethod ? t("div", { staticClass: "dropdown-field-wrapper flex min-w-0 flex-col" }, [t("div", { staticClass: "my-1 text-sm text-gray-600" }, [e._v(" " + e._s(e.$t("_common:signMethod.title")) + " ")]), t("CDropdown", { staticStyle: { "margin-bottom": "calc(1 * var(--rem))" }, attrs: { expanded: "" } }, [t("CButton", { staticClass: "is-left", attrs: { slot: "trigger", "dropdown-icon": !0, type: "none", pattern: "secondary", expanded: "" }, slot: "trigger" }, [t("div", { staticClass: "max-w-[calc(16_*_var(--rem))] py-1 leading-5" }, [t("div", [e._v(e._s(e.$t(`signMethod.${e.answerMethod.accept}.title`)))]), t("div", { staticClass: "truncate text-xs opacity-70" }, [e._v(" " + e._s(e.$t(`signMethod.${e.answerMethod.accept}.content`)) + " ")])])]), e._l(e.signOptions, function(i) {
+    return t("CDropdownItem", { key: i, on: { click: function(n) {
+      return e.$emit("update:answer-method", {
+        ...e.answerMethod,
+        accept: i
+      });
+    } } }, [t("div", { staticStyle: { "line-height": "1.25", padding: "4px 0" } }, [t("div", [e._v(e._s(e.$t(`signMethod.${i}.title`)))]), t("div", { staticClass: "max-w-[calc(12_*_var(--rem))] truncate", staticStyle: { "font-size": "12px", opacity: "0.7", "text-wrap": "wrap" } }, [e._v(" " + e._s(e.$t(`signMethod.${i}.content`)) + " ")])])]);
+  })], 2)], 1) : e._e()]) : e._e(), t("div", { staticStyle: { "margin-top": "calc(3 * var(--rem))" } }, [t("CButton", { staticStyle: { padding: "16px", "border-radius": "8px", height: "100%", "font-size": "14px", "font-weight": "600", "box-shadow": "0 2px 4px -1px rgba(0, 0, 0, 0.1)" }, attrs: { loading: e.isPosting, type: "secondary", wide: "" }, on: { click: e.validateForm } }, [e._v(e._s(e.$t("updateButton")))])], 1)], 1)]);
+}, z = [], O = /* @__PURE__ */ u(
+  F,
+  M,
+  z,
+  !1,
+  null,
+  "2405400e"
+);
+const R = O.exports, { mapFields: q } = p({
+  getterType: "forms/getField",
+  mutationType: "forms/updateField"
+}), A = {
+  name: "ClientModal",
+  i18nOptions: {
+    namespaces: "clientModal",
+    messages: {
+      en: {
+        unsavedDialog: {
+          title: "Unsaved changes",
+          message: "Are you sure you want to cancel?",
+          cancel: "No",
+          submit: "Yes"
+        },
+        removeDialog: {
+          title: "Remove recipient",
+          message: "Would you like to remove recipient from the document?"
+        }
+      },
+      sv: {
+        unsavedDialog: {
+          title: "Osparade ändringar",
+          message: "Är du säker på att du vill avbryta?",
+          cancel: "Stanna kvar",
+          submit: "Ja, stäng"
+        },
+        removeDialog: {
+          title: "Ta bort mottagare",
+          message: "Vill du ta bort mottagaren från dokumentet?"
+        }
+      }
+    }
+  },
+  components: {
+    FormClient: R
+  },
+  mixins: [f],
+  props: {
+    documentClientIndex: {
+      type: Number,
+      default: 0
+    },
+    signOrder: {
+      type: Number,
+      default: 0
+    },
+    inputFocusOnMount: {
+      type: String,
+      default: ""
+    },
+    forceExpand: {
+      type: Boolean,
+      default: !1
+    },
+    signOptions: {
+      type: Array,
+      default: () => ["signature", "inPerson"]
+    },
+    setFormValue: {
+      type: Function,
+      required: !0
+    },
+    removeFormValue: {
+      type: Function,
+      required: !0
+    },
+    // Optional prop if this modal is mounted from public form
+    isPublicForm: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  data() {
+    var e;
+    let a = l(this.formData, "data.defaultAnswerMethod.accept") || "signature";
+    return (e = this.signOptions) != null && e.length && !this.signOptions.includes(a) && ([a] = this.signOptions), {
+      storedNewClient: {
+        documentRole: "signee",
+        answerMethod: {
+          accept: a,
+          deny: "button"
+        }
+      },
+      isLoading: !1,
+      hasChanged: !1,
+      showMore: !1
+    };
+  },
+  computed: {
+    ...q({
+      endCustomer: "endCustomer"
+    }),
+    ...x("forms", {
+      formData: (a) => a.document2
+    }),
+    ...g({
+      can: "application/can",
+      feature: "application/feature",
+      defaultClientType: "endCustomers/defaultClientType"
+    }),
+    validateOrgNo() {
+      return !!(this.feature("bankId") || this.isPublicForm && b[_.brand].defaultRegion === "SE");
+    },
+    existsOnDocument() {
+      return !!l(this.formData, `clients[${this.documentClientIndex}]`);
+    }
+  },
+  created() {
+    this.forceExpand && (this.showMore = !0);
+    const a = l(
+      this.formData,
+      `clients[${this.documentClientIndex}]`,
+      {}
+    );
+    this.loadForm(a), ["endCustomer", "storedNewClient"].forEach(
+      (e) => this.$watch(e, {
+        deep: !0,
+        handler() {
+          this.hasChanged = !0;
+        }
+      })
+    );
+  },
+  methods: {
+    ...k({
+      saveClient: c.FORM_SUBMIT_ENDCUSTOMER,
+      showMessage: c.SHOW_MESSAGE
+    }),
+    omit: N,
+    loadForm(a = {}) {
+      this.storedNewClient = Object.assign(this.storedNewClient, a), this.endCustomer = $({
+        type: this.defaultClientType(),
+        ...a
+      });
+    },
+    async onSave() {
+      this.isLoading = !0;
+      let a = l(this.endCustomer, "id");
+      if (!this.isPublicForm) {
+        let e = !1;
+        this.endCustomer && (this.endCustomer.id ? this.can("endCustomers", "modify", this.endCustomer.id) && (e = !0) : this.can("endCustomers", "create") && (e = !0)), e && (a = await this.saveClient());
+      }
+      this.setFormValue({
+        key: `clients[${this.documentClientIndex}]`,
+        value: w(
+          { ...this.endCustomer, ...a && { id: a } },
+          { ...this.storedNewClient, signOrder: this.signOrder }
+        )
+      }), this.$emit("close"), this.isLoading = !1;
+    },
+    removeClient() {
+      this.showMessage({
+        displayType: "dialog",
+        type: "danger",
+        title: this.$t("removeDialog.title"),
+        message: this.$t("removeDialog.message"),
+        actions: {
+          cancel: {
+            text: this.$t("_common:cancel"),
+            callback: "cancel"
+          },
+          submit: {
+            text: this.$t("_common:remove"),
+            callback: () => {
+              this.removeFormValue(`clients[${this.documentClientIndex}]`), this.$emit("close");
+            }
+          }
+        }
+      });
+    },
+    close() {
+      return !this.hasChanged || !this.showMore ? this.$emit("close") : this.showMessage({
+        displayType: "dialog",
+        type: "danger",
+        title: this.$t("unsavedDialog.title"),
+        message: this.$t("unsavedDialog.message"),
+        actions: {
+          cancel: {
+            text: this.$t("unsavedDialog.cancel"),
+            callback: "cancel"
+          },
+          submit: {
+            text: this.$t("unsavedDialog.submit"),
+            callback: () => this.$emit("close")
+          }
+        }
+      });
+    }
+  }
+};
+var D = function() {
+  var e = this, t = e._self._c;
+  return t("div", { staticClass: "font-primary fixed inset-0 z-[1000] grid place-items-center overflow-auto bg-black bg-opacity-10 max-sm:block max-sm:min-h-full max-sm:w-full max-sm:overflow-auto sm:py-4", on: { "&click": function(i) {
+    return i.target !== i.currentTarget ? null : e.close.apply(null, arguments);
+  } } }, [t("div", { staticClass: "max-sm:h-initial relative mx-auto flex flex-col items-center rounded-xl bg-white p-10 text-lg max-sm:min-h-full max-sm:w-full max-sm:rounded-none max-sm:pt-16" }, [t("CButton", { staticClass: "z-2 absolute right-4 top-4", class: e.showMore ? "" : "sm:!hidden", attrs: { pattern: "tertiary", type: "none", circle: "", icon: "x" }, on: { click: e.close } }), t("FormClient", { staticClass: "max-w-full p-0", class: [e.showMore ? "w-[520px]" : "w-[360px]"], attrs: { "search-enabled": !0, "require-reference": !1, "simple-form": !e.showMore, "input-focus-on-mount": e.inputFocusOnMount, "document-role": e.storedNewClient.documentRole, "answer-method": e.storedNewClient.answerMethod, "sign-options": e.signOptions, "validate-org-no": e.validateOrgNo, "is-public-form": e.isPublicForm }, on: { "update:documentRole": function(i) {
+    return e.$set(e.storedNewClient, "documentRole", i);
+  }, "update:document-role": function(i) {
+    return e.$set(e.storedNewClient, "documentRole", i);
+  }, "update:answerMethod": function(i) {
+    return e.$set(e.storedNewClient, "answerMethod", i);
+  }, "update:answer-method": function(i) {
+    return e.$set(e.storedNewClient, "answerMethod", i);
+  }, setClient: function(i) {
+    e.loadForm(e.omit(i, ["answerMethod"]));
+  }, submit: e.onSave, "show-more": function(i) {
+    e.showMore = !0;
+  } } }), e.existsOnDocument && e.mq === "sm" ? t("CButton", { staticClass: "mt-4 text-sm", attrs: { type: "danger", pattern: "secondary", wide: "" }, on: { click: e.removeClient } }, [e._v(" " + e._s(e.$t("_common:remove")) + " ")]) : e._e()], 1)]);
+}, B = [], E = /* @__PURE__ */ u(
+  A,
+  D,
+  B,
+  !1,
+  null,
+  null
+);
+const U = E.exports;
+export {
+  U as default
+};