@db-ux/v-core-components 3.0.1 → 3.0.2-copilot2-e7bf98b

package/dist/db-ux.es.js

@@ -517,8 +517,8 @@ const ao = Object.entries(sa).map(([, t]) => t), Ra = {
       return !!(e.validMessage ?? e.validation === "valid");
     }
     function r() {
-      var b, k, M;
-      !((b = w.value) != null && b.validity.valid) || e.validation === "invalid" ? (g.value = v.value, s.value = e.invalidMessage || ((k = w.value) == null ? void 0 : k.validationMessage) || te, me() && (T.value = s.value, Z(() => T.value = "", 1e3))) : h() && ((M = w.value) != null && M.validity.valid) && e.required ? (g.value = p.value, me() && (T.value = e.validMessage ?? ge, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? g.value = f.value : g.value = void 0;
+      var b, k, F;
+      !((b = w.value) != null && b.validity.valid) || e.validation === "invalid" ? (g.value = v.value, s.value = e.invalidMessage || ((k = w.value) == null ? void 0 : k.validationMessage) || te, me() && (T.value = s.value, Z(() => T.value = "", 1e3))) : h() && ((F = w.value) != null && F.validity.valid) && e.required ? (g.value = p.value, me() && (T.value = e.validMessage ?? ge, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? g.value = f.value : g.value = void 0;
     }
     function c(b) {
       e.onChange && e.onChange(b), de(o, b, "checked"), r();
@@ -548,9 +548,9 @@ const ao = Object.entries(sa).map(([, t]) => t), Ra = {
           disabled: n(V)(b.disabled, "disabled"),
           value: b.value,
           required: n(V)(b.required, "required"),
-          onChange: k[0] || (k[0] = async (M) => c(M)),
-          onBlur: k[1] || (k[1] = async (M) => L(M)),
-          onFocus: k[2] || (k[2] = async (M) => C(M)),
+          onChange: k[0] || (k[0] = async (F) => c(F)),
+          onBlur: k[1] || (k[1] = async (F) => L(F)),
+          onFocus: k[2] || (k[2] = async (F) => C(F)),
           "aria-describedby": b.ariaDescribedBy ?? g.value
         }, null, 40, Za),
         b.label ? (m(), S(W, { key: 0 }, [
@@ -1024,7 +1024,7 @@ const et = (t) => {
     function k(y) {
       e.onFocus && e.onFocus(y);
     }
-    function M() {
+    function F() {
       const y = e.dataList;
       return Array.from(
         (Va(y) ? y == null ? void 0 : y.map((X) => ({
@@ -1080,7 +1080,7 @@ const et = (t) => {
         key: 0,
         id: s.value
       }, [
-        (m(!0), S(W, null, ye(M(), (B) => (m(), S("option", {
+        (m(!0), S(W, null, ye(F(), (B) => (m(), S("option", {
           key: s.value + "-option-" + B.value,
           value: B.value
         }, $(B.label), 9, gt))), 128))
@@ -1351,7 +1351,7 @@ const et = (t) => {
   },
   emits: ["update:values"],
   setup(t, { emit: a }) {
-    const o = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), p = d(void 0), v = d(void 0), s = d(void 0), g = d(void 0), T = d(void 0), w = d(void 0), h = d(void 0), r = d("no-validation"), c = d(!1), L = d(void 0), C = d(""), b = d(void 0), k = d(""), M = d([]), y = d(!1), X = d(!1), B = d(0), F = d([]), oe = d([]), K = d(!1), _e = d(void 0), Le = d(0), Ce = d(void 0), Ve = d(void 0), Pe = d(void 0), qe = d(!1), Ee = d(!1), va = d(null), z = d(null), ve = d(null), Fe = d(null), Ue = d(null);
+    const o = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), p = d(void 0), v = d(void 0), s = d(void 0), g = d(void 0), T = d(void 0), w = d(void 0), h = d(void 0), r = d("no-validation"), c = d(!1), L = d(void 0), C = d(""), b = d(void 0), k = d(""), F = d([]), y = d(!1), X = d(!1), B = d(0), M = d([]), oe = d([]), K = d(!1), _e = d(void 0), Le = d(0), Ce = d(void 0), Ve = d(void 0), Pe = d(void 0), qe = d(!1), Ee = d(!1), va = d(null), z = d(null), ve = d(null), Fe = d(null), Ue = d(null);
     Y(() => {
       const l = e.id ?? `custom-select-${Q()}`;
       i.value = l, u.value = l + fe, f.value = l + pe, p.value = l + he, s.value = l + Ze, g.value = l + Qe, T.value = l + "-summary", w.value = l + Re, b.value = l + "-selected-labels", h.value = l + "-info", v.value = e.invalidMessage || te, typeof window < "u" && "IntersectionObserver" in window && (Ve.value = new IntersectionObserver((I) => {
@@ -1429,14 +1429,14 @@ const et = (t) => {
     ), D(
       () => [e.values],
       () => {
-        e.values && Array.isArray(e.values) && e.values !== F.value && (F.value = e.values ?? []);
+        e.values && Array.isArray(e.values) && e.values !== M.value && (M.value = e.values ?? []);
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [F.value, ve.value],
+      () => [M.value, ve.value],
       () => {
         ve.value && pa();
       },
@@ -1454,10 +1454,10 @@ const et = (t) => {
         flush: "post"
       }
     ), D(
-      () => [F.value, B.value],
+      () => [M.value, B.value],
       () => {
         var l, I;
-        ((l = F.value) == null ? void 0 : l.length) === 0 ? (qe.value = !1, Ee.value = !1) : ((I = F.value) == null ? void 0 : I.length) === B.value ? (Ee.value = !1, qe.value = !0) : F.value && (Ee.value = !0);
+        ((l = M.value) == null ? void 0 : l.length) === 0 ? (qe.value = !1, Ee.value = !1) : ((I = M.value) == null ? void 0 : I.length) === B.value ? (Ee.value = !1, qe.value = !0) : M.value && (Ee.value = !0);
       },
       {
         immediate: !0,
@@ -1486,13 +1486,13 @@ const et = (t) => {
         flush: "post"
       }
     ), D(
-      () => [e.options, F.value],
+      () => [e.options, M.value],
       () => {
         var l, I;
-        (l = e.options) != null && l.length && (M.value = (I = e.options) == null ? void 0 : I.filter(
+        (l = e.options) != null && l.length && (F.value = (I = e.options) == null ? void 0 : I.filter(
           (E) => {
             var j, le;
-            return !E.value || !((j = F.value) != null && j.includes) ? !1 : !E.isGroupTitle && ((le = F.value) == null ? void 0 : le.includes(E.value));
+            return !E.value || !((j = M.value) != null && j.includes) ? !1 : !E.isGroupTitle && ((le = M.value) == null ? void 0 : le.includes(E.value));
           }
         ));
       },
@@ -1502,7 +1502,7 @@ const et = (t) => {
       }
     ), D(
       () => [
-        M.value,
+        F.value,
         e.selectedType,
         e.amountText,
         e.selectedLabels,
@@ -1514,13 +1514,13 @@ const et = (t) => {
           C.value = e.selectedLabels;
           return;
         }
-        if ((l = M.value) != null && l.length) {
+        if ((l = F.value) != null && l.length) {
           if (e.transformSelectedLabels) {
-            const j = M.value, le = e.transformSelectedLabels;
+            const j = F.value, le = e.transformSelectedLabels;
             C.value = le(j);
             return;
           }
-          e.selectedType === "amount" ? C.value = e.amountText ? e.amountText : `${(I = M.value) == null ? void 0 : I.length} ${Da}` : C.value = (E = M.value) == null ? void 0 : E.map((j) => Ie(j)).join(", ");
+          e.selectedType === "amount" ? C.value = e.amountText ? e.amountText : `${(I = F.value) == null ? void 0 : I.length} ${Da}` : C.value = (E = F.value) == null ? void 0 : E.map((j) => Ie(j)).join(", ");
         } else
           C.value = "";
       },
@@ -1529,10 +1529,10 @@ const et = (t) => {
         flush: "post"
       }
     ), D(
-      () => [M.value],
+      () => [F.value],
       () => {
         var l;
-        e.onAmountChange && e.onAmountChange(((l = M.value) == null ? void 0 : l.length) ?? 0);
+        e.onAmountChange && e.onAmountChange(((l = F.value) == null ? void 0 : l.length) ?? 0);
       },
       {
         immediate: !0,
@@ -1583,7 +1583,7 @@ const et = (t) => {
     }
     function ga() {
       var l;
-      return (l = F.value) != null && l.length ? F.value.at(0) ?? "" : "";
+      return (l = M.value) != null && l.length ? M.value.at(0) ?? "" : "";
     }
     function He(l) {
       var E;
@@ -1599,10 +1599,10 @@ const et = (t) => {
     }
     function ba(l) {
       var I, E;
-      return l && ((I = F.value) != null && I.includes) ? (E = F.value) == null ? void 0 : E.includes(l) : !1;
+      return l && ((I = M.value) != null && I.includes) ? (E = M.value) == null ? void 0 : E.includes(l) : !1;
     }
     function ya(l) {
-      return e.removeTagsTexts && e.removeTagsTexts.length > l ? e.removeTagsTexts.at(l) : `${ia} ${M.value ? Ie(M.value[l]) : ""}`;
+      return e.removeTagsTexts && e.removeTagsTexts.length > l ? e.removeTagsTexts.at(l) : `${ia} ${F.value ? Ie(F.value[l]) : ""}`;
     }
     function wa(l, I) {
       I && I.stopPropagation(), Xe(l.value), De();
@@ -1676,7 +1676,7 @@ const et = (t) => {
       }
     }
     function $e(l) {
-      (/* @__PURE__ */ new Date()).getTime() - Le.value < 200 || (F.value = l, c.value = !0, e.onOptionSelected && e.onOptionSelected(l ?? []), de(
+      (/* @__PURE__ */ new Date()).getTime() - Le.value < 200 || (M.value = l, c.value = !0, e.onOptionSelected && e.onOptionSelected(l ?? []), de(
         o,
         {
           target: {
@@ -1688,11 +1688,11 @@ const et = (t) => {
     }
     function Xe(l) {
       var I;
-      l && (e.multiple ? (I = F.value) != null && I.includes(l) ? $e(F.value.filter((E) => E !== l)) : $e([...F.value || [], l]) : ($e([l]), Ae(void 0, !0)));
+      l && (e.multiple ? (I = M.value) != null && I.includes(l) ? $e(M.value.filter((E) => E !== l)) : $e([...M.value || [], l]) : ($e([l]), Ae(void 0, !0)));
     }
     function La(l) {
       var I;
-      if (l.stopPropagation(), ((I = F.value) == null ? void 0 : I.length) === B.value)
+      if (l.stopPropagation(), ((I = M.value) == null ? void 0 : I.length) === B.value)
         $e([]);
       else {
         const E = X.value && Ue.value ? Ue.value.value : void 0;
@@ -1818,7 +1818,7 @@ const et = (t) => {
                 id: b.value
               }, $(C.value), 9, _t)) : U("", !0),
               l.selectedType === "tag" ? (m(), S("div", Ct, [
-                (m(!0), S(W, null, ye(M.value, (O, be) => (m(), J(kt, {
+                (m(!0), S(W, null, ye(F.value, (O, be) => (m(), J(kt, {
                   key: be,
                   emphasis: "strong",
                   behavior: "removable",
@@ -1926,7 +1926,7 @@ const et = (t) => {
             }, 8, ["width"])
           ], 64)) : U("", !0)
         ], 40, $t),
-        (l.showClearSelection ?? !0) && ((le = F.value) != null && le.length) ? (m(), J(Se, {
+        (l.showClearSelection ?? !0) && ((le = M.value) != null && le.length) ? (m(), J(Se, {
           key: 0,
           icon: "cross",
           variant: "ghost",
@@ -3005,8 +3005,8 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
       () => [i.value, w.value],
       () => {
         if (i.value && w.value) {
-          const B = i.value + fe, F = i.value + Re;
-          u.value = B, f.value = i.value + pe, p.value = i.value + he, s.value = F, x(e.message, e.showMessage) ? g.value = B : g.value = F, L(), w.value = !1;
+          const B = i.value + fe, M = i.value + Re;
+          u.value = B, f.value = i.value + pe, p.value = i.value + he, s.value = M, x(e.message, e.showMessage) ? g.value = B : g.value = M, L(), w.value = !1;
         }
       },
       {
@@ -3027,8 +3027,8 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
       return !!(e.validMessage ?? e.validation === "valid");
     }
     function L() {
-      var B, F, oe;
-      !((B = r.value) != null && B.validity.valid) || e.validation === "invalid" ? (g.value = p.value, v.value = e.invalidMessage || ((F = r.value) == null ? void 0 : F.validationMessage) || te, me() && (h.value = v.value, Z(() => h.value = "", 1e3))) : c() && ((oe = r.value) != null && oe.validity.valid) && e.required ? (g.value = f.value, me() && (h.value = e.validMessage ?? ge, Z(() => h.value = "", 1e3))) : x(e.message, e.showMessage) ? g.value = u.value : g.value = s.value;
+      var B, M, oe;
+      !((B = r.value) != null && B.validity.valid) || e.validation === "invalid" ? (g.value = p.value, v.value = e.invalidMessage || ((M = r.value) == null ? void 0 : M.validationMessage) || te, me() && (h.value = v.value, Z(() => h.value = "", 1e3))) : c() && ((oe = r.value) != null && oe.validity.valid) && e.required ? (g.value = f.value, me() && (h.value = e.validMessage ?? ge, Z(() => h.value = "", 1e3))) : x(e.message, e.showMessage) ? g.value = u.value : g.value = s.value;
     }
     function C(B) {
       e.onClick && e.onClick(B);
@@ -3039,17 +3039,17 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
     function k(B) {
       e.onChange && e.onChange(B), de(o, B), L();
     }
-    function M(B) {
+    function F(B) {
       e.onBlur && e.onBlur(B);
     }
     function y(B) {
       e.onFocus && e.onFocus(B);
     }
     function X(B) {
-      var F;
-      return B.label ?? ((F = B.value) == null ? void 0 : F.toString());
+      var M;
+      return B.label ?? ((M = B.value) == null ? void 0 : M.toString());
     }
-    return (B, F) => {
+    return (B, M) => {
       var oe;
       return m(), S("div", {
         class: P(n(q)("db-select", e.class)),
@@ -3073,14 +3073,14 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
           value: B.value ?? T.value,
           autocomplete: B.autocomplete,
           multiple: B.multiple,
-          onInput: F[0] || (F[0] = async (K) => b(K)),
-          onClick: F[1] || (F[1] = async (K) => C(K)),
-          onChange: F[2] || (F[2] = async (K) => k(K)),
-          onBlur: F[3] || (F[3] = async (K) => M(K)),
-          onFocus: F[4] || (F[4] = async (K) => y(K)),
+          onInput: M[0] || (M[0] = async (K) => b(K)),
+          onClick: M[1] || (M[1] = async (K) => C(K)),
+          onChange: M[2] || (M[2] = async (K) => k(K)),
+          onBlur: M[3] || (M[3] = async (K) => F(K)),
+          onFocus: M[4] || (M[4] = async (K) => y(K)),
           "aria-describedby": B.ariaDescribedBy ?? g.value
         }, [
-          F[5] || (F[5] = _("option", { hidden: !0 }, null, -1)),
+          M[5] || (M[5] = _("option", { hidden: !0 }, null, -1)),
           (oe = B.options) != null && oe.length ? (m(!0), S(W, { key: 0 }, ye(B.options, (K, _e) => (m(), S(W, { key: _e }, [
             K.options ? (m(), S("optgroup", {
               key: 0,
@@ -3473,11 +3473,11 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
           )
         );
         for (const b of L) {
-          const k = L.indexOf(b), M = b.querySelector("label"), y = b.querySelector("input");
-          if (y && M) {
+          const k = L.indexOf(b), F = b.querySelector("label"), y = b.querySelector("input");
+          if (y && F) {
             if (!y.id) {
               const X = `${e.value}-tab-${k}`;
-              M.setAttribute("for", X), y.id = X, y.setAttribute("name", e.value), C.length > k && y.setAttribute(
+              F.setAttribute("for", X), y.id = X, y.setAttribute("name", e.value), C.length > k && y.setAttribute(
                 "aria-controls",
                 `${e.value}-tab-panel-${k}`
               );
@@ -3496,19 +3496,20 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
       }
     }
     function r(c) {
-      var k;
-      c.stopPropagation();
-      const L = (k = c.target) == null ? void 0 : k.closest;
-      if (!L) return;
-      const C = L("ul"), b = (
-        // db-tab-item for angular and stencil wrapping elements
-        L("db-tab-item") ?? L("li")
-      );
-      if (C !== null && b !== null) {
-        const M = Array.from(C.childNodes).indexOf(b);
-        a.onIndexChange && a.onIndexChange(M);
+      var L;
+      if (c.stopPropagation(), c.target) {
+        const b = c.target.parentElement;
+        if (b && b.parentElement && ((L = b.parentElement) == null ? void 0 : L.nodeName) === "LI") {
+          const k = b.parentElement;
+          if (k) {
+            const F = k.parentElement;
+            if (F) {
+              const y = Array.from(F.childNodes).indexOf(k);
+              a.onIndexChange && a.onIndexChange(y), a.onTabSelect && a.onTabSelect(c);
+            }
+          }
+        }
       }
-      a.onTabSelect && a.onTabSelect(c);
     }
     return (c, L) => (m(), S("div", {
       ref_key: "_ref",
@@ -3519,7 +3520,8 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
       "data-scroll-behavior": c.behavior,
       "data-alignment": c.alignment ?? "start",
       "data-width": c.width ?? "auto",
-      onInput: L[0] || (L[0] = async (C) => r(C))
+      onInput: L[0] || (L[0] = async (C) => r(C)),
+      onChange: L[1] || (L[1] = async (C) => r(C))
     }, [
       u.value ? (m(), J(Se, {
         key: 0,
@@ -3530,11 +3532,11 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
         noText: !0,
         onClick: (C) => T(!0)
       }, {
-        default: H(() => L[1] || (L[1] = [
-          N(" Scroll left ")
+        default: H(() => L[2] || (L[2] = [
+          N(" Scroll left ", -1)
         ])),
         _: 1,
-        __: [1]
+        __: [2]
       }, 8, ["onClick"])) : U("", !0),
       c.tabs ? (m(), S(W, { key: 1 }, [
         ee(zi, null, {
@@ -3569,11 +3571,11 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
         noText: !0,
         onClick: (C) => T()
       }, {
-        default: H(() => L[2] || (L[2] = [
-          N(" Scroll right ")
+        default: H(() => L[3] || (L[3] = [
+          N(" Scroll right ", -1)
         ])),
         _: 1,
-        __: [2]
+        __: [3]
       }, 8, ["onClick"])) : U("", !0),
       A(c.$slots, "default")
     ], 42, qi));
@@ -3671,8 +3673,8 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
       return !!(e.validMessage ?? e.validation === "valid");
     }
     function r() {
-      var k, M, y;
-      !((k = w.value) != null && k.validity.valid) || e.validation === "invalid" ? (s.value = p.value, v.value = e.invalidMessage || ((M = w.value) == null ? void 0 : M.validationMessage) || te, me() && (T.value = v.value, Z(() => T.value = "", 1e3))) : h() && ((y = w.value) != null && y.validity.valid) && (e.required || e.minLength || e.maxLength) ? (s.value = f.value, me() && (T.value = e.validMessage ?? ge, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? s.value = u.value : s.value = void 0;
+      var k, F, y;
+      !((k = w.value) != null && k.validity.valid) || e.validation === "invalid" ? (s.value = p.value, v.value = e.invalidMessage || ((F = w.value) == null ? void 0 : F.validationMessage) || te, me() && (T.value = v.value, Z(() => T.value = "", 1e3))) : h() && ((y = w.value) != null && y.validity.valid) && (e.required || e.minLength || e.maxLength) ? (s.value = f.value, me() && (T.value = e.validMessage ?? ge, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? s.value = u.value : s.value = void 0;
     }
     function c(k) {
       e.input && e.input(k), g.value = k.target.value, e.onInput && e.onInput(k), de(o, k), r();
@@ -3686,7 +3688,7 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
     function b(k) {
       e.onFocus && e.onFocus(k);
     }
-    return (k, M) => (m(), S("div", {
+    return (k, F) => (m(), S("div", {
       class: P(n(q)("db-textarea", e.class)),
       "data-variant": k.variant,
       "data-hide-asterisk": n(ie)(k.showRequiredAsterisk),
@@ -3712,10 +3714,10 @@ const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-hea
         wrap: k.wrap,
         spellcheck: k.spellCheck,
         autocomplete: k.autocomplete,
-        onInput: M[0] || (M[0] = async (y) => c(y)),
-        onChange: M[1] || (M[1] = async (y) => L(y)),
-        onBlur: M[2] || (M[2] = async (y) => C(y)),
-        onFocus: M[3] || (M[3] = async (y) => b(y)),
+        onInput: F[0] || (F[0] = async (y) => c(y)),
+        onChange: F[1] || (F[1] = async (y) => L(y)),
+        onBlur: F[2] || (F[2] = async (y) => C(y)),
+        onFocus: F[3] || (F[3] = async (y) => b(y)),
         value: k.value ?? g.value,
         "aria-describedby": k.ariaDescribedBy ?? s.value,
         placeholder: k.placeholder ?? n(ta),