@cling-se/widget 1.0.0-beta.1 → 1.0.0-beta.2

package/dist/ClientModal-BzWQtWSZ.js

@@ -0,0 +1,1181 @@
+import { C as L } from "./ClientAutocomplete-9JzGcO9O.js";
+import { _ as z, b5 as j, o as p, d as h, E as Z, b6 as Y, s as i, ao as N, n as y, S as G, af as H, ar as B, a8 as K, m as P, a5 as J, b as g, v as r, e as n, w as a, c as b, f as v, F, k as O, B as C, aa as $, as as Q, D as X, p as _, a as x, g as q, bb as ee, aF as te } from "./main-Cb-nyil1.js";
+import { C as oe, a as ne, w as E } from "./CDropdownItem-Dmq5gYzA.js";
+import { _ as le } from "./CFormField.vue_vue_type_script_setup_true_lang-D_U9coAY.js";
+import { C as ae } from "./CPhoneInput-Bf6329PO.js";
+import { u as ie } from "./index-kp-GC5I0.js";
+import { r as se, a as k, e as re } from "./index-BjiGCJPI.js";
+import { o as de } from "./omit--YYr41Xp.js";
+const me = {
+  name: "CRadio",
+  mixins: [j]
+}, ue = ["disabled"], pe = ["disabled", "required", "name", "value"], ce = { class: "control-label" };
+function fe(e, t, s, f, c, l) {
+  return p(), h("label", {
+    ref: "label",
+    class: y([[`is-${e.size}`, { "is-disabled": e.disabled }], "b-radio radio"]),
+    disabled: e.disabledOrUndefined,
+    onClick: t[2] || (t[2] = (...u) => e.focus && e.focus(...u)),
+    onKeydown: t[3] || (t[3] = H(N((u) => e.$refs.label.click(), ["prevent"]), ["enter"]))
+  }, [
+    Z(i("input", {
+      ref: "input",
+      "onUpdate:modelValue": t[0] || (t[0] = (u) => e.computedValue = u),
+      disabled: e.disabledOrUndefined,
+      required: e.requiredOrUndefined,
+      name: e.name,
+      value: e.nativeValue,
+      type: "radio",
+      onClick: t[1] || (t[1] = N(() => {
+      }, ["stop"]))
+    }, null, 8, pe), [
+      [Y, e.computedValue]
+    ]),
+    i("span", {
+      class: y([`is-${e.type}`, "check"])
+    }, null, 2),
+    i("span", ce, [
+      G(e.$slots, "default")
+    ])
+  ], 42, ue);
+}
+const ge = /* @__PURE__ */ z(me, [["render", fe]]);
+function T(e) {
+  if (typeof e > "u") throw Error("Missing param inputParam");
+  let t = e;
+  Number.isInteger(t) && (t = t.toString());
+  let s = 0;
+  const f = t.length, c = f % 2;
+  let l, u;
+  for (l = 0; l < f; l += 1)
+    u = parseInt(t.charAt(l), 10), l % 2 === c && (u *= 2), u > 9 && (u -= 9), s += u;
+  return s % 10 === 0;
+}
+function A(e) {
+  let t = e.replace(/ /g, "");
+  return t = t.replace(/-/g, ""), !T(t) || (t = [t.slice(0, 6), "-", t.slice(6)].join(""), !t.match(/^(\d{6})-(\d{4})$/)) ? !1 : t;
+}
+function V(e) {
+  if (typeof e > "u" || e === null || e === "")
+    return !1;
+  let t = e.trim().replace(/[^0-9]+/g, "");
+  if (t.length !== 10 && t.length !== 12)
+    return !1;
+  if (t.length === 10) {
+    const c = t.substring(0, 2), l = (/* @__PURE__ */ new Date()).getFullYear(), u = parseInt(
+      l.toString().substring(2, 2),
+      10
+    );
+    parseInt(c, 10) === 19 || parseInt(c, 10) === 20 || (parseInt(c, 10) >= 0 && parseInt(c, 10) <= u ? t = `20${t}` : t = `19${t}`);
+  }
+  return (/* @__PURE__ */ new Date()).getFullYear() - parseInt(t.substring(0, 4), 10) < 16 ? !1 : T(t.substring(2)) ? t : !1;
+}
+const he = {
+  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: ve } = B({
+  getterType: "forms/getField",
+  mutationType: "forms/updateField"
+}), ye = {
+  name: "FormClient",
+  i18nOptions: {
+    namespaces: "formClient",
+    messages: he
+  },
+  components: {
+    ClientAutocomplete: L,
+    CCheckbox: K,
+    CDropdown: oe,
+    CDropdownItem: ne,
+    CField: le,
+    CPhoneInput: ae,
+    CRadio: ge
+  },
+  emits: [
+    "setClient",
+    "show-more",
+    "update:document-role",
+    "update:answer-method",
+    "submit"
+  ],
+  mixins: [E],
+  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
+    }
+  },
+  setup() {
+    return {
+      v$: ie()
+    };
+  },
+  validations() {
+    return [
+      this.name,
+      this.orgNo,
+      this.reference,
+      this.email,
+      this.cellphone
+    ].some((t) => !!t) ? {
+      orgNo: {
+        personalNumber(t) {
+          return !this.validateOrgNo || !t ? !0 : this.isIndivid ? V(t) : A(t) || V(t);
+        }
+      },
+      reference: {
+        required: k(this.requireReference && !this.isIndivid)
+      },
+      email: {
+        email: re
+      }
+    } : {
+      name: {
+        required: se
+      },
+      orgNo: {
+        required: k(this.type === "company")
+      },
+      cellphone: {
+        required: k(!this.isIndivid)
+      },
+      reference: {
+        required: k(!this.isIndivid)
+      },
+      email: {
+        required: k(!this.isIndivid)
+      }
+    };
+  },
+  computed: {
+    ...ve({
+      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"
+    }),
+    ...P({
+      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(e) {
+        const t = this.isIndivid ? V(e) : A(e) || V(e);
+        return this.validateOrgNo && t ? (this.realOrgNo = t, !0) : (this.realOrgNo = e, !0);
+      }
+    },
+    isIndivid() {
+      return this.type === "individual";
+    }
+  },
+  watch: {
+    type(e) {
+      J.setItem("defaultClientType", e);
+    }
+  },
+  mounted() {
+    var t, s, f;
+    const e = this.$refs[this.inputFocusOnMount] || this.$refs.name;
+    (f = (s = (t = e == null ? void 0 : e.$el) == null ? void 0 : t.nextElementSibling) == null ? void 0 : s.querySelector("input")) == null || f.focus();
+  },
+  methods: {
+    validateForm() {
+      return this.v$.$touch(), this.v$.$invalid ? !1 : (this.$emit("submit", !0), !0);
+    }
+  }
+}, be = { class: "form-client" }, Ce = { class: "space-between flex flex-wrap items-center pb-6" }, we = {
+  class: "flex-grow",
+  style: { "font-weight": "600", "font-size": "20px" }
+}, ke = { class: "type-toggle" }, $e = { style: { "line-height": "1.25", padding: "4px 0" } }, Ve = { style: { "font-size": "12px", opacity: "0.7" } }, Ne = { style: { "line-height": "1.25", padding: "4px 0" } }, Ie = { style: { "font-size": "12px", opacity: "0.7" } }, Me = {
+  class: "flex items-center justify-center",
+  style: { "margin-bottom": "calc(2.5 * var(--rem))" }
+}, Se = { class: "type-toggle" }, Fe = { key: 0 }, Oe = {
+  key: 0,
+  class: "dropdown-field-wrapper flex min-w-0 flex-col"
+}, ze = { class: "my-1 text-sm text-gray-600" }, Re = { class: "py-1 leading-5" }, De = { class: "text-xs opacity-70" }, Ue = { style: { "line-height": "1.25", padding: "4px 0" } }, qe = { style: { "font-size": "12px", opacity: "0.7" } }, Ae = {
+  key: 1,
+  class: "dropdown-field-wrapper flex min-w-0 flex-col"
+}, Be = { class: "my-1 text-sm text-gray-600" }, Pe = { class: "max-w-[calc(16_*_var(--rem))] py-1 leading-5" }, Ee = { class: "truncate text-xs opacity-70" }, Te = { style: { "line-height": "1.25", padding: "4px 0" } }, We = {
+  class: "max-w-[calc(12_*_var(--rem))] truncate",
+  style: { "font-size": "12px", opacity: "0.7", "text-wrap": "wrap" }
+}, Le = { style: { "margin-top": "calc(3 * var(--rem))" } };
+function je(e, t, s, f, c, l) {
+  const u = g("ClientAutocomplete"), d = g("CField"), m = g("CInput"), I = g("Animation"), R = g("CPhoneInput"), w = g("CButton"), M = g("CDropdownItem"), S = g("CDropdown"), W = g("CCheckbox"), D = g("CRadio");
+  return p(), h("div", be, [
+    s.simpleForm ? (p(), h("form", {
+      key: 0,
+      onSubmit: t[9] || (t[9] = N((...o) => l.validateForm && l.validateForm(...o), ["prevent"]))
+    }, [
+      i("div", Ce, [
+        i("div", we, r(e.$t("_common:recipient").capitalize()), 1),
+        i("div", ke, [
+          i("div", {
+            class: y([{ active: e.type === "individual" }, "type-toggle-button"]),
+            onClick: t[0] || (t[0] = (o) => e.type = "individual")
+          }, r(e.$t("individual")), 3),
+          i("div", {
+            class: y([{ active: e.type === "company" }, "type-toggle-button"]),
+            onClick: t[1] || (t[1] = (o) => e.type = "company")
+          }, r(e.$t("_common:company").capitalize()), 3)
+        ])
+      ]),
+      n(d, {
+        label: l.isIndivid ? e.$t("_common:name").capitalize() : e.$t("_common:company").capitalize(),
+        validator: f.v$.name,
+        messages: l.messages.name,
+        "label-position": "inside",
+        style: { "margin-bottom": "calc(1.5 * var(--rem))" }
+      }, {
+        default: a(() => [
+          n(u, {
+            ref: "name",
+            modelValue: e.name,
+            "onUpdate:modelValue": t[2] || (t[2] = (o) => e.name = o),
+            placeholder: l.isIndivid ? e.$t("placeholders.name") : e.$t("placeholders.companyName"),
+            "search-enabled": s.searchEnabled,
+            "show-loading": !0,
+            onSetClient: t[3] || (t[3] = (o) => e.$emit("setClient", o))
+          }, null, 8, ["modelValue", "placeholder", "search-enabled"])
+        ]),
+        _: 1
+      }, 8, ["label", "validator", "messages"]),
+      n(I, null, {
+        default: a(() => [
+          l.isIndivid ? v("", !0) : (p(), b(d, {
+            key: 0,
+            validator: f.v$.reference,
+            messages: l.messages.reference,
+            label: e.$t("reference").capitalize(),
+            "label-position": "inside",
+            class: "pb-4"
+          }, {
+            default: a(() => [
+              n(m, {
+                ref: "reference",
+                modelValue: e.reference,
+                "onUpdate:modelValue": t[4] || (t[4] = (o) => e.reference = o),
+                placeholder: e.$t("placeholders.reference")
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          }, 8, ["validator", "messages", "label"]))
+        ]),
+        _: 1
+      }),
+      n(d, {
+        validator: f.v$.email,
+        messages: l.messages.email,
+        label: e.$t("_common:email").capitalize(),
+        "label-position": "inside",
+        style: { "margin-bottom": "calc(1.5 * var(--rem))" }
+      }, {
+        default: a(() => [
+          n(m, {
+            ref: "email",
+            modelValue: e.email,
+            "onUpdate:modelValue": t[5] || (t[5] = (o) => e.email = o),
+            modelModifiers: { trim: !0 },
+            placeholder: e.$t("_common:email").capitalize()
+          }, null, 8, ["modelValue", "placeholder"])
+        ]),
+        _: 1
+      }, 8, ["validator", "messages", "label"]),
+      n(R, {
+        ref: "cellphone",
+        modelValue: e.cellphone,
+        "onUpdate:modelValue": t[6] || (t[6] = (o) => e.cellphone = o),
+        region: e.cellphoneRegion,
+        "onUpdate:region": t[7] || (t[7] = (o) => e.cellphoneRegion = o),
+        label: e.$t("_common:cellphone").capitalize(),
+        placeholder: e.$t("placeholders.cellphone"),
+        "default-region": e.companyRegion,
+        "label-position": "inside"
+      }, null, 8, ["modelValue", "region", "label", "placeholder", "default-region"]),
+      s.documentRole ? (p(), b(S, {
+        key: 0,
+        expanded: "",
+        style: { "margin-bottom": "calc(1 * var(--rem))", "margin-top": "calc(0.75 * var(--rem))" }
+      }, {
+        trigger: a(() => [
+          n(w, {
+            "dropdown-icon": !0,
+            "icon-props": {
+              stroke: "hsl(0, 0%, 50%)"
+            },
+            "icon-left": s.documentRole === "signee" ? "pen-tool" : "eye",
+            class: "is-left",
+            type: "none",
+            pattern: "secondary",
+            style: { width: "100%" }
+          }, {
+            default: a(() => [
+              i("div", $e, [
+                i("div", null, r(e.$t(`_common:documentRole.${s.documentRole}.description`)), 1),
+                i("div", Ve, r(e.$t(`_common:documentRole.${s.documentRole}.label`)), 1)
+              ])
+            ]),
+            _: 1
+          }, 8, ["icon-left"])
+        ]),
+        default: a(() => [
+          (p(), h(F, null, O(["signee", "recipient", "approver"], (o) => n(M, {
+            key: o,
+            "icon-left": o === "signee" ? "pen-tool" : "eye",
+            "icon-props": {
+              stroke: "hsl(0, 0%, 50%)"
+            },
+            onClick: (U) => e.$emit("update:document-role", o)
+          }, {
+            default: a(() => [
+              i("div", Ne, [
+                i("div", null, r(e.$t(`_common:documentRole.${o}.description`)), 1),
+                i("div", Ie, r(e.$t(`_common:documentRole.${o}.label`)), 1)
+              ])
+            ]),
+            _: 2
+          }, 1032, ["icon-left", "onClick"])), 64))
+        ]),
+        _: 1
+      })) : v("", !0),
+      n(w, {
+        type: "secondary",
+        pattern: "tertiary",
+        size: "small",
+        "icon-left": "arrow-right",
+        onClick: t[8] || (t[8] = (o) => e.$emit("show-more"))
+      }, {
+        default: a(() => [
+          C(r(e.$t("showMore").capitalize()), 1)
+        ]),
+        _: 1
+      }),
+      n(w, {
+        loading: e.isPosting,
+        "native-type": "submit",
+        type: "secondary",
+        wide: "",
+        size: "medium",
+        class: "mt-4",
+        style: { 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)" }
+      }, {
+        default: a(() => [
+          C(r(e.$t("updateButton")), 1)
+        ]),
+        _: 1
+      }, 8, ["loading"])
+    ], 32)) : (p(), h("div", {
+      key: 1,
+      class: y({ "column-only": e.windowWidth <= 600 })
+    }, [
+      i("div", Me, [
+        i("div", Se, [
+          i("div", {
+            class: y([{ active: e.type === "individual" }, "type-toggle-button"]),
+            onClick: t[10] || (t[10] = (o) => e.type = "individual")
+          }, r(e.$t("individual")), 3),
+          i("div", {
+            class: y([{ active: e.type === "company" }, "type-toggle-button"]),
+            onClick: t[11] || (t[11] = (o) => e.type = "company")
+          }, r(e.$t("_common:company").capitalize()), 3)
+        ])
+      ]),
+      n(d, {
+        class: "flex",
+        grouped: ""
+      }, {
+        default: a(() => [
+          n(d, {
+            label: l.isIndivid ? e.$t("_common:name").capitalize() : e.$t("_common:company").capitalize(),
+            validator: f.v$.name,
+            messages: l.messages.name,
+            "label-position": "inside",
+            expanded: ""
+          }, {
+            default: a(() => [
+              n(u, {
+                ref: "name",
+                modelValue: e.name,
+                "onUpdate:modelValue": t[12] || (t[12] = (o) => e.name = o),
+                placeholder: l.isIndivid ? e.$t("placeholders.name") : e.$t("placeholders.companyName"),
+                "show-loading": !0,
+                "search-enabled": s.searchEnabled,
+                onSetClient: t[13] || (t[13] = (o) => e.$emit("setClient", o))
+              }, null, 8, ["modelValue", "placeholder", "search-enabled"])
+            ]),
+            _: 1
+          }, 8, ["label", "validator", "messages"]),
+          n(d, {
+            label: l.isIndivid ? e.$t("_common:socialNo").capitalize() : e.$t("_common:orgNoShort").capitalize(),
+            validator: f.v$.orgNo,
+            messages: l.isIndivid ? l.messages.orgNo : l.messages.realOrgNo,
+            "label-position": "inside",
+            expanded: ""
+          }, {
+            default: a(() => [
+              n(m, {
+                ref: "orgNo",
+                modelValue: l.orgNo,
+                "onUpdate:modelValue": t[14] || (t[14] = (o) => l.orgNo = o),
+                placeholder: l.isIndivid ? e.$t("placeholders.socialNo") : e.$t("placeholders.orgNo")
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          }, 8, ["label", "validator", "messages"])
+        ]),
+        _: 1
+      }),
+      n(I, null, {
+        default: a(() => [
+          e.type && !l.isIndivid ? (p(), b(d, {
+            key: 0,
+            validator: f.v$.reference,
+            messages: l.messages.reference,
+            label: e.$t("_common:reference").capitalize(),
+            "label-position": "inside",
+            class: "pb-4"
+          }, {
+            default: a(() => [
+              n(m, {
+                ref: "reference",
+                modelValue: e.reference,
+                "onUpdate:modelValue": t[15] || (t[15] = (o) => e.reference = o),
+                placeholder: e.$t("placeholders.reference")
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          }, 8, ["validator", "messages", "label"])) : v("", !0),
+          e.type && !l.isIndivid && e.feature("reverseVat") && e.feature("regionSE") ? (p(), b(d, {
+            key: 1,
+            style: { "padding-left": "0.5em", "margin-bottom": "calc(2 * var(--rem))" }
+          }, {
+            default: a(() => [
+              n(W, {
+                modelValue: e.reverseVat,
+                "onUpdate:modelValue": t[16] || (t[16] = (o) => e.reverseVat = o),
+                size: "normal"
+              }, {
+                default: a(() => [
+                  C(r(e.$t("_common:vat.reverseVat")), 1)
+                ]),
+                _: 1
+              }, 8, ["modelValue"])
+            ]),
+            _: 1
+          })) : v("", !0)
+        ]),
+        _: 1
+      }),
+      n(d, {
+        class: "flex",
+        grouped: ""
+      }, {
+        default: a(() => [
+          n(d, {
+            validator: f.v$.email,
+            messages: l.messages.email,
+            label: e.$t("_common:email").capitalize(),
+            "label-position": "inside",
+            class: "flex-1",
+            expanded: ""
+          }, {
+            default: a(() => [
+              n(m, {
+                ref: "email",
+                modelValue: e.email,
+                "onUpdate:modelValue": t[17] || (t[17] = (o) => e.email = o),
+                modelModifiers: { trim: !0 },
+                placeholder: e.$t("_common:email").capitalize()
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          }, 8, ["validator", "messages", "label"]),
+          n(R, {
+            modelValue: e.cellphone,
+            "onUpdate:modelValue": t[18] || (t[18] = (o) => e.cellphone = o),
+            region: e.cellphoneRegion,
+            "onUpdate:region": t[19] || (t[19] = (o) => e.cellphoneRegion = o),
+            label: e.$t("_common:cellphone").capitalize(),
+            placeholder: e.$t("placeholders.cellphone"),
+            "default-region": e.companyRegion,
+            "label-position": "inside",
+            class: "h-full flex-1"
+          }, null, 8, ["modelValue", "region", "label", "placeholder", "default-region"])
+        ]),
+        _: 1
+      }),
+      n(d, {
+        label: e.$t("_common:address").capitalize(),
+        "label-position": "inside"
+      }, {
+        default: a(() => [
+          n(m, {
+            ref: "street",
+            modelValue: e.street,
+            "onUpdate:modelValue": t[20] || (t[20] = (o) => e.street = o),
+            placeholder: e.$t("placeholders.address")
+          }, null, 8, ["modelValue", "placeholder"])
+        ]),
+        _: 1
+      }, 8, ["label"]),
+      n(d, {
+        class: "force-two flex",
+        grouped: ""
+      }, {
+        default: a(() => [
+          n(d, { expanded: "" }, {
+            default: a(() => [
+              n(m, {
+                ref: "zip",
+                modelValue: e.zip,
+                "onUpdate:modelValue": t[21] || (t[21] = (o) => e.zip = o),
+                placeholder: e.$t("_common:zip").capitalize()
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          }),
+          n(d, { expanded: "" }, {
+            default: a(() => [
+              n(m, {
+                ref: "city",
+                modelValue: e.city,
+                "onUpdate:modelValue": t[22] || (t[22] = (o) => e.city = o),
+                placeholder: e.$t("_common:city").capitalize()
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }),
+      n(d, { class: "flex" }, {
+        default: a(() => [
+          n(D, {
+            modelValue: e.separateWorkAddress,
+            "onUpdate:modelValue": t[23] || (t[23] = (o) => e.separateWorkAddress = o),
+            "native-value": !1,
+            type: "secondary",
+            size: "small",
+            style: { "margin-bottom": "0.5em" }
+          }, {
+            default: a(() => [
+              C(r(e.$t("seperateWorkAddress.false")), 1)
+            ]),
+            _: 1
+          }, 8, ["modelValue"]),
+          n(D, {
+            modelValue: e.separateWorkAddress,
+            "onUpdate:modelValue": t[24] || (t[24] = (o) => e.separateWorkAddress = o),
+            "native-value": !0,
+            type: "secondary",
+            size: "small",
+            style: { "margin-bottom": "0.5em" }
+          }, {
+            default: a(() => [
+              C(r(e.$t("seperateWorkAddress.true")), 1)
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 1
+      }),
+      n(I, null, {
+        default: a(() => [
+          e.type && e.separateWorkAddress ? (p(), h("div", Fe, [
+            n(d, {
+              label: e.$t("_common:addressWork").capitalize() + ` ( ${e.$t("workAddressSubLabel")} )`
+            }, {
+              default: a(() => [
+                n(m, {
+                  ref: "workStreet",
+                  modelValue: e.workStreet,
+                  "onUpdate:modelValue": t[25] || (t[25] = (o) => e.workStreet = o),
+                  placeholder: e.$t("placeholders.address")
+                }, null, 8, ["modelValue", "placeholder"])
+              ]),
+              _: 1
+            }, 8, ["label"]),
+            n(d, {
+              class: "force-two flex",
+              grouped: ""
+            }, {
+              default: a(() => [
+                n(d, { expanded: "" }, {
+                  default: a(() => [
+                    n(m, {
+                      ref: "workZip",
+                      modelValue: e.workZip,
+                      "onUpdate:modelValue": t[26] || (t[26] = (o) => e.workZip = o),
+                      placeholder: e.$t("_common:zip").capitalize(),
+                      expanded: ""
+                    }, null, 8, ["modelValue", "placeholder"])
+                  ]),
+                  _: 1
+                }),
+                n(d, { expanded: "" }, {
+                  default: a(() => [
+                    n(m, {
+                      ref: "workCity",
+                      modelValue: e.workCity,
+                      "onUpdate:modelValue": t[27] || (t[27] = (o) => e.workCity = o),
+                      placeholder: e.$t("_common:city").capitalize(),
+                      expanded: ""
+                    }, null, 8, ["modelValue", "placeholder"])
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })
+          ])) : v("", !0)
+        ]),
+        _: 1
+      }),
+      s.documentRole || s.answerMethod ? (p(), b(d, {
+        key: 0,
+        grouped: "",
+        class: "flex pt-4"
+      }, {
+        default: a(() => [
+          s.documentRole ? (p(), h("div", Oe, [
+            i("div", ze, r(e.$t("_common:documentRole.title")), 1),
+            n(S, {
+              expanded: "",
+              style: { "margin-bottom": "calc(1 * var(--rem))" }
+            }, {
+              trigger: a(() => [
+                n(w, {
+                  "dropdown-icon": !0,
+                  "icon-props": {
+                    stroke: "hsl(0, 0%, 50%)"
+                  },
+                  "icon-left": s.documentRole === "signee" ? "pen-tool" : "eye",
+                  class: "is-left",
+                  type: "none",
+                  pattern: "secondary",
+                  expanded: ""
+                }, {
+                  default: a(() => [
+                    i("div", Re, [
+                      i("div", null, r(e.$t(`_common:documentRole.${s.documentRole}.description`)), 1),
+                      i("div", De, r(e.$t(`_common:documentRole.${s.documentRole}.label`)), 1)
+                    ])
+                  ]),
+                  _: 1
+                }, 8, ["icon-left"])
+              ]),
+              default: a(() => [
+                (p(), h(F, null, O(["signee", "recipient", "approver"], (o) => n(M, {
+                  key: o,
+                  "icon-left": o === "signee" ? "pen-tool" : "eye",
+                  "icon-props": {
+                    stroke: "hsl(0, 0%, 50%)"
+                  },
+                  onClick: (U) => e.$emit("update:document-role", o)
+                }, {
+                  default: a(() => [
+                    i("div", Ue, [
+                      i("div", null, r(e.$t(`_common:documentRole.${o}.description`)), 1),
+                      i("div", qe, r(e.$t(`_common:documentRole.${o}.label`)), 1)
+                    ])
+                  ]),
+                  _: 2
+                }, 1032, ["icon-left", "onClick"])), 64))
+              ]),
+              _: 1
+            })
+          ])) : v("", !0),
+          s.answerMethod ? (p(), h("div", Ae, [
+            i("div", Be, r(e.$t("_common:signMethod.title")), 1),
+            n(S, {
+              expanded: "",
+              style: { "margin-bottom": "calc(1 * var(--rem))" }
+            }, {
+              trigger: a(() => [
+                n(w, {
+                  "dropdown-icon": !0,
+                  class: "is-left",
+                  type: "none",
+                  pattern: "secondary",
+                  expanded: ""
+                }, {
+                  default: a(() => [
+                    i("div", Pe, [
+                      i("div", null, r(e.$t(`signMethod.${s.answerMethod.accept}.title`)), 1),
+                      i("div", Ee, r(e.$t(`signMethod.${s.answerMethod.accept}.content`)), 1)
+                    ])
+                  ]),
+                  _: 1
+                })
+              ]),
+              default: a(() => [
+                (p(!0), h(F, null, O(s.signOptions, (o) => (p(), b(M, {
+                  key: o,
+                  onClick: (U) => e.$emit("update:answer-method", {
+                    ...s.answerMethod,
+                    accept: o
+                  })
+                }, {
+                  default: a(() => [
+                    i("div", Te, [
+                      i("div", null, r(e.$t(`signMethod.${o}.title`)), 1),
+                      i("div", We, r(e.$t(`signMethod.${o}.content`)), 1)
+                    ])
+                  ]),
+                  _: 2
+                }, 1032, ["onClick"]))), 128))
+              ]),
+              _: 1
+            })
+          ])) : v("", !0)
+        ]),
+        _: 1
+      })) : v("", !0),
+      i("div", Le, [
+        n(w, {
+          loading: e.isPosting,
+          type: "secondary",
+          wide: "",
+          style: { 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)" },
+          onClick: l.validateForm
+        }, {
+          default: a(() => [
+            C(r(e.$t("updateButton")), 1)
+          ]),
+          _: 1
+        }, 8, ["loading", "onClick"])
+      ])
+    ], 2))
+  ]);
+}
+const Ze = /* @__PURE__ */ z(ye, [["render", je], ["__scopeId", "data-v-a49b2cec"]]), { mapFields: Ye } = B({
+  getterType: "forms/getField",
+  mutationType: "forms/updateField"
+}), Ge = {
+  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: Ze
+  },
+  emits: ["close"],
+  mixins: [E],
+  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 t;
+    let e = $(this.formData, "data.defaultAnswerMethod.accept") || "signature";
+    return (t = this.signOptions) != null && t.length && !this.signOptions.includes(e) && ([e] = this.signOptions), {
+      storedNewClient: {
+        documentRole: "signee",
+        answerMethod: {
+          accept: e,
+          deny: "button"
+        }
+      },
+      isLoading: !1,
+      hasChanged: !1,
+      showMore: !1
+    };
+  },
+  computed: {
+    ...Ye({
+      endCustomer: "endCustomer"
+    }),
+    ...Q("forms", {
+      formData: (e) => e.document2
+    }),
+    ...P({
+      can: "application/can",
+      feature: "application/feature",
+      defaultClientType: "endCustomers/defaultClientType"
+    }),
+    validateOrgNo() {
+      return !!(this.feature("bankId") || this.isPublicForm && X[_.brand].defaultRegion === "SE");
+    },
+    existsOnDocument() {
+      return !!$(this.formData, `clients[${this.documentClientIndex}]`);
+    }
+  },
+  created() {
+    this.forceExpand && (this.showMore = !0);
+    const e = $(
+      this.formData,
+      `clients[${this.documentClientIndex}]`,
+      {}
+    );
+    this.loadForm(e), ["endCustomer", "storedNewClient"].forEach(
+      (t) => this.$watch(t, {
+        deep: !0,
+        handler() {
+          this.hasChanged = !0;
+        }
+      })
+    );
+  },
+  methods: {
+    ...x({
+      saveClient: q.FORM_SUBMIT_ENDCUSTOMER,
+      showMessage: q.SHOW_MESSAGE
+    }),
+    omit: de,
+    loadForm(e = {}) {
+      this.storedNewClient = Object.assign(this.storedNewClient, e), this.endCustomer = ee({
+        type: this.defaultClientType(),
+        ...e
+      });
+    },
+    async onSave() {
+      this.isLoading = !0;
+      let e = $(this.endCustomer, "id");
+      if (!this.isPublicForm) {
+        let t = !1;
+        this.endCustomer && (this.endCustomer.id ? this.can("endCustomers", "modify", this.endCustomer.id) && (t = !0) : this.can("endCustomers", "create") && (t = !0)), t && (e = await this.saveClient());
+      }
+      this.setFormValue({
+        key: `clients[${this.documentClientIndex}]`,
+        value: te(
+          { ...this.endCustomer, ...e && { id: e } },
+          { ...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")
+          }
+        }
+      });
+    }
+  }
+}, He = { class: "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" };
+function Ke(e, t, s, f, c, l) {
+  const u = g("CButton"), d = g("FormClient");
+  return p(), h("div", {
+    class: "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",
+    onClickPassive: t[4] || (t[4] = N((...m) => l.close && l.close(...m), ["self"]))
+  }, [
+    i("div", He, [
+      n(u, {
+        class: y([c.showMore ? "" : "sm:!hidden", "z-2 absolute right-4 top-4"]),
+        pattern: "tertiary",
+        type: "none",
+        circle: "",
+        icon: "x",
+        onClick: l.close
+      }, null, 8, ["class", "onClick"]),
+      n(d, {
+        "document-role": c.storedNewClient.documentRole,
+        "onUpdate:documentRole": t[0] || (t[0] = (m) => c.storedNewClient.documentRole = m),
+        "answer-method": c.storedNewClient.answerMethod,
+        "onUpdate:answerMethod": t[1] || (t[1] = (m) => c.storedNewClient.answerMethod = m),
+        "search-enabled": !0,
+        "require-reference": !1,
+        "simple-form": !c.showMore,
+        "input-focus-on-mount": s.inputFocusOnMount,
+        "sign-options": s.signOptions,
+        "validate-org-no": l.validateOrgNo,
+        "is-public-form": s.isPublicForm,
+        class: y([[c.showMore ? "w-[520px]" : "w-[360px]"], "max-w-full p-0"]),
+        onSetClient: t[2] || (t[2] = (m) => l.loadForm(l.omit(m, ["answerMethod"]))),
+        onSubmit: l.onSave,
+        onShowMore: t[3] || (t[3] = (m) => c.showMore = !0)
+      }, null, 8, ["document-role", "answer-method", "simple-form", "input-focus-on-mount", "sign-options", "validate-org-no", "is-public-form", "class", "onSubmit"]),
+      l.existsOnDocument && e.mq === "sm" ? (p(), b(u, {
+        key: 0,
+        type: "danger",
+        pattern: "secondary",
+        wide: "",
+        class: "mt-4 text-sm",
+        onClick: l.removeClient
+      }, {
+        default: a(() => [
+          C(r(e.$t("_common:remove")), 1)
+        ]),
+        _: 1
+      }, 8, ["onClick"])) : v("", !0)
+    ])
+  ], 32);
+}
+const Je = /* @__PURE__ */ z(Ge, [["render", Ke]]), lt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: Je
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  Je as C,
+  ge as a,
+  lt as b
+};