@cling-se/widget 0.13.1 → 0.13.2

package/dist/{formComponentsInstall-6894b988.js → formComponentsInstall-CWgaR4yB.js}

@@ -1,163 +1,55 @@
-import { b as H, m as g } from "./vuex.esm-4a0fff7c.js";
-import { s as q, F as j } from "./Flag-a6b545e0.js";
-import { m } from "./mapFormMixin-de4a37c3.js";
-import { B as I } from "./BaseDatePicker-1975be7c.js";
-import { E as K } from "./ErrorCallout-87033b39.js";
-import { I as W, a as X, r as l } from "./IsPremiumPreStep-27645ee9.js";
-import { n as o, aw as O, ax as v, h as U, b as c, ay as Q, r as Y, az as G, aA as J, s as T, aB as P, aC as R, d as M, F as y } from "./main-b9ea9725.js";
-import Z from "./AddClientCallout-fd6dc000.js";
-import ee from "./ClientModal-c5ee3885.js";
-import { c as te, r as ie, g as se, C as h, a as f, b as p } from "./CDropdownItem-7e71da85.js";
-import { S as ne } from "./CSlider.vue_vue_type_style_index_0_lang-ceb19661.js";
-import { C as _ } from "./CCallout-4c253200.js";
-import { C as z } from "./CField-823448be.js";
+import { m } from "./mapFormMixin-BrtcYsT9.js";
+import { I as H, a as q, r as l } from "./index-Cp7dG8Zm.js";
+import { n as o, ay as j, az as v, h as K, b as c, aA as W, q as X, aB as I, aC as U, r as O, aD as T, f as P, aE as M, F as y } from "./main-DBw231uy.js";
+import { B as R } from "./BaseDatePicker-BpyeJH3N.js";
+import { E as Q } from "./ErrorCallout-Dvy9895L.js";
+import { s as Y, F as G } from "./Flag-CDN9A_59.js";
+import { b as J, m as g } from "./vuex.esm-DKGl8mcw.js";
+import Z from "./AddClientCallout-7LpWNu29.js";
+import ee from "./ClientModal-B8PkUqY2.js";
+import { c as te, r as ie, g as se, C as h, a as f, b as p } from "./CDropdownItem-CTJ55d4m.js";
+import { S as ne } from "./CTabs.vue_vue_type_style_index_0_scoped_e02a6440_lang-Dc_pbPEA.js";
+import { C as _ } from "./CCallout-CgviPbdr.js";
+import { C as E } from "./CField-FGP7ehRq.js";
 const ae = {
-  name: "DocumentSendReminderItem",
-  props: {
-    label: {
-      type: String,
-      required: !0
-    },
-    value: {
-      type: [Number, String],
-      default: 0
+  name: "CFormField",
+  components: {
+    CField: E
+  },
+  extends: j,
+  computed: {
+    type() {
+      return this.hasErrors ? "is-danger" : this.isValid ? "is-success" : null;
     },
-    done: {
-      type: Boolean,
-      default: !1
+    customClass() {
+      return this.hasErrors ? "text-red-500" : this.isValid ? "text-green-500" : null;
     }
   }
 };
 var re = function() {
   var e = this, i = e._self._c;
-  return i("div", { staticClass: "mb-4 flex min-h-[2.5em] select-none items-center rounded-md bg-gray-100 px-4 py-2 text-sm font-medium" }, [i("div", { staticClass: "mr-6 flex-auto select-none text-gray-700" }, [e._v(" " + e._s(e.label) + " ")]), i("div", { staticClass: "flex flex-nowrap items-center justify-center text-sm" }, [e.done ? i("span", { staticClass: "text-green-500" }, [i("BaseIcon", { attrs: { type: "check", size: "18" } }), e._v(" " + e._s(e.$t("sent")) + " ")], 1) : [i("CButton", { staticClass: "!h-6 !w-6 bg-white", attrs: { icon: "minus", size: "small", circle: "", raised: "" }, on: { click: function(s) {
-    e.$emit("input", Math.max(e.value - 1, 0));
-  } } }), i("div", { staticClass: "min-w-[8ch] py-4 text-center text-sm font-medium text-gray-800" }, [e.value ? [e._v(" " + e._s(e.$tc("day", { count: Number(e.value) })) + " ")] : i("span", { staticClass: "text-xs text-gray-500" }, [e._v(" " + e._s(e.$t("disabled").capitalize()) + " ")])], 2), i("CButton", { staticClass: "!h-6 !w-6 bg-white", attrs: { icon: "plus", size: "small", circle: "", raised: "" }, on: { click: function(s) {
-    return e.$emit("input", e.value + 1);
-  } } })]], 2)]);
+  return i("CField", e._b({ attrs: { label: e.label, "custom-class": e.customClass, type: e.type, message: e.firstErrorMessage } }, "CField", { ...e.$attrs, ...e.$props }, !1), [e._t("default")], 2);
 }, oe = [], le = /* @__PURE__ */ o(
   ae,
   re,
   oe,
   !1,
   null,
-  null,
-  null,
-  null
-);
-const de = le.exports, ce = {
-  name: "DocumentSendReminders",
-  i18nOptions: {
-    namespaces: "documentSendReminders",
-    messages: {
-      en: {
-        description: "Edit when smart reminders should be sent to client",
-        notViewed: "Not viewed after",
-        notAnswered: "No reply after",
-        expires: "When expiration date is within"
-      },
-      sv: {
-        description: "Ställ in när smarta påminnelser ska skickas ut till mottagaren",
-        notViewed: "Inte öppnat efter",
-        notAnswered: "Inte svarat efter",
-        expires: "När giltighetstiden är inom"
-      }
-    }
-  },
-  components: {
-    DocumentSendReminderItem: de
-  },
-  mixins: [m()],
-  props: {
-    setFormValue: {
-      type: Function,
-      required: !0
-    },
-    removeFormValue: {
-      type: Function,
-      required: !0
-    }
-  },
-  computed: {
-    reminders() {
-      const t = {
-        first: null,
-        notViewed: null,
-        notAnswered: null,
-        expires: null
-      };
-      return this._document.reminders.forEach((e, i) => {
-        e.type === "first" ? t.first = { ...e, index: i } : e.type === "viewed" ? t.notViewed = { ...e, index: i } : e.type === "expires" ? t.expires = { ...e, index: i } : t.notAnswered = { ...e, index: i };
-      }), t;
-    }
-  },
-  methods: {
-    getDefaultReminders() {
-      if (!this._document.template)
-        return [];
-      const t = this._document.template.getDefaultData({
-        path: "properties.data.properties.reminders"
-      });
-      return t && Array.isArray(t) ? t : [];
-    },
-    setReminder(t, e) {
-      let i = "sendDays";
-      if (typeof e == "string" && (i = "sendAt"), !e) {
-        this.removeFormValue(`data.reminders[${t.index}]`);
-        return;
-      }
-      if (typeof t == "string") {
-        let s = this.getDefaultReminders().find(
-          (n) => n.type === t
-        );
-        if (s || (s = O.default.find((n) => n.type === t)), !s)
-          throw new Error("Could not find default reminder");
-        s[i] = e, this.setFormValue({ key: "data.reminders", value: s });
-        return;
-      }
-      this.setFormValue({
-        key: `data.reminders[${t.index}].${i}`,
-        value: e
-      });
-    }
-  }
-};
-var ue = function() {
-  var e = this, i = e._self._c;
-  return i("div", { staticStyle: { "background-color": "white", "border-radius": "calc(0.5 * var(--rem))", padding: "calc(2 * var(--rem))", "font-size": "16px" } }, [i("div", { staticStyle: { "font-size": "1.25em", "font-weight": "700", "margin-bottom": "0.25em", "text-align": "center" } }, [e._v(" " + e._s(e.$t("_common:reminder_plural").capitalize()) + " ")]), i("div", { staticClass: "text-center text-gray-600", staticStyle: { "max-width": "calc(20 * var(--rem))", margin: "0 auto calc(2 * var(--rem)) auto" } }, [e._v(" " + e._s(e.$t("description")) + " ")]), e._l([
-    { type: "notViewed", fallbackKey: "viewed" },
-    { type: "notAnswered", fallbackKey: "reminder" },
-    { type: "expires", fallbackKey: "expires" }
-  ], function(s, n) {
-    return i("DocumentSendReminderItem", { key: n, attrs: { label: e.$t(s.type), value: e.reminders[s.type] ? e.reminders[s.type].sendDays : 0, done: e.reminders[s.type] && e.reminders[s.type].status === "successful" }, on: { input: function(a) {
-      return e.setReminder(e.reminders[s.type] || s.fallbackKey, a);
-    } } });
-  }), i("div", { staticClass: "flex w-full items-center justify-center", staticStyle: { "margin-top": "calc(2.5 * var(--rem))" } }, [i("CButton", { attrs: { type: "secondary", expanded: "" }, on: { click: function(s) {
-    return e.$emit("close");
-  } } }, [e._v(" " + e._s(e.$t("_common:save")) + " ")])], 1)], 2);
-}, me = [], pe = /* @__PURE__ */ o(
-  ce,
-  ue,
-  me,
-  !1,
-  null,
-  null,
-  null,
   null
 );
-const he = pe.exports;
-function N(t, e) {
+const de = le.exports;
+function z(t, e) {
   const i = new Date(t.getTime());
   return i.setDate(
     t.getDate() + (7 + e - t.getDay() - 1) % 7 + 1
   ), i.setHours(8, 0, 0, 0), i;
 }
-function E(t) {
+function N(t) {
   const e = new Date(t.getTime());
   return e.setDate(e.getDate() + 1), e.setHours(10, 0, 0, 0), e;
 }
-let b = E(/* @__PURE__ */ new Date()), C = N(/* @__PURE__ */ new Date(), 1);
-const fe = {
+let b = N(/* @__PURE__ */ new Date()), C = z(/* @__PURE__ */ new Date(), 1);
+const ce = {
   name: "DocumentSendLater",
   i18nOptions: {
     namespaces: "documentSendLater",
@@ -183,7 +75,7 @@ const fe = {
     }
   },
   components: {
-    BaseDatePicker: I
+    BaseDatePicker: R
   },
   props: {
     _document: {
@@ -218,7 +110,7 @@ const fe = {
     }
   },
   computed: {
-    ...H("forms", {
+    ...J("forms", {
       formData: (t) => t.document2.data
     }),
     ...g({
@@ -241,7 +133,7 @@ const fe = {
     }
   },
   created() {
-    b = E(/* @__PURE__ */ new Date()), C = N(/* @__PURE__ */ new Date(), 1);
+    b = N(/* @__PURE__ */ new Date()), C = z(/* @__PURE__ */ new Date(), 1);
   },
   methods: {
     setTime(t) {
@@ -269,14 +161,14 @@ const fe = {
         ), s = i >= 0 ? `data.reminders[${i}]` : "data.reminders";
         this.setFormValue({ key: s, value: e }), await this.onSaveDocument({ doSend: !0 }), this.backupSentFlag = !1;
       } catch (e) {
-        U(e);
+        K(e);
       } finally {
         this.backupSentFlag = !1;
       }
     }
   }
 };
-var ge = function() {
+var ue = function() {
   var e = this, i = e._self._c;
   return i("div", { staticClass: "overflow-hidden rounded-xl bg-white" }, [i("div", { staticClass: "px-6 pb-3 pt-8" }, [i("div", { staticClass: "text-md text-center font-semibold" }, [e._v(" " + e._s(e.$t("title")) + " ")]), i("div", { staticClass: "pt-8" }, e._l([
     [e.tomorrowMorning, "tomorrowMorning"],
@@ -285,21 +177,102 @@ var ge = function() {
     return i("div", { key: n, staticClass: "mb-4 flex cursor-pointer select-none items-center justify-between rounded-md border border-gray-200 bg-gray-50 p-4 text-sm hover:border-gray-300 hover:bg-gray-100 active:border-gray-400 active:bg-gray-200", on: { click: () => e.onSendAt(s[0]) } }, [i("div", { staticClass: "font-medium" }, [e._v(e._s(e.$t(s[1])))]), i("div", { staticClass: "text-gray-500" }, [e._v(" " + e._s(e.$formatDate(s[0], "p, d MMM")) + " ")])]);
   }), 0)]), i("div", { staticClass: "border-t border-gray-200 bg-gray-100 px-8 py-6", class: e.showCustom ? "" : "cursor-pointer hover:bg-gray-200", on: { click: function(s) {
     e.showCustom = !0;
-  } } }, [i("div", { staticClass: "flex items-center text-sm" }, [i("BaseIcon", { staticClass: "text-primary-500 mr-2", attrs: { type: "calendar", size: "18" } }), i("div", { staticClass: "font-medium", domProps: { textContent: e._s(e.$t("custom.title")) } })], 1), i("Animation", [i("div", { directives: [{ name: "show", rawName: "v-show", value: e.showCustom, expression: "showCustom" }], staticClass: "mt-4" }, [i("div", { staticClass: "grid grid-cols-2 gap-4" }, [i("BaseDatePicker", { attrs: { value: e.sendAt }, on: { input: e.setDate } }), i("CInput", { attrs: { value: e.$formatDate(e.sendAt, "HH:mm"), clearable: !1, type: "time" }, on: { input: e.setTime } })], 1), e.$v.$invalid ? i("div", { staticClass: "error-wrapper" }, [i("BaseIcon", { staticClass: "text-primary-500 mr-2", attrs: { type: "calendar" } }), e._v(" " + e._s(e.$t("custom.invalid")) + " ")], 1) : e._e(), i("CButton", { staticStyle: { "margin-top": "calc(1.5 * var(--rem))" }, attrs: { loading: e.isPostingDocument, type: "secondary", wide: "" }, on: { click: function(s) {
+  } } }, [i("div", { staticClass: "flex items-center text-sm" }, [i("CIcon", { staticClass: "text-primary-500 mr-2", attrs: { type: "calendar", size: "18" } }), i("div", { staticClass: "font-medium", domProps: { textContent: e._s(e.$t("custom.title")) } })], 1), i("Animation", [i("div", { directives: [{ name: "show", rawName: "v-show", value: e.showCustom, expression: "showCustom" }], staticClass: "mt-4" }, [i("div", { staticClass: "grid grid-cols-2 gap-4" }, [i("BaseDatePicker", { attrs: { value: e.sendAt }, on: { input: e.setDate } }), i("CInput", { attrs: { value: e.$formatDate(e.sendAt, "HH:mm"), clearable: !1, type: "time" }, on: { input: e.setTime } })], 1), e.$v.$invalid ? i("div", { staticClass: "error-wrapper" }, [i("CIcon", { staticClass: "text-primary-500 mr-2", attrs: { type: "calendar" } }), e._v(" " + e._s(e.$t("custom.invalid")) + " ")], 1) : e._e(), i("CButton", { staticStyle: { "margin-top": "calc(1.5 * var(--rem))" }, attrs: { loading: e.isPostingDocument, type: "secondary", wide: "" }, on: { click: function(s) {
     return e.onSendAt(e.sendAt);
   } } }, [e._v(" " + e._s(e.$t("_common:send")) + " " + e._s(e.$formatDate(e.sendAt, "d MMM - p")) + " ")])], 1)])], 1)]);
-}, ve = [], ye = /* @__PURE__ */ o(
-  fe,
-  ge,
-  ve,
+}, me = [], pe = /* @__PURE__ */ o(
+  ce,
+  ue,
+  me,
   !1,
   null,
-  "f68debf4",
-  null,
-  null
+  "799363f2"
 );
-const _e = ye.exports;
-const be = {
+const he = pe.exports, fe = {
+  sv: {
+    title: "Skicka dokument",
+    nameLabel: "Dokumentnamn",
+    namePlaceholder: "Namn",
+    sendAs: "Skicka som",
+    validityPeriod: "Giltighetstid",
+    manualDelivery: "Manuell leverans",
+    manualDeliveryTooltip: "Skicka ut dokument till din mottagare själv. Du kan dela en länk eller en PDF.",
+    scheduledTooltip: "Schemalägg utskick",
+    clientsAreMissingContactInfo: "En eller flera mottagare saknar e-post eller mobiltelefon-nr. Dokumentet kommer inte att kunna skickas till dem.",
+    missingDeliveryMethod: "Välj en eller fler leveransmetoder",
+    sendButton: "Skicka dokument",
+    signMethod: {
+      title: "Signeringsmetod",
+      tooltip: "Hur ska din mottagare signera?",
+      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: "Send document",
+    nameLabel: "Document name",
+    namePlaceholder: "Name",
+    sendAs: "Send as",
+    validityPeriod: "Expiration",
+    manualDelivery: "Manual delivery",
+    manualDeliveryTooltip: "Share the document with your recipient yourself. You can share a link or a PDF.",
+    scheduledTooltip: "Schedule delivery",
+    clientsAreMissingContactInfo: "Note that one or more recipients are missing an email or cellphone number. The document will not be sent to them.",
+    missingDeliveryMethod: "Please select one or more delivery methods",
+    sendButton: "Send document",
+    signMethod: {
+      title: "Signing method",
+      tooltip: "How do you want your client to sign?",
+      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"
+      }
+    }
+  }
+}, ge = {
+  sv: {
+    addFirstButton: "Lägg till mottagare",
+    addButton: "Lägg till mottagare",
+    signOrder: {
+      label: "Signeringsordning",
+      tooltip: "Signeringsordning låter dig bestämma i vilken ordning dina mottagare tar emot och signerar dokumentet."
+    }
+  },
+  en: {
+    addFirstButton: "Add recipient",
+    addButton: "Add recipient",
+    signOrder: {
+      label: "Signing order",
+      tooltip: "Signing order lets you decide the order in which your recipients receive and sign your documents."
+    }
+  }
+}, ve = {
   name: "ClientSendListItem",
   props: {
     client: {
@@ -318,6 +291,10 @@ const be = {
       type: Boolean,
       default: !1
     },
+    allowEditClients: {
+      type: Boolean,
+      default: !0
+    },
     rightButton: {
       // TODO temporary in order to disable sender sign for widget context
       type: Boolean,
@@ -329,49 +306,52 @@ const be = {
       isHover: !1,
       isDropdownOpen: !1
     };
+  },
+  methods: {
+    onClick() {
+      var t;
+      if (this.rightButton && this.isSender)
+        return (t = this.$refs.dropdown) == null ? void 0 : t.toggle();
+      this.allowEditClients && this.$emit("open");
+    }
   }
 };
-var Ce = function() {
+var ye = function() {
   var s;
   var e = this, i = e._self._c;
   return i("div", { staticClass: "rc-card flex items-center", class: {
     "is-hover": e.isHover,
     "has-controls": e.isOrder
-  }, staticStyle: { "padding-left": "8px" }, on: { click: function(n) {
-    e.rightButton && e.isSender ? e.$refs.dropdown.toggle() : e.$emit("open");
-  }, "&mouseover": function(n) {
+  }, staticStyle: { "padding-left": "8px" }, on: { click: e.onClick, "&mouseover": function(n) {
     e.isHover = !0;
   }, "&mouseleave": function(n) {
     e.isHover = !1;
-  } } }, [e.compact ? i("div", { staticStyle: { "font-size": "14px" } }, [i("div", [e._v(e._s(e.client.name || e.client.companyName))]), e.client.name && e.client.companyName ? i("div", { staticStyle: { "font-size": "12px", "font-weight": "500" } }, [e._v(" " + e._s(e.client.companyName) + " ")]) : e._e(), e.client.documentRole ? i("div", { staticClass: "text-gray-700", staticStyle: { "font-size": "13px", "margin-top": "4px" } }, [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e(), e.isOrder ? i("div", { staticClass: "compact-order" }, [i("BaseIcon", { staticClass: "compact-order-button", attrs: { size: "16", type: "chevron-up" }, on: { click: function(n) {
+  } } }, [e.compact ? i("div", { staticStyle: { "font-size": "14px" } }, [i("div", [e._v(e._s(e.client.name || e.client.companyName))]), e.client.name && e.client.companyName ? i("div", { staticStyle: { "font-size": "12px", "font-weight": "500" } }, [e._v(" " + e._s(e.client.companyName) + " ")]) : e._e(), e.client.documentRole ? i("div", { staticClass: "text-gray-700", staticStyle: { "font-size": "13px", "margin-top": "4px" } }, [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e(), e.isOrder ? i("div", { staticClass: "compact-order" }, [i("CIcon", { staticClass: "compact-order-button", attrs: { size: "16", type: "chevron-up" }, on: { click: function(n) {
     return n.preventDefault(), n.stopPropagation(), e.$emit("move", -1);
-  } } }), i("div", { staticClass: "rc-order", staticStyle: { width: "20px", height: "20px" } }, [e._v(" " + e._s(e.client.signOrder) + " ")]), i("BaseIcon", { staticClass: "compact-order-button", attrs: { size: "16", type: "chevron-down" }, on: { click: function(n) {
+  } } }), i("div", { staticClass: "rc-order", staticStyle: { width: "20px", height: "20px" } }, [e._v(" " + e._s(e.client.signOrder) + " ")]), i("CIcon", { staticClass: "compact-order-button", attrs: { size: "16", type: "chevron-down" }, on: { click: function(n) {
     return n.preventDefault(), n.stopPropagation(), e.$emit("move", 1);
   } } })], 1) : e._e()]) : [i("div", { staticStyle: { width: "34px", flex: "0 0 34px", display: "inline-flex", "justify-content": "center" } }, [e.isOrder ? i("div", { staticStyle: { position: "relative", display: "inline-block" } }, [i("CButton", { staticClass: "rc-order__button up", attrs: { type: "none", pattern: "primary", circle: "", raised: "", size: "small", icon: "minus" }, on: { click: function(n) {
     return n.preventDefault(), n.stopPropagation(), e.$emit("move", -1);
   } } }), i("CButton", { staticClass: "rc-order__button down", attrs: { type: "none", pattern: "primary", circle: "", raised: "", size: "small", icon: "plus" }, on: { click: function(n) {
     return n.preventDefault(), n.stopPropagation(), e.$emit("move", 1);
-  } } }), i("div", { staticClass: "rc-order" }, [e._v(" " + e._s(e.client.signOrder) + " ")])], 1) : i("BaseIcon", { staticClass: "text-primary-500", staticStyle: { "margin-right": "8px", flex: "0 0 18px" }, attrs: { type: e.isSender ? "send" : ["signee", "approver"].includes(e.client.documentRole) ? "pen-tool" : "eye", size: "18" } })], 1), i("div", { staticClass: "rc-data truncate-text" }, [e.client.name || e.client.companyName ? i("div", { staticStyle: { "font-weight": "500" } }, [e._v(" " + e._s(e.client.name || e.client.companyName) + " ")]) : e.isSender ? i("div", { staticClass: "text-gray-500" }, [e._v(" " + e._s(e.$t("_common:empty", { thing: e.$t("_common:reference") })) + " ")]) : i("div", { staticClass: "text-gray-500" }, [e._v(" " + e._s(e.$t("_common:missing", { thing: e.$t("_common:name") })) + " ")]), i("div", { staticClass: "text-gray-700", staticStyle: { "font-size": "12px" } }, [e.isSender ? [e.isSender ? i("span", [e._v(" " + e._s(e.$t("_common:documentRole.sender.description")) + " ")]) : e._e(), e.client.documentRole === "signee" ? i("span", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e()] : [((s = e.client.answerMethod) == null ? void 0 : s.accept) === "inPerson" ? i("span", { staticClass: "text-red-500" }, [e._v(" " + e._s(e.$t("_common:signMethod.title")) + ": "), i("span", [e._v(" " + e._s(e.$t("_common:signMethod.inPerson")) + " ")])]) : e._e(), e.client.documentRole ? i("span", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e(), e.client.email ? i("span", [e._v(e._s(e.client.email))]) : e._e(), e.client.cellphone ? i("span", [e._v(e._s(e.client.cellphone))]) : e._e()]], 2)])], e.rightButton ? i("transition", { attrs: { name: "fade-100" } }, [e.isHover || e.isDropdownOpen ? [e.isSender ? i("CDropdown", { ref: "dropdown", staticStyle: { position: "absolute", right: "calc(0.5 * var(--rem))" }, attrs: { position: "is-bottom-left", "menu-styling": {
+  } } }), i("div", { staticClass: "rc-order" }, [e._v(" " + e._s(e.client.signOrder) + " ")])], 1) : i("CIcon", { staticClass: "text-primary-500", staticStyle: { "margin-right": "8px", flex: "0 0 18px" }, attrs: { type: e.isSender ? "send" : ["signee", "approver"].includes(e.client.documentRole) ? "pen-tool" : "eye", size: "18" } })], 1), i("div", { staticClass: "rc-data truncate-text" }, [e.client.name || e.client.companyName ? i("div", { staticStyle: { "font-weight": "500" } }, [e._v(" " + e._s(e.client.name || e.client.companyName) + " ")]) : e.isSender ? i("div", { staticClass: "text-gray-500" }, [e._v(" " + e._s(e.$t("_common:empty", { thing: e.$t("_common:reference") })) + " ")]) : i("div", { staticClass: "text-gray-500" }, [e._v(" " + e._s(e.$t("_common:missing", { thing: e.$t("_common:name") })) + " ")]), i("div", { staticClass: "text-gray-700", staticStyle: { "font-size": "12px" } }, [e.isSender ? [e.isSender ? i("span", [e._v(" " + e._s(e.$t("_common:documentRole.sender.description")) + " ")]) : e._e(), e.client.documentRole === "signee" ? i("span", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e()] : [((s = e.client.answerMethod) == null ? void 0 : s.accept) === "inPerson" ? i("span", { staticClass: "text-red-500" }, [e._v(" " + e._s(e.$t("_common:signMethod.title")) + ": "), i("span", [e._v(" " + e._s(e.$t("_common:signMethod.inPerson")) + " ")])]) : e._e(), e.client.documentRole ? i("span", [e._v(" " + e._s(e.$t(`_common:documentRole.${e.client.documentRole}.description`)) + " ")]) : e._e(), e.client.email ? i("span", [e._v(e._s(e.client.email))]) : e._e(), e.client.cellphone ? i("span", [e._v(e._s(e.client.cellphone))]) : e._e()]], 2)])], e.rightButton ? i("transition", { attrs: { name: "fade-100" } }, [e.isHover || e.isDropdownOpen ? [e.isSender ? i("CDropdown", { ref: "dropdown", staticStyle: { position: "absolute", right: "calc(0.5 * var(--rem))" }, attrs: { position: "is-bottom-left", "menu-styling": {
     minWidth: "220px"
   }, "append-to-body": "" }, on: { "active-change": function(n) {
     e.isDropdownOpen = n;
   } }, nativeOn: { click: function(n) {
     n.stopPropagation();
-  } } }, [i("CButton", { attrs: { slot: "trigger", circle: "", size: "small", type: "none", pattern: "secondary", raised: "", icon: "more-horizontal" }, slot: "trigger" }), e._t("dropdownOptions")], 2) : i("CButton", { staticStyle: { position: "absolute", right: "calc(0.5 * var(--rem))" }, attrs: { circle: "", size: "small", icon: "x", type: "none", pattern: "secondary", raised: "" }, on: { click: function(n) {
+  } } }, [i("CButton", { attrs: { slot: "trigger", circle: "", size: "small", type: "none", pattern: "secondary", raised: "", icon: "more-horizontal" }, slot: "trigger" }), e._t("dropdownOptions")], 2) : e.allowEditClients ? i("CButton", { staticStyle: { position: "absolute", right: "calc(0.5 * var(--rem))" }, attrs: { circle: "", size: "small", icon: "x", type: "none", pattern: "secondary", raised: "" }, on: { click: function(n) {
     return n.stopPropagation(), e.$emit("remove");
-  } } })] : e._e()], 2) : e._e()], 2);
-}, xe = [], we = /* @__PURE__ */ o(
-  be,
-  Ce,
-  xe,
+  } } }) : e._e()] : e._e()], 2) : e._e()], 2);
+}, _e = [], be = /* @__PURE__ */ o(
+  ve,
+  ye,
+  _e,
   !1,
   null,
-  "bf545f05",
-  null,
-  null
+  "47fa5bc0"
 );
-const L = we.exports;
-const Se = {
+const L = be.exports, Ce = {
   name: "SenderBlockItem",
   i18nOptions: {
     namespaces: "senderBlockItem",
@@ -399,6 +379,11 @@ const Se = {
       setFnName: "setFormValue"
     })
   ],
+  inject: {
+    allowSenderSign: {
+      default: !0
+    }
+  },
   props: {
     setFormValue: {
       type: Function,
@@ -409,11 +394,6 @@ const Se = {
       default: !1
     }
   },
-  inject: {
-    allowSenderSign: {
-      default: !0
-    }
-  },
   data() {
     return {
       senderClientData: null
@@ -435,7 +415,7 @@ const Se = {
         "data.defaultAnswerMethod"
       );
       this.senderClientData = {
-        ...Q(),
+        ...W(),
         documentRole: "recipient",
         ...i && { answerMethod: i },
         ...this.senderClient,
@@ -462,7 +442,7 @@ const Se = {
     }
   }
 };
-var $e = function() {
+var we = function() {
   var e = this, i = e._self._c;
   return e.senderClientData ? i("RecipientBlockItem", { staticClass: "first-of-group last-of-group", staticStyle: { display: "inline-flex", width: "auto", "padding-right": "2em", "min-width": "220px" }, attrs: { client: e.senderClientData, "right-button": e.allowSenderSign, "is-sender": !0 } }, [i("template", { slot: "dropdownOptions" }, [i("CDropdownItem", { attrs: { value: !!e.senderClient, "close-on-click": !1, toggle: "" }, on: { input: e.toggleSenderSign } }, [e._v(" " + e._s(e.$t("toggle.label")) + " ")]), e.senderClient ? [i("CDropdownItem", { attrs: { separator: "" } }), i("div", { staticClass: "text-gray-400", staticStyle: { "font-size": "13px", padding: "calc(0.5 * var(--rem)) 0 calc(0.25 * var(--rem))", "font-weight": "500" } }, [e._v(" " + e._s(e.$t("_common:signMethod.title")) + " ")]), e._l([
     "login",
@@ -473,111 +453,24 @@ var $e = function() {
       return e.setSenderMethod(s);
     } } }, [e._v(" " + e._s(e.$t(`_common:signMethod.${s}`)) + " ")]);
   })] : i("div", { staticClass: "bg-gray-100 text-gray-700", staticStyle: { padding: "calc(0.5 * var(--rem))", margin: "calc(0.5 * var(--rem))", "font-size": "13px", "border-radius": "4px", "line-height": "1.25", "font-weight": "500" } }, [e._v(" " + e._s(e.$t("toggle.description")) + " ")])], 2)], 2) : e._e();
-}, ke = [], De = /* @__PURE__ */ o(
-  Se,
-  $e,
-  ke,
+}, xe = [], Se = /* @__PURE__ */ o(
+  Ce,
+  we,
+  xe,
   !1,
   null,
-  "9f98b35e",
-  null,
-  null
+  "dad49914"
 );
-const Ve = De.exports, Fe = {
-  sv: {
-    title: "Skicka dokument",
-    nameLabel: "Dokumentnamn",
-    namePlaceholder: "Namn",
-    sendAs: "Skicka som",
-    validityPeriod: "Giltighetstid",
-    manualDelivery: "Manuell leverans",
-    manualDeliveryTooltip: "Skicka ut dokument till din mottagare själv. Du kan dela en länk eller en PDF.",
-    scheduledTooltip: "Schemalägg utskick",
-    clientsAreMissingContactInfo: "En eller flera mottagare saknar e-post eller mobiltelefon-nr. Dokumentet kommer inte att kunna skickas till dem.",
-    missingDeliveryMethod: "Välj en eller fler leveransmetoder",
-    sendButton: "Skicka dokument",
-    signMethod: {
-      title: "Signeringsmetod",
-      tooltip: "Hur ska din mottagare signera?",
-      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: "Send document",
-    nameLabel: "Document name",
-    namePlaceholder: "Name",
-    sendAs: "Send as",
-    validityPeriod: "Expiration",
-    manualDelivery: "Manual delivery",
-    manualDeliveryTooltip: "Share the document with your recipient yourself. You can share a link or a PDF.",
-    scheduledTooltip: "Schedule delivery",
-    clientsAreMissingContactInfo: "Note that one or more recipients are missing an email or cellphone number. The document will not be sent to them.",
-    missingDeliveryMethod: "Please select one or more delivery methods",
-    sendButton: "Send document",
-    signMethod: {
-      title: "Signing method",
-      tooltip: "How do you want your client to sign?",
-      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"
-      }
-    }
-  }
-}, Ae = {
-  sv: {
-    addFirstButton: "Lägg till mottagare",
-    addButton: "Lägg till mottagare",
-    signOrder: {
-      label: "Signeringsordning",
-      tooltip: "Signeringsordning låter dig bestämma i vilken ordning dina mottagare tar emot och signerar dokumentet."
-    }
-  },
-  en: {
-    addFirstButton: "Add recipient",
-    addButton: "Add recipient",
-    signOrder: {
-      label: "Signing order",
-      tooltip: "Signing order lets you decide the order in which your recipients receive and sign your documents."
-    }
-  }
-};
-const Be = {
+const $e = Se.exports, ke = {
   name: "RecipientBlock",
   i18nOptions: {
     namespaces: "recipientBlock",
-    messages: Ae
+    messages: ge
   },
   components: {
     AddClientCallout: Z,
     RecipientBlockItem: L,
-    SenderBlockItem: Ve
+    SenderBlockItem: $e
   },
   mixins: [
     m(["clients"], {
@@ -602,6 +495,10 @@ const Be = {
       type: Boolean,
       default: !1
     },
+    allowEditClients: {
+      type: Boolean,
+      default: !0
+    },
     isPublicForm: {
       type: Boolean,
       default: !1
@@ -623,7 +520,7 @@ const Be = {
   },
   methods: {
     onMoveRecipient({ index: t, direction: e }) {
-      this.clients = Y(this.clients).set(
+      this.clients = X(this.clients).set(
         {
           ...this.clients[t],
           signOrder: Math.max(this.clients[t].signOrder + e, 0)
@@ -642,7 +539,7 @@ const Be = {
           signOrder: i ? s.signOrder : n + 1
         }));
       } else
-        e = c(this._document, "template.reminders", []), e.length || (e = O.default);
+        e = c(this._document, "template.reminders", []), e.length || (e = I.default);
       this.setFormValue({ key: "data.reminders", value: e }), this.setFormValue({ key: "useSignOrder", value: t });
     },
     removeClient(t) {
@@ -653,7 +550,7 @@ const Be = {
       this.$modal.show(ee, {
         documentClientIndex: t,
         ...this.useSignOrder && {
-          signOrder: G(e) === "number" ? e : this.maxSignOrder + 1
+          signOrder: U(e) === "number" ? e : this.maxSignOrder + 1
         },
         setFormValue: this.setFormValue,
         removeFormValue: this.removeFormValue,
@@ -665,13 +562,13 @@ const Be = {
     }
   }
 };
-var Ie = function() {
+var De = function() {
   var e = this, i = e._self._c;
-  return i("div", [e.compact ? e._e() : [i("div", { staticClass: "pb-0.5 text-xs font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("_common:from").capitalize()) + ": ")]), i("SenderBlockItem", { attrs: { _document: e._document, _value: { senderClient: "senderClient" }, "set-form-value": e.setFormValue, "default-add-sender-client": e.defaultAddSenderClient } })], i("div", { staticClass: "block-title flex pb-0.5 pt-2 text-xs text-gray-500", class: { "block-title__line": !e.compact } }, [e.compact ? e._e() : i("div", { staticClass: "font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("_common:to").capitalize()) + ": ")]), e.clients && e.clients.length ? i("div", { staticClass: "ml-auto inline-flex items-center justify-end" }, [i("BaseIcon", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$t("signOrder.tooltip"), expression: "$t('signOrder.tooltip')" }], staticClass: "mr-1", attrs: { type: "info", size: "14" } }), i("div", { staticClass: "mr-2 font-medium" }, [e._v(" " + e._s(e.$t("signOrder.label")) + " ")]), i("CSwitch", { staticClass: "!mr-0", attrs: { value: e.useSignOrder, size: "tiny", type: "success" }, on: { input: e.toggleSignOrder } })], 1) : e._e()]), e.clients && e.clients.length ? [e.useSignOrder ? i("transition-group", { staticClass: "list-move", attrs: { name: "list-move" } }, [e._l(e.sortedClients, function(s, n) {
+  return i("div", [e.compact ? e._e() : [i("div", { staticClass: "pb-0.5 text-xs font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("_common:from").capitalize()) + ": ")]), i("SenderBlockItem", { attrs: { _document: e._document, _value: { senderClient: "senderClient" }, "set-form-value": e.setFormValue, "default-add-sender-client": e.defaultAddSenderClient } })], i("div", { staticClass: "block-title flex pb-0.5 pt-2 text-xs text-gray-500", class: { "block-title__line": !e.compact } }, [e.compact ? e._e() : i("div", { staticClass: "font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("_common:to").capitalize()) + ": ")]), e.clients && e.clients.length ? i("div", { staticClass: "ml-auto inline-flex items-center justify-end" }, [i("CIcon", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$t("signOrder.tooltip"), expression: "$t('signOrder.tooltip')" }], staticClass: "mr-1", attrs: { type: "info", size: "14" } }), i("div", { staticClass: "mr-2 font-medium" }, [e._v(" " + e._s(e.$t("signOrder.label")) + " ")]), i("CSwitch", { staticClass: "!mr-0", attrs: { value: e.useSignOrder, size: "tiny", type: "success" }, on: { input: e.toggleSignOrder } })], 1) : e._e()]), e.clients && e.clients.length ? [e.useSignOrder ? i("transition-group", { staticClass: "list-move", attrs: { name: "list-move" } }, [e._l(e.sortedClients, function(s, n) {
     return [n > 0 && s.signOrder !== e.sortedClients[n - 1].signOrder ? i("div", { key: n, staticClass: "h-2 pl-6" }, [i("div", { staticClass: "bg-primary-500 h-full w-0.5 rounded-sm" })]) : e._e(), i("div", { key: s._uniqueId, staticClass: "mb-0.5 mt-px" }, [i("RecipientBlockItem", { class: {
       "first-of-group": n === 0 || n > 0 && s.signOrder !== e.sortedClients[n - 1].signOrder,
       "last-of-group": n === e.sortedClients.length - 1 || e.sortedClients[n + 1] && s.signOrder !== e.sortedClients[n + 1].signOrder
-    }, attrs: { client: s, "is-order": e.useSignOrder, compact: e.compact }, on: { move: function(a) {
+    }, attrs: { client: s, "is-order": e.useSignOrder, compact: e.compact, "allow-edit-clients": e.allowEditClients }, on: { move: function(a) {
       return e.onMoveRecipient({ index: s.index, direction: a });
     }, open: function(a) {
       return e.openClientModal(s.index);
@@ -682,42 +579,169 @@ var Ie = function() {
     return i("RecipientBlockItem", { key: s._uniqueId, staticClass: "mb-0.5 mt-px", class: {
       "first-of-group": n === 0,
       "last-of-group": n === e.clients.length - 1
-    }, attrs: { "is-order": e.useSignOrder, compact: e.compact, client: s }, on: { open: function(a) {
+    }, attrs: { "is-order": e.useSignOrder, compact: e.compact, "allow-edit-clients": e.allowEditClients, client: s }, on: { open: function(a) {
       return e.openClientModal(n);
     }, remove: function(a) {
       return e.removeClient(n);
     } } });
-  }), e.compact ? e._e() : i("CButton", { staticClass: "is-thinner !text-sm", attrs: { type: "secondary", pattern: "tertiary", "icon-left": "plus", size: "normal" }, on: { click: function(s) {
+  }), !e.compact && e.allowEditClients ? i("CButton", { staticClass: "is-thinner !text-sm", attrs: { type: "secondary", pattern: "tertiary", "icon-left": "plus", size: "normal" }, on: { click: function(s) {
     return e.openClientModal(e.clients.length);
-  } } }, [e._v(" " + e._s(e.$t("addButton")) + " ")])] : e.$view === "widget" || this.viewSettings.isPublicForm ? i("CButton", { staticClass: "!px-4 font-medium", attrs: { type: "secondary", raised: "", size: "small", taller: "", "icon-left": "person" }, on: { click: function(s) {
+  } } }, [e._v(" " + e._s(e.$t("addButton")) + " ")]) : e._e()] : (e.$view === "widget" || e.viewSettings.isPublicForm) && e.allowEditClients ? i("CButton", { staticClass: "!px-4 font-medium", attrs: { type: "secondary", raised: "", size: "small", taller: "", "icon-left": "person" }, on: { click: function(s) {
     return e.openClientModal(e.clients.length);
-  } } }, [e._v(" " + e._s(e.$t("addFirstButton")) + " ")]) : e.compact ? e._e() : i("AddClientCallout", { attrs: { compact: !0 }, on: { add: function(s) {
+  } } }, [e._v(" " + e._s(e.$t("addFirstButton")) + " ")]) : !e.compact && e.allowEditClients ? i("AddClientCallout", { attrs: { compact: !0 }, on: { add: function(s) {
     return e.openClientModal(e.clients.length);
-  }, setClient: e.setClient } })], 2);
+  }, setClient: e.setClient } }) : e._e()], 2);
+}, Ve = [], Fe = /* @__PURE__ */ o(
+  ke,
+  De,
+  Ve,
+  !1,
+  null,
+  "d0782eac"
+);
+const Ae = Fe.exports, Be = {
+  name: "DocumentSendReminderItem",
+  props: {
+    label: {
+      type: String,
+      required: !0
+    },
+    value: {
+      type: [Number, String],
+      default: 0
+    },
+    done: {
+      type: Boolean,
+      default: !1
+    }
+  }
+};
+var Ie = function() {
+  var e = this, i = e._self._c;
+  return i("div", { staticClass: "mb-4 flex min-h-[2.5em] select-none items-center rounded-md bg-gray-100 px-4 py-2 text-sm font-medium" }, [i("div", { staticClass: "mr-6 flex-auto select-none text-gray-700" }, [e._v(" " + e._s(e.label) + " ")]), i("div", { staticClass: "flex flex-nowrap items-center justify-center text-sm" }, [e.done ? i("span", { staticClass: "text-green-500" }, [i("CIcon", { attrs: { type: "check", size: "18" } }), e._v(" " + e._s(e.$t("sent")) + " ")], 1) : [i("CButton", { staticClass: "!h-6 !w-6 bg-white", attrs: { icon: "minus", size: "small", circle: "", raised: "" }, on: { click: function(s) {
+    e.$emit("input", Math.max(e.value - 1, 0));
+  } } }), i("div", { staticClass: "min-w-[8ch] py-4 text-center text-sm font-medium text-gray-800" }, [e.value ? [e._v(" " + e._s(e.$tc("day", { count: Number(e.value) })) + " ")] : i("span", { staticClass: "text-xs text-gray-500" }, [e._v(" " + e._s(e.$t("disabled").capitalize()) + " ")])], 2), i("CButton", { staticClass: "!h-6 !w-6 bg-white", attrs: { icon: "plus", size: "small", circle: "", raised: "" }, on: { click: function(s) {
+    return e.$emit("input", e.value + 1);
+  } } })]], 2)]);
 }, Oe = [], Te = /* @__PURE__ */ o(
   Be,
   Ie,
   Oe,
   !1,
   null,
-  "c3186725",
+  null
+);
+const Pe = Te.exports, Me = {
+  name: "DocumentSendReminders",
+  i18nOptions: {
+    namespaces: "documentSendReminders",
+    messages: {
+      en: {
+        description: "Edit when smart reminders should be sent to client",
+        notViewed: "Not viewed after",
+        notAnswered: "No reply after",
+        expires: "When expiration date is within"
+      },
+      sv: {
+        description: "Ställ in när smarta påminnelser ska skickas ut till mottagaren",
+        notViewed: "Inte öppnat efter",
+        notAnswered: "Inte svarat efter",
+        expires: "När giltighetstiden är inom"
+      }
+    }
+  },
+  components: {
+    DocumentSendReminderItem: Pe
+  },
+  mixins: [m()],
+  props: {
+    setFormValue: {
+      type: Function,
+      required: !0
+    },
+    removeFormValue: {
+      type: Function,
+      required: !0
+    }
+  },
+  computed: {
+    reminders() {
+      const t = {
+        first: null,
+        notViewed: null,
+        notAnswered: null,
+        expires: null
+      };
+      return this._document.reminders.forEach((e, i) => {
+        e.type === "first" ? t.first = { ...e, index: i } : e.type === "viewed" ? t.notViewed = { ...e, index: i } : e.type === "expires" ? t.expires = { ...e, index: i } : t.notAnswered = { ...e, index: i };
+      }), t;
+    }
+  },
+  methods: {
+    getDefaultReminders() {
+      if (!this._document.template)
+        return [];
+      const t = this._document.template.getDefaultData({
+        path: "properties.data.properties.reminders"
+      });
+      return t && Array.isArray(t) ? t : [];
+    },
+    setReminder(t, e) {
+      let i = "sendDays";
+      if (typeof e == "string" && (i = "sendAt"), !e) {
+        this.removeFormValue(`data.reminders[${t.index}]`);
+        return;
+      }
+      if (typeof t == "string") {
+        let s = this.getDefaultReminders().find(
+          (n) => n.type === t
+        );
+        if (s || (s = I.default.find((n) => n.type === t)), !s)
+          throw new Error("Could not find default reminder");
+        s[i] = e, this.setFormValue({ key: "data.reminders", value: s });
+        return;
+      }
+      this.setFormValue({
+        key: `data.reminders[${t.index}].${i}`,
+        value: e
+      });
+    }
+  }
+};
+var Re = function() {
+  var e = this, i = e._self._c;
+  return i("div", { staticStyle: { "background-color": "white", "border-radius": "calc(0.5 * var(--rem))", padding: "calc(2 * var(--rem))", "font-size": "16px" } }, [i("div", { staticStyle: { "font-size": "1.25em", "font-weight": "700", "margin-bottom": "0.25em", "text-align": "center" } }, [e._v(" " + e._s(e.$t("_common:reminder_plural").capitalize()) + " ")]), i("div", { staticClass: "text-center text-gray-600", staticStyle: { "max-width": "calc(20 * var(--rem))", margin: "0 auto calc(2 * var(--rem)) auto" } }, [e._v(" " + e._s(e.$t("description")) + " ")]), e._l([
+    { type: "notViewed", fallbackKey: "viewed" },
+    { type: "notAnswered", fallbackKey: "reminder" },
+    { type: "expires", fallbackKey: "expires" }
+  ], function(s, n) {
+    return i("DocumentSendReminderItem", { key: n, attrs: { label: e.$t(s.type), value: e.reminders[s.type] ? e.reminders[s.type].sendDays : 0, done: e.reminders[s.type] && e.reminders[s.type].status === "successful" }, on: { input: function(a) {
+      return e.setReminder(e.reminders[s.type] || s.fallbackKey, a);
+    } } });
+  }), i("div", { staticClass: "flex w-full items-center justify-center", staticStyle: { "margin-top": "calc(2.5 * var(--rem))" } }, [i("CButton", { attrs: { type: "secondary", expanded: "" }, on: { click: function(s) {
+    return e.$emit("close");
+  } } }, [e._v(" " + e._s(e.$t("_common:save")) + " ")])], 1)], 2);
+}, Ee = [], ze = /* @__PURE__ */ o(
+  Me,
+  Re,
+  Ee,
+  !1,
   null,
   null
 );
-const Pe = Te.exports;
-const Re = {
+const Ne = ze.exports, Le = {
   name: "SendForm",
   i18nOptions: {
     namespaces: "sendForm",
-    messages: Fe
+    messages: fe
   },
   components: {
-    Simplebar: q,
-    BaseDatePicker: I,
-    RecipientBlock: Pe,
-    ErrorCallout: K,
-    IsPremiumPreStep: W,
-    IsPremium: X
+    Simplebar: Y,
+    BaseDatePicker: R,
+    RecipientBlock: Ae,
+    ErrorCallout: Q,
+    IsPremiumPreStep: H,
+    IsPremium: q
   },
   mixins: [
     m(
@@ -745,6 +769,10 @@ const Re = {
       type: Boolean,
       default: !0
     },
+    allowEditClients: {
+      type: Boolean,
+      default: !0
+    },
     setFormValue: {
       type: Function,
       required: !0
@@ -857,8 +885,6 @@ const Re = {
     async doSaveDocument({ doSend: t }) {
       try {
         this.localIsPosting = !0, await this.onSaveDocument({ doSend: t });
-      } catch (e) {
-        throw e;
       } finally {
         this.localIsPosting = !1;
       }
@@ -894,7 +920,7 @@ const Re = {
     },
     openReminders() {
       this.useSignOrder || this.$modal.show(
-        he,
+        Ne,
         {
           _document: this._document,
           setFormValue: this.setFormValue,
@@ -910,7 +936,7 @@ const Re = {
     },
     openSendLater() {
       this.$v.$touch(), !this.$v.$invalid && this.$modal.show(
-        _e,
+        he,
         {
           _document: this._document,
           setFormValue: this.setFormValue,
@@ -936,7 +962,7 @@ const Re = {
     }
   }
 };
-var Me = function() {
+var He = function() {
   var e = this, i = e._self._c;
   return i("IsPremium", { scopedSlots: e._u([{ key: "default", fn: function({ canUseBankId: s, canUseSms: n }) {
     var a;
@@ -944,7 +970,7 @@ var Me = function() {
       e.name = r;
     }, expression: "name" } })], 1) : e._e(), i("div", { staticClass: "mb-6" }, [i("RecipientBlock", { attrs: { _value: {
       clients: "clients"
-    }, _document: e._document, "set-form-value": e.setFormValue, "remove-form-value": e.removeFormValue, "default-add-sender-client": e.documentSenderSign, "is-public-form": e.isPublicForm } })], 1), e._t("default"), e.defaultAnswerMethod && e.signMethods.length > 1 ? i("div", { staticClass: "mb-8" }, [i("div", { staticClass: "block-title pb-0.5 text-xs font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("signMethod.title")) + " "), i("BaseIcon", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$t("signMethod.tooltip"), expression: "$t('signMethod.tooltip')" }], staticClass: "ml-px text-gray-500", attrs: { type: "info", size: "14" } })], 1), i("div", { staticClass: "cb-card-group" }, e._l(e.signMethods, function(r) {
+    }, _document: e._document, "set-form-value": e.setFormValue, "remove-form-value": e.removeFormValue, "default-add-sender-client": e.documentSenderSign, "allow-edit-clients": e.allowEditClients, "is-public-form": e.isPublicForm } })], 1), e._t("default"), e.defaultAnswerMethod && e.signMethods.length > 1 ? i("div", { staticClass: "mb-8" }, [i("div", { staticClass: "block-title pb-0.5 text-xs font-medium text-gray-900" }, [e._v(" " + e._s(e.$t("signMethod.title")) + " "), i("CIcon", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$t("signMethod.tooltip"), expression: "$t('signMethod.tooltip')" }], staticClass: "ml-px text-gray-500", attrs: { type: "info", size: "14" } })], 1), i("div", { staticClass: "cb-card-group" }, e._l(e.signMethods, function(r) {
       return i("div", { key: r.value, staticClass: "cb-card flex border-2 border-transparent hover:border-gray-300/30 hover:bg-gray-200", class: {
         checked: e.defaultAnswerMethod.accept === r.value
       }, on: { click: function(d) {
@@ -974,7 +1000,7 @@ var Me = function() {
                 })
               ` }], staticClass: "mr-2 w-12", attrs: { loading: e.isPosting, type: "none", icon: "save", pattern: "secondary" }, on: { click: function(d) {
           return e.doSaveDocument({ doSend: !1 });
-        } } }) : e._e(), e.showSchedule && !e.useSignOrder && !e.isManualDelivery ? i("CButton", { staticClass: "@md:w-auto mr-2 w-12", staticStyle: { padding: "14px 16px", "border-radius": "8px", height: "initial", "font-size": "14px", "font-weight": "600" }, attrs: { disabled: e.isPosting || !e.clients.length, type: "none", pattern: "secondary" }, on: { click: e.openSendLater } }, [i("span", { staticClass: "@md:!block !hidden", domProps: { textContent: e._s(e.$t("scheduledTooltip")) } }), i("BaseIcon", { staticClass: "@md:!hidden", attrs: { type: "calendar", size: "16" } })], 1) : e._e(), i("div", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$v.$invalid ? {
+        } } }) : e._e(), e.showSchedule && !e.useSignOrder && !e.isManualDelivery ? i("CButton", { staticClass: "@md:w-auto mr-2 w-12", staticStyle: { padding: "14px 16px", "border-radius": "8px", height: "initial", "font-size": "14px", "font-weight": "600" }, attrs: { disabled: e.isPosting || !e.clients.length, type: "none", pattern: "secondary" }, on: { click: e.openSendLater } }, [i("span", { staticClass: "@md:!block !hidden", domProps: { textContent: e._s(e.$t("scheduledTooltip")) } }), i("CIcon", { staticClass: "@md:!hidden", attrs: { type: "calendar", size: "16" } })], 1) : e._e(), i("div", { directives: [{ name: "tooltip", rawName: "v-tooltip", value: e.$v.$invalid ? {
           content: e.clients.length ? e.$t("missingDeliveryMethod") : e.$t(
             "components:account.documentForm.clients.errorMessage"
           )
@@ -994,151 +1020,57 @@ var Me = function() {
       } }], null, !0) })];
     }), e._t("footer")], 2)], 1)];
   } }], null, !0) });
-}, ze = [], Ne = /* @__PURE__ */ o(
-  Re,
-  Me,
-  ze,
-  !1,
-  null,
-  "45742846",
-  null,
-  null
-);
-const ri = Ne.exports, Ee = {
-  name: "CFormField",
-  components: {
-    CField: z
-  },
-  extends: J,
-  computed: {
-    type() {
-      return this.hasErrors ? "is-danger" : this.isValid ? "is-success" : null;
-    },
-    customClass() {
-      return this.hasErrors ? "text-red-500" : this.isValid ? "text-green-500" : null;
-    }
-  }
-};
-var Le = function() {
-  var e = this, i = e._self._c;
-  return i("CField", e._b({ attrs: { label: e.label, "custom-class": e.customClass, type: e.type, message: e.firstErrorMessage } }, "CField", { ...e.$attrs, ...e.$props }, !1), [e._t("default")], 2);
-}, He = [], qe = /* @__PURE__ */ o(
-  Ee,
+}, qe = [], je = /* @__PURE__ */ o(
   Le,
   He,
+  qe,
   !1,
   null,
-  null,
-  null,
-  null
+  "a160ead7"
 );
-const je = qe.exports, Ke = {
-  name: "CSkeleton",
-  functional: !0,
+const ri = je.exports, Ke = {
+  name: "CAutocomplete",
+  components: {
+    CInput: O
+  },
+  mixins: [T],
+  inheritAttrs: !1,
   props: {
-    active: {
-      type: Boolean,
-      default: !0
+    value: {
+      type: [Number, String],
+      default: null
     },
-    animated: {
-      type: Boolean,
-      default: !1
+    data: {
+      type: Array,
+      default: () => []
     },
-    width: [Number, String],
-    height: [Number, String],
-    circle: Boolean,
-    rounded: {
-      type: Boolean,
-      default: !0
+    field: {
+      type: String,
+      default: "value"
     },
-    count: {
-      type: Number,
-      default: 1
+    keepFirst: Boolean,
+    clearOnSelect: Boolean,
+    openOnFocus: Boolean,
+    customFormatter: {
+      type: Function,
+      default: () => {
+      }
     },
-    hidden: {
-      type: [Boolean, String],
-      default: !1
-    },
-    color: {
-      type: String,
-      default: null
-    }
-  },
-  render(t, e) {
-    if (!e.props.active)
-      return;
-    const i = [], s = e.props.width, n = e.props.height;
-    for (let a = 0; a < e.props.count; a++)
-      i.push(
-        t("div", {
-          staticClass: "c-skeleton-item",
-          class: { "is-rounded": e.props.rounded },
-          key: a,
-          style: {
-            height: n === void 0 ? null : isNaN(n) ? n : n + "px",
-            width: s === void 0 ? null : isNaN(s) ? s : s + "px",
-            borderRadius: e.props.circle ? "50%" : null,
-            background: e.props.color ? e.props.color : null
-          }
-        })
-      );
-    return t(
-      "div",
-      {
-        staticStyle: e.data.staticStyle,
-        staticClass: "c-skeleton",
-        class: [
-          e.data.staticClass,
-          {
-            "is-animated": e.props.animated,
-            "is-invisible": e.props.hidden
-          }
-        ]
-      },
-      i
-    );
-  }
-}, We = null, Xe = null;
-var Ue = /* @__PURE__ */ o(
-  Ke,
-  We,
-  Xe,
-  !1,
-  null,
-  null,
-  null,
-  null
-);
-const x = Ue.exports, Qe = {
-  name: "CAutocomplete",
-  components: {
-    CInput: T
-  },
-  mixins: [P],
-  inheritAttrs: !1,
-  props: {
-    value: [Number, String],
-    data: {
-      type: Array,
-      default: () => []
-    },
-    field: {
-      type: String,
-      default: "value"
-    },
-    keepFirst: Boolean,
-    clearOnSelect: Boolean,
-    openOnFocus: Boolean,
-    customFormatter: Function,
     checkInfiniteScroll: Boolean,
     keepOpen: Boolean,
     clearable: Boolean,
-    maxHeight: [String, Number],
+    maxHeight: {
+      type: [String, Number],
+      default: null
+    },
     dropdownPosition: {
       type: String,
       default: "auto"
     },
-    iconRight: String,
+    iconRight: {
+      type: String,
+      default: null
+    },
     iconRightClickable: Boolean,
     appendToBody: Boolean
   },
@@ -1388,9 +1320,9 @@ const x = Ue.exports, Qe = {
     onBlur(t) {
       this.hasFocus = !1, this.$emit("blur", t);
     },
-    onInput(t) {
-      const e = this.getValue(this.selected);
-      e && e === this.newValue || (this.$emit("typing", this.newValue), this.checkValidity());
+    onInput() {
+      const t = this.getValue(this.selected);
+      t && t === this.newValue || (this.$emit("typing", this.newValue), this.checkValidity());
     },
     rightIconClick(t) {
       this.clearable ? this.newValue = "" : this.$emit("icon-right-click", t);
@@ -1420,7 +1352,7 @@ const x = Ue.exports, Qe = {
     }
   }
 };
-var Ye = function() {
+var We = function() {
   var e = this, i = e._self._c;
   return i("div", { staticClass: "autocomplete control", class: { "is-expanded": e.expanded } }, [i("CInput", e._b({ ref: "input", attrs: { size: e.size, loading: e.loading, rounded: e.rounded, icon: e.icon, "icon-right": e.newIconRight, "icon-right-clickable": e.newIconRightClickable, "icon-pack": e.iconPack, maxlength: e.maxlength, autocomplete: e.newAutocomplete, "use-html5-validation": !1, type: "text" }, on: { input: e.onInput, focus: e.focused, blur: e.onBlur, "icon-right-click": e.rightIconClick, "icon-click": (s) => e.$emit("icon-click", s) }, nativeOn: { keyup: function(s) {
     if (!s.type.indexOf("key") && e._k(s.keyCode, "esc", 27, s.key, ["Esc", "Escape"]))
@@ -1441,21 +1373,170 @@ var Ye = function() {
       return e.setSelected(s, void 0, a);
     } } }, [e.hasDefaultSlot ? e._t("default", null, { option: s, index: n }) : i("span", [e._v(" " + e._s(e.getValue(s, !0)) + " ")])], 2);
   }), e.data.length === 0 && e.hasEmptySlot ? i("div", { staticClass: "dropdown-item is-disabled" }, [e._t("empty")], 2) : e._e(), e.hasFooterSlot ? i("div", { staticClass: "dropdown-item" }, [e._t("footer")], 2) : e._e()], 2)])])], 1);
-}, Ge = [], Je = /* @__PURE__ */ o(
-  Qe,
-  Ye,
-  Ge,
+}, Xe = [], Ue = /* @__PURE__ */ o(
+  Ke,
+  We,
+  Xe,
   !1,
   null,
+  null
+);
+const Qe = Ue.exports, Ye = {
+  name: "CMessage",
+  props: {
+    type: {
+      type: String,
+      default: "secondary"
+    },
+    badge: {
+      type: String,
+      default: ""
+    },
+    text: {
+      type: String,
+      default: ""
+    }
+  }
+};
+var Ge = function(e, i) {
+  return e("div", { class: [i.data.class, i.data.staticClass], staticStyle: { padding: "0.75em 1em", display: "flex", "align-items": "flex-start", "border-radius": "0.6em", "background-color": "hsl(var(--gray-color-100) / 1)" }, style: { ...i.data.staticStyle } }, [e("div", { class: [`has-background-${i.props.type}`], staticStyle: { display: "inline-block", padding: "0.5em", "border-radius": "0.45em", "font-weight": "700", color: "white", "line-height": "1", "font-size": "12px", "margin-right": "1.25em" } }, [i._v(" " + i._s(i.props.badge || i.parent.$t("components:cling.message.tip")) + " ")]), e("div", { staticStyle: { color: "hsl(0, 0%, 25%)" } }, [i.props.text ? [i._v(" " + i._s(i.props.text) + " ")] : i._e(), i._t("default")], 2)]);
+}, Je = [], Ze = /* @__PURE__ */ o(
+  Ye,
+  Ge,
+  Je,
+  !0,
   null,
+  "9be3b227"
+);
+const w = Ze.exports, et = {
+  name: "CPhoneInput",
+  components: {
+    Flag: G,
+    CInput: O,
+    CDropdown: h,
+    CDropdownItem: f,
+    CButton: P,
+    CField: E,
+    SmartList: ne
+  },
+  props: {
+    value: {
+      type: [String, Number],
+      default: ""
+    },
+    region: {
+      type: String,
+      default: ""
+    },
+    // Region to fallback to if prefix is not found in value
+    defaultRegion: {
+      type: String,
+      required: !0
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    labelPosition: {
+      type: String,
+      default: ""
+    }
+  },
+  data() {
+    return {
+      internalPrefix: null,
+      // Used to remember prefix when value is changed to empty
+      searchQuery: ""
+    };
+  },
+  computed: {
+    defaultPrefix() {
+      return l[this.internalRegion].callingCode;
+    },
+    currentRegion() {
+      return this.getRegionByCallingCode(this.prefix);
+    },
+    internalRegion: {
+      get() {
+        if (this.region)
+          return this.region;
+        if (this.value) {
+          const t = (Object.keys(l) || []).find(
+            (e) => l[e].callingCode && this.value && this.value.startsWith(l[e].callingCode)
+          );
+          if (t)
+            return t;
+        }
+        return this.internalPrefix ? this.getRegionByCallingCode(this.internalPrefix) : this.defaultRegion;
+      },
+      set(t) {
+        this.$emit("update:region", t), this.updateValue({ prefix: l[t].callingCode });
+      }
+    },
+    prefix() {
+      if (!this.value)
+        return this.internalPrefix || this.defaultPrefix;
+      const t = (Object.keys(l) || []).find(
+        (e) => l[e].callingCode && this.value && this.value.startsWith(l[e].callingCode)
+      );
+      return t ? l[t].callingCode : this.defaultPrefix;
+    },
+    phone: {
+      get() {
+        return this.prefix && this.value && this.value.startsWith(this.prefix) ? this.value.substring(this.prefix.length) : this.value;
+      },
+      set(t) {
+        this.updateValue({ phone: t });
+      }
+    },
+    sortedRegions() {
+      return (Object.keys(l) || []).map((t) => ({
+        key: t,
+        title: `${l[t].name} (${t})`,
+        callingCode: l[t].callingCode
+      })).sort((t, e) => t.title.localeCompare(e.title));
+    }
+  },
+  methods: {
+    getRegionByCallingCode(t) {
+      return t ? (Object.keys(l) || []).find(
+        (i) => t === l[i].callingCode
+      ) : null;
+    },
+    updateValue({ prefix: t, phone: e }) {
+      const i = t !== void 0 ? t : this.prefix || "", s = e !== void 0 ? e : this.phone || "", n = `${i}${s}`;
+      n !== i ? (this.$emit("input", n), this.region || this.$emit("update:region", this.internalRegion), this.internalPrefix = null) : (this.internalPrefix = i, this.$emit("input", ""));
+    }
+  }
+};
+var tt = function() {
+  var e = this, i = e._self._c;
+  return i("CField", { staticClass: "has-addons", attrs: { expanded: "" } }, [i("div", { staticClass: "control" }, [i("SmartList", { attrs: { query: e.searchQuery, items: e.sortedRegions }, scopedSlots: e._u([{ key: "default", fn: function({ items: s }) {
+    return [i("CDropdown", { staticClass: "control", staticStyle: { height: "100%" }, attrs: { size: e.$attrs.size, disabled: e.$attrs.disabled, "menu-styling": {
+      maxWidth: "300px"
+    }, scrollable: !0, position: "is-bottom-right", "max-height": "240px" }, model: { value: e.internalRegion, callback: function(n) {
+      e.internalRegion = n;
+    }, expression: "internalRegion" } }, [i("CButton", { staticStyle: { height: "100%" }, attrs: { slot: "trigger", size: e.$attrs.size, type: "none", pattern: "secondary" }, slot: "trigger" }, [i("Flag", { staticStyle: { "margin-right": "0.35em" }, attrs: { region: e.internalRegion } }), e._v(" " + e._s(e.prefix) + " ")], 1), i("CInput", { staticStyle: { "margin-bottom": "0.25em" }, attrs: { slot: "header", placeholder: e.$t("_common:search"), filled: "" }, slot: "header", model: { value: e.searchQuery, callback: function(n) {
+      e.searchQuery = n;
+    }, expression: "searchQuery" } }), e._l(s, function({ key: n, title: a, callingCode: r }) {
+      return i("CDropdownItem", { key: n, staticClass: "truncate-text", attrs: { value: n } }, [i("Flag", { staticStyle: { "margin-right": "0.75em", flex: "0 0 auto" }, attrs: { region: n, title: a } }), i("span", { staticClass: "truncate-text" }, [e._v(" " + e._s(a) + " (" + e._s(r) + ") ")])], 1);
+    })], 2)];
+  } }]) })], 1), i("CField", { staticClass: "control", attrs: { label: e.label, "label-position": e.labelPosition, expanded: "" } }, [i("CInput", e._b({ attrs: { size: e.$attrs.size, placeholder: e.$attrs.placeholder, type: "tel" }, model: { value: e.phone, callback: function(s) {
+    e.phone = s;
+  }, expression: "phone" } }, "CInput", { ...e.$attrs, ...e.$props }, !1))], 1)], 1);
+}, it = [], st = /* @__PURE__ */ o(
+  et,
+  tt,
+  it,
+  !1,
   null,
   null
 );
-const Ze = Je.exports, et = {
+const x = st.exports, nt = {
   name: "CRadio",
-  mixins: [R]
+  mixins: [M]
 };
-var tt = function() {
+var at = function() {
   var e = this, i = e._self._c;
   return i("label", { ref: "label", staticClass: "b-radio radio", class: [`is-${e.size}`, { "is-disabled": e.disabled }], attrs: { disabled: e.disabled }, on: { click: e.focus, keydown: function(s) {
     return !s.type.indexOf("key") && e._k(s.keyCode, "enter", 13, s.key, "Enter") ? null : (s.preventDefault(), e.$refs.label.click());
@@ -1464,22 +1545,20 @@ var tt = function() {
   }, change: function(s) {
     e.computedValue = e.nativeValue;
   } } }), i("span", { staticClass: "check", class: `is-${e.type}` }), i("span", { staticClass: "control-label" }, [e._t("default")], 2)]);
-}, it = [], st = /* @__PURE__ */ o(
-  et,
-  tt,
-  it,
+}, rt = [], ot = /* @__PURE__ */ o(
+  nt,
+  at,
+  rt,
   !1,
   null,
-  null,
-  null,
   null
 );
-const w = st.exports, nt = {
+const S = ot.exports, lt = {
   name: "CRadioButton",
-  mixins: [R],
   components: {
-    CButton: M
+    CButton: P
   },
+  mixins: [M],
   props: {
     type: {
       type: String,
@@ -1493,7 +1572,7 @@ const w = st.exports, nt = {
     };
   }
 };
-var at = function() {
+var dt = function() {
   var e = this, i = e._self._c;
   return i("div", { staticClass: "control", class: { "is-expanded": e.expanded } }, [i("CButton", { ref: "label", staticClass: "c-radio radio button", class: [{ "is-disabled": e.disabled, "is-focused": e.isFocused }], attrs: { tag: "label", type: e.newValue === e.nativeValue ? e.type : null, size: e.size, disabled: e.disabled }, on: { click: e.focus, keydown: function(s) {
     return !s.type.indexOf("key") && e._k(s.keyCode, "enter", 13, s.key, "Enter") ? null : (s.preventDefault(), e.$refs.$el.label.click());
@@ -1506,29 +1585,36 @@ var at = function() {
   }, change: function(s) {
     e.computedValue = e.nativeValue;
   } } })], 2)], 1);
-}, rt = [], ot = /* @__PURE__ */ o(
-  nt,
-  at,
-  rt,
+}, ct = [], ut = /* @__PURE__ */ o(
+  lt,
+  dt,
+  ct,
   !1,
   null,
-  null,
-  null,
   null
 );
-const S = ot.exports, lt = {
+const $ = ut.exports, mt = {
   name: "CSelect",
-  mixins: [P],
+  mixins: [T],
   inheritAttrs: !1,
   props: {
     value: {
       type: [String, Number, Boolean, Object, Array, Function],
       default: null
     },
-    placeholder: String,
+    placeholder: {
+      type: String,
+      default: ""
+    },
     multiple: Boolean,
-    selectClass: [String, Object, Array],
-    nativeSize: [String, Number]
+    selectClass: {
+      type: [String, Object, Array],
+      default: ""
+    },
+    nativeSize: {
+      type: [String, Number],
+      default: null
+    }
   },
   data() {
     return {
@@ -1570,7 +1656,7 @@ const S = ot.exports, lt = {
     }
   }
 };
-var dt = function() {
+var pt = function() {
   var e = this, i = e._self._c;
   return i("div", { staticClass: "control", class: { "is-expanded": e.expanded, "has-icons-left": e.icon } }, [i("span", { staticClass: "select", class: e.spanClasses }, [i("select", e._b({ directives: [{ name: "model", rawName: "v-model", value: e.computedValue, expression: "computedValue" }], ref: "select", class: e.selectClass, attrs: { multiple: e.multiple, size: e.nativeSize }, on: { blur: function(s) {
     e.$emit("blur", s) && e.checkHtml5Validity();
@@ -1585,913 +1671,854 @@ var dt = function() {
     });
     e.computedValue = s.target.multiple ? n : n[0];
   } } }, "select", e.$attrs, !1), [e.placeholder && e.computedValue == null ? i("option", { attrs: { disabled: "", hidden: "" }, domProps: { value: null } }, [e._v(" " + e._s(e.placeholder) + " ")]) : e._e(), e._t("default")], 2)])]);
-}, ct = [], ut = /* @__PURE__ */ o(
-  lt,
-  dt,
-  ct,
+}, ht = [], ft = /* @__PURE__ */ o(
+  mt,
+  pt,
+  ht,
   !1,
   null,
-  "e050ad8b",
-  null,
-  null
+  "23e48013"
 );
-const $ = ut.exports, mt = {
-  name: "CSwitch",
+const k = ft.exports, gt = {
+  name: "CSkeleton",
+  functional: !0,
   props: {
-    value: [String, Number, Boolean, Function, Object, Array, Date],
-    nativeValue: [String, Number, Boolean, Function, Object, Array, Date],
-    disabled: Boolean,
-    type: String,
-    name: String,
-    required: Boolean,
-    size: {
-      size: String,
-      default: "default"
-    },
-    trueValue: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
+    active: {
+      type: Boolean,
       default: !0
     },
-    falseValue: {
-      type: [String, Number, Boolean, Function, Object, Array, Date],
+    animated: {
+      type: Boolean,
       default: !1
     },
+    width: [Number, String],
+    height: [Number, String],
+    circle: Boolean,
     rounded: {
       type: Boolean,
       default: !0
-    }
-  },
-  data() {
-    return {
-      newValue: this.value
-    };
-  },
-  computed: {
-    computedValue: {
-      get() {
-        return this.newValue;
-      },
-      set(t) {
-        this.newValue = t, this.$emit("input", t);
-      }
     },
-    newClass() {
-      return [
-        `is-${this.size}`,
-        {
-          "is-disabled": this.disabled,
-          "is-rounded": this.rounded
-        }
-      ];
-    }
-  },
-  watch: {
-    /**
-     * When v-model change, set internal value.
-     */
-    value(t) {
-      this.newValue = t;
+    count: {
+      type: Number,
+      default: 1
+    },
+    hidden: {
+      type: [Boolean, String],
+      default: !1
+    },
+    color: {
+      type: String,
+      default: null
     }
   },
-  methods: {
-    focus() {
-      this.$refs.input.focus();
-    }
+  render(t, e) {
+    if (!e.props.active)
+      return;
+    const i = [], s = e.props.width, n = e.props.height;
+    for (let a = 0; a < e.props.count; a++)
+      i.push(
+        t("div", {
+          staticClass: "c-skeleton-item",
+          class: { "is-rounded": e.props.rounded },
+          key: a,
+          style: {
+            height: n === void 0 ? null : isNaN(n) ? n : n + "px",
+            width: s === void 0 ? null : isNaN(s) ? s : s + "px",
+            borderRadius: e.props.circle ? "50%" : null,
+            background: e.props.color ? e.props.color : null
+          }
+        })
+      );
+    return t(
+      "div",
+      {
+        staticStyle: e.data.staticStyle,
+        staticClass: "c-skeleton",
+        class: [
+          e.data.staticClass,
+          {
+            "is-animated": e.props.animated,
+            "is-invisible": e.props.hidden
+          }
+        ]
+      },
+      i
+    );
   }
-};
-var pt = function() {
-  var e = this, i = e._self._c;
-  return i("label", { ref: "label", staticClass: "switch", class: e.newClass, attrs: { disabled: e.disabled }, on: { click: e.focus, keydown: function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "enter", 13, s.key, "Enter") ? null : (s.preventDefault(), e.$refs.label.click());
-  } } }, [i("input", { directives: [{ name: "model", rawName: "v-model", value: e.computedValue, expression: "computedValue" }], ref: "input", attrs: { disabled: e.disabled, name: e.name, required: e.required, "true-value": e.trueValue, "false-value": e.falseValue, type: "checkbox" }, domProps: { value: e.nativeValue, checked: Array.isArray(e.computedValue) ? e._i(e.computedValue, e.nativeValue) > -1 : e._q(e.computedValue, e.trueValue) }, on: { click: function(s) {
-    s.stopPropagation();
-  }, change: function(s) {
-    var n = e.computedValue, a = s.target, r = a.checked ? e.trueValue : e.falseValue;
-    if (Array.isArray(n)) {
-      var d = e.nativeValue, u = e._i(n, d);
-      a.checked ? u < 0 && (e.computedValue = n.concat([d])) : u > -1 && (e.computedValue = n.slice(0, u).concat(n.slice(u + 1)));
-    } else
-      e.computedValue = r;
-  } } }), i("span", { staticClass: "check", class: [`is-${e.type}`] }), i("span", { staticClass: "control-label" }, [e._t("default")], 2)]);
-}, ht = [], ft = /* @__PURE__ */ o(
-  mt,
-  pt,
-  ht,
+}, vt = null, yt = null;
+var _t = /* @__PURE__ */ o(
+  gt,
+  vt,
+  yt,
   !1,
   null,
-  "e2ce5684",
-  null,
   null
 );
-const k = ft.exports, gt = {
-  name: "CSlotComponent",
+const D = _t.exports, bt = {
+  name: "CSliderThumb",
+  inheritAttrs: !1,
   props: {
-    component: {
-      type: Object,
-      required: !0
-    },
-    name: {
-      type: String,
-      default: "default"
-    },
-    scoped: {
-      type: Boolean
-    },
-    props: {
-      type: Object
-    },
-    tag: {
-      type: String,
-      default: "div"
-    },
-    event: {
-      type: String,
-      default: "hook:updated"
-    }
-  },
-  methods: {
-    refresh() {
-      this.$forceUpdate();
+    value: {
+      type: Number,
+      default: 0
     },
-    isVueComponent() {
-      return this.component && this.component._isVue;
-    }
-  },
-  created() {
-    this.isVueComponent() && this.component.$on(this.event, this.refresh);
-  },
-  beforeDestroy() {
-    this.isVueComponent() && this.component.$off(this.event, this.refresh);
-  },
-  // eslint-disable-next-line consistent-return
-  render(t) {
-    if (this.isVueComponent())
-      return t(
-        this.tag,
-        {},
-        this.scoped ? this.component.$scopedSlots[this.name](this.props) : this.component.$slots[this.name]
-      );
-  }
-}, vt = {
-  name: "CTabs",
-  components: {
-    CSlotComponent: gt
-  },
-  props: {
-    value: [Number, String],
-    expanded: Boolean,
-    type: String,
-    size: String,
-    position: {
+    type: {
       type: String,
-      validator(t) {
-        return ["left", "right", "center"].indexOf(t) > -1;
-      },
-      default: null
+      default: ""
     },
-    animated: {
+    tooltip: {
       type: Boolean,
       default: !0
     },
-    destroyOnHide: {
-      type: Boolean,
-      default: !1
-    },
-    vertical: Boolean,
-    multiline: Boolean
+    customFormatter: {
+      type: Function,
+      default: null
+    }
   },
   data() {
     return {
-      activeTab: 0,
-      defaultSlots: [],
-      contentHeight: 0,
-      isTransitioning: !1,
-      _isTabs: !0
-      // Used internally by TabItem
+      isFocused: !1,
+      dragging: !1,
+      startX: 0,
+      startPosition: 0,
+      newPosition: null,
+      oldValue: this.value
     };
   },
   computed: {
-    mainClasses() {
-      return {
-        "is-fullwidth": this.expanded,
-        "is-vertical": this.vertical,
-        "is-multiline": this.multiline,
-        [`is-${this.position}`]: this.position && this.vertical
-      };
+    disabled() {
+      return this.$parent.disabled;
     },
-    navClasses() {
-      return [
-        this.type,
-        {
-          [`is-${this.size}`]: !!this.size,
-          [`is-${this.position}`]: this.position && !this.vertical,
-          "is-fullwidth": this.expanded,
-          "is-toggle-rounded is-toggle": this.type === "is-toggle-rounded"
-        }
-      ];
+    max() {
+      return this.$parent.max;
     },
-    tabItems() {
-      return this.defaultSlots.filter(
-        (t) => t.componentInstance && t.componentInstance.$data && t.componentInstance.$data._isTabItem
-      ).map((t) => t.componentInstance);
-    }
-  },
-  watch: {
-    /**
-     * When v-model is changed set the new active tab.
-     */
-    value(t) {
-      const e = this.getIndexByValue(t, t);
-      this.changeTab(e);
+    min() {
+      return this.$parent.min;
     },
-    /**
-     * When tab-items are updated, set active one.
-     */
-    tabItems() {
-      if (this.activeTab < this.tabItems.length) {
-        let t = this.activeTab;
-        this.tabItems.map((e, i) => {
-          e.isActive && (t = i, t < this.tabItems.length && (this.tabItems[t].isActive = !1));
-        }), this.tabItems[this.activeTab].isActive = !0;
-      } else
-        this.activeTab > 0 && this.changeTab(this.activeTab - 1);
+    step() {
+      return this.$parent.step;
+    },
+    precision() {
+      return this.$parent.precision;
+    },
+    currentPosition() {
+      return `${(this.value - this.min) / (this.max - this.min) * 100}%`;
+    },
+    wrapperStyle() {
+      return { left: this.currentPosition };
+    },
+    tooltipLabel() {
+      return typeof this.customFormatter == "function" ? this.customFormatter(this.value) : this.value.toString();
     }
   },
-  mounted() {
-    this.activeTab = this.getIndexByValue(this.value || 0), this.activeTab < this.tabItems.length && (this.tabItems[this.activeTab].isActive = !0), this.refreshSlots();
-  },
   methods: {
-    /**
-     * Change the active tab and emit change event.
-     */
-    changeTab(t) {
-      this.activeTab === t || this.tabItems[t] === void 0 || (this.activeTab < this.tabItems.length && this.tabItems[this.activeTab].deactivate(this.activeTab, t), this.tabItems[t].activate(this.activeTab, t), this.activeTab = t, this.$emit("change", this.getValueByIndex(t)));
+    onFocus() {
+      this.isFocused = !0;
     },
-    /**
-     * Tab click listener, emit input event and change active tab.
-     */
-    tabClick(t) {
-      this.activeTab !== t && (this.$emit("input", this.getValueByIndex(t)), this.changeTab(t));
+    onBlur() {
+      this.isFocused = !1;
     },
-    refreshSlots() {
-      this.defaultSlots = this.$slots.default || [];
+    onButtonDown(t) {
+      this.disabled || (t.preventDefault(), this.onDragStart(t), typeof window < "u" && (document.addEventListener("mousemove", this.onDragging), document.addEventListener("touchmove", this.onDragging), document.addEventListener("mouseup", this.onDragEnd), document.addEventListener("touchend", this.onDragEnd), document.addEventListener("contextmenu", this.onDragEnd)));
     },
-    getIndexByValue(t) {
-      const e = this.tabItems.map(
-        (i) => i.$options.propsData ? i.$options.propsData.value : void 0
-      ).indexOf(t);
-      return e >= 0 ? e : t;
+    onLeftKeyDown() {
+      this.disabled || this.value === this.min || (this.newPosition = parseFloat(this.currentPosition) - this.step / (this.max - this.min) * 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
     },
-    getValueByIndex(t) {
-      const { propsData: e } = this.tabItems[t].$options;
-      return e && e.value ? e.value : t;
+    onRightKeyDown() {
+      this.disabled || this.value === this.max || (this.newPosition = parseFloat(this.currentPosition) + this.step / (this.max - this.min) * 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
+    },
+    onHomeKeyDown() {
+      this.disabled || this.value === this.min || (this.newPosition = 0, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
+    },
+    onEndKeyDown() {
+      this.disabled || this.value === this.max || (this.newPosition = 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
+    },
+    onDragStart(t) {
+      this.dragging = !0, this.$emit("dragstart"), t.type === "touchstart" && (t.clientX = t.touches[0].clientX), this.startX = t.clientX, this.startPosition = parseFloat(this.currentPosition), this.newPosition = this.startPosition;
+    },
+    onDragging(t) {
+      if (this.dragging) {
+        t.type === "touchmove" && (t.clientX = t.touches[0].clientX);
+        const e = (t.clientX - this.startX) / this.$parent.sliderSize() * 100;
+        this.newPosition = this.startPosition + e, this.setPosition(this.newPosition);
+      }
+    },
+    onDragEnd() {
+      this.dragging = !1, this.$emit("dragend"), this.value !== this.oldValue && this.$parent.emitValue("change"), this.setPosition(this.newPosition), typeof window < "u" && (document.removeEventListener("mousemove", this.onDragging), document.removeEventListener("touchmove", this.onDragging), document.removeEventListener("mouseup", this.onDragEnd), document.removeEventListener("touchend", this.onDragEnd), document.removeEventListener("contextmenu", this.onDragEnd));
+    },
+    setPosition(t) {
+      if (t === null || isNaN(t))
+        return;
+      t < 0 ? t = 0 : t > 100 && (t = 100);
+      const e = 100 / ((this.max - this.min) / this.step);
+      let s = Math.round(t / e) * e / 100 * (this.max - this.min) + this.min;
+      s = parseFloat(s.toFixed(this.precision)), this.$emit("input", s), !this.dragging && s !== this.oldValue && (this.oldValue = s);
     }
   }
 };
-var yt = function() {
+var Ct = function() {
   var e = this, i = e._self._c;
-  return i("div", { staticClass: "c-tabs", class: e.mainClasses }, [i("nav", { staticClass: "tabs", class: e.navClasses }, [i("ul", e._l(e.tabItems, function(s, n) {
-    return i("li", { directives: [{ name: "show", rawName: "v-show", value: s.visible, expression: "tabItem.visible" }], key: n, class: {
-      "is-active": e.activeTab === n,
-      "is-disabled": s.disabled
-    } }, [s.$slots.header ? i("CSlotComponent", { attrs: { component: s, name: "header", tag: "a" }, nativeOn: { click: function(a) {
-      return e.tabClick(n);
-    } } }) : i("a", { on: { click: function(a) {
-      return e.tabClick(n);
-    } } }, [s.icon ? i("BaseIcon", { attrs: { size: e.size, type: s.icon } }) : e._e(), i("span", [e._v(e._s(s.label))])], 1)], 1);
-  }), 0)]), i("section", { staticClass: "tab-content", class: { "is-transitioning": e.isTransitioning } }, [e._t("default")], 2)]);
-}, _t = [], bt = /* @__PURE__ */ o(
-  vt,
-  yt,
-  _t,
+  return i("div", { staticClass: "c-slider-thumb-wrapper", class: { "is-dragging": e.dragging }, style: e.wrapperStyle }, [i("div", e._b({ staticClass: "c-slider-thumb", attrs: { tabindex: e.disabled ? !1 : 0 }, on: { mousedown: e.onButtonDown, touchstart: e.onButtonDown, focus: e.onFocus, blur: e.onBlur, keydown: [function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "left", 37, s.key, ["Left", "ArrowLeft"]) || "button" in s && s.button !== 0 ? null : (s.preventDefault(), e.onLeftKeyDown.apply(null, arguments));
+  }, function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "right", 39, s.key, ["Right", "ArrowRight"]) || "button" in s && s.button !== 2 ? null : (s.preventDefault(), e.onRightKeyDown.apply(null, arguments));
+  }, function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "down", 40, s.key, ["Down", "ArrowDown"]) ? null : (s.preventDefault(), e.onLeftKeyDown.apply(null, arguments));
+  }, function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "up", 38, s.key, ["Up", "ArrowUp"]) ? null : (s.preventDefault(), e.onRightKeyDown.apply(null, arguments));
+  }, function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "home", void 0, s.key, void 0) ? null : (s.preventDefault(), e.onHomeKeyDown.apply(null, arguments));
+  }, function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "end", void 0, s.key, void 0) ? null : (s.preventDefault(), e.onEndKeyDown.apply(null, arguments));
+  }] } }, "div", e.$attrs, !1))]);
+}, wt = [], xt = /* @__PURE__ */ o(
+  bt,
+  Ct,
+  wt,
   !1,
   null,
-  "e8891cc0",
-  null,
   null
 );
-const D = bt.exports, Ct = {
-  name: "CTabItem",
+const St = xt.exports, $t = {
+  name: "CSliderTick",
   props: {
-    label: String,
-    icon: String,
-    iconPack: String,
-    disabled: Boolean,
-    visible: {
-      type: Boolean,
-      default: !0
-    },
-    value: [String, Number]
+    value: {
+      type: Number,
+      default: 0
+    }
   },
-  data() {
-    return {
-      isActive: !1,
-      transitionName: null,
-      _isTabItem: !0
-      // Used internally by Tab
-    };
+  computed: {
+    position() {
+      const t = (this.value - this.$parent.min) / (this.$parent.max - this.$parent.min) * 100;
+      return t >= 0 && t <= 100 ? t : 0;
+    },
+    hidden() {
+      return this.value === this.$parent.min || this.value === this.$parent.max;
+    }
   },
   created() {
-    if (!this.$parent.$data._isTabs)
-      throw this.$destroy(), new Error("You should wrap bTabItem on a bTabs");
-    this.$parent.refreshSlots();
-  },
-  beforeDestroy() {
-    this.$parent.refreshSlots();
+    if (!this.$parent.$data._isSlider)
+      throw this.$destroy(), new Error("You should wrap bSliderTick on a bSlider");
   },
   methods: {
-    /**
-     * Activate tab, alter animation name based on the index.
-     */
-    activate(t, e) {
-      this.transitionName = e < t ? this.$parent.vertical ? "slide-down" : "slide-next" : this.$parent.vertical ? "slide-up" : "slide-prev", this.isActive = !0;
-    },
-    /**
-     * Deactivate tab, alter animation name based on the index.
-     */
-    deactivate(t, e) {
-      this.transitionName = e < t ? this.$parent.vertical ? "slide-down" : "slide-next" : this.$parent.vertical ? "slide-up" : "slide-prev", this.isActive = !1;
-    }
-  },
-  render(t) {
-    if (this.$parent.destroyOnHide && (!this.isActive || !this.visible))
-      return;
-    const e = t(
-      "div",
-      {
-        directives: [
-          {
-            name: "show",
-            value: this.isActive && this.visible
-          }
-        ],
-        class: "tab-item"
-      },
-      this.$slots.default
-    );
-    return this.$parent.animated ? t(
-      "transition",
-      {
-        props: {
-          name: this.transitionName,
-          mode: "out-in"
-        },
-        on: {
-          "before-enter": () => {
-            this.$parent.isTransitioning = !0;
-          },
-          "after-enter": () => {
-            this.$parent.isTransitioning = !1;
-          }
-        }
-      },
-      [e]
-    ) : e;
-  }
-}, xt = null, wt = null;
-var St = /* @__PURE__ */ o(
-  Ct,
-  xt,
-  wt,
-  !1,
-  null,
-  null,
-  null,
-  null
-);
-const V = St.exports, $t = {
-  name: "CMessage",
-  props: {
-    type: {
-      type: String,
-      default: "secondary"
-    },
-    badge: {
-      type: String,
-      default: ""
-    },
-    text: {
-      type: String,
-      default: ""
+    getTickStyle(t) {
+      return { left: `${t}%` };
     }
   }
 };
-var kt = function(e, i) {
-  return e("div", { class: [i.data.class, i.data.staticClass], staticStyle: { padding: "0.75em 1em", display: "flex", "align-items": "flex-start", "border-radius": "0.6em", "background-color": "hsl(var(--gray-color-100) / 1)" }, style: { ...i.data.staticStyle } }, [e("div", { class: [`has-background-${i.props.type}`], staticStyle: { display: "inline-block", padding: "0.5em", "border-radius": "0.45em", "font-weight": "700", color: "white", "line-height": "1", "font-size": "12px", "margin-right": "1.25em" } }, [i._v(" " + i._s(i.props.badge || i.parent.$t("components:cling.message.tip")) + " ")]), e("div", { staticStyle: { color: "hsl(0, 0%, 25%)" } }, [i.props.text ? [i._v(" " + i._s(i.props.text) + " ")] : i._e(), i._t("default")], 2)]);
+var kt = function() {
+  var e = this, i = e._self._c;
+  return i("div", { staticClass: "c-slider-tick", class: { "is-tick-hidden": e.hidden }, style: e.getTickStyle(e.position) }, [e.$slots.default ? i("span", { staticClass: "c-slider-tick-label" }, [e._t("default")], 2) : e._e()]);
 }, Dt = [], Vt = /* @__PURE__ */ o(
   $t,
   kt,
   Dt,
-  !0,
-  null,
-  "9be3b227",
+  !1,
   null,
   null
 );
-const F = Vt.exports, Ft = {
-  name: "CPhoneInput",
+const Ft = Vt.exports, At = {
+  name: "CSlider",
   components: {
-    Flag: j,
-    CInput: T,
-    CDropdown: h,
-    CDropdownItem: f,
-    CButton: M,
-    CField: z,
-    SmartList: ne
+    CSliderThumb: St,
+    CSliderTick: Ft
   },
   props: {
     value: {
-      type: [String, Number],
-      default: ""
+      type: [Number, Array],
+      default: 0
     },
-    region: {
-      type: String,
-      default: ""
+    min: {
+      type: Number,
+      default: 0
     },
-    // Region to fallback to if prefix is not found in value
-    defaultRegion: {
-      type: String,
-      required: !0
+    max: {
+      type: Number,
+      default: 100
     },
-    label: {
+    step: {
+      type: Number,
+      default: 1
+    },
+    type: {
       type: String,
-      default: ""
+      default: "primary"
     },
-    labelPosition: {
+    size: {
       type: String,
       default: ""
+    },
+    ticks: {
+      type: Boolean,
+      default: !1
+    },
+    tooltip: {
+      type: Boolean,
+      default: !0
+    },
+    tooltipType: {
+      type: String,
+      default: ""
+    },
+    rounded: {
+      type: Boolean,
+      default: !1
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    lazy: {
+      type: Boolean,
+      default: !1
+    },
+    customFormatter: {
+      type: Function,
+      default: null
+    },
+    ariaLabel: {
+      type: [String, Array],
+      default: ""
+    },
+    biggerSliderFocus: {
+      type: Boolean,
+      default: !1
     }
   },
   data() {
     return {
-      internalPrefix: null,
-      // Used to remember prefix when value is changed to empty
-      searchQuery: ""
+      value1: null,
+      value2: null,
+      dragging: !1,
+      isRange: !1,
+      _isSlider: !0
+      // Used by Thumb and Tick
     };
   },
   computed: {
-    defaultPrefix() {
-      return l[this.internalRegion].callingCode;
+    newTooltipType() {
+      return this.tooltipType ? this.tooltipType : this.type;
     },
-    currentRegion() {
-      return this.getRegionByCallingCode(this.prefix);
+    tickValues() {
+      if (!this.ticks || this.min > this.max || this.step === 0)
+        return [];
+      const t = [];
+      for (let e = this.min + this.step; e < this.max; e += this.step)
+        t.push(e);
+      return t;
     },
-    internalRegion: {
-      get() {
-        if (this.region)
-          return this.region;
-        if (this.value) {
-          const t = (Object.keys(l) || []).find(
-            (e) => l[e].callingCode && this.value && this.value.startsWith(l[e].callingCode)
-          );
-          if (t)
-            return t;
-        }
-        return this.internalPrefix ? this.getRegionByCallingCode(this.internalPrefix) : this.defaultRegion;
-      },
-      set(t) {
-        this.$emit("update:region", t), this.updateValue({ prefix: l[t].callingCode });
-      }
+    minValue() {
+      return Math.min(this.value1, this.value2);
     },
-    prefix() {
-      if (!this.value)
-        return this.internalPrefix || this.defaultPrefix;
-      const t = (Object.keys(l) || []).find(
-        (e) => l[e].callingCode && this.value && this.value.startsWith(l[e].callingCode)
-      );
-      return t ? l[t].callingCode : this.defaultPrefix;
+    maxValue() {
+      return Math.max(this.value1, this.value2);
     },
-    phone: {
-      get() {
-        return this.prefix && this.value && this.value.startsWith(this.prefix) ? this.value.substring(this.prefix.length) : this.value;
-      },
-      set(t) {
-        this.updateValue({ phone: t });
-      }
+    barSize() {
+      return this.isRange ? `${100 * (this.maxValue - this.minValue) / (this.max - this.min)}%` : `${100 * (this.value1 - this.min) / (this.max - this.min)}%`;
     },
-    sortedRegions() {
-      return (Object.keys(l) || []).map((t) => ({
-        key: t,
-        title: `${l[t].name} (${t})`,
-        callingCode: l[t].callingCode
-      })).sort((t, e) => t.title.localeCompare(e.title));
+    barStart() {
+      return this.isRange ? `${100 * (this.minValue - this.min) / (this.max - this.min)}%` : "0%";
+    },
+    precision() {
+      const t = [this.min, this.max, this.step].map((e) => {
+        const i = `${e}`.split(".")[1];
+        return i ? i.length : 0;
+      });
+      return Math.max(...t);
+    },
+    barStyle() {
+      return {
+        width: this.barSize,
+        left: this.barStart
+      };
+    },
+    rootClasses() {
+      return {
+        "is-rounded": this.rounded,
+        "is-dragging": this.dragging,
+        "is-disabled": this.disabled,
+        "slider-focus": this.biggerSliderFocus
+      };
+    }
+  },
+  watch: {
+    /**
+     * When v-model is changed set the new active step.
+     */
+    value(t) {
+      this.setValues(t);
+    },
+    value1() {
+      this.onInternalValueUpdate();
+    },
+    value2() {
+      this.onInternalValueUpdate();
+    },
+    min() {
+      this.setValues(this.value);
+    },
+    max() {
+      this.setValues(this.value);
     }
   },
+  created() {
+    this.isThumbReversed = !1, this.isTrackClickDisabled = !1, this.setValues(this.value);
+  },
   methods: {
-    getRegionByCallingCode(t) {
-      return t ? (Object.keys(l) || []).find(
-        (i) => t === l[i].callingCode
-      ) : null;
+    setValues(t) {
+      if (!(this.min > this.max))
+        if (Array.isArray(t)) {
+          this.isRange = !0;
+          const e = typeof t[0] != "number" || isNaN(t[0]) ? this.min : p(t[0], this.min, this.max), i = typeof t[1] != "number" || isNaN(t[1]) ? this.max : p(t[1], this.min, this.max);
+          this.value1 = this.isThumbReversed ? i : e, this.value2 = this.isThumbReversed ? e : i;
+        } else
+          this.isRange = !1, this.value1 = isNaN(t) ? this.min : p(t, this.min, this.max), this.value2 = null;
     },
-    updateValue({ prefix: t, phone: e }) {
-      const i = t !== void 0 ? t : this.prefix || "", s = e !== void 0 ? e : this.phone || "", n = `${i}${s}`;
-      n !== i ? (this.$emit("input", n), this.region || this.$emit("update:region", this.internalRegion), this.internalPrefix = null) : (this.internalPrefix = i, this.$emit("input", ""));
+    onInternalValueUpdate() {
+      this.isRange && (this.isThumbReversed = this.value1 > this.value2), (!this.lazy || !this.dragging) && this.emitValue("input"), this.dragging && this.emitValue("dragging");
+    },
+    sliderSize() {
+      return this.$refs.slider.getBoundingClientRect().width;
+    },
+    onSliderClick(t) {
+      if (this.disabled || this.isTrackClickDisabled)
+        return;
+      const e = this.$refs.slider.getBoundingClientRect().left, i = (t.clientX - e) / this.sliderSize() * 100, s = this.min + i * (this.max - this.min) / 100, n = Math.abs(s - this.value1);
+      if (this.isRange) {
+        const a = Math.abs(s - this.value2);
+        if (n <= a) {
+          if (n < this.step / 2)
+            return;
+          this.$refs.button1.setPosition(i);
+        } else {
+          if (a < this.step / 2)
+            return;
+          this.$refs.button2.setPosition(i);
+        }
+      } else {
+        if (n < this.step / 2)
+          return;
+        this.$refs.button1.setPosition(i);
+      }
+      this.emitValue("change");
+    },
+    onDragStart() {
+      this.dragging = !0, this.$emit("dragstart");
+    },
+    onDragEnd() {
+      this.isTrackClickDisabled = !0, setTimeout(() => {
+        this.isTrackClickDisabled = !1;
+      }, 0), this.dragging = !1, this.$emit("dragend"), this.lazy && this.emitValue("input");
+    },
+    emitValue(t) {
+      this.$emit(
+        t,
+        this.isRange ? [this.minValue, this.maxValue] : this.value1
+      );
     }
   }
 };
-var At = function() {
+var Bt = function() {
   var e = this, i = e._self._c;
-  return i("CField", { staticClass: "has-addons", attrs: { expanded: "" } }, [i("div", { staticClass: "control" }, [i("SmartList", { attrs: { query: e.searchQuery, items: e.sortedRegions }, scopedSlots: e._u([{ key: "default", fn: function({ items: s }) {
-    return [i("CDropdown", { staticClass: "control", staticStyle: { height: "100%" }, attrs: { size: e.$attrs.size, disabled: e.$attrs.disabled, "menu-styling": {
-      maxWidth: "300px"
-    }, scrollable: !0, position: "is-bottom-right", "max-height": "240px" }, model: { value: e.internalRegion, callback: function(n) {
-      e.internalRegion = n;
-    }, expression: "internalRegion" } }, [i("CButton", { staticStyle: { height: "100%" }, attrs: { slot: "trigger", size: e.$attrs.size, type: "none", pattern: "secondary" }, slot: "trigger" }, [i("Flag", { staticStyle: { "margin-right": "0.35em" }, attrs: { region: e.internalRegion } }), e._v(" " + e._s(e.prefix) + " ")], 1), i("CInput", { staticStyle: { "margin-bottom": "0.25em" }, attrs: { slot: "header", placeholder: e.$t("_common:search"), filled: "" }, slot: "header", model: { value: e.searchQuery, callback: function(n) {
-      e.searchQuery = n;
-    }, expression: "searchQuery" } }), e._l(s, function({ key: n, title: a, callingCode: r }) {
-      return i("CDropdownItem", { key: n, staticClass: "truncate-text", attrs: { value: n } }, [i("Flag", { staticStyle: { "margin-right": "0.75em", flex: "0 0 auto" }, attrs: { region: n, title: a } }), i("span", { staticClass: "truncate-text" }, [e._v(" " + e._s(a) + " (" + e._s(r) + ") ")])], 1);
-    })], 2)];
-  } }]) })], 1), i("CField", { staticClass: "control", attrs: { label: e.label, "label-position": e.labelPosition, expanded: "" } }, [i("CInput", e._b({ attrs: { size: e.$attrs.size, placeholder: e.$attrs.placeholder, type: "tel" }, model: { value: e.phone, callback: function(s) {
-    e.phone = s;
-  }, expression: "phone" } }, "CInput", { ...e.$attrs, ...e.$props }, !1))], 1)], 1);
-}, Bt = [], It = /* @__PURE__ */ o(
-  Ft,
+  return i("div", { staticClass: "c-slider", class: [`is-${e.size}`, `is-${e.type}`, e.rootClasses], on: { click: e.onSliderClick } }, [i("div", { ref: "slider", staticClass: "c-slider-track" }, [i("div", { staticClass: "c-slider-fill", style: e.barStyle }), e.ticks ? e._l(e.tickValues, function(s, n) {
+    return i("CSliderTick", { key: n, attrs: { value: s } });
+  }) : e._e(), e._t("default"), i("CSliderThumb", { ref: "button1", attrs: { type: `is-${e.newTooltipType}`, tooltip: e.tooltip, "custom-formatter": e.customFormatter, "aria-valuenow": e.value1, "aria-valuemin": e.min, "aria-valuemax": e.max, "aria-label": Array.isArray(e.ariaLabel) ? e.ariaLabel[0] : e.ariaLabel, "aria-disabled": e.disabled, role: "slider", "aria-orientation": "horizontal" }, on: { dragstart: e.onDragStart, dragend: e.onDragEnd }, model: { value: e.value1, callback: function(s) {
+    e.value1 = s;
+  }, expression: "value1" } }), e.isRange ? i("CSliderThumb", { ref: "button2", attrs: { type: e.newTooltipType, tooltip: e.tooltip, "custom-formatter": e.customFormatter, "aria-valuenow": e.value2, "aria-valuemin": e.min, "aria-valuemax": e.max, "aria-label": Array.isArray(e.ariaLabel) ? e.ariaLabel[1] : "", "aria-disabled": e.disabled, role: "slider", "aria-orientation": "horizontal" }, on: { dragstart: e.onDragStart, dragend: e.onDragEnd }, model: { value: e.value2, callback: function(s) {
+    e.value2 = s;
+  }, expression: "value2" } }) : e._e()], 2)]);
+}, It = [], Ot = /* @__PURE__ */ o(
   At,
   Bt,
+  It,
   !1,
   null,
-  null,
-  null,
   null
 );
-const A = It.exports, Ot = {
-  name: "CSliderThumb",
-  inheritAttrs: !1,
+const V = Ot.exports, Tt = {
+  name: "CSwitch",
   props: {
     value: {
-      type: Number,
-      default: 0
+      type: [String, Number, Boolean, Function, Object, Array, Date],
+      default: null
+    },
+    nativeValue: {
+      type: [String, Number, Boolean, Function, Object, Array, Date],
+      default: null
     },
+    disabled: Boolean,
     type: {
       type: String,
       default: ""
     },
-    tooltip: {
-      type: Boolean,
+    name: {
+      type: String,
+      default: ""
+    },
+    required: Boolean,
+    size: {
+      type: String,
+      default: ""
+    },
+    trueValue: {
+      type: [String, Number, Boolean, Function, Object, Array, Date],
       default: !0
     },
-    customFormatter: Function
+    falseValue: {
+      type: [String, Number, Boolean, Function, Object, Array, Date],
+      default: !1
+    },
+    rounded: {
+      type: Boolean,
+      default: !0
+    }
   },
   data() {
     return {
-      isFocused: !1,
-      dragging: !1,
-      startX: 0,
-      startPosition: 0,
-      newPosition: null,
-      oldValue: this.value
+      newValue: this.value
     };
   },
   computed: {
-    disabled() {
-      return this.$parent.disabled;
-    },
-    max() {
-      return this.$parent.max;
-    },
-    min() {
-      return this.$parent.min;
-    },
-    step() {
-      return this.$parent.step;
-    },
-    precision() {
-      return this.$parent.precision;
-    },
-    currentPosition() {
-      return `${(this.value - this.min) / (this.max - this.min) * 100}%`;
-    },
-    wrapperStyle() {
-      return { left: this.currentPosition };
+    computedValue: {
+      get() {
+        return this.newValue;
+      },
+      set(t) {
+        this.newValue = t, this.$emit("input", t);
+      }
     },
-    tooltipLabel() {
-      return typeof this.customFormatter < "u" ? this.customFormatter(this.value) : this.value.toString();
+    newClass() {
+      return [
+        `is-${this.size}`,
+        {
+          "is-disabled": this.disabled,
+          "is-rounded": this.rounded
+        }
+      ];
+    }
+  },
+  watch: {
+    /**
+     * When v-model change, set internal value.
+     */
+    value(t) {
+      this.newValue = t;
     }
   },
   methods: {
-    onFocus() {
-      this.isFocused = !0;
-    },
-    onBlur() {
-      this.isFocused = !1;
-    },
-    onButtonDown(t) {
-      this.disabled || (t.preventDefault(), this.onDragStart(t), typeof window < "u" && (document.addEventListener("mousemove", this.onDragging), document.addEventListener("touchmove", this.onDragging), document.addEventListener("mouseup", this.onDragEnd), document.addEventListener("touchend", this.onDragEnd), document.addEventListener("contextmenu", this.onDragEnd)));
-    },
-    onLeftKeyDown() {
-      this.disabled || this.value === this.min || (this.newPosition = parseFloat(this.currentPosition) - this.step / (this.max - this.min) * 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
-    },
-    onRightKeyDown() {
-      this.disabled || this.value === this.max || (this.newPosition = parseFloat(this.currentPosition) + this.step / (this.max - this.min) * 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
-    },
-    onHomeKeyDown() {
-      this.disabled || this.value === this.min || (this.newPosition = 0, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
-    },
-    onEndKeyDown() {
-      this.disabled || this.value === this.max || (this.newPosition = 100, this.setPosition(this.newPosition), this.$parent.emitValue("change"));
-    },
-    onDragStart(t) {
-      this.dragging = !0, this.$emit("dragstart"), t.type === "touchstart" && (t.clientX = t.touches[0].clientX), this.startX = t.clientX, this.startPosition = parseFloat(this.currentPosition), this.newPosition = this.startPosition;
-    },
-    onDragging(t) {
-      if (this.dragging) {
-        t.type === "touchmove" && (t.clientX = t.touches[0].clientX);
-        const e = (t.clientX - this.startX) / this.$parent.sliderSize() * 100;
-        this.newPosition = this.startPosition + e, this.setPosition(this.newPosition);
-      }
-    },
-    onDragEnd() {
-      this.dragging = !1, this.$emit("dragend"), this.value !== this.oldValue && this.$parent.emitValue("change"), this.setPosition(this.newPosition), typeof window < "u" && (document.removeEventListener("mousemove", this.onDragging), document.removeEventListener("touchmove", this.onDragging), document.removeEventListener("mouseup", this.onDragEnd), document.removeEventListener("touchend", this.onDragEnd), document.removeEventListener("contextmenu", this.onDragEnd));
-    },
-    setPosition(t) {
-      if (t === null || isNaN(t))
-        return;
-      t < 0 ? t = 0 : t > 100 && (t = 100);
-      const e = 100 / ((this.max - this.min) / this.step);
-      let s = Math.round(t / e) * e / 100 * (this.max - this.min) + this.min;
-      s = parseFloat(s.toFixed(this.precision)), this.$emit("input", s), !this.dragging && s !== this.oldValue && (this.oldValue = s);
+    focus() {
+      this.$refs.input.focus();
     }
   }
 };
-var Tt = function() {
+var Pt = function() {
   var e = this, i = e._self._c;
-  return i("div", { staticClass: "c-slider-thumb-wrapper", class: { "is-dragging": e.dragging }, style: e.wrapperStyle }, [i("div", e._b({ staticClass: "c-slider-thumb", attrs: { tabindex: e.disabled ? !1 : 0 }, on: { mousedown: e.onButtonDown, touchstart: e.onButtonDown, focus: e.onFocus, blur: e.onBlur, keydown: [function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "left", 37, s.key, ["Left", "ArrowLeft"]) || "button" in s && s.button !== 0 ? null : (s.preventDefault(), e.onLeftKeyDown.apply(null, arguments));
-  }, function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "right", 39, s.key, ["Right", "ArrowRight"]) || "button" in s && s.button !== 2 ? null : (s.preventDefault(), e.onRightKeyDown.apply(null, arguments));
-  }, function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "down", 40, s.key, ["Down", "ArrowDown"]) ? null : (s.preventDefault(), e.onLeftKeyDown.apply(null, arguments));
-  }, function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "up", 38, s.key, ["Up", "ArrowUp"]) ? null : (s.preventDefault(), e.onRightKeyDown.apply(null, arguments));
-  }, function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "home", void 0, s.key, void 0) ? null : (s.preventDefault(), e.onHomeKeyDown.apply(null, arguments));
-  }, function(s) {
-    return !s.type.indexOf("key") && e._k(s.keyCode, "end", void 0, s.key, void 0) ? null : (s.preventDefault(), e.onEndKeyDown.apply(null, arguments));
-  }] } }, "div", e.$attrs, !1))]);
-}, Pt = [], Rt = /* @__PURE__ */ o(
-  Ot,
+  return i("label", { ref: "label", staticClass: "switch", class: e.newClass, attrs: { disabled: e.disabled }, on: { click: e.focus, keydown: function(s) {
+    return !s.type.indexOf("key") && e._k(s.keyCode, "enter", 13, s.key, "Enter") ? null : (s.preventDefault(), e.$refs.label.click());
+  } } }, [i("input", { directives: [{ name: "model", rawName: "v-model", value: e.computedValue, expression: "computedValue" }], ref: "input", attrs: { disabled: e.disabled, name: e.name, required: e.required, "true-value": e.trueValue, "false-value": e.falseValue, type: "checkbox" }, domProps: { value: e.nativeValue, checked: Array.isArray(e.computedValue) ? e._i(e.computedValue, e.nativeValue) > -1 : e._q(e.computedValue, e.trueValue) }, on: { click: function(s) {
+    s.stopPropagation();
+  }, change: function(s) {
+    var n = e.computedValue, a = s.target, r = a.checked ? e.trueValue : e.falseValue;
+    if (Array.isArray(n)) {
+      var d = e.nativeValue, u = e._i(n, d);
+      a.checked ? u < 0 && (e.computedValue = n.concat([d])) : u > -1 && (e.computedValue = n.slice(0, u).concat(n.slice(u + 1)));
+    } else
+      e.computedValue = r;
+  } } }), i("span", { staticClass: "check", class: [`is-${e.type}`] }), i("span", { staticClass: "control-label" }, [e._t("default")], 2)]);
+}, Mt = [], Rt = /* @__PURE__ */ o(
   Tt,
   Pt,
+  Mt,
   !1,
   null,
-  null,
+  "4cdd239d"
+);
+const F = Rt.exports, Et = {
+  name: "CTabItem",
+  props: {
+    label: String,
+    icon: String,
+    iconPack: String,
+    disabled: Boolean,
+    visible: {
+      type: Boolean,
+      default: !0
+    },
+    value: [String, Number]
+  },
+  data() {
+    return {
+      isActive: !1,
+      transitionName: null,
+      _isTabItem: !0
+      // Used internally by Tab
+    };
+  },
+  created() {
+    if (!this.$parent.$data._isTabs)
+      throw this.$destroy(), new Error("You should wrap bTabItem on a bTabs");
+    this.$parent.refreshSlots();
+  },
+  beforeDestroy() {
+    this.$parent.refreshSlots();
+  },
+  methods: {
+    /**
+     * Activate tab, alter animation name based on the index.
+     */
+    activate(t, e) {
+      this.transitionName = e < t ? this.$parent.vertical ? "slide-down" : "slide-next" : this.$parent.vertical ? "slide-up" : "slide-prev", this.isActive = !0;
+    },
+    /**
+     * Deactivate tab, alter animation name based on the index.
+     */
+    deactivate(t, e) {
+      this.transitionName = e < t ? this.$parent.vertical ? "slide-down" : "slide-next" : this.$parent.vertical ? "slide-up" : "slide-prev", this.isActive = !1;
+    }
+  },
+  render(t) {
+    if (this.$parent.destroyOnHide && (!this.isActive || !this.visible))
+      return;
+    const e = t(
+      "div",
+      {
+        directives: [
+          {
+            name: "show",
+            value: this.isActive && this.visible
+          }
+        ],
+        class: "tab-item"
+      },
+      this.$slots.default
+    );
+    return this.$parent.animated ? t(
+      "transition",
+      {
+        props: {
+          name: this.transitionName,
+          mode: "out-in"
+        },
+        on: {
+          "before-enter": () => {
+            this.$parent.isTransitioning = !0;
+          },
+          "after-enter": () => {
+            this.$parent.isTransitioning = !1;
+          }
+        }
+      },
+      [e]
+    ) : e;
+  }
+}, zt = null, Nt = null;
+var Lt = /* @__PURE__ */ o(
+  Et,
+  zt,
+  Nt,
+  !1,
   null,
   null
 );
-const Mt = Rt.exports, zt = {
-  name: "CSliderTick",
+const A = Lt.exports, Ht = {
+  name: "CSlotComponent",
   props: {
-    value: {
-      type: Number,
-      default: 0
+    component: {
+      type: Object,
+      required: !0
+    },
+    name: {
+      type: String,
+      default: "default"
+    },
+    scoped: {
+      type: Boolean
+    },
+    props: {
+      type: Object
+    },
+    tag: {
+      type: String,
+      default: "div"
+    },
+    event: {
+      type: String,
+      default: "hook:updated"
     }
   },
-  computed: {
-    position() {
-      const t = (this.value - this.$parent.min) / (this.$parent.max - this.$parent.min) * 100;
-      return t >= 0 && t <= 100 ? t : 0;
+  methods: {
+    refresh() {
+      this.$forceUpdate();
     },
-    hidden() {
-      return this.value === this.$parent.min || this.value === this.$parent.max;
+    isVueComponent() {
+      return this.component && this.component._isVue;
     }
   },
   created() {
-    if (!this.$parent.$data._isSlider)
-      throw this.$destroy(), new Error("You should wrap bSliderTick on a bSlider");
+    this.isVueComponent() && this.component.$on(this.event, this.refresh);
   },
-  methods: {
-    getTickStyle(t) {
-      return { left: `${t}%` };
-    }
+  beforeDestroy() {
+    this.isVueComponent() && this.component.$off(this.event, this.refresh);
+  },
+  render(t) {
+    if (this.isVueComponent())
+      return t(
+        this.tag,
+        {},
+        this.scoped ? this.component.$scopedSlots[this.name](this.props) : this.component.$slots[this.name]
+      );
   }
-};
-var Nt = function() {
-  var e = this, i = e._self._c;
-  return i("div", { staticClass: "c-slider-tick", class: { "is-tick-hidden": e.hidden }, style: e.getTickStyle(e.position) }, [e.$slots.default ? i("span", { staticClass: "c-slider-tick-label" }, [e._t("default")], 2) : e._e()]);
-}, Et = [], Lt = /* @__PURE__ */ o(
-  zt,
-  Nt,
-  Et,
-  !1,
-  null,
-  null,
-  null,
-  null
-);
-const Ht = Lt.exports, qt = {
-  name: "CSlider",
+}, qt = {
+  name: "CTabs",
   components: {
-    CSliderThumb: Mt,
-    CSliderTick: Ht
+    CSlotComponent: Ht
   },
   props: {
     value: {
-      type: [Number, Array],
-      default: 0
-    },
-    min: {
-      type: Number,
-      default: 0
-    },
-    max: {
-      type: Number,
-      default: 100
-    },
-    step: {
-      type: Number,
-      default: 1
+      type: [Number, String],
+      default: null
     },
+    expanded: Boolean,
     type: {
       type: String,
-      default: "primary"
-    },
-    size: String,
-    ticks: {
-      type: Boolean,
-      default: !1
+      default: null
     },
-    tooltip: {
-      type: Boolean,
-      default: !0
+    size: {
+      type: String,
+      default: null
     },
-    tooltipType: String,
-    rounded: {
-      type: Boolean,
-      default: !1
+    position: {
+      type: String,
+      validator(t) {
+        return ["left", "right", "center"].indexOf(t) > -1;
+      },
+      default: null
     },
-    disabled: {
+    animated: {
       type: Boolean,
-      default: !1
+      default: !0
     },
-    lazy: {
+    destroyOnHide: {
       type: Boolean,
       default: !1
     },
-    customFormatter: Function,
-    ariaLabel: [String, Array],
-    biggerSliderFocus: {
-      type: Boolean,
-      default: !1
-    }
+    vertical: Boolean,
+    multiline: Boolean
   },
   data() {
     return {
-      value1: null,
-      value2: null,
-      dragging: !1,
-      isRange: !1,
-      _isSlider: !0
-      // Used by Thumb and Tick
+      activeTab: 0,
+      defaultSlots: [],
+      contentHeight: 0,
+      isTransitioning: !1,
+      _isTabs: !0
+      // Used internally by TabItem
     };
   },
   computed: {
-    newTooltipType() {
-      return this.tooltipType ? this.tooltipType : this.type;
-    },
-    tickValues() {
-      if (!this.ticks || this.min > this.max || this.step === 0)
-        return [];
-      const t = [];
-      for (let e = this.min + this.step; e < this.max; e += this.step)
-        t.push(e);
-      return t;
-    },
-    minValue() {
-      return Math.min(this.value1, this.value2);
-    },
-    maxValue() {
-      return Math.max(this.value1, this.value2);
-    },
-    barSize() {
-      return this.isRange ? `${100 * (this.maxValue - this.minValue) / (this.max - this.min)}%` : `${100 * (this.value1 - this.min) / (this.max - this.min)}%`;
-    },
-    barStart() {
-      return this.isRange ? `${100 * (this.minValue - this.min) / (this.max - this.min)}%` : "0%";
-    },
-    precision() {
-      const t = [this.min, this.max, this.step].map((e) => {
-        const i = `${e}`.split(".")[1];
-        return i ? i.length : 0;
-      });
-      return Math.max(...t);
-    },
-    barStyle() {
+    mainClasses() {
       return {
-        width: this.barSize,
-        left: this.barStart
+        "is-fullwidth": this.expanded,
+        "is-vertical": this.vertical,
+        "is-multiline": this.multiline,
+        [`is-${this.position}`]: this.position && this.vertical
       };
     },
-    rootClasses() {
-      return {
-        "is-rounded": this.rounded,
-        "is-dragging": this.dragging,
-        "is-disabled": this.disabled,
-        "slider-focus": this.biggerSliderFocus
-      };
+    navClasses() {
+      return [
+        this.type,
+        {
+          [`is-${this.size}`]: !!this.size,
+          [`is-${this.position}`]: this.position && !this.vertical,
+          "is-fullwidth": this.expanded,
+          "is-toggle-rounded is-toggle": this.type === "is-toggle-rounded"
+        }
+      ];
+    },
+    tabItems() {
+      return this.defaultSlots.filter(
+        (t) => t.componentInstance && t.componentInstance.$data && t.componentInstance.$data._isTabItem
+      ).map((t) => t.componentInstance);
     }
   },
   watch: {
     /**
-     * When v-model is changed set the new active step.
+     * When v-model is changed set the new active tab.
      */
     value(t) {
-      this.setValues(t);
-    },
-    value1() {
-      this.onInternalValueUpdate();
-    },
-    value2() {
-      this.onInternalValueUpdate();
-    },
-    min() {
-      this.setValues(this.value);
+      const e = this.getIndexByValue(t, t);
+      this.changeTab(e);
     },
-    max() {
-      this.setValues(this.value);
+    /**
+     * When tab-items are updated, set active one.
+     */
+    tabItems() {
+      if (this.activeTab < this.tabItems.length) {
+        let t = this.activeTab;
+        this.tabItems.map((e, i) => {
+          e.isActive && (t = i, t < this.tabItems.length && (this.tabItems[t].isActive = !1));
+        }), this.tabItems[this.activeTab].isActive = !0;
+      } else
+        this.activeTab > 0 && this.changeTab(this.activeTab - 1);
     }
   },
-  created() {
-    this.isThumbReversed = !1, this.isTrackClickDisabled = !1, this.setValues(this.value);
+  mounted() {
+    this.activeTab = this.getIndexByValue(this.value || 0), this.activeTab < this.tabItems.length && (this.tabItems[this.activeTab].isActive = !0), this.refreshSlots();
   },
   methods: {
-    setValues(t) {
-      if (!(this.min > this.max))
-        if (Array.isArray(t)) {
-          this.isRange = !0;
-          const e = typeof t[0] != "number" || isNaN(t[0]) ? this.min : p(t[0], this.min, this.max), i = typeof t[1] != "number" || isNaN(t[1]) ? this.max : p(t[1], this.min, this.max);
-          this.value1 = this.isThumbReversed ? i : e, this.value2 = this.isThumbReversed ? e : i;
-        } else
-          this.isRange = !1, this.value1 = isNaN(t) ? this.min : p(t, this.min, this.max), this.value2 = null;
-    },
-    onInternalValueUpdate() {
-      this.isRange && (this.isThumbReversed = this.value1 > this.value2), (!this.lazy || !this.dragging) && this.emitValue("input"), this.dragging && this.emitValue("dragging");
-    },
-    sliderSize() {
-      return this.$refs.slider.getBoundingClientRect().width;
+    /**
+     * Change the active tab and emit change event.
+     */
+    changeTab(t) {
+      this.activeTab === t || this.tabItems[t] === void 0 || (this.activeTab < this.tabItems.length && this.tabItems[this.activeTab].deactivate(this.activeTab, t), this.tabItems[t].activate(this.activeTab, t), this.activeTab = t, this.$emit("change", this.getValueByIndex(t)));
     },
-    onSliderClick(t) {
-      if (this.disabled || this.isTrackClickDisabled)
-        return;
-      const e = this.$refs.slider.getBoundingClientRect().left, i = (t.clientX - e) / this.sliderSize() * 100, s = this.min + i * (this.max - this.min) / 100, n = Math.abs(s - this.value1);
-      if (this.isRange) {
-        const a = Math.abs(s - this.value2);
-        if (n <= a) {
-          if (n < this.step / 2)
-            return;
-          this.$refs.button1.setPosition(i);
-        } else {
-          if (a < this.step / 2)
-            return;
-          this.$refs.button2.setPosition(i);
-        }
-      } else {
-        if (n < this.step / 2)
-          return;
-        this.$refs.button1.setPosition(i);
-      }
-      this.emitValue("change");
+    /**
+     * Tab click listener, emit input event and change active tab.
+     */
+    tabClick(t) {
+      this.activeTab !== t && (this.$emit("input", this.getValueByIndex(t)), this.changeTab(t));
     },
-    onDragStart() {
-      this.dragging = !0, this.$emit("dragstart");
+    refreshSlots() {
+      this.defaultSlots = this.$slots.default || [];
     },
-    onDragEnd() {
-      this.isTrackClickDisabled = !0, setTimeout(() => {
-        this.isTrackClickDisabled = !1;
-      }, 0), this.dragging = !1, this.$emit("dragend"), this.lazy && this.emitValue("input");
+    getIndexByValue(t) {
+      const e = this.tabItems.map(
+        (i) => i.$options.propsData ? i.$options.propsData.value : void 0
+      ).indexOf(t);
+      return e >= 0 ? e : t;
     },
-    emitValue(t) {
-      this.$emit(
-        t,
-        this.isRange ? [this.minValue, this.maxValue] : this.value1
-      );
+    getValueByIndex(t) {
+      const { propsData: e } = this.tabItems[t].$options;
+      return e && e.value ? e.value : t;
     }
   }
 };
 var jt = function() {
   var e = this, i = e._self._c;
-  return i("div", { staticClass: "c-slider", class: [`is-${e.size}`, `is-${e.type}`, e.rootClasses], on: { click: e.onSliderClick } }, [i("div", { ref: "slider", staticClass: "c-slider-track" }, [i("div", { staticClass: "c-slider-fill", style: e.barStyle }), e.ticks ? e._l(e.tickValues, function(s, n) {
-    return i("CSliderTick", { key: n, attrs: { value: s } });
-  }) : e._e(), e._t("default"), i("CSliderThumb", { ref: "button1", attrs: { type: `is-${e.newTooltipType}`, tooltip: e.tooltip, "custom-formatter": e.customFormatter, "aria-valuenow": e.value1, "aria-valuemin": e.min, "aria-valuemax": e.max, "aria-label": Array.isArray(e.ariaLabel) ? e.ariaLabel[0] : e.ariaLabel, "aria-disabled": e.disabled, role: "slider", "aria-orientation": "horizontal" }, on: { dragstart: e.onDragStart, dragend: e.onDragEnd }, model: { value: e.value1, callback: function(s) {
-    e.value1 = s;
-  }, expression: "value1" } }), e.isRange ? i("CSliderThumb", { ref: "button2", attrs: { type: e.newTooltipType, tooltip: e.tooltip, "custom-formatter": e.customFormatter, "aria-valuenow": e.value2, "aria-valuemin": e.min, "aria-valuemax": e.max, "aria-label": Array.isArray(e.ariaLabel) ? e.ariaLabel[1] : "", "aria-disabled": e.disabled, role: "slider", "aria-orientation": "horizontal" }, on: { dragstart: e.onDragStart, dragend: e.onDragEnd }, model: { value: e.value2, callback: function(s) {
-    e.value2 = s;
-  }, expression: "value2" } }) : e._e()], 2)]);
+  return i("div", { staticClass: "c-tabs", class: e.mainClasses }, [i("nav", { staticClass: "tabs", class: e.navClasses }, [i("ul", e._l(e.tabItems, function(s, n) {
+    return i("li", { directives: [{ name: "show", rawName: "v-show", value: s.visible, expression: "tabItem.visible" }], key: n, class: {
+      "is-active": e.activeTab === n,
+      "is-disabled": s.disabled
+    } }, [s.$slots.header ? i("CSlotComponent", { attrs: { component: s, name: "header", tag: "a" }, nativeOn: { click: function(a) {
+      return e.tabClick(n);
+    } } }) : i("a", { on: { click: function(a) {
+      return e.tabClick(n);
+    } } }, [s.icon ? i("CIcon", { attrs: { size: e.size, type: s.icon } }) : e._e(), i("span", [e._v(e._s(s.label))])], 1)], 1);
+  }), 0)]), i("section", { staticClass: "tab-content", class: { "is-transitioning": e.isTransitioning } }, [e._t("default")], 2)]);
 }, Kt = [], Wt = /* @__PURE__ */ o(
   qt,
   jt,
   Kt,
   !1,
   null,
-  null,
-  null,
-  null
+  "e02a6440"
 );
 const B = Wt.exports;
 function oi(t) {
-  t.component(x.name, x), t.component("CAutocomplete", Ze), t.component(y.name, y), t.component(w.name, w), t.component(S.name, S), t.component(h.name, h), t.component(f.name, f), t.component($.name, $), t.component(_.name, _), t.component(k.name, k), t.component(D.name, D), t.component(V.name, V), t.component("CField", je), t.component(F.name, F), t.component(A.name, A), t.component(B.name, B);
+  t.component(D.name, D), t.component("CAutocomplete", Qe), t.component(y.name, y), t.component(S.name, S), t.component($.name, $), t.component(h.name, h), t.component(f.name, f), t.component(k.name, k), t.component(_.name, _), t.component(F.name, F), t.component(B.name, B), t.component(A.name, A), t.component("CField", de), t.component(w.name, w), t.component(x.name, x), t.component(V.name, V);
 }
 export {
-  je as C,
+  de as C,
   ri as S,
   oi as i
 };