@db-ux/v-core-components 3.0.0 → 3.0.2

package/dist/db-ux.es.js

@@ -1,30 +1,30 @@
-var La = Object.defineProperty;
-var Ta = (t, a, l) => a in t ? La(t, a, { enumerable: !0, configurable: !0, writable: !0, value: l }) : t[a] = l;
-var ne = (t, a, l) => Ta(t, typeof a != "symbol" ? a + "" : a, l);
-import { defineComponent as P, ref as d, onMounted as Y, watch as D, createElementBlock as B, openBlock as g, normalizeClass as z, unref as n, createElementVNode as _, createCommentVNode as V, renderSlot as A, Fragment as U, createTextVNode as N, toDisplayString as L, renderList as be, createBlock as Q, createVNode as ee, withCtx as W, onUnmounted as _a } from "vue";
-const Le = "OVERWRITE_DEFAULT_ID", ke = "LABEL SHOULD BE SET", aa = " ", Ca = "MESSAGE SHOULD BE SET", Je = "-label", Qe = "-select", ve = "-message", fe = "-valid-message", pe = "-invalid-message", Re = "-placeholder", Ze = "-datalist", he = "TODO: Add a validMessage", te = "TODO: Add an invalidMessage", ta = "Remove", Ea = "Back", Aa = "Selected", Da = "BurgerMenu", Na = "brand", Fa = 4, Ge = "Close", Ki = "density", Ji = "color";
-var ia = /* @__PURE__ */ ((t) => (t.FUNCTIONAL = "functional", t.REGULAR = "regular", t.EXPRESSIVE = "expressive", t))(ia || {});
-const Qi = Object.entries(ia).map(([, t]) => t);
-var la = /* @__PURE__ */ ((t) => (t.PRIMARY = "primary", t))(la || {}), oa = /* @__PURE__ */ ((t) => (t.NEUTRAL_BG_LEVEL_1 = "neutral-bg-basic-level-1", t.NEUTRAL_BG_LEVEL_2 = "neutral-bg-basic-level-2", t.NEUTRAL_BG_LEVEL_3 = "neutral-bg-basic-level-3", t.NEUTRAL_BG_TRANSPARENT_SEMI = "neutral-bg-basic-transparent-semi", t.NEUTRAL_BG_TRANSPARENT_FULL = "neutral-bg-basic-transparent-full", t.BRAND_BG_LEVEL_1 = "brand-bg-basic-level-1", t.BRAND_BG_LEVEL_2 = "brand-bg-basic-level-2", t.BRAND_BG_LEVEL_3 = "brand-bg-basic-level-3", t.BRAND_BG_TRANSPARENT_SEMI = "brand-bg-basic-transparent-semi", t.BRAND_BG_TRANSPARENT_FULL = "brand-bg-basic-transparent-full", t.SUCCESSFUL_BG_LEVEL_1 = "successful-bg-basic-level-1", t.SUCCESSFUL_BG_LEVEL_2 = "successful-bg-basic-level-2", t.SUCCESSFUL_BG_LEVEL_3 = "successful-bg-basic-level-3", t.SUCCESSFUL_BG_TRANSPARENT_SEMI = "successful-bg-basic-transparent-semi", t.SUCCESSFUL_BG_TRANSPARENT_FULL = "successful-bg-basic-transparent-full", t.CRITICAL_BG_LEVEL_1 = "critical-bg-basic-level-1", t.CRITICAL_BG_LEVEL_2 = "critical-bg-basic-level-2", t.CRITICAL_BG_LEVEL_3 = "critical-bg-basic-level-3", t.CRITICAL_BG_TRANSPARENT_SEMI = "critical-bg-basic-transparent-semi", t.CRITICAL_BG_TRANSPARENT_Full = "critical-bg-basic-transparent-full", t.WARNING_BG_LEVEL_1 = "warning-bg-basic-level-1", t.WARNING_BG_LEVEL_2 = "warning-bg-basic-level-2", t.WARNING_BG_LEVEL_3 = "warning-bg-basic-level-3", t.WARNING_BG_TRANSPARENT_SEMI = "warning-bg-basic-transparent-semi", t.WARNING_BG_TRANSPARENT_FULL = "warning-bg-basic-transparent-full", t.INFORMATIONAL_BG_LEVEL_1 = "informational-bg-basic-level-1", t.INFORMATIONAL_BG_LEVEL_2 = "informational-bg-basic-level-2", t.INFORMATIONAL_BG_LEVEL_3 = "informational-bg-basic-level-3", t.INFORMATIONAL_BG_TRANSPARENT_SEMI = "informational-bg-basic-transparent-semi", t.INFORMATIONAL_BG_TRANSPARENT_FULL = "informational-bg-basic-transparent-full", t))(oa || {});
-const Zi = Object.entries(oa).map(([, t]) => t), xi = Object.entries(la).map(([, t]) => t);
-var na = /* @__PURE__ */ ((t) => (t.CRITICAL = "critical", t.INFORMATIONAL = "informational", t.WARNING = "warning", t.SUCCESSFUL = "successful", t))(na || {});
-const el = Object.entries(na).map(([, t]) => t), Ma = {
+var Ta = Object.defineProperty;
+var _a = (t, a, o) => a in t ? Ta(t, a, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[a] = o;
+var ne = (t, a, o) => _a(t, typeof a != "symbol" ? a + "" : a, o);
+import { defineComponent as G, ref as d, onMounted as Y, watch as D, createElementBlock as S, openBlock as m, normalizeClass as P, unref as n, createElementVNode as _, createCommentVNode as U, renderSlot as A, Fragment as W, createTextVNode as N, toDisplayString as $, renderList as ye, createBlock as J, createVNode as ee, withCtx as H, onUnmounted as Ca } from "vue";
+const Te = "OVERWRITE_DEFAULT_ID", we = "LABEL SHOULD BE SET", ta = " ", Ea = "MESSAGE SHOULD BE SET", Qe = "-label", Ze = "-select", fe = "-message", pe = "-valid-message", he = "-invalid-message", Re = "-placeholder", xe = "-datalist", ge = "TODO: Add a validMessage", te = "TODO: Add an invalidMessage", ia = "Remove", Aa = "Back", Da = "Selected", Na = "BurgerMenu", Fa = "brand", Ma = 4, We = "Close", Ji = "density", Qi = "color";
+var oa = /* @__PURE__ */ ((t) => (t.FUNCTIONAL = "functional", t.REGULAR = "regular", t.EXPRESSIVE = "expressive", t))(oa || {});
+const Zi = Object.entries(oa).map(([, t]) => t);
+var la = /* @__PURE__ */ ((t) => (t.PRIMARY = "primary", t))(la || {}), na = /* @__PURE__ */ ((t) => (t.NEUTRAL_BG_LEVEL_1 = "neutral-bg-basic-level-1", t.NEUTRAL_BG_LEVEL_2 = "neutral-bg-basic-level-2", t.NEUTRAL_BG_LEVEL_3 = "neutral-bg-basic-level-3", t.NEUTRAL_BG_TRANSPARENT_SEMI = "neutral-bg-basic-transparent-semi", t.NEUTRAL_BG_TRANSPARENT_FULL = "neutral-bg-basic-transparent-full", t.BRAND_BG_LEVEL_1 = "brand-bg-basic-level-1", t.BRAND_BG_LEVEL_2 = "brand-bg-basic-level-2", t.BRAND_BG_LEVEL_3 = "brand-bg-basic-level-3", t.BRAND_BG_TRANSPARENT_SEMI = "brand-bg-basic-transparent-semi", t.BRAND_BG_TRANSPARENT_FULL = "brand-bg-basic-transparent-full", t.SUCCESSFUL_BG_LEVEL_1 = "successful-bg-basic-level-1", t.SUCCESSFUL_BG_LEVEL_2 = "successful-bg-basic-level-2", t.SUCCESSFUL_BG_LEVEL_3 = "successful-bg-basic-level-3", t.SUCCESSFUL_BG_TRANSPARENT_SEMI = "successful-bg-basic-transparent-semi", t.SUCCESSFUL_BG_TRANSPARENT_FULL = "successful-bg-basic-transparent-full", t.CRITICAL_BG_LEVEL_1 = "critical-bg-basic-level-1", t.CRITICAL_BG_LEVEL_2 = "critical-bg-basic-level-2", t.CRITICAL_BG_LEVEL_3 = "critical-bg-basic-level-3", t.CRITICAL_BG_TRANSPARENT_SEMI = "critical-bg-basic-transparent-semi", t.CRITICAL_BG_TRANSPARENT_Full = "critical-bg-basic-transparent-full", t.WARNING_BG_LEVEL_1 = "warning-bg-basic-level-1", t.WARNING_BG_LEVEL_2 = "warning-bg-basic-level-2", t.WARNING_BG_LEVEL_3 = "warning-bg-basic-level-3", t.WARNING_BG_TRANSPARENT_SEMI = "warning-bg-basic-transparent-semi", t.WARNING_BG_TRANSPARENT_FULL = "warning-bg-basic-transparent-full", t.INFORMATIONAL_BG_LEVEL_1 = "informational-bg-basic-level-1", t.INFORMATIONAL_BG_LEVEL_2 = "informational-bg-basic-level-2", t.INFORMATIONAL_BG_LEVEL_3 = "informational-bg-basic-level-3", t.INFORMATIONAL_BG_TRANSPARENT_SEMI = "informational-bg-basic-transparent-semi", t.INFORMATIONAL_BG_TRANSPARENT_FULL = "informational-bg-basic-transparent-full", t))(na || {});
+const xi = Object.entries(na).map(([, t]) => t), eo = Object.entries(la).map(([, t]) => t);
+var sa = /* @__PURE__ */ ((t) => (t.CRITICAL = "critical", t.INFORMATIONAL = "informational", t.WARNING = "warning", t.SUCCESSFUL = "successful", t))(sa || {});
+const ao = Object.entries(sa).map(([, t]) => t), Ra = {
   width: 390,
   height: 884
-}, Ra = {
+}, za = {
   width: 1920,
   height: 1280
-}, al = [{
+}, to = [{
   name: "desktop",
-  ...Ra
+  ...za
 }, {
   name: "tablet",
   width: 768,
   height: 1024
 }, {
   name: "mobile",
-  ...Ma
-}], J = () => {
+  ...Ra
+}], Q = () => {
   var t, a;
   if (typeof window < "u") {
     if ((t = window.crypto) != null && t.randomUUID)
@@ -33,37 +33,37 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
       return window.crypto.getRandomValues(new Uint32Array(3)).join("-");
   }
   return Math.random().toString().substring(2);
-}, sa = (t, a) => {
-  const l = t.children;
-  Object.values(l).forEach((e) => {
-    e.setAttribute(a.key, a.value), e.children.length > 0 && sa(e, a);
+}, da = (t, a) => {
+  const o = t.children;
+  Object.values(o).forEach((e) => {
+    e.setAttribute(a.key, a.value), e.children.length > 0 && da(e, a);
   });
 }, q = (...t) => {
   let a = "";
-  for (const l of t)
-    if (l)
-      if (typeof l == "string")
-        a += `${l} `;
+  for (const o of t)
+    if (o)
+      if (typeof o == "string")
+        a += `${o} `;
       else
-        for (const e in l)
-          l[e] && (a += `${e} `);
+        for (const e in o)
+          o[e] && (a += `${e} `);
   return a.trim();
-}, za = (t) => Array.isArray(t) && t.every((a) => typeof a == "string"), qa = ["Mac", "iPhone", "iPad", "iPod"], ge = () => typeof window < "u" && qa.some((t) => window.navigator.userAgent.includes(t)), Z = (t, a) => new Promise(() => setTimeout(t, a)), F = (t) => {
+}, Va = (t) => Array.isArray(t) && t.every((a) => typeof a == "string"), Pa = ["Mac", "iPhone", "iPad", "iPod"], me = () => typeof window < "u" && Pa.some((t) => window.navigator.userAgent.includes(t)), Z = (t, a) => new Promise(() => setTimeout(t, a)), R = (t) => {
   if (t != null)
     return String(typeof t == "string" ? !!t : t);
-}, R = (t, a) => {
+}, V = (t, a) => {
   if (t != null)
     return typeof t == "string" && a ? !!(a === t || t) : !!t;
-}, Se = (t, a) => {
+}, ke = (t, a) => {
   if (!(t == null && a == null))
     return Number(t ?? a);
-}, xe = (t, a) => a && ["number", "range"].includes(a) ? Se(t) : t, ie = (t) => {
+}, ea = (t, a) => a && ["number", "range"].includes(a) ? ke(t) : t, ie = (t) => {
   if (t != null)
-    return F(!t);
-}, x = (t, a) => (a === void 0 || !!a) && !!t, ea = (t) => t.querySelector('input[type="search"]'), tl = (t, a) => {
-  const l = t.id ?? t.value ?? J();
-  return `${a}${l}`;
-}, Va = (t) => t.key !== void 0, Pa = ["id"], Ua = ["aria-disabled", "name", "open"], Ga = /* @__PURE__ */ P({
+    return R(!t);
+}, x = (t, a) => (a === void 0 || !!a) && !!t, aa = (t) => t.querySelector('input[type="search"]'), io = (t, a) => {
+  const o = t.id ?? t.value ?? Q();
+  return `${a}${o}`;
+}, qa = (t) => t.key !== void 0, Ua = ["id"], Ga = ["aria-disabled", "name", "open"], Wa = /* @__PURE__ */ G({
   __name: "accordion-item",
   props: {
     defaultOpen: { type: Boolean, default: void 0 },
@@ -81,9 +81,9 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     name: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(!1), i = d(void 0), u = d(!1), f = d(null);
+    const a = t, o = d(Te), e = d(!1), i = d(void 0), u = d(!1), f = d(null);
     Y(() => {
-      l.value = a.id || "accordion-item-" + J(), a.defaultOpen && (e.value = a.defaultOpen), u.value = !0;
+      o.value = a.id || "accordion-item-" + Q(), a.defaultOpen && (e.value = a.defaultOpen), u.value = !0;
     }), D(
       () => [f.value, u.value],
       () => {
@@ -103,39 +103,39 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
         flush: "post"
       }
     );
-    function m(r) {
-      r == null || r.preventDefault();
+    function p(v) {
+      v == null || v.preventDefault();
       const s = !e.value;
       a.onToggle && a.onToggle(s), e.value = s;
     }
-    return (r, s) => (g(), B("li", {
-      id: l.value,
-      class: z(n(q)("db-accordion-item", a.class))
+    return (v, s) => (m(), S("li", {
+      id: o.value,
+      class: P(n(q)("db-accordion-item", a.class))
     }, [
       _("details", {
-        "aria-disabled": n(F)(r.disabled),
+        "aria-disabled": n(R)(v.disabled),
         ref_key: "_ref",
         ref: f,
         name: i.value,
         open: e.value
       }, [
         _("summary", {
-          onClick: s[0] || (s[0] = async (p) => m(p))
+          onClick: s[0] || (s[0] = async (g) => p(g))
         }, [
-          r.headlinePlain ? (g(), B(U, { key: 0 }, [
-            N(L(r.headlinePlain), 1)
-          ], 64)) : V("", !0),
-          r.headlinePlain ? V("", !0) : A(r.$slots, "headline", { key: 1 })
+          v.headlinePlain ? (m(), S(W, { key: 0 }, [
+            N($(v.headlinePlain), 1)
+          ], 64)) : U("", !0),
+          v.headlinePlain ? U("", !0) : A(v.$slots, "headline", { key: 1 })
         ]),
         _("div", null, [
-          r.text ? (g(), B(U, { key: 0 }, [
-            N(L(r.text), 1)
-          ], 64)) : A(r.$slots, "default", { key: 1 })
+          v.text ? (m(), S(W, { key: 0 }, [
+            N($(v.text), 1)
+          ], 64)) : A(v.$slots, "default", { key: 1 })
         ])
-      ], 8, Ua)
-    ], 10, Pa));
+      ], 8, Ga)
+    ], 10, Ua));
   }
-}), Wa = ["id", "data-variant"], il = /* @__PURE__ */ P({
+}), Oa = ["id", "data-variant"], oo = /* @__PURE__ */ G({
   __name: "accordion",
   props: {
     behavior: { default: void 0 },
@@ -151,13 +151,13 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(""), i = d(!1), u = d(!1), f = d(null);
+    const a = t, o = d(Te), e = d(""), i = d(!1), u = d(!1), f = d(null);
     Y(() => {
-      l.value = a.id || "accordion-" + J(), i.value = !0, u.value = !0;
+      o.value = a.id || "accordion-" + Q(), i.value = !0, u.value = !0;
     }), D(
-      () => [i.value, a.name, a.behavior, l.value],
+      () => [i.value, a.name, a.behavior, o.value],
       () => {
-        i.value && (a.behavior === "single" ? a.name ? e.value !== a.name && (e.value = a.name) : e.value !== l.value && l.value && (e.value = l.value) : e.value = "");
+        i.value && (a.behavior === "single" ? a.name ? e.value !== a.name && (e.value = a.name) : e.value !== o.value && o.value && (e.value = o.value) : e.value = "");
       },
       {
         immediate: !0,
@@ -167,9 +167,9 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
       () => [f.value, e.value],
       () => {
         if (f.value) {
-          const r = f.value.getElementsByTagName("details");
-          if (r)
-            for (const s of Array.from(r))
+          const v = f.value.getElementsByTagName("details");
+          if (v)
+            for (const s of Array.from(v))
               e.value === "" ? s.removeAttribute("name") : s.name = e.value ?? "";
         }
       },
@@ -182,12 +182,12 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
       () => {
         if (f.value && u.value) {
           if (a.initOpenIndex && a.initOpenIndex.length > 0) {
-            const r = f.value.getElementsByTagName("details");
-            if (r) {
+            const v = f.value.getElementsByTagName("details");
+            if (v) {
               const s = a.behavior === "single" && a.initOpenIndex.length > 1 ? [a.initOpenIndex[0]] : a.initOpenIndex;
-              Array.from(r).forEach(
-                (p, T) => {
-                  s != null && s.includes(T) && (p.open = !0);
+              Array.from(v).forEach(
+                (g, T) => {
+                  s != null && s.includes(T) && (g.open = !0);
                 }
               );
             }
@@ -200,31 +200,31 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
         flush: "post"
       }
     );
-    function m() {
+    function p() {
       try {
         return typeof a.items == "string" ? JSON.parse(a.items) : a.items;
-      } catch (r) {
-        console.error(r);
+      } catch (v) {
+        console.error(v);
       }
       return [];
     }
-    return (r, s) => (g(), B("ul", {
+    return (v, s) => (m(), S("ul", {
       ref_key: "_ref",
       ref: f,
-      id: l.value,
-      class: z(n(q)("db-accordion", a.class)),
-      "data-variant": r.variant
+      id: o.value,
+      class: P(n(q)("db-accordion", a.class)),
+      "data-variant": v.variant
     }, [
-      r.items ? V("", !0) : A(r.$slots, "default", { key: 0 }),
-      r.items ? (g(!0), B(U, { key: 1 }, be(m(), (p, T) => (g(), Q(Ga, {
+      v.items ? U("", !0) : A(v.$slots, "default", { key: 0 }),
+      v.items ? (m(!0), S(W, { key: 1 }, ye(p(), (g, T) => (m(), J(Wa, {
         key: `accordion-item-${T}`,
-        headlinePlain: p.headlinePlain,
-        disabled: p.disabled,
-        text: p.text
-      }, null, 8, ["headlinePlain", "disabled", "text"]))), 128)) : V("", !0)
-    ], 10, Wa));
+        headlinePlain: g.headlinePlain,
+        disabled: g.disabled,
+        text: g.text
+      }, null, 8, ["headlinePlain", "disabled", "text"]))), 128)) : U("", !0)
+    ], 10, Oa));
   }
-}), Oa = ["id", "data-semantic", "data-size", "data-emphasis", "data-placement", "data-label"], ll = /* @__PURE__ */ P({
+}), lo = ["divider", "card"], no = ["multiple", "single"], Ha = ["id", "data-semantic", "data-size", "data-emphasis", "data-placement", "data-label"], so = /* @__PURE__ */ G({
   __name: "badge",
   props: {
     placement: { default: void 0 },
@@ -240,14 +240,14 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(!1), e = d(null);
+    const a = t, o = d(!1), e = d(null);
     return Y(() => {
-      l.value = !0;
+      o.value = !0;
     }), D(
-      () => [e.value, l.value],
+      () => [e.value, o.value],
       () => {
         var i;
-        if (e.value && l.value && (i = a.placement) != null && i.startsWith("corner")) {
+        if (e.value && o.value && (i = a.placement) != null && i.startsWith("corner")) {
           let u = e.value.parentElement;
           u && u.localName.includes("badge") && (u = u.parentElement), u && (u.dataset.hasBadge = "true");
         }
@@ -258,24 +258,24 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
       }
     ), (i, u) => {
       var f;
-      return g(), B("span", {
+      return m(), S("span", {
         ref_key: "_ref",
         ref: e,
         id: i.id,
-        class: z(n(q)("db-badge", a.class)),
+        class: P(n(q)("db-badge", a.class)),
         "data-semantic": i.semantic,
         "data-size": i.size,
         "data-emphasis": i.emphasis,
         "data-placement": i.placement,
-        "data-label": ((f = i.placement) == null ? void 0 : f.startsWith("corner")) && (i.label ?? n(ke))
+        "data-label": ((f = i.placement) == null ? void 0 : f.startsWith("corner")) && (i.label ?? n(we))
       }, [
-        i.text ? (g(), B(U, { key: 0 }, [
-          N(L(i.text), 1)
+        i.text ? (m(), S(W, { key: 0 }, [
+          N($(i.text), 1)
         ], 64)) : A(i.$slots, "default", { key: 1 })
-      ], 10, Oa);
+      ], 10, Ha);
     };
   }
-}), Ha = ["data-icon", "data-show-icon", "id"], ol = /* @__PURE__ */ P({
+}), uo = ["inline", "corner-top-left", "corner-top-right", "corner-center-left", "corner-center-right", "corner-bottom-left", "corner-bottom-right"], Xa = ["data-icon", "data-show-icon", "id"], ro = /* @__PURE__ */ G({
   __name: "brand",
   props: {
     hideLogo: { type: Boolean, default: void 0 },
@@ -289,21 +289,21 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("div", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("div", {
       ref_key: "_ref",
-      ref: l,
-      "data-icon": e.hideLogo ? "none" : e.icon ?? n(Na),
-      "data-show-icon": n(F)(e.showIcon),
+      ref: o,
+      "data-icon": e.hideLogo ? "none" : e.icon ?? n(Fa),
+      "data-show-icon": n(R)(e.showIcon),
       id: e.id,
-      class: z(n(q)("db-brand", a.class))
+      class: P(n(q)("db-brand", a.class))
     }, [
-      e.text ? (g(), B(U, { key: 0 }, [
-        N(L(e.text), 1)
+      e.text ? (m(), S(W, { key: 0 }, [
+        N($(e.text), 1)
       ], 64)) : A(e.$slots, "default", { key: 1 })
-    ], 10, Ha));
+    ], 10, Xa));
   }
-}), Xa = ["id", "type", "disabled", "data-icon", "data-show-icon", "data-icon-trailing", "data-show-icon-trailing", "data-size", "data-width", "data-variant", "data-no-text", "name", "form", "value"], Be = /* @__PURE__ */ P({
+}), ja = ["id", "type", "disabled", "data-icon", "data-show-icon", "data-icon-trailing", "data-show-icon-trailing", "data-size", "data-width", "data-variant", "data-no-text", "name", "form", "value"], Se = /* @__PURE__ */ G({
   __name: "button",
   props: {
     disabled: { type: [Boolean, String], default: void 0 },
@@ -330,39 +330,39 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     iconTrailing: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     function e() {
       return a.type ? a.type : a.onClick ? "button" : "submit";
     }
     function i(u) {
       a.onClick && a.onClick(u);
     }
-    return (u, f) => (g(), B("button", {
+    return (u, f) => (m(), S("button", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: u.id,
-      class: z(n(q)("db-button", a.class)),
+      class: P(n(q)("db-button", a.class)),
       type: e(),
-      disabled: n(R)(u.disabled, "disabled"),
+      disabled: n(V)(u.disabled, "disabled"),
       "data-icon": u.iconLeading ?? u.icon,
-      "data-show-icon": n(F)(u.showIconLeading ?? u.showIcon),
+      "data-show-icon": n(R)(u.showIconLeading ?? u.showIcon),
       "data-icon-trailing": u.iconTrailing,
-      "data-show-icon-trailing": n(F)(u.showIconTrailing),
+      "data-show-icon-trailing": n(R)(u.showIconTrailing),
       "data-size": u.size,
       "data-width": u.width,
       "data-variant": u.variant,
-      "data-no-text": n(F)(u.noText),
+      "data-no-text": n(R)(u.noText),
       name: u.name,
       form: u.form,
       value: u.value,
-      onClick: f[0] || (f[0] = async (m) => i(m))
+      onClick: f[0] || (f[0] = async (p) => i(p))
     }, [
-      u.text ? (g(), B(U, { key: 0 }, [
-        N(L(u.text), 1)
+      u.text ? (m(), S(W, { key: 0 }, [
+        N($(u.text), 1)
       ], 64)) : A(u.$slots, "default", { key: 1 })
-    ], 10, Xa));
+    ], 10, ja));
   }
-}), ja = ["id", "data-behavior", "data-elevation-level", "data-spacing"], nl = /* @__PURE__ */ P({
+}), co = ["outlined", "brand", "filled", "ghost"], vo = ["button", "reset", "submit"], Ya = ["id", "data-behavior", "data-elevation-level", "data-spacing"], fo = /* @__PURE__ */ G({
   __name: "card",
   props: {
     behavior: { default: void 0 },
@@ -376,26 +376,26 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     spacing: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     function e(i) {
       a.onClick && a.onClick(i);
     }
-    return (i, u) => (g(), B("div", {
+    return (i, u) => (m(), S("div", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: i.id,
-      class: z(n(q)("db-card", a.class)),
+      class: P(n(q)("db-card", a.class)),
       "data-behavior": i.behavior,
       "data-elevation-level": i.elevationLevel,
       "data-spacing": i.spacing,
       onClick: u[0] || (u[0] = async (f) => e(f))
     }, [
       A(i.$slots, "default")
-    ], 10, ja));
+    ], 10, Ya));
   }
-}), de = (t, a, l = "value") => {
-  t(`update:${l}`, a.target[l]);
-}, Ya = ["id", "data-icon", "data-semantic", "data-size", "data-show-icon-leading"], ae = /* @__PURE__ */ P({
+}), po = ["static", "interactive"], ho = ["1", "2", "3"], de = (t, a, o = "value") => {
+  t(`update:${o}`, a.target[o]);
+}, Ka = ["id", "data-icon", "data-semantic", "data-size", "data-show-icon-leading"], ae = /* @__PURE__ */ G({
   __name: "infotext",
   props: {
     children: { default: void 0 },
@@ -410,26 +410,26 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("span", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("span", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-infotext", a.class)),
+      class: P(n(q)("db-infotext", a.class)),
       "data-icon": e.icon,
       "data-semantic": e.semantic,
       "data-size": e.size,
-      "data-show-icon-leading": n(F)(e.showIcon ?? !0)
+      "data-show-icon-leading": n(R)(e.showIcon ?? !0)
     }, [
-      e.text ? (g(), B(U, { key: 0 }, [
-        N(L(e.text), 1)
+      e.text ? (m(), S(W, { key: 0 }, [
+        N($(e.text), 1)
       ], 64)) : A(e.$slots, "default", { key: 1 })
-    ], 10, Ya));
+    ], 10, Ka));
   }
-}), Ka = ["data-size", "data-hide-asterisk", "data-hide-label"], Ja = ["for"], Qa = ["aria-invalid", "data-custom-validity", "id", "name", "checked", "disabled", "value", "required", "aria-describedby"], Za = {
+}), Ja = ["data-size", "data-hide-asterisk", "data-hide-label"], Qa = ["for"], Za = ["aria-invalid", "data-custom-validity", "id", "name", "checked", "disabled", "value", "required", "aria-describedby"], xa = {
   "data-visually-hidden": "true",
   role: "status"
-}, sl = /* @__PURE__ */ P({
+}, go = /* @__PURE__ */ G({
   __name: "checkbox",
   props: {
     indeterminate: { type: [Boolean, String], default: void 0 },
@@ -467,16 +467,16 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
   },
   emits: ["update:checked"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(!1), u = d(void 0), f = d(void 0), m = d(void 0), r = d(void 0), s = d(void 0), p = d(""), T = d(""), S = d(null);
+    const o = a, e = t, i = d(!1), 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(""), w = d(null);
     Y(() => {
       i.value = !0;
-      const b = e.id ?? `checkbox-${J()}`;
-      u.value = b, f.value = b + ve, m.value = b + fe, r.value = b + pe, s.value = e.invalidMessage || te;
+      const b = e.id ?? `checkbox-${Q()}`;
+      u.value = b, f.value = b + fe, p.value = b + pe, v.value = b + he, s.value = e.invalidMessage || te;
     }), D(
-      () => [S.value, e.invalidMessage],
+      () => [w.value, e.invalidMessage],
       () => {
         var b;
-        s.value = e.invalidMessage || ((b = S.value) == null ? void 0 : b.validationMessage) || te;
+        s.value = e.invalidMessage || ((b = w.value) == null ? void 0 : b.validationMessage) || te;
       },
       {
         immediate: !0,
@@ -486,8 +486,8 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
       () => [u.value],
       () => {
         if (u.value) {
-          const b = u.value + ve;
-          f.value = b, m.value = u.value + fe, r.value = u.value + pe, x(e.message, e.showMessage) && (p.value = b);
+          const b = u.value + fe;
+          f.value = b, p.value = u.value + pe, v.value = u.value + he, x(e.message, e.showMessage) && (g.value = b), r();
         }
       },
       {
@@ -495,18 +495,18 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
         flush: "post"
       }
     ), D(
-      () => [i.value, S.value, e.indeterminate],
+      () => [i.value, w.value, e.indeterminate],
       () => {
-        S.value && e.indeterminate !== void 0 && (S.value.indeterminate = !!R(e.indeterminate));
+        w.value && e.indeterminate !== void 0 && (w.value.indeterminate = !!V(e.indeterminate));
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [i.value, S.value, e.checked],
+      () => [i.value, w.value, e.checked],
       () => {
-        i.value && S.value && (e.checked != null && (S.value.checked = !!R(e.checked)), i.value = !1);
+        i.value && w.value && (e.checked != null && (w.value.checked = !!V(e.checked)), i.value = !1);
       },
       {
         immediate: !0,
@@ -516,21 +516,21 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     function h() {
       return !!(e.validMessage ?? e.validation === "valid");
     }
-    function v() {
-      var b, w, O;
-      !((b = S.value) != null && b.validity.valid) || e.validation === "invalid" ? (p.value = r.value, s.value = e.invalidMessage || ((w = S.value) == null ? void 0 : w.validationMessage) || te, ge() && (T.value = s.value, Z(() => T.value = "", 1e3))) : h() && ((O = S.value) != null && O.validity.valid) && e.required ? (p.value = m.value, ge() && (T.value = e.validMessage ?? he, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? p.value = f.value : p.value = "";
+    function r() {
+      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(l, b, "checked"), v();
+      e.onChange && e.onChange(b), de(o, b, "checked"), r();
     }
-    function I(b) {
+    function L(b) {
       e.onBlur && e.onBlur(b);
     }
     function C(b) {
       e.onFocus && e.onFocus(b);
     }
-    return (b, w) => (g(), B("div", {
-      class: z(n(q)("db-checkbox", e.class)),
+    return (b, k) => (m(), S("div", {
+      class: P(n(q)("db-checkbox", e.class)),
       "data-size": b.size,
       "data-hide-asterisk": n(ie)(b.showRequiredAsterisk),
       "data-hide-label": n(ie)(b.showLabel)
@@ -541,61 +541,61 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
           "aria-invalid": b.validation === "invalid",
           "data-custom-validity": b.validation,
           ref_key: "_ref",
-          ref: S,
+          ref: w,
           id: u.value,
           name: b.name,
-          checked: n(R)(b.checked, "checked"),
-          disabled: n(R)(b.disabled, "disabled"),
+          checked: n(V)(b.checked, "checked"),
+          disabled: n(V)(b.disabled, "disabled"),
           value: b.value,
-          required: n(R)(b.required, "required"),
-          onChange: w[0] || (w[0] = async (O) => c(O)),
-          onBlur: w[1] || (w[1] = async (O) => I(O)),
-          onFocus: w[2] || (w[2] = async (O) => C(O)),
-          "aria-describedby": b.ariaDescribedBy ?? p.value
-        }, null, 40, Qa),
-        b.label ? (g(), B(U, { key: 0 }, [
-          N(L(b.label), 1)
+          required: n(V)(b.required, "required"),
+          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 }, [
+          N($(b.label), 1)
         ], 64)) : A(b.$slots, "default", { key: 1 })
-      ], 8, Ja),
-      n(x)(b.message, b.showMessage) ? (g(), Q(ae, {
+      ], 8, Qa),
+      n(x)(b.message, b.showMessage) ? (m(), J(ae, {
         key: 0,
         size: "small",
         icon: b.messageIcon,
         id: f.value
       }, {
-        default: W(() => [
-          N(L(b.message), 1)
+        default: H(() => [
+          N($(b.message), 1)
         ]),
         _: 1
-      }, 8, ["icon", "id"])) : V("", !0),
-      h() ? (g(), Q(ae, {
+      }, 8, ["icon", "id"])) : U("", !0),
+      h() ? (m(), J(ae, {
         key: 1,
         size: "small",
         semantic: "successful",
-        id: m.value
+        id: p.value
       }, {
-        default: W(() => [
-          N(L(b.validMessage || n(he)), 1)
+        default: H(() => [
+          N($(b.validMessage || n(ge)), 1)
         ]),
         _: 1
-      }, 8, ["id"])) : V("", !0),
+      }, 8, ["id"])) : U("", !0),
       ee(ae, {
         size: "small",
         semantic: "critical",
-        id: r.value
+        id: v.value
       }, {
-        default: W(() => [
-          N(L(s.value), 1)
+        default: H(() => [
+          N($(s.value), 1)
         ]),
         _: 1
       }, 8, ["id"]),
-      _("span", Za, L(T.value), 1)
-    ], 10, Ka));
+      _("span", xa, $(T.value), 1)
+    ], 10, Ja));
   }
 }), re = class re {
   static runCallbacks(a) {
-    for (const l of Object.values(re.callbacks))
-      typeof l == "function" && l(a);
+    for (const o of Object.values(re.callbacks))
+      typeof o == "function" && o(a);
   }
   constructor() {
     if (re._instance)
@@ -603,8 +603,8 @@ const el = Object.entries(na).map(([, t]) => t), Ma = {
     re._instance = this, self.document && self.document.addEventListener("click", (a) => re.runCallbacks(a));
   }
   addCallback(a) {
-    const l = J();
-    return re.callbacks[l] = a, l;
+    const o = Q();
+    return re.callbacks[o] = a, o;
   }
   removeCallback(a) {
     delete re.callbacks[a];
@@ -624,66 +624,66 @@ const ce = class ce {
     }, !0);
   }
   static runCallbacks(a) {
-    for (const l of Object.values(ce.callbacks))
-      typeof l == "function" && l(a);
+    for (const o of Object.values(ce.callbacks))
+      typeof o == "function" && o(a);
   }
   addCallback(a) {
-    const l = J();
-    return ce.callbacks[l] = a, l;
+    const o = Q();
+    return ce.callbacks[o] = a, o;
   }
   removeCallback(a) {
     delete ce.callbacks[a];
   }
 };
 ne(ce, "callbacks", {}), ne(ce, "_instance", null);
-let Ie = ce;
-const xa = (t) => {
-  var v;
+let Be = ce;
+const et = (t) => {
+  var r;
   const {
     top: a,
-    bottom: l,
+    bottom: o,
     left: e,
     right: i
   } = t.getBoundingClientRect(), {
     innerHeight: u,
     innerWidth: f
   } = window;
-  let m = a < 0, r = l > u, s = e < 0, p = i > f;
-  const T = t.dataset.outsideVy, S = t.dataset.outsideVx, h = (v = t == null ? void 0 : t.parentElement) == null ? void 0 : v.getBoundingClientRect();
-  return h && (T && (t.dataset.outsideVy === "top" ? m = h.top - (l - h.bottom) < 0 : r = h.bottom + (h.top - a) > u), S && (t.dataset.outsideVx === "left" ? s = h.left - (i - h.right) < 0 : p = h.right + (h.left - e) > f)), {
-    outTop: m,
-    outBottom: r,
+  let p = a < 0, v = o > u, s = e < 0, g = i > f;
+  const T = t.dataset.outsideVy, w = t.dataset.outsideVx, h = (r = t == null ? void 0 : t.parentElement) == null ? void 0 : r.getBoundingClientRect();
+  return h && (T && (t.dataset.outsideVy === "top" ? p = h.top - (o - h.bottom) < 0 : v = h.bottom + (h.top - a) > u), w && (t.dataset.outsideVx === "left" ? s = h.left - (i - h.right) < 0 : g = h.right + (h.left - e) > f)), {
+    outTop: p,
+    outBottom: v,
     outLeft: s,
-    outRight: p
+    outRight: g
   };
-}, et = (t) => {
+}, at = (t) => {
   const {
     outTop: a,
-    outBottom: l,
+    outBottom: o,
     outLeft: e,
     outRight: i
-  } = xa(t);
+  } = et(t);
   let u = {};
-  return a || l ? (u = {
+  return a || o ? (u = {
     vy: a ? "top" : "bottom"
   }, t.dataset.outsideVy = u.vy) : delete t.dataset.outsideVy, e || i ? (u = {
     ...u,
     vx: i ? "right" : "left"
   }, t.dataset.outsideVx = u.vx) : delete t.dataset.outsideVx, u;
-}, at = (t, a, l) => {
+}, tt = (t, a, o) => {
   if (getComputedStyle(t).zIndex === "9999") return;
   const {
     top: e,
     bottom: i,
     childHeight: u,
     childWidth: f,
-    width: m,
-    right: r,
+    width: p,
+    right: v,
     left: s,
-    correctedPlacement: p
-  } = da(t, a, l);
-  t.dataset.width === "full" && (t.style.inlineSize = `${m}px`), p === "top" || p === "bottom" || p === "top-start" || p === "bottom-start" ? t.style.insetInlineStart = `${s}px` : (p === "top-end" || p === "bottom-end") && (t.style.insetInlineStart = `${r - f}px`), p != null && p.startsWith("top") ? t.style.insetBlockStart = `${e - u}px` : p != null && p.startsWith("bottom") && (t.style.insetBlockStart = `${i}px`), t.style.position = "fixed";
-}, da = (t, a, l) => {
+    correctedPlacement: g
+  } = ua(t, a, o);
+  t.dataset.width === "full" && (t.style.inlineSize = `${p}px`), g === "top" || g === "bottom" || g === "top-start" || g === "bottom-start" ? t.style.insetInlineStart = `${s}px` : (g === "top-end" || g === "bottom-end") && (t.style.insetInlineStart = `${v - f}px`), g != null && g.startsWith("top") ? t.style.insetBlockStart = `${e - u}px` : g != null && g.startsWith("bottom") && (t.style.insetBlockStart = `${i}px`), t.style.position = "fixed";
+}, ua = (t, a, o) => {
   if (!t || !a)
     return {
       top: 0,
@@ -694,7 +694,7 @@ const xa = (t) => {
       left: 0,
       childHeight: 0,
       childWidth: 0,
-      correctedPlacement: l,
+      correctedPlacement: o,
       innerWidth: window.innerWidth,
       innerHeight: window.innerHeight
     };
@@ -702,84 +702,84 @@ const xa = (t) => {
     top: i,
     height: u,
     bottom: f,
-    right: m,
-    left: r,
+    right: p,
+    left: v,
     width: s
   } = a.getBoundingClientRect(), {
-    innerHeight: p,
+    innerHeight: g,
     innerWidth: T
   } = window;
-  let S = e.height, h = e.width;
-  (l === "bottom" || l === "top") && (h = h / 2), (l === "left" || l === "right") && (S = S / 2);
-  const v = f + S > p, c = i - S < 0, I = r - h < 0, C = m + h > T;
-  let b = l;
-  return l.startsWith("bottom") ? v ? (b = l == null ? void 0 : l.replace("bottom", "top"), I && C ? b = "top" : I ? b = "top-start" : C && (b = "top-end")) : I && C ? b = "bottom" : I ? b = "bottom-start" : C && (b = "bottom-end") : l.startsWith("top") ? c ? (b = l == null ? void 0 : l.replace("top", "bottom"), I && C ? b = "bottom" : I ? b = "bottom-start" : C && (b = "bottom-end")) : I && C ? b = "top" : I ? b = "top-start" : C && (b = "top-end") : l.startsWith("left") ? I ? (b = l == null ? void 0 : l.replace("left", "right"), v && c ? b = "right" : v ? b = "right-end" : c && (b = "right-start")) : v && c ? b = "left" : v ? b = "left-end" : c && (b = "left-start") : b.startsWith("right") && (C ? (b = l == null ? void 0 : l.replace("right", "left"), v && c ? b = "left" : v ? b = "left-end" : c && (b = "left-start")) : v && c ? b = "right" : v ? b = "right-end" : c && (b = "right-start")), {
+  let w = e.height, h = e.width;
+  (o === "bottom" || o === "top") && (h = h / 2), (o === "left" || o === "right") && (w = w / 2);
+  const r = f + w > g, c = i - w < 0, L = v - h < 0, C = p + h > T;
+  let b = o;
+  return o.startsWith("bottom") ? r ? (b = o == null ? void 0 : o.replace("bottom", "top"), L && C ? b = "top" : L ? b = "top-start" : C && (b = "top-end")) : L && C ? b = "bottom" : L ? b = "bottom-start" : C && (b = "bottom-end") : o.startsWith("top") ? c ? (b = o == null ? void 0 : o.replace("top", "bottom"), L && C ? b = "bottom" : L ? b = "bottom-start" : C && (b = "bottom-end")) : L && C ? b = "top" : L ? b = "top-start" : C && (b = "top-end") : o.startsWith("left") ? L ? (b = o == null ? void 0 : o.replace("left", "right"), r && c ? b = "right" : r ? b = "right-end" : c && (b = "right-start")) : r && c ? b = "left" : r ? b = "left-end" : c && (b = "left-start") : b.startsWith("right") && (C ? (b = o == null ? void 0 : o.replace("right", "left"), r && c ? b = "left" : r ? b = "left-end" : c && (b = "left-start")) : r && c ? b = "right" : r ? b = "right-end" : c && (b = "right-start")), {
     top: i,
     bottom: f,
-    right: m,
+    right: p,
     height: u,
     width: s,
-    left: r,
+    left: v,
     childHeight: e.height,
     childWidth: e.width,
     correctedPlacement: b,
     innerWidth: T,
-    innerHeight: p
+    innerHeight: g
   };
-}, ua = (t, a, l) => {
+}, ra = (t, a, o) => {
   const e = getComputedStyle(t).getPropertyValue("--db-popover-distance") ?? "0px", {
     top: i,
     height: u,
     width: f,
-    childHeight: m,
-    childWidth: r,
+    childHeight: p,
+    childWidth: v,
     right: s,
-    left: p,
+    left: g,
     bottom: T,
-    correctedPlacement: S,
+    correctedPlacement: w,
     innerWidth: h,
-    innerHeight: v
-  } = da(t, a, l);
-  if (r > f && (S.startsWith("bottom") || S.startsWith("top"))) {
-    const c = f / 2 / r * 100;
-    S.endsWith("start") ? t.style.setProperty("--db-tooltip-arrow-inline-start", `${c}%`) : S.endsWith("end") && t.style.setProperty("--db-tooltip-arrow-inline-start", `${100 - c}%`);
+    innerHeight: r
+  } = ua(t, a, o);
+  if (v > f && (w.startsWith("bottom") || w.startsWith("top"))) {
+    const c = f / 2 / v * 100;
+    w.endsWith("start") ? t.style.setProperty("--db-tooltip-arrow-inline-start", `${c}%`) : w.endsWith("end") && t.style.setProperty("--db-tooltip-arrow-inline-start", `${100 - c}%`);
   }
-  if (m > u && (S.startsWith("left") || S.startsWith("bottom"))) {
-    const c = u / 2 / m * 100;
-    S.endsWith("start") ? t.style.setProperty("--db-tooltip-arrow-block-start", `${c}%`) : S.endsWith("end") && t.style.setProperty("--db-tooltip-arrow-block-start", `${100 - c}%`);
+  if (p > u && (w.startsWith("left") || w.startsWith("bottom"))) {
+    const c = u / 2 / p * 100;
+    w.endsWith("start") ? t.style.setProperty("--db-tooltip-arrow-block-start", `${c}%`) : w.endsWith("end") && t.style.setProperty("--db-tooltip-arrow-block-start", `${100 - c}%`);
   }
-  if (S === "right" || S === "left")
+  if (w === "right" || w === "left")
     t.style.insetBlockStart = `${i + u / 2}px`;
-  else if (S === "right-start" || S === "left-start") {
-    const c = i + m;
-    t.style.insetBlockStart = `${i}px`, t.style.insetBlockEnd = `${c > v ? v : c}px`;
-  } else if (S === "right-end" || S === "left-end") {
-    const c = T - m;
+  else if (w === "right-start" || w === "left-start") {
+    const c = i + p;
+    t.style.insetBlockStart = `${i}px`, t.style.insetBlockEnd = `${c > r ? r : c}px`;
+  } else if (w === "right-end" || w === "left-end") {
+    const c = T - p;
     t.style.insetBlockStart = `${c < 0 ? 0 : c}px`, t.style.insetBlockEnd = `${T}px`;
-  } else if (S === "top" || S === "bottom")
-    t.style.insetInlineStart = `${p + f / 2}px`;
-  else if (S === "top-start" || S === "bottom-start") {
-    const c = p + r;
-    t.style.insetInlineStart = `${p}px`, t.style.insetInlineEnd = `${c > h ? h : c}px`;
-  } else if (S === "top-end" || S === "bottom-end") {
-    const c = p - r;
-    t.style.insetInlineStart = `${s - r}px`, t.style.insetInlineEnd = `${c < 0 ? 0 : c}px`;
+  } else if (w === "top" || w === "bottom")
+    t.style.insetInlineStart = `${g + f / 2}px`;
+  else if (w === "top-start" || w === "bottom-start") {
+    const c = g + v;
+    t.style.insetInlineStart = `${g}px`, t.style.insetInlineEnd = `${c > h ? h : c}px`;
+  } else if (w === "top-end" || w === "bottom-end") {
+    const c = g - v;
+    t.style.insetInlineStart = `${s - v}px`, t.style.insetInlineEnd = `${c < 0 ? 0 : c}px`;
   }
-  if (S != null && S.startsWith("right")) {
-    const c = s + r;
+  if (w != null && w.startsWith("right")) {
+    const c = s + v;
     t.style.insetInlineStart = `calc(${s}px + ${e})`, t.style.insetInlineEnd = `calc(${c > h ? h : c}px + ${e})`;
-  } else if (S != null && S.startsWith("left")) {
-    const c = p - r;
+  } else if (w != null && w.startsWith("left")) {
+    const c = g - v;
     t.style.insetInlineStart = `calc(${c < 0 ? 0 : c}px - ${e})`, t.style.insetInlineEnd = `calc(${s}px - ${e})`;
-  } else if (S != null && S.startsWith("top")) {
-    const c = i - m;
+  } else if (w != null && w.startsWith("top")) {
+    const c = i - p;
     t.style.insetBlockStart = `calc(${c < 0 ? 0 : c}px - ${e})`, t.style.insetBlockEnd = `calc(${T}px - ${e})`;
-  } else if (S != null && S.startsWith("bottom")) {
-    const c = T + m;
-    t.style.insetBlockStart = `calc(${T}px + ${e})`, t.style.insetBlockEnd = `calc(${c > v ? v : c}px + ${e})`;
+  } else if (w != null && w.startsWith("bottom")) {
+    const c = T + p;
+    t.style.insetBlockStart = `calc(${T}px + ${e})`, t.style.insetBlockEnd = `calc(${c > r ? r : c}px + ${e})`;
   }
-  t.style.position = "fixed", t.dataset.correctedPlacement = S;
-}, tt = ["id", "data-width"], it = /* @__PURE__ */ P({
+  t.style.position = "fixed", t.dataset.correctedPlacement = w;
+}, it = ["id", "data-width"], ot = /* @__PURE__ */ G({
   __name: "custom-select-dropdown",
   props: {
     width: { default: "fixed" },
@@ -790,19 +790,19 @@ const xa = (t) => {
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("article", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("article", {
       "data-spacing": "none",
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-custom-select-dropdown db-card", a.class)),
+      class: P(n(q)("db-custom-select-dropdown db-card", a.class)),
       "data-width": e.width
     }, [
       A(e.$slots, "default")
-    ], 10, tt));
+    ], 10, it));
   }
-}), lt = ["id", "data-divider"], ot = ["data-icon", "data-show-icon", "data-icon-trailing"], nt = ["type", "name", "form", "checked", "disabled", "value"], st = { key: 1 }, dt = /* @__PURE__ */ P({
+}), lt = ["id", "data-divider"], nt = ["data-icon", "data-show-icon", "data-icon-trailing"], st = ["type", "name", "form", "checked", "disabled", "value"], dt = { key: 1 }, ut = /* @__PURE__ */ G({
   __name: "custom-select-list-item",
   props: {
     groupTitle: { default: void 0 },
@@ -826,9 +826,9 @@ const xa = (t) => {
   },
   emits: ["update:checked"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(!1), f = d(null);
+    const o = a, e = t, i = d(void 0), u = d(!1), f = d(null);
     Y(() => {
-      i.value = e.id ?? `custom-select-list-item-${J()}`;
+      i.value = e.id ?? `custom-select-list-item-${Q()}`;
     }), D(
       () => [e.isGroupTitle, e.showDivider],
       () => {
@@ -839,30 +839,30 @@ const xa = (t) => {
         flush: "post"
       }
     );
-    function m(s) {
-      s.stopPropagation(), e.onChange && e.onChange(s), de(l, s, "checked");
+    function p(s) {
+      s.stopPropagation(), e.onChange && e.onChange(s), de(o, s, "checked");
     }
-    function r() {
+    function v() {
       if (!(e.isGroupTitle || e.type === "checkbox"))
-        return R(e.checked, "checked") ? "check" : "x_placeholder";
+        return V(e.checked, "checked") ? "check" : "x_placeholder";
     }
-    return (s, p) => (g(), B("li", {
+    return (s, g) => (m(), S("li", {
       ref_key: "_ref",
       ref: f,
       id: i.value,
-      class: z(
+      class: P(
         n(q)("db-custom-select-list-item", e.class, {
           "db-checkbox": s.type === "checkbox" && !s.isGroupTitle,
           "db-radio": s.type !== "checkbox" && !s.isGroupTitle
         })
       ),
-      "data-divider": n(F)(u.value)
+      "data-divider": n(R)(u.value)
     }, [
-      s.isGroupTitle ? (g(), B("span", st, L(s.groupTitle), 1)) : (g(), B("label", {
+      s.isGroupTitle ? (m(), S("span", dt, $(s.groupTitle), 1)) : (m(), S("label", {
         key: 0,
         "data-icon": s.type !== "checkbox" && s.icon ? s.icon : void 0,
-        "data-show-icon": n(F)(s.showIcon),
-        "data-icon-trailing": r()
+        "data-show-icon": n(R)(s.showIcon),
+        "data-icon-trailing": v()
       }, [
         _("input", {
           class: "db-custom-select-list-item-checkbox",
@@ -870,18 +870,18 @@ const xa = (t) => {
           type: s.type,
           name: s.name,
           form: s.name,
-          checked: n(R)(s.checked, "checked"),
-          disabled: n(R)(s.disabled, "disabled"),
+          checked: n(V)(s.checked, "checked"),
+          disabled: n(V)(s.disabled, "disabled"),
           value: s.value,
-          onChange: p[0] || (p[0] = async (T) => m(T))
-        }, null, 40, nt),
-        s.label ? (g(), B(U, { key: 0 }, [
-          N(L(s.label), 1)
+          onChange: g[0] || (g[0] = async (T) => p(T))
+        }, null, 40, st),
+        s.label ? (m(), S(W, { key: 0 }, [
+          N($(s.label), 1)
         ], 64)) : A(s.$slots, "default", { key: 1 })
-      ], 8, ot))
+      ], 8, nt))
     ], 10, lt));
   }
-}), ut = ["role", "aria-label", "id"], rt = /* @__PURE__ */ P({
+}), rt = ["role", "aria-label", "id"], ct = /* @__PURE__ */ G({
   __name: "custom-select-list",
   props: {
     label: { default: void 0 },
@@ -893,24 +893,24 @@ const xa = (t) => {
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("div", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("div", {
       role: e.multiple ? "group" : "radiogroup",
       "aria-label": e.label,
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-custom-select-list", a.class))
+      class: P(n(q)("db-custom-select-list", a.class))
     }, [
       _("ul", null, [
         A(e.$slots, "default")
       ])
-    ], 10, ut));
+    ], 10, rt));
   }
-}), ct = ["data-variant", "data-hide-label", "data-show-icon", "data-icon", "data-icon-trailing", "data-hide-asterisk", "data-show-icon-trailing"], vt = ["for"], ft = ["aria-invalid", "data-custom-validity", "data-field-sizing", "id", "name", "type", "multiple", "placeholder", "disabled", "required", "step", "value", "maxLength", "minLength", "max", "min", "readOnly", "form", "pattern", "size", "autoComplete", "autoFocus", "list", "aria-describedby"], pt = ["id"], ht = ["value"], gt = {
+}), vt = ["data-variant", "data-hide-label", "data-show-icon", "data-icon", "data-icon-trailing", "data-hide-asterisk", "data-show-icon-trailing"], ft = ["for"], pt = ["aria-invalid", "data-custom-validity", "data-field-sizing", "id", "name", "type", "multiple", "placeholder", "disabled", "required", "step", "value", "maxLength", "minLength", "max", "min", "readOnly", "form", "pattern", "size", "autoComplete", "autoFocus", "list", "aria-describedby"], ht = ["id"], gt = ["value"], mt = {
   "data-visually-hidden": "true",
   role: "status"
-}, mt = /* @__PURE__ */ P({
+}, bt = /* @__PURE__ */ G({
   __name: "input",
   props: {
     dataList: { default: void 0 },
@@ -969,15 +969,15 @@ const xa = (t) => {
   },
   emits: ["update:value"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), m = d(void 0), r = d(void 0), s = d(void 0), p = d(""), T = d(""), S = d(""), h = 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(""), h = d(null);
     Y(() => {
-      const y = e.id ?? `input-${J()}`;
-      i.value = y, u.value = y + ve, f.value = y + fe, m.value = y + pe, s.value = y + Ze, r.value = e.invalidMessage || te;
+      const y = e.id ?? `input-${Q()}`;
+      i.value = y, u.value = y + fe, f.value = y + pe, p.value = y + he, s.value = y + xe, v.value = e.invalidMessage || te;
     }), D(
       () => [h.value, e.invalidMessage],
       () => {
         var y;
-        r.value = e.invalidMessage || ((y = h.value) == null ? void 0 : y.validationMessage) || te;
+        v.value = e.invalidMessage || ((y = h.value) == null ? void 0 : y.validationMessage) || te;
       },
       {
         immediate: !0,
@@ -987,8 +987,8 @@ const xa = (t) => {
       () => [i.value],
       () => {
         if (i.value) {
-          const y = i.value + ve;
-          u.value = y, f.value = i.value + fe, m.value = i.value + pe, s.value = e.dataListId ?? i.value + Ze, x(e.message, e.showMessage) && (p.value = y);
+          const y = i.value + fe;
+          u.value = y, f.value = i.value + pe, p.value = i.value + he, s.value = e.dataListId ?? i.value + xe, x(e.message, e.showMessage) && (g.value = y), c();
         }
       },
       {
@@ -1005,45 +1005,45 @@ const xa = (t) => {
         flush: "post"
       }
     );
-    function v() {
+    function r() {
       return !!(e.validMessage ?? e.validation === "valid");
     }
     function c() {
-      var y, H, k;
-      !((y = h.value) != null && y.validity.valid) || e.validation === "invalid" ? (p.value = m.value, r.value = e.invalidMessage || ((H = h.value) == null ? void 0 : H.validationMessage) || te, ge() && (S.value = r.value, Z(() => S.value = "", 1e3))) : v() && ((k = h.value) != null && k.validity.valid) && (e.required || e.minLength || e.maxLength || e.pattern) ? (p.value = f.value, ge() && (S.value = e.validMessage ?? he, Z(() => S.value = "", 1e3))) : x(e.message, e.showMessage) ? p.value = u.value : p.value = "";
+      var y, X, B;
+      !((y = h.value) != null && y.validity.valid) || e.validation === "invalid" ? (g.value = p.value, v.value = e.invalidMessage || ((X = h.value) == null ? void 0 : X.validationMessage) || te, me() && (w.value = v.value, Z(() => w.value = "", 1e3))) : r() && ((B = h.value) != null && B.validity.valid) && (e.required || e.minLength || e.maxLength || e.pattern) ? (g.value = f.value, me() && (w.value = e.validMessage ?? ge, Z(() => w.value = "", 1e3))) : x(e.message, e.showMessage) ? g.value = u.value : g.value = void 0;
     }
-    function I(y) {
-      e.input && e.input(y), T.value = y.target.value, e.onInput && e.onInput(y), de(l, y), c();
+    function L(y) {
+      e.input && e.input(y), T.value = y.target.value, e.onInput && e.onInput(y), de(o, y), c();
     }
     function C(y) {
-      e.onChange && e.onChange(y), de(l, y), c();
+      e.onChange && e.onChange(y), de(o, y), c();
     }
     function b(y) {
       e.onBlur && e.onBlur(y);
     }
-    function w(y) {
+    function k(y) {
       e.onFocus && e.onFocus(y);
     }
-    function O() {
+    function F() {
       const y = e.dataList;
       return Array.from(
-        (za(y) ? y == null ? void 0 : y.map((H) => ({
-          value: H,
+        (Va(y) ? y == null ? void 0 : y.map((X) => ({
+          value: X,
           label: void 0
         })) : y) || []
       );
     }
-    return (y, H) => (g(), B("div", {
-      class: z(n(q)("db-input", e.class)),
+    return (y, X) => (m(), S("div", {
+      class: P(n(q)("db-input", e.class)),
       "data-variant": y.variant,
       "data-hide-label": n(ie)(y.showLabel),
-      "data-show-icon": n(F)(y.showIconLeading ?? y.showIcon),
+      "data-show-icon": n(R)(y.showIconLeading ?? y.showIcon),
       "data-icon": y.iconLeading ?? y.icon,
       "data-icon-trailing": y.iconTrailing,
       "data-hide-asterisk": n(ie)(y.showRequiredAsterisk),
-      "data-show-icon-trailing": n(F)(y.showIconTrailing)
+      "data-show-icon-trailing": n(R)(y.showIconTrailing)
     }, [
-      _("label", { for: i.value }, L(y.label ?? n(ke)), 9, vt),
+      _("label", { for: i.value }, $(y.label ?? n(we)), 9, ft),
       _("input", {
         "aria-invalid": y.validation === "invalid",
         "data-custom-validity": y.validation,
@@ -1053,75 +1053,75 @@ const xa = (t) => {
         id: i.value,
         name: y.name,
         type: y.type || "text",
-        multiple: n(R)(y.multiple, "multiple"),
-        placeholder: y.placeholder ?? n(aa),
-        disabled: n(R)(y.disabled, "disabled"),
-        required: n(R)(y.required, "required"),
-        step: n(Se)(y.step),
+        multiple: n(V)(y.multiple, "multiple"),
+        placeholder: y.placeholder ?? n(ta),
+        disabled: n(V)(y.disabled, "disabled"),
+        required: n(V)(y.required, "required"),
+        step: n(ke)(y.step),
         value: y.value ?? T.value,
-        maxLength: n(Se)(y.maxLength, y.maxlength),
-        minLength: n(Se)(y.minLength, y.minlength),
-        max: n(xe)(y.max, y.type),
-        min: n(xe)(y.min, y.type),
-        readOnly: n(R)(y.readOnly, "readOnly") || n(R)(y.readonly, "readonly"),
+        maxLength: n(ke)(y.maxLength, y.maxlength),
+        minLength: n(ke)(y.minLength, y.minlength),
+        max: n(ea)(y.max, y.type),
+        min: n(ea)(y.min, y.type),
+        readOnly: n(V)(y.readOnly, "readOnly") || n(V)(y.readonly, "readonly"),
         form: y.form,
         pattern: y.pattern,
         size: y.size,
         autoComplete: y.autocomplete,
-        autoFocus: n(R)(y.autofocus, "autofocus"),
-        onInput: H[0] || (H[0] = async (k) => I(k)),
-        onChange: H[1] || (H[1] = async (k) => C(k)),
-        onBlur: H[2] || (H[2] = async (k) => b(k)),
-        onFocus: H[3] || (H[3] = async (k) => w(k)),
+        autoFocus: n(V)(y.autofocus, "autofocus"),
+        onInput: X[0] || (X[0] = async (B) => L(B)),
+        onChange: X[1] || (X[1] = async (B) => C(B)),
+        onBlur: X[2] || (X[2] = async (B) => b(B)),
+        onFocus: X[3] || (X[3] = async (B) => k(B)),
         list: y.dataList && s.value,
-        "aria-describedby": y.ariaDescribedBy ?? p.value
-      }, null, 40, ft),
-      y.dataList ? (g(), B("datalist", {
+        "aria-describedby": y.ariaDescribedBy ?? g.value
+      }, null, 40, pt),
+      y.dataList ? (m(), S("datalist", {
         key: 0,
         id: s.value
       }, [
-        (g(!0), B(U, null, be(O(), (k) => (g(), B("option", {
-          key: s.value + "-option-" + k.value,
-          value: k.value
-        }, L(k.label), 9, ht))), 128))
-      ], 8, pt)) : V("", !0),
+        (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))
+      ], 8, ht)) : U("", !0),
       A(y.$slots, "default"),
-      n(x)(y.message, y.showMessage) ? (g(), Q(ae, {
+      n(x)(y.message, y.showMessage) ? (m(), J(ae, {
         key: 1,
         size: "small",
         icon: y.messageIcon,
         id: u.value
       }, {
-        default: W(() => [
-          N(L(y.message), 1)
+        default: H(() => [
+          N($(y.message), 1)
         ]),
         _: 1
-      }, 8, ["icon", "id"])) : V("", !0),
-      v() ? (g(), Q(ae, {
+      }, 8, ["icon", "id"])) : U("", !0),
+      r() ? (m(), J(ae, {
         key: 2,
         size: "small",
         semantic: "successful",
         id: f.value
       }, {
-        default: W(() => [
-          N(L(y.validMessage || n(he)), 1)
+        default: H(() => [
+          N($(y.validMessage || n(ge)), 1)
         ]),
         _: 1
-      }, 8, ["id"])) : V("", !0),
+      }, 8, ["id"])) : U("", !0),
       ee(ae, {
         size: "small",
         semantic: "critical",
-        id: m.value
+        id: p.value
       }, {
-        default: W(() => [
-          N(L(r.value), 1)
+        default: H(() => [
+          N($(v.value), 1)
         ]),
         _: 1
       }, 8, ["id"]),
-      _("span", gt, L(S.value), 1)
-    ], 10, ct));
+      _("span", mt, $(w.value), 1)
+    ], 10, vt));
   }
-}), bt = ["id", "data-emphasis", "data-animation", "data-delay", "data-width", "data-show-arrow", "data-placement"], ra = /* @__PURE__ */ P({
+}), yt = ["id", "data-emphasis", "data-animation", "data-delay", "data-width", "data-show-arrow", "data-placement"], ca = /* @__PURE__ */ G({
   __name: "tooltip",
   props: {
     showArrow: { type: [Boolean, String], default: void 0 },
@@ -1138,21 +1138,21 @@ const xa = (t) => {
     width: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(!1), i = d(void 0), u = d(void 0), f = d(null);
+    const a = t, o = d(Te), e = d(!1), i = d(void 0), u = d(void 0), f = d(null);
     Y(() => {
-      l.value = a.id || "tooltip-" + J(), e.value = !0;
+      o.value = a.id || "tooltip-" + Q(), e.value = !0;
     }), D(
       () => [f.value, e.value],
       () => {
-        if (f.value && e.value && l.value) {
-          const v = s();
-          v && (["mouseenter", "focusin"].forEach((c) => {
-            v.addEventListener(c, () => h(v));
-          }), v.addEventListener("keydown", (c) => r(c)), ["mouseleave", "focusout"].forEach((c) => {
-            v.addEventListener(c, () => S());
-          }), v.dataset.hasTooltip = "true", a.variant === "label" ? v.setAttribute("aria-labelledby", l.value) : v.setAttribute("aria-describedby", l.value)), typeof window < "u" && "IntersectionObserver" in window && (u.value = new IntersectionObserver((c) => {
-            const I = c.find(({ target: C }) => C === s());
-            I && !I.isIntersecting && r(!1);
+        if (f.value && e.value && o.value) {
+          const r = s();
+          r && (["mouseenter", "focusin"].forEach((c) => {
+            r.addEventListener(c, () => h(r));
+          }), r.addEventListener("keydown", (c) => v(c)), ["mouseleave", "focusout"].forEach((c) => {
+            r.addEventListener(c, () => w());
+          }), r.dataset.hasTooltip = "true", a.variant === "label" ? r.setAttribute("aria-labelledby", o.value) : r.setAttribute("aria-describedby", o.value)), typeof window < "u" && "IntersectionObserver" in window && (u.value = new IntersectionObserver((c) => {
+            const L = c.find(({ target: C }) => C === s());
+            L && !L.isIntersecting && v(!1);
           })), e.value = !1;
         }
       },
@@ -1161,61 +1161,61 @@ const xa = (t) => {
         flush: "post"
       }
     );
-    function m(v) {
-      v.stopPropagation();
+    function p(r) {
+      r.stopPropagation();
     }
-    function r(v) {
-      (!v || v.key === "Escape") && f.value && getComputedStyle(f.value).visibility === "visible" && s().blur();
+    function v(r) {
+      (!r || r.key === "Escape") && f.value && getComputedStyle(f.value).visibility === "visible" && s().blur();
     }
     function s() {
-      let v = f.value.parentElement;
-      return v && v.localName.includes("tooltip") && (v = v.parentElement), v;
+      let r = f.value.parentElement;
+      return r && r.localName.includes("tooltip") && (r = r.parentElement), r;
     }
-    function p(v) {
-      v && f.value && Z(() => {
-        ua(
+    function g(r) {
+      r && f.value && Z(() => {
+        ra(
           f.value,
-          v,
+          r,
           a.placement ?? "bottom"
         );
       }, 1);
     }
-    function T(v, c) {
-      var I, C;
-      (I = v == null ? void 0 : v.target) != null && I.contains && ((C = v == null ? void 0 : v.target) != null && C.contains(f.value)) && p(c);
+    function T(r, c) {
+      var L, C;
+      (L = r == null ? void 0 : r.target) != null && L.contains && ((C = r == null ? void 0 : r.target) != null && C.contains(f.value)) && g(c);
     }
-    function S() {
-      var v;
-      i.value && new Ie().removeCallback(
+    function w() {
+      var r;
+      i.value && new Be().removeCallback(
         i.value
-      ), (v = u.value) == null || v.unobserve(s());
+      ), (r = u.value) == null || r.unobserve(s());
     }
-    function h(v) {
+    function h(r) {
       var c;
-      i.value = new Ie().addCallback(
-        (I) => T(I, v)
-      ), p(v), (c = u.value) == null || c.observe(s());
+      i.value = new Be().addCallback(
+        (L) => T(L, r)
+      ), g(r), (c = u.value) == null || c.observe(s());
     }
-    return (v, c) => (g(), B("i", {
+    return (r, c) => (m(), S("i", {
       role: "tooltip",
       "aria-hidden": "true",
       "data-gap": "true",
       ref_key: "_ref",
       ref: f,
-      class: z(n(q)("db-tooltip", a.class)),
-      id: l.value,
-      "data-emphasis": v.emphasis,
-      "data-animation": n(F)(v.animation ?? !0),
-      "data-delay": v.delay,
-      "data-width": v.width,
-      "data-show-arrow": n(F)(v.showArrow ?? !0),
-      "data-placement": v.placement,
-      onClick: c[0] || (c[0] = async (I) => m(I))
+      class: P(n(q)("db-tooltip", a.class)),
+      id: o.value,
+      "data-emphasis": r.emphasis,
+      "data-animation": n(R)(r.animation ?? !0),
+      "data-delay": r.delay,
+      "data-width": r.width,
+      "data-show-arrow": n(R)(r.showArrow ?? !0),
+      "data-placement": r.placement,
+      onClick: c[0] || (c[0] = async (L) => p(L))
     }, [
-      A(v.$slots, "default")
-    ], 10, bt));
+      A(r.$slots, "default")
+    ], 10, yt));
   }
-}), yt = ["id", "data-semantic", "data-emphasis", "data-icon", "data-show-check-state", "data-show-icon", "data-no-text", "data-overflow"], wt = /* @__PURE__ */ P({
+}), wt = ["id", "data-semantic", "data-emphasis", "data-icon", "data-show-check-state", "data-show-icon", "data-no-text", "data-overflow"], kt = /* @__PURE__ */ G({
   __name: "tag",
   props: {
     behavior: { default: void 0 },
@@ -1239,32 +1239,32 @@ const xa = (t) => {
     remove: {}
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     function e(u) {
       u && (u.stopPropagation(), a.onRemove && a.onRemove(u));
     }
     function i() {
-      return a.removeButton ? a.removeButton : ta;
+      return a.removeButton ? a.removeButton : ia;
     }
-    return (u, f) => (g(), B("div", {
+    return (u, f) => (m(), S("div", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: u.id,
-      class: z(n(q)("db-tag", a.class)),
+      class: P(n(q)("db-tag", a.class)),
       "data-semantic": u.semantic,
       "data-emphasis": u.emphasis,
       "data-icon": u.icon,
-      "data-show-check-state": n(F)(u.showCheckState ?? !0),
-      "data-show-icon": n(F)(u.showIcon),
-      "data-no-text": n(F)(u.noText),
-      "data-overflow": n(F)(u.overflow)
+      "data-show-check-state": n(R)(u.showCheckState ?? !0),
+      "data-show-icon": n(R)(u.showIcon),
+      "data-no-text": n(R)(u.noText),
+      "data-overflow": n(R)(u.overflow)
     }, [
       A(u.$slots, "content"),
       A(u.$slots, "default"),
-      u.text ? (g(), B(U, { key: 0 }, [
-        N(L(u.text), 1)
-      ], 64)) : V("", !0),
-      u.behavior === "removable" ? (g(), B("button", {
+      u.text ? (m(), S(W, { key: 0 }, [
+        N($(u.text), 1)
+      ], 64)) : U("", !0),
+      u.behavior === "removable" ? (m(), S("button", {
         key: 1,
         class: "db-button db-tab-remove-button",
         "data-icon": "cross",
@@ -1272,21 +1272,21 @@ const xa = (t) => {
         "data-no-text": "true",
         "data-variant": "ghost",
         type: "button",
-        onClick: f[0] || (f[0] = async (m) => e(m))
+        onClick: f[0] || (f[0] = async (p) => e(p))
       }, [
-        ee(ra, { variant: "label" }, {
-          default: W(() => [
-            N(L(i()), 1)
+        ee(ca, { variant: "label" }, {
+          default: H(() => [
+            N($(i()), 1)
           ]),
           _: 1
         })
-      ])) : V("", !0)
-    ], 10, yt));
+      ])) : U("", !0)
+    ], 10, wt));
   }
-}), kt = ["id", "aria-invalid", "data-custom-validity", "data-width", "data-variant", "data-required", "data-hide-asterisk", "data-placement", "data-selected-type", "data-hide-label", "data-icon", "data-show-icon"], St = ["id"], Bt = ["id", "form", "name", "multiple", "disabled", "required"], It = ["disabled", "value"], $t = ["open"], Lt = ["id", "aria-disabled", "aria-labelledby"], Tt = ["data-visually-hidden", "id"], _t = { key: 1 }, Ct = { key: 0 }, Et = { key: 0 }, At = { class: "db-checkbox db-custom-select-list-item" }, Dt = ["form", "checked"], Nt = ["aria-hidden", "id"], Ft = {
+}), St = ["id", "aria-invalid", "data-custom-validity", "data-width", "data-variant", "data-required", "data-hide-asterisk", "data-placement", "data-selected-type", "data-hide-label", "data-icon", "data-show-icon"], Bt = ["id"], Lt = ["id", "form", "name", "multiple", "disabled", "required"], It = ["disabled", "value"], $t = ["open"], Tt = ["id", "aria-disabled", "aria-labelledby"], _t = ["data-visually-hidden", "id"], Ct = { key: 1 }, Et = { key: 0 }, At = { key: 0 }, Dt = { class: "db-checkbox db-custom-select-list-item" }, Nt = ["form", "checked"], Ft = ["aria-hidden", "id"], Mt = {
   "data-visually-hidden": "true",
   role: "status"
-}, dl = /* @__PURE__ */ P({
+}, mo = /* @__PURE__ */ G({
   __name: "custom-select",
   props: {
     children: { default: void 0 },
@@ -1351,21 +1351,21 @@ const xa = (t) => {
   },
   emits: ["update:values"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), m = d(void 0), r = d(void 0), s = d(void 0), p = d(void 0), T = d(void 0), S = d(void 0), h = d(void 0), v = d("no-validation"), c = d(""), I = d(""), C = d(void 0), b = d(""), w = d([]), O = d(!1), y = d(!1), H = d(0), k = d([]), X = d([]), le = d(!1), K = d(void 0), Ne = d(0), ye = d(void 0), _e = d(void 0), qe = d(void 0), Ve = d(!1), Ce = d(!1), ca = d(null), M = d(null), we = d(null), Fe = d(null), Pe = 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 o = e.id ?? `custom-select-${J()}`;
-      i.value = o, u.value = o + ve, f.value = o + fe, m.value = o + pe, s.value = o + Qe, p.value = o + Je, T.value = o + "-summary", S.value = o + Re, C.value = o + "-selected-labels", h.value = o + "-info", r.value = e.invalidMessage || te, typeof window < "u" && "IntersectionObserver" in window && (_e.value = new IntersectionObserver(($) => {
-        if (M.value) {
-          const E = $.find(({ target: j }) => j === M.value);
-          E && !E.isIntersecting && M.value.open && (M.value.open = !1);
+      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) => {
+        if (z.value) {
+          const E = I.find(({ target: j }) => j === z.value);
+          E && !E.isIntersecting && z.value.open && (z.value.open = !1);
         }
       }));
     }), D(
-      () => [M.value],
+      () => [z.value],
       () => {
-        M.value && M.value.addEventListener(
+        z.value && z.value.addEventListener(
           "focusout",
-          (o) => Ee(o)
+          (l) => Ae(l)
         );
       },
       {
@@ -1376,8 +1376,8 @@ const xa = (t) => {
       () => [i.value],
       () => {
         if (i.value) {
-          const o = i.value + ve;
-          p.value = i.value + Je, s.value = i.value + Qe, f.value = i.value + fe, m.value = i.value + pe, S.value = i.value + Re, x(e.message, e.showMessage) ? Oe(o) : Oe();
+          const l = i.value + fe;
+          g.value = i.value + Qe, s.value = i.value + Ze, f.value = i.value + pe, p.value = i.value + he, w.value = i.value + Re, x(e.message, e.showMessage) ? He(l) : He();
         }
       },
       {
@@ -1385,13 +1385,13 @@ const xa = (t) => {
         flush: "post"
       }
     ), D(
-      () => [M.value, c.value],
+      () => [z.value, L.value],
       () => {
-        if (M.value) {
-          const o = M.value.querySelector("summary");
-          o && o.setAttribute(
+        if (z.value) {
+          const l = z.value.querySelector("summary");
+          l && l.setAttribute(
             "aria-describedby",
-            e.ariaDescribedBy ?? (c.value || "")
+            e.ariaDescribedBy ?? (L.value || "")
           );
         }
       },
@@ -1400,27 +1400,27 @@ const xa = (t) => {
         flush: "post"
       }
     ), D(
-      () => [e.showNoResults, X.value],
+      () => [e.showNoResults, e.showLoading, oe.value],
       () => {
-        e.showNoResults !== void 0 ? le.value = e.showNoResults : X.value && (le.value = X.value.length === 0);
+        e.showNoResults !== void 0 ? K.value = e.showNoResults : oe.value && (K.value = oe.value.length === 0);
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [e.showSelectAll, H.value, e.multiple],
+      () => [e.showSelectAll, B.value, e.multiple],
       () => {
-        O.value = !!(e.multiple && (e.showSelectAll ?? H.value > 5));
+        y.value = !!(e.multiple && (e.showSelectAll ?? B.value > 5));
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [e.showSearch, H.value],
+      () => [e.showSearch, B.value],
       () => {
-        y.value = e.showSearch ?? H.value > 9;
+        X.value = e.showSearch ?? B.value > 9;
       },
       {
         immediate: !0,
@@ -1429,16 +1429,16 @@ const xa = (t) => {
     ), D(
       () => [e.values],
       () => {
-        e.values && Array.isArray(e.values) && e.values !== k.value && (k.value = e.values ?? []);
+        e.values && Array.isArray(e.values) && e.values !== M.value && (M.value = e.values ?? []);
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [k.value],
+      () => [M.value, ve.value],
       () => {
-        fa();
+        ve.value && pa();
       },
       {
         immediate: !0,
@@ -1447,17 +1447,17 @@ const xa = (t) => {
     ), D(
       () => [e.validation],
       () => {
-        v.value = e.validation;
+        r.value = e.validation;
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [k.value, H.value],
+      () => [M.value, B.value],
       () => {
-        var o, $;
-        ((o = k.value) == null ? void 0 : o.length) === 0 ? (Ve.value = !1, Ce.value = !1) : (($ = k.value) == null ? void 0 : $.length) === H.value ? (Ce.value = !1, Ve.value = !0) : k.value && (Ce.value = !0);
+        var l, I;
+        ((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,
@@ -1466,8 +1466,8 @@ const xa = (t) => {
     ), D(
       () => [e.options],
       () => {
-        var o;
-        X.value = e.options, H.value = ((o = e.options) == null ? void 0 : o.filter(($) => !$.isGroupTitle).length) ?? 0;
+        var l;
+        oe.value = e.options, B.value = ((l = e.options) == null ? void 0 : l.filter((I) => !I.isGroupTitle).length) ?? 0;
       },
       {
         immediate: !0,
@@ -1476,9 +1476,9 @@ const xa = (t) => {
     ), D(
       () => [e.searchValue],
       () => {
-        if (qe.value = e.searchValue, e.searchValue) {
-          const o = e.searchValue;
-          je(o);
+        if (Pe.value = e.searchValue, e.searchValue) {
+          const l = e.searchValue;
+          Ye(l);
         }
       },
       {
@@ -1486,13 +1486,13 @@ const xa = (t) => {
         flush: "post"
       }
     ), D(
-      () => [e.options, k.value],
+      () => [e.options, M.value],
       () => {
-        var o, $;
-        (o = e.options) != null && o.length && (w.value = ($ = e.options) == null ? void 0 : $.filter(
+        var l, I;
+        (l = e.options) != null && l.length && (F.value = (I = e.options) == null ? void 0 : I.filter(
           (E) => {
-            var j, oe;
-            return !E.value || !((j = k.value) != null && j.includes) ? !1 : !E.isGroupTitle && ((oe = k.value) == null ? void 0 : oe.includes(E.value));
+            var j, le;
+            return !E.value || !((j = M.value) != null && j.includes) ? !1 : !E.isGroupTitle && ((le = M.value) == null ? void 0 : le.includes(E.value));
           }
         ));
       },
@@ -1502,366 +1502,366 @@ const xa = (t) => {
       }
     ), D(
       () => [
-        w.value,
+        F.value,
         e.selectedType,
         e.amountText,
         e.selectedLabels,
         e.transformSelectedLabels
       ],
       () => {
-        var o, $, E;
+        var l, I, E;
         if (e.selectedLabels) {
-          I.value = e.selectedLabels;
+          C.value = e.selectedLabels;
           return;
         }
-        if ((o = w.value) != null && o.length) {
+        if ((l = F.value) != null && l.length) {
           if (e.transformSelectedLabels) {
-            const j = w.value, oe = e.transformSelectedLabels;
-            I.value = oe(j);
+            const j = F.value, le = e.transformSelectedLabels;
+            C.value = le(j);
             return;
           }
-          e.selectedType === "amount" ? I.value = e.amountText ? e.amountText : `${($ = w.value) == null ? void 0 : $.length} ${Aa}` : I.value = (E = w.value) == null ? void 0 : E.map((j) => $e(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
-          I.value = "";
+          C.value = "";
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [w.value],
+      () => [F.value],
       () => {
-        var o;
-        e.onAmountChange && e.onAmountChange(((o = w.value) == null ? void 0 : o.length) ?? 0);
+        var l;
+        e.onAmountChange && e.onAmountChange(((l = F.value) == null ? void 0 : l.length) ?? 0);
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [Ce.value, Fe.value],
+      () => [Ee.value, Fe.value],
       () => {
-        Fe.value && (Fe.value.indeterminate = !!Ce.value);
+        Fe.value && (Fe.value.indeterminate = !!Ee.value);
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [we.value, e.invalidMessage],
+      () => [ve.value, e.invalidMessage],
       () => {
-        var o;
-        r.value = e.invalidMessage || ((o = we.value) == null ? void 0 : o.validationMessage) || te;
+        var l;
+        v.value = e.invalidMessage || ((l = ve.value) == null ? void 0 : l.validationMessage) || te;
       },
       {
         immediate: !0,
         flush: "post"
       }
     );
-    function va(o) {
-      var $, E;
-      ($ = o == null ? void 0 : o.target) != null && $.contains && ((E = o == null ? void 0 : o.target) != null && E.contains(M.value)) && Ue();
+    function fa(l) {
+      var I, E;
+      (I = l == null ? void 0 : l.target) != null && I.contains && ((E = l == null ? void 0 : l.target) != null && E.contains(z.value)) && Ge();
     }
-    function We() {
+    function Oe() {
       return !!(e.validMessage ?? e.validation === "valid");
     }
-    function fa() {
-      var o, $, E;
-      we.value && (we.value.value = ha()), !((o = we.value) != null && o.validity.valid) || e.validation === "invalid" ? (c.value = m.value, r.value = e.invalidMessage || (($ = we.value) == null ? void 0 : $.validationMessage) || te, ge() && (b.value = r.value, Z(() => b.value = "", 1e3)), v.value = e.validation ?? "invalid") : We() && ((E = we.value) != null && E.validity.valid) && e.required ? (c.value = f.value, ge() && (b.value = e.validMessage ?? he, Z(() => b.value = "", 1e3)), v.value = e.validation ?? "valid") : x(e.message, e.showMessage) ? (c.value = u.value, v.value = e.validation ?? "no-validation") : (c.value = S.value, v.value = e.validation ?? "no-validation");
-    }
-    function pa(o) {
-      var $, E;
-      e.onDropdownToggle && (o.stopPropagation(), e.onDropdownToggle(o)), o.target instanceof HTMLDetailsElement && o.target.open ? (K.value = new ze().addCallback(
-        (j) => Sa(j)
-      ), ye.value = new Ie().addCallback(
-        (j) => va(j)
-      ), Ue(), ($ = _e.value) == null || $.observe(M.value), o.target.dataset.test || Xe()) : (K.value && new ze().removeCallback(
-        K.value
-      ), ye.value && new Ie().removeCallback(
-        ye.value
-      ), (E = _e.value) == null || E.unobserve(M.value));
-    }
-    function ha() {
-      var o;
-      return (o = k.value) != null && o.length ? k.value.at(0) ?? "" : "";
-    }
-    function Oe(o) {
-      var E;
-      const $ = [];
-      o && $.push(o), C.value && ((E = I.value) != null && E.length) && $.push(C.value), c.value = $.join(" ");
+    function pa() {
+      var l, I, E;
+      ve.value && (ve.value.value = ga()), !((l = ve.value) != null && l.validity.valid) || e.validation === "invalid" ? (L.value = p.value, v.value = e.invalidMessage || ((I = ve.value) == null ? void 0 : I.validationMessage) || te, me() && (k.value = v.value, Z(() => k.value = "", 1e3)), c.value && (r.value = e.validation ?? "invalid")) : Oe() && ((E = ve.value) != null && E.validity.valid) && e.required ? (L.value = f.value, me() && (k.value = e.validMessage ?? ge, Z(() => k.value = "", 1e3)), r.value = e.validation ?? "valid") : x(e.message, e.showMessage) ? (L.value = u.value, r.value = e.validation ?? "no-validation") : (L.value = w.value, r.value = e.validation ?? "no-validation");
+    }
+    function ha(l) {
+      var I, E;
+      e.onDropdownToggle && (l.stopPropagation(), e.onDropdownToggle(l)), l.target instanceof HTMLDetailsElement && l.target.open ? (_e.value = new ze().addCallback(
+        (j) => Ba(j)
+      ), Ce.value = new Be().addCallback(
+        (j) => fa(j)
+      ), Ge(), (I = Ve.value) == null || I.observe(z.value), l.target.dataset.test || je()) : (_e.value && new ze().removeCallback(
+        _e.value
+      ), Ce.value && new Be().removeCallback(
+        Ce.value
+      ), (E = Ve.value) == null || E.unobserve(z.value));
     }
     function ga() {
-      return e.selectAllLabel ?? ke;
+      var l;
+      return (l = M.value) != null && l.length ? M.value.at(0) ?? "" : "";
+    }
+    function He(l) {
+      var E;
+      const I = [];
+      l && I.push(l), b.value && ((E = C.value) != null && E.length) && I.push(b.value), L.value = I.join(" ");
     }
-    function $e(o) {
-      var $;
-      return o.label ?? (($ = o.value) == null ? void 0 : $.toString()) ?? "";
+    function ma() {
+      return e.selectAllLabel ?? we;
     }
-    function ma(o) {
-      var $, E;
-      return o && (($ = k.value) != null && $.includes) ? (E = k.value) == null ? void 0 : E.includes(o) : !1;
+    function Ie(l) {
+      var I;
+      return l.label ?? ((I = l.value) == null ? void 0 : I.toString()) ?? "";
     }
-    function ba(o) {
-      return e.removeTagsTexts && e.removeTagsTexts.length > o ? e.removeTagsTexts.at(o) : `${ta} ${w.value ? $e(w.value[o]) : ""}`;
+    function ba(l) {
+      var I, E;
+      return l && ((I = M.value) != null && I.includes) ? (E = M.value) == null ? void 0 : E.includes(l) : !1;
     }
-    function ya(o, $) {
-      $ && $.stopPropagation(), He(o.value), Ae();
+    function ya(l) {
+      return e.removeTagsTexts && e.removeTagsTexts.length > l ? e.removeTagsTexts.at(l) : `${ia} ${F.value ? Ie(F.value[l]) : ""}`;
     }
-    function Ue() {
-      if (M.value) {
-        const o = M.value.querySelector("article");
-        o && Z(() => {
-          at(
-            o,
-            M.value,
+    function wa(l, I) {
+      I && I.stopPropagation(), Xe(l.value), De();
+    }
+    function Ge() {
+      if (z.value) {
+        const l = z.value.querySelector("article");
+        l && Z(() => {
+          tt(
+            l,
+            z.value,
             e.placement ?? "bottom"
           );
         }, 1);
       }
     }
-    function wa(o) {
-      var $, E, j, oe, G, me, De;
-      if (($ = M.value) != null && $.open) {
+    function ka(l) {
+      var I, E, j, le, O, be, Ne;
+      if ((I = z.value) != null && I.open) {
         if (self.document) {
           const ue = self.document.activeElement;
           if (ue)
             if (ue.getAttribute("type") === "checkbox" || ue.getAttribute("type") === "radio") {
               const se = ue == null ? void 0 : ue.closest("li");
-              if (o.key === "ArrowDown" || o.key === "ArrowRight")
+              if (l.key === "ArrowDown" || l.key === "ArrowRight")
                 se != null && se.nextElementSibling ? (j = (E = se == null ? void 0 : se.nextElementSibling) == null ? void 0 : E.querySelector("input")) == null || j.focus() : Me(ue);
               else if (se != null && se.previousElementSibling)
-                (G = (oe = se == null ? void 0 : se.previousElementSibling) == null ? void 0 : oe.querySelector("input")) == null || G.focus();
-              else if (M.value.querySelector('input[type="checkbox"]') !== ue)
+                (O = (le = se == null ? void 0 : se.previousElementSibling) == null ? void 0 : le.querySelector("input")) == null || O.focus();
+              else if (z.value.querySelector('input[type="checkbox"]') !== ue)
                 Me(ue);
               else {
-                const Ye = ea(M.value);
-                if (Ye)
+                const Ke = aa(z.value);
+                if (Ke)
                   Z(() => {
-                    Ye.focus();
+                    Ke.focus();
                   }, 100);
                 else {
-                  const Ke = Array.from(
-                    (me = M.value) == null ? void 0 : me.querySelectorAll(
+                  const Je = Array.from(
+                    (be = z.value) == null ? void 0 : be.querySelectorAll(
                       'input[type="checkbox"],input[type="radio"]'
                     )
                   );
-                  Ke.length && ((De = Ke.at(-1)) == null || De.focus());
+                  Je.length && ((Ne = Je.at(-1)) == null || Ne.focus());
                 }
               }
             } else
-              ue.getAttribute("type") === "search" && (o.key === "ArrowUp" || o.key === "ArrowLeft") ? (Ee(void 0, !0), Ae()) : Me(ue);
+              ue.getAttribute("type") === "search" && (l.key === "ArrowUp" || l.key === "ArrowLeft") ? (Ae(void 0, !0), De()) : Me(ue);
         }
-      } else (o.key === "ArrowDown" || o.key === "ArrowRight") && (Ue(), M.value && (M.value.open = !0), Xe());
-      o.stopPropagation(), o.preventDefault();
-    }
-    function ka(o) {
-      var $;
-      o.stopPropagation(), o.key === "Escape" && (($ = M.value) != null && $.open) ? (Ee(void 0, !0), Ae()) : (o.key === "ArrowDown" || o.key === "ArrowUp" || o.key === "ArrowLeft" || o.key === "ArrowRight") && wa(o);
-    }
-    function Ee(o, $) {
-      if (M.value) {
-        if ($)
-          M.value.open = !1, Ae();
-        else if (M.value.open && o && o.relatedTarget) {
-          const E = o.relatedTarget;
-          M.value.contains(E) || Z(() => M.value.open = !1, 1);
+      } else (l.key === "ArrowDown" || l.key === "ArrowRight") && (Ge(), z.value && (z.value.open = !0), je());
+      l.stopPropagation(), l.preventDefault();
+    }
+    function Sa(l) {
+      var I;
+      l.stopPropagation(), l.key === "Escape" && ((I = z.value) != null && I.open) ? (Ae(void 0, !0), De()) : (l.key === "ArrowDown" || l.key === "ArrowUp" || l.key === "ArrowLeft" || l.key === "ArrowRight") && ka(l);
+    }
+    function Ae(l, I) {
+      if (z.value) {
+        if (I)
+          z.value.open = !1, De();
+        else if (z.value.open && l && l.relatedTarget) {
+          const E = l.relatedTarget;
+          z.value.contains(E) || Z(() => z.value.open = !1, 1);
         }
       }
     }
-    function Sa(o) {
-      var $;
-      if (o) {
-        const E = o.target;
-        ($ = M.value) != null && $.open && !M.value.contains(E) && (M.value.open = !1);
+    function Ba(l) {
+      var I;
+      if (l) {
+        const E = l.target;
+        (I = z.value) != null && I.open && !z.value.contains(E) && (z.value.open = !1);
       }
     }
-    function Te(o) {
-      (/* @__PURE__ */ new Date()).getTime() - Ne.value < 200 || (k.value = o, e.onOptionSelected && e.onOptionSelected(o ?? []), de(
-        l,
+    function $e(l) {
+      (/* @__PURE__ */ new Date()).getTime() - Le.value < 200 || (M.value = l, c.value = !0, e.onOptionSelected && e.onOptionSelected(l ?? []), de(
+        o,
         {
           target: {
-            values: o
+            values: l
           }
         },
         "values"
-      ), Ne.value = (/* @__PURE__ */ new Date()).getTime());
+      ), Le.value = (/* @__PURE__ */ new Date()).getTime());
     }
-    function He(o) {
-      var $;
-      o && (e.multiple ? ($ = k.value) != null && $.includes(o) ? Te(k.value.filter((E) => E !== o)) : Te([...k.value || [], o]) : (Te([o]), Ee(void 0, !0)));
+    function Xe(l) {
+      var I;
+      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 Ba(o) {
-      var $;
-      if (o.stopPropagation(), (($ = k.value) == null ? void 0 : $.length) === H.value)
-        Te([]);
+    function La(l) {
+      var I;
+      if (l.stopPropagation(), ((I = M.value) == null ? void 0 : I.length) === B.value)
+        $e([]);
       else {
-        const E = y.value && Pe.value ? Pe.value.value : void 0;
-        Te(
+        const E = X.value && Ue.value ? Ue.value.value : void 0;
+        $e(
           e.options ? e.options.filter(
             (j) => {
-              var oe;
-              return !j.isGroupTitle && (!E || ((oe = j.value) == null ? void 0 : oe.toLowerCase().includes(E.toLowerCase())));
+              var le;
+              return !j.isGroupTitle && (!E || ((le = j.value) == null ? void 0 : le.toLowerCase().includes(E.toLowerCase())));
             }
           ).map((j) => j.value ?? "") : []
         );
       }
     }
-    function Me(o) {
-      if (M.value) {
-        const $ = Array.from(
-          M.value.querySelectorAll(
+    function Me(l) {
+      if (z.value) {
+        const I = Array.from(
+          z.value.querySelectorAll(
             'input[type="checkbox"],input[type="radio"]'
           )
         );
-        if ($.length) {
-          const E = $.at(0), j = E === o && $.length > 1 ? $.at(1) : E;
+        if (I.length) {
+          const E = I.at(0), j = E === l && I.length > 1 ? I.at(1) : E;
           j && Z(() => {
             j.focus();
           }, 1);
         }
       }
     }
-    function Xe() {
-      if (M.value) {
-        const o = ea(M.value);
-        o ? Z(() => {
-          o.focus();
+    function je() {
+      if (z.value) {
+        const l = aa(z.value);
+        l ? Z(() => {
+          l.focus();
         }, 1) : Me();
       }
     }
-    function je(o) {
-      if (o === void 0)
+    function Ye(l) {
+      if (l === void 0)
         return;
-      let $;
-      if (typeof o == "string")
-        $ = o;
+      let I;
+      if (typeof l == "string")
+        I = l;
       else {
-        const E = o;
-        E.stopPropagation(), e.onSearch && e.onSearch(E), $ = E.target.value, qe.value = $;
+        const E = l;
+        E.stopPropagation(), e.onSearch && e.onSearch(E), I = E.target.value, Pe.value = I;
       }
-      !e.options || !$ || $.length === 0 ? X.value = e.options : e.searchFilter ? X.value = e.options.filter(
-        (E) => e.searchFilter(E, $)
-      ) : X.value = e.options.filter(
-        (E) => !E.isGroupTitle && $e(E).toLowerCase().includes($.toLowerCase())
+      !e.options || !I || I.length === 0 ? oe.value = e.options : e.searchFilter ? oe.value = e.options.filter(
+        (E) => e.searchFilter(E, I)
+      ) : oe.value = e.options.filter(
+        (E) => !E.isGroupTitle && Ie(E).toLowerCase().includes(I.toLowerCase())
       );
     }
-    function Ia(o) {
-      o.stopPropagation(), Te([]), Ae();
+    function Ia(l) {
+      l.stopPropagation(), $e([]), De();
     }
-    function Ae() {
-      var o;
-      M.value && ((o = M.value.querySelector("summary")) == null || o.focus());
+    function De() {
+      var l;
+      z.value && ((l = z.value.querySelector("summary")) == null || l.focus());
     }
-    function $a(o) {
-      o.stopPropagation();
+    function $a(l) {
+      l.stopPropagation();
     }
-    return (o, $) => {
-      var E, j, oe;
-      return g(), B("div", {
+    return (l, I) => {
+      var E, j, le;
+      return m(), S("div", {
         id: i.value,
         ref_key: "_ref",
-        ref: ca,
-        class: z(n(q)("db-custom-select", e.class)),
-        "aria-invalid": v.value === "invalid",
-        "data-custom-validity": v.value,
-        "data-width": o.formFieldWidth,
-        "data-variant": o.variant === "floating" && o.selectedType === "tag" && o.multiple ? "above" : o.variant,
-        "data-required": n(F)(o.required),
-        "data-hide-asterisk": n(ie)(o.showRequiredAsterisk),
-        "data-placement": o.placement,
-        "data-selected-type": o.multiple ? o.selectedType : "text",
-        "data-hide-label": n(ie)(o.showLabel),
-        "data-icon": o.icon,
-        "data-show-icon": n(F)(o.showIcon)
+        ref: va,
+        class: P(n(q)("db-custom-select", e.class)),
+        "aria-invalid": r.value === "invalid",
+        "data-custom-validity": r.value,
+        "data-width": l.formFieldWidth,
+        "data-variant": l.variant === "floating" && l.selectedType === "tag" && l.multiple ? "above" : l.variant,
+        "data-required": n(R)(l.required),
+        "data-hide-asterisk": n(ie)(l.showRequiredAsterisk),
+        "data-placement": l.placement,
+        "data-selected-type": l.multiple ? l.selectedType : "text",
+        "data-hide-label": n(ie)(l.showLabel),
+        "data-icon": l.icon,
+        "data-show-icon": n(R)(l.showIcon)
       }, [
-        _("label", { id: p.value }, [
-          N(L(o.label ?? n(ke)), 1),
+        _("label", { id: g.value }, [
+          N($(l.label ?? n(we)), 1),
           _("select", {
             role: "none",
             hidden: !0,
             id: s.value,
             tabIndex: -1,
             ref_key: "selectRef",
-            ref: we,
-            form: o.form,
-            name: o.name,
-            multiple: n(R)(o.multiple, "multiple"),
-            disabled: n(R)(o.disabled, "disabled"),
-            required: n(R)(o.required, "required"),
-            onChange: $[0] || ($[0] = async (G) => $a(G))
+            ref: ve,
+            form: l.form,
+            name: l.name,
+            multiple: n(V)(l.multiple, "multiple"),
+            disabled: n(V)(l.disabled, "disabled"),
+            required: n(V)(l.required, "required"),
+            onChange: I[0] || (I[0] = async (O) => $a(O))
           }, [
-            (E = o.options) != null && E.length ? (g(!0), B(U, { key: 0 }, be(o.options, (G, me) => (g(), B("option", {
-              key: me,
-              disabled: G.disabled,
-              value: G.value
-            }, L($e(G)), 9, It))), 128)) : V("", !0)
-          ], 40, Bt)
-        ], 8, St),
+            (E = l.options) != null && E.length ? (m(!0), S(W, { key: 0 }, ye(l.options, (O, be) => (m(), S("option", {
+              key: be,
+              disabled: O.disabled,
+              value: O.value
+            }, $(Ie(O)), 9, It))), 128)) : U("", !0)
+          ], 40, Lt)
+        ], 8, Bt),
         _("details", {
           ref_key: "detailsRef",
-          ref: M,
-          open: o.open,
-          onToggle: $[2] || ($[2] = async (G) => pa(G)),
-          onKeydown: $[3] || ($[3] = async (G) => ka(G))
+          ref: z,
+          open: l.open,
+          onToggle: I[2] || (I[2] = async (O) => ha(O)),
+          onKeydown: I[3] || (I[3] = async (O) => Sa(O))
         }, [
-          A(o.$slots, "default"),
-          o.options ? (g(), B(U, { key: 0 }, [
+          A(l.$slots, "default"),
+          l.options ? (m(), S(W, { key: 0 }, [
             _("summary", {
               class: "db-custom-select-form-field",
               id: T.value,
-              "aria-disabled": n(F)(o.disabled),
-              "aria-labelledby": p.value
+              "aria-disabled": n(R)(l.disabled),
+              "aria-labelledby": g.value
             }, [
-              (j = I.value) != null && j.length ? (g(), B("span", {
+              (j = C.value) != null && j.length ? (m(), S("span", {
                 key: 0,
-                "data-visually-hidden": n(F)(o.selectedType === "tag"),
-                id: C.value
-              }, L(I.value), 9, Tt)) : V("", !0),
-              o.selectedType === "tag" ? (g(), B("div", _t, [
-                (g(!0), B(U, null, be(w.value, (G, me) => (g(), Q(wt, {
-                  key: me,
+                "data-visually-hidden": n(R)(l.selectedType === "tag"),
+                id: b.value
+              }, $(C.value), 9, _t)) : U("", !0),
+              l.selectedType === "tag" ? (m(), S("div", Ct, [
+                (m(!0), S(W, null, ye(F.value, (O, be) => (m(), J(kt, {
+                  key: be,
                   emphasis: "strong",
                   behavior: "removable",
-                  removeButton: ba(me),
-                  onRemove: (De) => ya(G, De)
+                  removeButton: ya(be),
+                  onRemove: (Ne) => wa(O, Ne)
                 }, {
-                  default: W(() => [
-                    N(L($e(G)), 1)
+                  default: H(() => [
+                    N($(Ie(O)), 1)
                   ]),
                   _: 2
                 }, 1032, ["removeButton", "onRemove"]))), 128))
-              ])) : V("", !0)
-            ], 8, Lt),
-            ee(it, { width: o.dropdownWidth }, {
-              default: W(() => [
-                y.value ? (g(), B("div", Ct, [
-                  ee(mt, {
+              ])) : U("", !0)
+            ], 8, Tt),
+            ee(ot, { width: l.dropdownWidth }, {
+              default: H(() => [
+                X.value ? (m(), S("div", Et, [
+                  ee(bt, {
                     type: "search",
                     ref_key: "searchInputRef",
-                    ref: Pe,
+                    ref: Ue,
                     name: i.value,
                     form: i.value,
                     showLabel: !1,
-                    value: qe.value,
-                    label: o.searchLabel ?? n(ke),
-                    placeholder: o.searchPlaceholder ?? o.searchLabel,
-                    ariaDescribedBy: le.value || o.showLoading ? h.value : void 0,
-                    onInput: (G) => je(G)
+                    value: Pe.value,
+                    label: l.searchLabel ?? n(we),
+                    placeholder: l.searchPlaceholder ?? l.searchLabel,
+                    ariaDescribedBy: K.value || l.showLoading ? h.value : void 0,
+                    onInput: (O) => Ye(O)
                   }, null, 8, ["name", "form", "value", "label", "placeholder", "ariaDescribedBy", "onInput"])
-                ])) : V("", !0),
-                le.value || o.showLoading ? (g(), Q(ae, {
+                ])) : U("", !0),
+                K.value || l.showLoading ? (m(), J(ae, {
                   key: 1,
                   id: h.value,
-                  icon: le.value ? void 0 : "circular_arrows",
-                  semantic: le.value ? "warning" : "informational"
+                  icon: l.showLoading ? "circular_arrows" : void 0,
+                  semantic: l.showLoading ? "informational" : "warning"
                 }, {
-                  default: W(() => [
-                    N(L((le.value ? o.noResultsText : o.loadingText) ?? n(Ca)), 1)
+                  default: H(() => [
+                    N($((l.showLoading ? l.loadingText : l.noResultsText) ?? n(Ea)), 1)
                   ]),
                   _: 1
-                }, 8, ["id", "icon", "semantic"])) : (g(), B(U, { key: 2 }, [
-                  O.value ? (g(), B("div", Et, [
-                    _("div", At, [
+                }, 8, ["id", "icon", "semantic"])) : (m(), S(W, { key: 2 }, [
+                  y.value ? (m(), S("div", At, [
+                    _("div", Dt, [
                       _("label", null, [
                         _("input", {
                           type: "checkbox",
@@ -1869,34 +1869,34 @@ const xa = (t) => {
                           ref_key: "selectAllRef",
                           ref: Fe,
                           form: i.value,
-                          checked: Ve.value,
-                          onChange: $[1] || ($[1] = async (G) => Ba(G))
-                        }, null, 40, Dt),
-                        N(L(ga()), 1)
+                          checked: qe.value,
+                          onChange: I[1] || (I[1] = async (O) => La(O))
+                        }, null, 40, Nt),
+                        N($(ma()), 1)
                       ])
                     ])
-                  ])) : V("", !0),
-                  ee(rt, {
-                    multiple: n(R)(o.multiple, "multiple"),
-                    label: o.ariaListLabel ?? o.label ?? n(ke)
+                  ])) : U("", !0),
+                  ee(ct, {
+                    multiple: n(V)(l.multiple, "multiple"),
+                    label: l.ariaListLabel ?? l.label ?? n(we)
                   }, {
-                    default: W(() => [
-                      (g(!0), B(U, null, be(X.value, (G, me) => (g(), Q(dt, {
-                        key: me,
-                        type: o.multiple ? "checkbox" : "radio",
-                        showDivider: G.showDivider,
-                        icon: G.icon,
-                        isGroupTitle: G.isGroupTitle,
-                        groupTitle: $e(G),
+                    default: H(() => [
+                      (m(!0), S(W, null, ye(oe.value, (O, be) => (m(), J(ut, {
+                        key: be,
+                        type: l.multiple ? "checkbox" : "radio",
+                        showDivider: O.showDivider,
+                        icon: O.icon,
+                        isGroupTitle: O.isGroupTitle,
+                        groupTitle: Ie(O),
                         name: i.value,
-                        checked: ma(G.value),
-                        disabled: G.disabled,
-                        value: G.value,
-                        onChange: (De) => He(G.value)
+                        checked: ba(O.value),
+                        disabled: O.disabled,
+                        value: O.value,
+                        onChange: (Ne) => Xe(O.value)
                       }, {
-                        default: W(() => [
-                          G.isGroupTitle ? V("", !0) : (g(), B(U, { key: 0 }, [
-                            N(L($e(G)), 1)
+                        default: H(() => [
+                          O.isGroupTitle ? U("", !0) : (m(), S(W, { key: 0 }, [
+                            N($(Ie(O)), 1)
                           ], 64))
                         ]),
                         _: 2
@@ -1906,17 +1906,17 @@ const xa = (t) => {
                   }, 8, ["multiple", "label"])
                 ], 64)),
                 _("div", null, [
-                  ee(Be, {
+                  ee(Se, {
                     variant: "ghost",
                     width: "full",
                     icon: "cross",
                     size: "small",
                     name: i.value,
                     form: i.value,
-                    onClick: (G) => Ee(void 0, !0)
+                    onClick: (O) => Ae(void 0, !0)
                   }, {
-                    default: W(() => [
-                      N(L(o.mobileCloseButtonText ?? n(Ge)), 1)
+                    default: H(() => [
+                      N($(l.mobileCloseButtonText ?? n(We)), 1)
                     ]),
                     _: 1
                   }, 8, ["name", "form", "onClick"])
@@ -1924,9 +1924,9 @@ const xa = (t) => {
               ]),
               _: 1
             }, 8, ["width"])
-          ], 64)) : V("", !0)
+          ], 64)) : U("", !0)
         ], 40, $t),
-        (o.showClearSelection ?? !0) && ((oe = k.value) != null && oe.length) ? (g(), Q(Be, {
+        (l.showClearSelection ?? !0) && ((le = M.value) != null && le.length) ? (m(), J(Se, {
           key: 0,
           icon: "cross",
           variant: "ghost",
@@ -1934,60 +1934,60 @@ const xa = (t) => {
           noText: !0,
           name: i.value,
           form: i.value,
-          onClick: (G) => Ia(G)
+          onClick: (O) => Ia(O)
         }, {
-          default: W(() => [
-            N(L(o.clearSelectionText), 1),
-            ee(ra, { placement: "top" }, {
-              default: W(() => [
-                N(L(o.clearSelectionText), 1)
+          default: H(() => [
+            N($(l.clearSelectionText), 1),
+            ee(ca, { placement: "top" }, {
+              default: H(() => [
+                N($(l.clearSelectionText), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
-        }, 8, ["name", "form", "onClick"])) : V("", !0),
+        }, 8, ["name", "form", "onClick"])) : U("", !0),
         _("span", {
-          "aria-hidden": n(F)(!0),
-          id: S.value
-        }, L(o.placeholder ?? o.label), 9, Nt),
-        n(x)(o.message, o.showMessage) ? (g(), Q(ae, {
+          "aria-hidden": n(R)(!0),
+          id: w.value
+        }, $(l.placeholder ?? l.label), 9, Ft),
+        n(x)(l.message, l.showMessage) ? (m(), J(ae, {
           key: 1,
           size: "small",
-          icon: o.messageIcon,
+          icon: l.messageIcon,
           id: u.value
         }, {
-          default: W(() => [
-            N(L(o.message), 1)
+          default: H(() => [
+            N($(l.message), 1)
           ]),
           _: 1
-        }, 8, ["icon", "id"])) : V("", !0),
-        We() ? (g(), Q(ae, {
+        }, 8, ["icon", "id"])) : U("", !0),
+        Oe() ? (m(), J(ae, {
           key: 2,
           size: "small",
           semantic: "successful",
           id: f.value
         }, {
-          default: W(() => [
-            N(L(o.validMessage || n(he)), 1)
+          default: H(() => [
+            N($(l.validMessage || n(ge)), 1)
           ]),
           _: 1
-        }, 8, ["id"])) : V("", !0),
+        }, 8, ["id"])) : U("", !0),
         ee(ae, {
           size: "small",
           semantic: "critical",
-          id: m.value
+          id: p.value
         }, {
-          default: W(() => [
-            N(L(r.value), 1)
+          default: H(() => [
+            N($(v.value), 1)
           ]),
           _: 1
         }, 8, ["id"]),
-        _("span", Ft, L(b.value), 1)
-      ], 10, kt);
+        _("span", Mt, $(k.value), 1)
+      ], 10, St);
     };
   }
-}), Mt = ["id"], ul = /* @__PURE__ */ P({
+}), bo = ["fixed", "auto", "full"], Rt = ["id"], yo = /* @__PURE__ */ G({
   __name: "custom-select-form-field",
   props: {
     children: { default: void 0 },
@@ -1997,17 +1997,17 @@ const xa = (t) => {
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("summary", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("summary", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-custom-select-form-field", a.class))
+      class: P(n(q)("db-custom-select-form-field", a.class))
     }, [
       A(e.$slots, "default")
-    ], 10, Mt));
+    ], 10, Rt));
   }
-}), Rt = ["id", "data-margin", "data-variant", "data-emphasis", "data-width"], rl = /* @__PURE__ */ P({
+}), wo = ["checkbox", "radio"], ko = ["amount", "text", "tag"], zt = ["id", "data-margin", "data-variant", "data-emphasis", "data-width"], So = /* @__PURE__ */ G({
   __name: "divider",
   props: {
     margin: { default: void 0 },
@@ -2021,19 +2021,19 @@ const xa = (t) => {
     width: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("div", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("div", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
       "data-margin": e.margin,
       "data-variant": e.variant,
       "data-emphasis": e.emphasis,
       "data-width": e.width,
-      class: z(n(q)("db-divider", a.class))
-    }, null, 10, Rt));
+      class: P(n(q)("db-divider", a.class))
+    }, null, 10, zt));
   }
-}), zt = ["id", "data-position", "data-backdrop", "data-direction", "data-variant"], qt = ["data-spacing", "data-width", "data-direction", "data-rounded"], Vt = { class: "db-drawer-header" }, Pt = { class: "db-drawer-header-text" }, Ut = { class: "db-drawer-content" }, Gt = /* @__PURE__ */ P({
+}), Bo = ["none", "_"], Lo = ["horizontal", "vertical"], Vt = ["id", "data-position", "data-backdrop", "data-direction", "data-variant"], Pt = ["data-spacing", "data-width", "data-direction", "data-rounded"], qt = { class: "db-drawer-header" }, Ut = { class: "db-drawer-header-text" }, Gt = { class: "db-drawer-content" }, Wt = /* @__PURE__ */ G({
   __name: "drawer",
   props: {
     backdrop: { default: void 0 },
@@ -2056,9 +2056,9 @@ const xa = (t) => {
     spacing: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(!1), e = d(null), i = d(null);
+    const a = t, o = d(!1), e = d(null), i = d(null);
     Y(() => {
-      f(), l.value = !0;
+      f(), o.value = !0;
     }), D(
       () => [a.open],
       () => {
@@ -2069,11 +2069,11 @@ const xa = (t) => {
         flush: "post"
       }
     ), D(
-      () => [e.value, l.value, a.position],
+      () => [e.value, o.value, a.position],
       () => {
-        if (e.value && l.value && a.position === "absolute") {
-          const r = e.value.parentElement;
-          r && (r.style.position = "relative");
+        if (e.value && o.value && a.position === "absolute") {
+          const v = e.value.parentElement;
+          v && (v.style.position = "relative");
         }
       },
       {
@@ -2081,73 +2081,73 @@ const xa = (t) => {
         flush: "post"
       }
     );
-    function u(m, r) {
+    function u(p, v) {
       var s;
-      m && (Va(m) ? m.key === "Escape" && (m.preventDefault(), a.onClose && a.onClose(m)) : (r && (m.stopPropagation(), a.onClose && a.onClose(m)), ((s = m.target) == null ? void 0 : s.nodeName) === "DIALOG" && m.type === "click" && a.backdrop !== "none" && a.onClose && a.onClose(m)));
+      p && (qa(p) ? p.key === "Escape" && (p.preventDefault(), a.onClose && a.onClose(p)) : (v && (p.stopPropagation(), a.onClose && a.onClose(p)), ((s = p.target) == null ? void 0 : s.nodeName) === "DIALOG" && p.type === "click" && a.backdrop !== "none" && a.onClose && a.onClose(p)));
     }
     function f() {
       if (e.value) {
-        const m = !!a.open;
-        m && !e.value.open && (i.value && (i.value.hidden = !1), a.position === "absolute" || a.backdrop === "none" || a.variant === "inside" ? e.value.show() : e.value.showModal()), !m && e.value.open && (i.value && (i.value.hidden = !0), Z(() => {
-          var r;
-          i.value && (i.value.hidden = !1), (r = e.value) == null || r.close();
+        const p = !!a.open;
+        p && !e.value.open && (i.value && (i.value.hidden = !1), a.position === "absolute" || a.backdrop === "none" || a.variant === "inside" ? e.value.show() : e.value.showModal()), !p && e.value.open && (i.value && (i.value.hidden = !0), Z(() => {
+          var v;
+          i.value && (i.value.hidden = !1), (v = e.value) == null || v.close();
         }, 401));
       }
     }
-    return (m, r) => (g(), B("dialog", {
+    return (p, v) => (m(), S("dialog", {
       class: "db-drawer",
-      id: m.id,
+      id: p.id,
       ref_key: "_ref",
       ref: e,
-      onClick: r[0] || (r[0] = async (s) => u(s)),
-      onKeydown: r[1] || (r[1] = async (s) => u(s)),
-      "data-position": m.position,
-      "data-backdrop": m.backdrop,
-      "data-direction": m.direction,
-      "data-variant": m.variant
+      onClick: v[0] || (v[0] = async (s) => u(s)),
+      onKeydown: v[1] || (v[1] = async (s) => u(s)),
+      "data-position": p.position,
+      "data-backdrop": p.backdrop,
+      "data-direction": p.direction,
+      "data-variant": p.variant
     }, [
       _("article", {
         ref_key: "dialogContainerRef",
         ref: i,
-        class: z(n(q)("db-drawer-container", a.class)),
-        "data-spacing": m.spacing,
-        "data-width": m.width,
-        "data-direction": m.direction,
-        "data-rounded": n(F)(m.rounded)
+        class: P(n(q)("db-drawer-container", a.class)),
+        "data-spacing": p.spacing,
+        "data-width": p.width,
+        "data-direction": p.direction,
+        "data-rounded": n(R)(p.rounded)
       }, [
-        _("header", Vt, [
-          _("div", Pt, [
-            A(m.$slots, "drawer-header")
+        _("header", qt, [
+          _("div", Ut, [
+            A(p.$slots, "drawer-header")
           ]),
-          ee(Be, {
+          ee(Se, {
             class: "button-close-drawer",
             icon: "cross",
             variant: "ghost",
-            id: m.closeButtonId,
+            id: p.closeButtonId,
             noText: !0,
             onClick: (s) => u(s, !0)
           }, {
-            default: W(() => [
-              N(L(m.closeButtonText ?? n(Ge)), 1)
+            default: H(() => [
+              N($(p.closeButtonText ?? n(We)), 1)
             ]),
             _: 1
           }, 8, ["id", "onClick"])
         ]),
-        _("div", Ut, [
-          A(m.$slots, "default")
+        _("div", Gt, [
+          A(p.$slots, "default")
         ])
-      ], 10, qt)
-    ], 40, zt));
+      ], 10, Pt)
+    ], 40, Vt));
   }
-}), Wt = (t) => {
-  var l, e;
+}), Io = ["none", "strong", "weak", "invisible"], $o = ["left", "right", "up", "down"], To = ["modal", "inside"], _o = ["fixed", "absolute"], Ot = (t) => {
+  var o, e;
   const {
     target: a
   } = t;
-  return !!(!((l = a == null ? void 0 : a.classList) != null && l.contains("db-navigation-item-expand-button")) && ((e = a == null ? void 0 : a.parentElement) != null && e.classList.contains("db-navigation-item")));
+  return !!(!((o = a == null ? void 0 : a.classList) != null && o.contains("db-navigation-item-expand-button")) && ((e = a == null ? void 0 : a.parentElement) != null && e.classList.contains("db-navigation-item")));
 };
-class Ot {
-  constructor(a, l) {
+class Ht {
+  constructor(a, o) {
     ne(this, "element");
     ne(this, "subNavigation");
     ne(this, "parentSubNavigation", null);
@@ -2156,23 +2156,23 @@ class Ot {
     ne(this, "mouseX", 0);
     ne(this, "mouseY", 0);
     var e;
-    this.element = a, this.subNavigation = l, !(!this.element || !this.subNavigation) && (this.parentSubNavigation = (e = this.element) == null ? void 0 : e.closest(".db-sub-navigation"), this.parentSubNavigation && !this.element.closest(".db-drawer") && this.init());
+    this.element = a, this.subNavigation = o, !(!this.element || !this.subNavigation) && (this.parentSubNavigation = (e = this.element) == null ? void 0 : e.closest(".db-sub-navigation"), this.parentSubNavigation && !this.element.closest(".db-drawer") && this.init());
   }
   init() {
-    var l, e;
-    const a = ((l = this.parentSubNavigation) == null ? void 0 : l.getBoundingClientRect().width) ?? 0;
+    var o, e;
+    const a = ((o = this.parentSubNavigation) == null ? void 0 : o.getBoundingClientRect().width) ?? 0;
     (e = this.element) == null || e.style.setProperty("--db-navigation-item-inline-size", `${a}px`), this.initialized = !0;
   }
   enableFollow() {
     var i;
     if (!this.initialized || this.triangleData || !this.element || !this.subNavigation)
       return;
-    const a = et(this.subNavigation), l = this.element.getBoundingClientRect(), e = ((i = this.parentSubNavigation) == null ? void 0 : i.getBoundingClientRect().width) ?? 0;
+    const a = at(this.subNavigation), o = this.element.getBoundingClientRect(), e = ((i = this.parentSubNavigation) == null ? void 0 : i.getBoundingClientRect().width) ?? 0;
     this.triangleData = {
-      itemRect: l,
+      itemRect: o,
       parentElementWidth: e,
       subNavigationHeight: this.subNavigation.getBoundingClientRect().height,
-      padding: (e - l.width) / 2,
+      padding: (e - o.width) / 2,
       outsideVX: a.vx,
       outsideVY: a.vy
     };
@@ -2198,15 +2198,15 @@ class Ot {
     if (!this.triangleData)
       return;
     if (a === "fill-gap") {
-      const f = `${this.triangleData.itemRect.height + 2 * this.triangleData.padding}px`, m = `${this.triangleData.parentElementWidth - this.triangleData.padding}px`;
+      const f = `${this.triangleData.itemRect.height + 2 * this.triangleData.padding}px`, p = `${this.triangleData.parentElementWidth - this.triangleData.padding}px`;
       return {
-        lb: `${m} ${f}`,
-        lt: `${m} 0`,
+        lb: `${p} ${f}`,
+        lt: `${p} 0`,
         rt: "100% 0",
         rb: `100% ${f}`
       };
     }
-    const l = this.getTriangleTipX(), e = this.getTriangleTipY(), i = `${l}px ${e}px`, u = `${l}px ${e}px`;
+    const o = this.getTriangleTipX(), e = this.getTriangleTipY(), i = `${o}px ${e}px`, u = `${o}px ${e}px`;
     return {
       lb: i,
       lt: u,
@@ -2218,11 +2218,11 @@ class Ot {
     if (!this.initialized || !this.triangleData || !this.element || !this.subNavigation)
       return;
     this.mouseX = a.clientX - this.triangleData.itemRect.left, this.mouseY = a.clientY - this.triangleData.itemRect.top;
-    const l = this.hasMouseEnteredSubNavigation(), e = this.getTriangleCoordinates(l ? "fill-gap" : "safe-triangle");
-    e && (this.element.style.setProperty("--db-navigation-item-clip-path", `polygon(${e.lb}, ${e.lt}, ${e.rt}, ${e.rb})`), l && (this.triangleData = void 0));
+    const o = this.hasMouseEnteredSubNavigation(), e = this.getTriangleCoordinates(o ? "fill-gap" : "safe-triangle");
+    e && (this.element.style.setProperty("--db-navigation-item-clip-path", `polygon(${e.lb}, ${e.lt}, ${e.rt}, ${e.rb})`), o && (this.triangleData = void 0));
   }
 }
-const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-header-drawer-navigation" }, jt = { class: "db-header-meta-navigation" }, Yt = { class: "db-header-secondary-action" }, Kt = { class: "db-header-meta-navigation" }, Jt = { class: "db-header-navigation-bar" }, Qt = { class: "db-header-brand-container" }, Zt = { class: "db-header-navigation-container" }, xt = { class: "db-header-navigation" }, ei = { class: "db-header-primary-action" }, ai = { class: "db-header-action-container" }, ti = { class: "db-header-burger-menu-container" }, ii = { class: "db-header-secondary-action" }, cl = /* @__PURE__ */ P({
+const Xt = ["id", "data-width", "data-on-forcing-mobile"], jt = { class: "db-header-drawer-navigation" }, Yt = { class: "db-header-meta-navigation" }, Kt = { class: "db-header-secondary-action" }, Jt = { class: "db-header-meta-navigation" }, Qt = { class: "db-header-navigation-bar" }, Zt = { class: "db-header-brand-container" }, xt = { class: "db-header-navigation-container" }, ei = { class: "db-header-navigation" }, ai = { class: "db-header-primary-action" }, ti = { class: "db-header-action-container" }, ii = { class: "db-header-burger-menu-container" }, oi = { class: "db-header-secondary-action" }, Co = /* @__PURE__ */ G({
   __name: "header",
   props: {
     brand: {},
@@ -2242,105 +2242,99 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     width: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(!1), i = d(!1), u = d(null);
+    const a = t, o = d(!1), e = d(!1), i = d(null);
     Y(() => {
-      e.value = !0, l.value = a.id || "header-" + J();
+      o.value = !0;
     }), D(
-      () => [e.value],
+      () => [o.value, i.value],
       () => {
-        if (e.value && document && l.value && a.forceMobile) {
-          const r = document.getElementById(
-            l.value ?? ""
-          );
-          r && sa(r, {
-            key: "data-force-mobile",
-            value: "true"
-          }), i.value = !0;
-        }
+        o.value && i.value && a.forceMobile && (da(i.value, {
+          key: "data-force-mobile",
+          value: "true"
+        }), e.value = !0);
       },
       {
         immediate: !0,
         flush: "post"
       }
     );
-    function f(r) {
-      const s = !R(a.drawerOpen, "drawerOpen");
-      a.onToggle && a.onToggle(s);
+    function u(p) {
+      const v = !V(a.drawerOpen, "drawerOpen");
+      a.onToggle && a.onToggle(v);
     }
-    function m(r) {
-      Wt(r) && f();
+    function f(p) {
+      Ot(p) && u();
     }
-    return (r, s) => (g(), B("header", {
+    return (p, v) => (m(), S("header", {
       ref_key: "_ref",
-      ref: u,
-      class: z(n(q)("db-header", a.class)),
-      id: l.value,
-      "data-width": r.width,
-      "data-on-forcing-mobile": r.forceMobile && !i.value
+      ref: i,
+      class: P(n(q)("db-header", a.class)),
+      id: p.id,
+      "data-width": p.width,
+      "data-on-forcing-mobile": p.forceMobile && !e.value
     }, [
-      ee(Gt, {
+      ee(Wt, {
         class: "db-header-drawer",
         spacing: "small",
         rounded: !0,
-        open: n(R)(r.drawerOpen),
-        onClose: (p) => f()
+        open: n(V)(p.drawerOpen),
+        onClose: (s) => u()
       }, {
-        default: W(() => [
-          _("div", Xt, [
+        default: H(() => [
+          _("div", jt, [
             _("div", {
               class: "db-header-navigation",
-              onClick: s[0] || (s[0] = async (p) => m(p))
+              onClick: v[0] || (v[0] = async (s) => f(s))
             }, [
-              A(r.$slots, "default")
+              A(p.$slots, "default")
             ]),
-            _("div", jt, [
-              A(r.$slots, "meta-navigation")
+            _("div", Yt, [
+              A(p.$slots, "meta-navigation")
             ])
           ]),
-          _("div", Yt, [
-            A(r.$slots, "secondary-action")
+          _("div", Kt, [
+            A(p.$slots, "secondary-action")
           ])
         ]),
         _: 3
       }, 8, ["open", "onClose"]),
-      _("div", Kt, [
-        A(r.$slots, "meta-navigation")
-      ]),
       _("div", Jt, [
-        _("div", Qt, [
-          A(r.$slots, "brand")
-        ]),
+        A(p.$slots, "meta-navigation")
+      ]),
+      _("div", Qt, [
         _("div", Zt, [
-          _("div", xt, [
-            A(r.$slots, "default")
-          ]),
+          A(p.$slots, "brand")
+        ]),
+        _("div", xt, [
           _("div", ei, [
-            A(r.$slots, "primary-action")
+            A(p.$slots, "default")
+          ]),
+          _("div", ai, [
+            A(p.$slots, "primary-action")
           ])
         ]),
-        _("div", ai, [
-          _("div", ti, [
-            ee(Be, {
+        _("div", ti, [
+          _("div", ii, [
+            ee(Se, {
               icon: "menu",
               variant: "ghost",
-              id: l.value + "-burger-menu",
               noText: !0,
-              onClick: (p) => f()
+              onClick: (s) => u()
             }, {
-              default: W(() => [
-                N(L(r.burgerMenuLabel ?? n(Da)), 1)
+              default: H(() => [
+                N($(p.burgerMenuLabel ?? n(Na)), 1)
               ]),
               _: 1
-            }, 8, ["id", "onClick"])
+            }, 8, ["onClick"])
           ]),
-          _("div", ii, [
-            A(r.$slots, "secondary-action")
+          _("div", oi, [
+            A(p.$slots, "secondary-action")
           ])
         ])
       ])
-    ], 10, Ht));
+    ], 10, Xt));
   }
-}), li = ["id", "data-icon", "data-icon-weight", "data-icon-variant"], vl = /* @__PURE__ */ P({
+}), li = ["id", "data-icon", "data-icon-weight", "data-icon-variant"], Eo = /* @__PURE__ */ G({
   __name: "icon",
   props: {
     variant: { default: void 0 },
@@ -2354,23 +2348,42 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("span", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("span", {
       "aria-hidden": "true",
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-icon", a.class)),
+      class: P(n(q)("db-icon", a.class)),
       "data-icon": e.icon,
       "data-icon-weight": e.weight,
       "data-icon-variant": e.variant
     }, [
-      e.text ? (g(), B(U, { key: 0 }, [
-        N(L(e.text), 1)
+      e.text ? (m(), S(W, { key: 0 }, [
+        N($(e.text), 1)
       ], 64)) : A(e.$slots, "default", { key: 1 })
     ], 10, li));
   }
-}), oi = ["id", "href", "target", "rel", "role", "hrefLang", "aria-disabled", "tabIndex", "data-size", "data-show-icon-trailing", "data-variant", "data-content", "data-wrap"], fl = /* @__PURE__ */ P({
+}), Ao = ["16", "20", "24", "32", "48", "64"], Do = [
+  "color",
+  "date",
+  "datetime-local",
+  "email",
+  "file",
+  // TODO: move this to own component
+  "hidden",
+  "month",
+  "number",
+  "password",
+  "range",
+  // TODO: move this to own component
+  "search",
+  "tel",
+  "text",
+  "time",
+  "url",
+  "week"
+], ni = ["id", "href", "target", "rel", "role", "hrefLang", "aria-disabled", "tabIndex", "data-size", "data-show-icon-trailing", "data-variant", "data-content", "data-wrap"], No = /* @__PURE__ */ G({
   __name: "link",
   props: {
     content: { default: void 0 },
@@ -2394,35 +2407,35 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     wrap: { type: [Boolean, String], default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     function e(i) {
       a.onClick && a.onClick(i);
     }
-    return (i, u) => (g(), B("a", {
+    return (i, u) => (m(), S("a", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: i.id,
-      class: z(n(q)("db-link", a.class)),
+      class: P(n(q)("db-link", a.class)),
       href: i.href,
       target: i.target,
       rel: i.rel,
       role: i.role,
       hrefLang: i.hreflang,
-      "aria-disabled": n(F)(i.disabled),
+      "aria-disabled": n(R)(i.disabled),
       tabIndex: i.disabled ? -1 : 0,
       "data-size": i.size,
-      "data-show-icon-trailing": n(F)(i.showIcon ?? !0),
+      "data-show-icon-trailing": n(R)(i.showIcon ?? !0),
       "data-variant": i.variant,
       "data-content": i.content || "internal",
-      "data-wrap": n(F)(i.wrap),
+      "data-wrap": n(R)(i.wrap),
       onClick: u[0] || (u[0] = async (f) => e(f))
     }, [
-      i.text ? (g(), B(U, { key: 0 }, [
-        N(L(i.text), 1)
+      i.text ? (m(), S(W, { key: 0 }, [
+        N($(i.text), 1)
       ], 64)) : A(i.$slots, "default", { key: 1 })
-    ], 10, oi));
+    ], 10, ni));
   }
-}), ni = ["id"], pl = /* @__PURE__ */ P({
+}), Fo = ["adaptive", "brand", "inline"], Mo = ["medium", "small"], Ro = ["external", "internal"], si = ["id"], zo = /* @__PURE__ */ G({
   __name: "navigation",
   props: {
     children: { default: void 0 },
@@ -2432,24 +2445,24 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(null);
+    const a = t, o = d(Te), e = d(null);
     return Y(() => {
-      l.value = a.id || "navigation-" + J();
-    }), (i, u) => (g(), B("nav", {
+      o.value = a.id || "navigation-" + Q();
+    }), (i, u) => (m(), S("nav", {
       ref_key: "_ref",
       ref: e,
-      id: l.value,
-      class: z(n(q)("db-navigation", a.class))
+      id: o.value,
+      class: P(n(q)("db-navigation", a.class))
     }, [
       _("menu", null, [
         A(i.$slots, "default")
       ])
-    ], 10, ni));
+    ], 10, si));
   }
-}), si = ["id", "data-width", "data-icon", "data-show-icon", "data-active", "data-wrap", "aria-disabled"], di = ["aria-haspopup", "aria-expanded", "disabled"], ui = ["data-force-close", "id"], ri = {
+}), di = ["id", "data-width", "data-icon", "data-show-icon", "data-active", "data-wrap", "aria-disabled"], ui = ["aria-haspopup", "aria-expanded", "disabled"], ri = ["data-force-close", "id"], ci = {
   key: 0,
   class: "db-mobile-navigation-back"
-}, hl = /* @__PURE__ */ P({
+}, Vo = /* @__PURE__ */ G({
   __name: "navigation-item",
   props: {
     active: { type: Boolean, default: void 0 },
@@ -2471,15 +2484,15 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(!1), e = d(!1), i = d(!0), u = d(!1), f = d(!1), m = d(
-      "sub-navigation-" + J()
-    ), r = d(void 0), s = d(null);
+    const a = t, o = d(!1), e = d(!1), i = d(!0), u = d(!1), f = d(!1), p = d(
+      "sub-navigation-" + Q()
+    ), v = d(void 0), s = d(null);
     Y(() => {
-      l.value = !0;
+      o.value = !0;
     }), D(
       () => [a.subNavigationExpanded],
       () => {
-        a.subNavigationExpanded !== void 0 && (u.value = !!R(
+        a.subNavigationExpanded !== void 0 && (u.value = !!V(
           a.subNavigationExpanded,
           "subNavigationExpanded"
         ));
@@ -2489,14 +2502,14 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         flush: "post"
       }
     ), D(
-      () => [l.value, s.value],
+      () => [o.value, s.value],
       () => {
         var h;
-        if (l.value && s.value) {
-          const v = s.value.querySelector("menu");
-          v && (((h = v.children) == null ? void 0 : h.length) > 0 ? (e.value = !0, r.value || (r.value = new Ot(
+        if (o.value && s.value) {
+          const r = s.value.querySelector("menu");
+          r && (((h = r.children) == null ? void 0 : h.length) > 0 ? (e.value = !0, v.value || (v.value = new Ht(
             s.value,
-            v
+            r
           ))) : i.value = !1);
         }
       },
@@ -2505,84 +2518,84 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         flush: "post"
       }
     );
-    function p(h) {
-      var v;
-      ((v = h == null ? void 0 : h.target) == null ? void 0 : v.nodeName) === "A" && (f.value = !0, Z(() => {
+    function g(h) {
+      var r;
+      ((r = h == null ? void 0 : h.target) == null ? void 0 : r.nodeName) === "A" && (f.value = !0, Z(() => {
         f.value = !1;
       }, 1e3));
     }
     function T(h) {
       a.onClick && (h.stopPropagation(), a.onClick(h)), e.value && (u.value = !0);
     }
-    function S(h) {
+    function w(h) {
       h.stopPropagation(), u.value = !1;
     }
-    return (h, v) => (g(), B("li", {
+    return (h, r) => (m(), S("li", {
       ref_key: "_ref",
       ref: s,
       id: h.id,
-      onMouseover: v[2] || (v[2] = async (c) => {
-        var I;
-        return (I = r.value) == null ? void 0 : I.enableFollow();
+      onMouseover: r[2] || (r[2] = async (c) => {
+        var L;
+        return (L = v.value) == null ? void 0 : L.enableFollow();
       }),
-      onMouseleave: v[3] || (v[3] = async (c) => {
-        var I;
-        return (I = r.value) == null ? void 0 : I.disableFollow();
+      onMouseleave: r[3] || (r[3] = async (c) => {
+        var L;
+        return (L = v.value) == null ? void 0 : L.disableFollow();
       }),
-      onMousemove: v[4] || (v[4] = async (c) => {
-        var I;
-        return (I = r.value) == null ? void 0 : I.followByMouseEvent(c);
+      onMousemove: r[4] || (r[4] = async (c) => {
+        var L;
+        return (L = v.value) == null ? void 0 : L.followByMouseEvent(c);
       }),
-      class: z(n(q)("db-navigation-item", a.class)),
+      class: P(n(q)("db-navigation-item", a.class)),
       "data-width": h.width,
       "data-icon": h.icon,
-      "data-show-icon": n(F)(h.showIcon),
+      "data-show-icon": n(R)(h.showIcon),
       "data-active": h.active,
-      "data-wrap": n(F)(h.wrap),
-      "aria-disabled": n(F)(h.disabled)
+      "data-wrap": n(R)(h.wrap),
+      "aria-disabled": n(R)(h.disabled)
     }, [
-      i.value ? V("", !0) : (g(), B(U, { key: 0 }, [
-        h.text ? (g(), B(U, { key: 0 }, [
-          N(L(h.text), 1)
+      i.value ? U("", !0) : (m(), S(W, { key: 0 }, [
+        h.text ? (m(), S(W, { key: 0 }, [
+          N($(h.text), 1)
         ], 64)) : A(h.$slots, "default", { key: 1 })
       ], 64)),
-      i.value ? (g(), B(U, { key: 1 }, [
+      i.value ? (m(), S(W, { key: 1 }, [
         _("button", {
           class: "db-navigation-item-expand-button",
           "aria-haspopup": e.value,
           "aria-expanded": u.value,
-          disabled: n(R)(h.disabled, "disabled"),
-          onClick: v[0] || (v[0] = async (c) => T(c))
+          disabled: n(V)(h.disabled, "disabled"),
+          onClick: r[0] || (r[0] = async (c) => T(c))
         }, [
-          h.text ? (g(), B(U, { key: 0 }, [
-            N(L(h.text), 1)
+          h.text ? (m(), S(W, { key: 0 }, [
+            N($(h.text), 1)
           ], 64)) : A(h.$slots, "default", { key: 1 })
-        ], 8, di),
+        ], 8, ui),
         _("menu", {
           class: "db-sub-navigation",
           "data-force-close": f.value,
-          id: m.value,
-          onClick: v[1] || (v[1] = async (c) => p(c))
+          id: p.value,
+          onClick: r[1] || (r[1] = async (c) => g(c))
         }, [
-          e.value ? (g(), B("div", ri, [
-            ee(Be, {
+          e.value ? (m(), S("div", ci, [
+            ee(Se, {
               icon: "arrow_left",
               variant: "ghost",
               id: h.backButtonId,
-              onClick: (c) => S(c)
+              onClick: (c) => w(c)
             }, {
-              default: W(() => [
-                N(L(h.backButtonText ?? n(Ea)), 1)
+              default: H(() => [
+                N($(h.backButtonText ?? n(Aa)), 1)
               ]),
               _: 1
             }, 8, ["id", "onClick"])
-          ])) : V("", !0),
+          ])) : U("", !0),
           A(h.$slots, "sub-navigation")
-        ], 8, ui)
-      ], 64)) : V("", !0)
-    ], 42, si));
+        ], 8, ri)
+      ], 64)) : U("", !0)
+    ], 42, di));
   }
-}), ci = ["id", "aria-live", "data-semantic", "data-variant", "data-icon", "data-show-icon", "data-link-variant"], vi = { key: 0 }, fi = { key: 1 }, gl = /* @__PURE__ */ P({
+}), vi = ["id", "aria-live", "data-semantic", "data-variant", "data-icon", "data-show-icon", "data-link-variant"], fi = { key: 0 }, pi = { key: 1 }, Po = /* @__PURE__ */ G({
   __name: "notification",
   props: {
     ariaLive: { default: void 0 },
@@ -2613,32 +2626,32 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     text: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     function e(i) {
       i && (i.stopPropagation(), a.onClose && a.onClose(i));
     }
-    return (i, u) => (g(), B("article", {
+    return (i, u) => (m(), S("article", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: i.id,
-      class: z(n(q)("db-notification", a.class)),
+      class: P(n(q)("db-notification", a.class)),
       "aria-live": i.ariaLive,
       "data-semantic": i.semantic,
       "data-variant": i.variant,
       "data-icon": i.icon,
-      "data-show-icon": n(F)(i.showIcon),
+      "data-show-icon": n(R)(i.showIcon),
       "data-link-variant": i.linkVariant
     }, [
       A(i.$slots, "image"),
-      n(x)(i.headline, i.showHeadline) ? (g(), B("header", vi, L(i.headline), 1)) : V("", !0),
+      n(x)(i.headline, i.showHeadline) ? (m(), S("header", fi, $(i.headline), 1)) : U("", !0),
       _("p", null, [
-        i.text ? (g(), B(U, { key: 0 }, [
-          N(L(i.text), 1)
+        i.text ? (m(), S(W, { key: 0 }, [
+          N($(i.text), 1)
         ], 64)) : A(i.$slots, "default", { key: 1 })
       ]),
-      n(x)(i.timestamp, i.showTimestamp) ? (g(), B("span", fi, L(i.timestamp), 1)) : V("", !0),
+      n(x)(i.timestamp, i.showTimestamp) ? (m(), S("span", pi, $(i.timestamp), 1)) : U("", !0),
       A(i.$slots, "link"),
-      n(R)(i.closeable, "closeable") ? (g(), Q(Be, {
+      n(V)(i.closeable, "closeable") ? (m(), J(Se, {
         key: 2,
         icon: "cross",
         variant: "ghost",
@@ -2647,14 +2660,14 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         noText: !0,
         onClick: (f) => e(f)
       }, {
-        default: W(() => [
-          N(L(i.closeButtonText ?? n(Ge)), 1)
+        default: H(() => [
+          N($(i.closeButtonText ?? n(We)), 1)
         ]),
         _: 1
-      }, 8, ["id", "onClick"])) : V("", !0)
-    ], 10, ci));
+      }, 8, ["id", "onClick"])) : U("", !0)
+    ], 10, vi));
   }
-}), pi = ["id", "data-variant", "data-fade-in", "data-fonts-loaded"], ml = /* @__PURE__ */ P({
+}), qo = ["docked", "standalone", "overlay"], Uo = ["block", "inline"], Go = ["assertive", "polite", "off"], hi = ["id", "data-variant", "data-fade-in", "data-fonts-loaded"], Wo = /* @__PURE__ */ G({
   __name: "page",
   props: {
     documentOverflow: { default: void 0 },
@@ -2670,32 +2683,32 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(!1), e = d(null);
+    const a = t, o = d(!1), e = d(null);
     return typeof window < "u" && document && (a.documentOverflow === "hidden" || a.variant === "fixed" && a.documentOverflow !== "auto") && document.documentElement.classList.add("db-page-document"), Y(() => {
-      l.value = !a.fadeIn, document && a.fadeIn ? document.fonts.ready.then(() => {
-        l.value = !0;
-      }) : l.value = !0;
-    }), _a(() => {
+      o.value = !a.fadeIn, document && a.fadeIn ? document.fonts.ready.then(() => {
+        o.value = !0;
+      }) : o.value = !0;
+    }), Ca(() => {
       typeof window < "u" && document.documentElement.classList.contains("db-page-document") && document.documentElement.classList.remove("db-page-document");
-    }), (i, u) => (g(), B("div", {
+    }), (i, u) => (m(), S("div", {
       ref_key: "_ref",
       ref: e,
       id: i.id,
-      class: z(n(q)("db-page", a.class)),
+      class: P(n(q)("db-page", a.class)),
       "data-variant": i.variant,
-      "data-fade-in": n(F)(i.fadeIn),
-      "data-fonts-loaded": n(F)(l.value)
+      "data-fade-in": n(R)(i.fadeIn),
+      "data-fonts-loaded": n(R)(o.value)
     }, [
       A(i.$slots, "header"),
       _("main", {
-        class: z(n(q)("db-main", i.mainClass))
+        class: P(n(q)("db-main", i.mainClass))
       }, [
         A(i.$slots, "default")
       ], 2),
       A(i.$slots, "footer")
-    ], 10, pi));
+    ], 10, hi));
   }
-}), hi = ["id"], gi = ["data-spacing", "data-gap", "data-animation", "data-open", "data-delay", "data-width", "data-placement"], bl = /* @__PURE__ */ P({
+}), Oo = ["auto", "fixed"], Ho = ["hidden", "auto"], gi = ["id"], mi = ["data-spacing", "data-gap", "data-animation", "data-open", "data-delay", "data-width", "data-placement"], Xo = /* @__PURE__ */ G({
   __name: "popover",
   props: {
     open: { type: [Boolean, String], default: void 0 },
@@ -2713,25 +2726,25 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     width: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(!1), e = d(!1), i = d(void 0), u = d(void 0), f = d(null);
+    const a = t, o = d(!1), e = d(!1), i = d(void 0), u = d(void 0), f = d(null);
     Y(() => {
-      l.value = !0;
+      o.value = !0;
     }), D(
-      () => [f.value, l.value],
+      () => [f.value, o.value],
       () => {
-        if (f.value && l.value) {
-          l.value = !1;
-          const h = S();
-          h && (h.ariaHasPopup = "true"), r(), f.value.addEventListener(
+        if (f.value && o.value) {
+          o.value = !1;
+          const h = w();
+          h && (h.ariaHasPopup = "true"), v(), f.value.addEventListener(
             "keydown",
-            (v) => m(v)
-          ), ["mouseenter", "focusin"].forEach((v) => {
-            f.value.addEventListener(v, () => p());
-          }), ["mouseleave", "focusout"].forEach((v) => {
-            f.value.addEventListener(v, () => T());
-          }), typeof window < "u" && "IntersectionObserver" in window && (u.value = new IntersectionObserver((v) => {
-            const c = v.find(({ target: I }) => I === S());
-            c && !c.isIntersecting && m(!1);
+            (r) => p(r)
+          ), ["mouseenter", "focusin"].forEach((r) => {
+            f.value.addEventListener(r, () => g());
+          }), ["mouseleave", "focusout"].forEach((r) => {
+            f.value.addEventListener(r, () => T());
+          }), typeof window < "u" && "IntersectionObserver" in window && (u.value = new IntersectionObserver((r) => {
+            const c = r.find(({ target: L }) => L === w());
+            c && !c.isIntersecting && p(!1);
           }));
         }
       },
@@ -2743,7 +2756,7 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
       () => [f.value, e.value],
       () => {
         if (f.value) {
-          const h = S();
+          const h = w();
           h && (h.ariaExpanded = (!!e.value).toString());
         }
       },
@@ -2752,16 +2765,16 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         flush: "post"
       }
     );
-    function m(h) {
+    function p(h) {
       if (!h || h.key === "Escape")
-        for (const v of Array.from(f.value.children))
-          v.blur();
+        for (const r of Array.from(f.value.children))
+          r.blur();
     }
-    function r() {
+    function v() {
       if (!f.value) return;
       const h = f.value.querySelector("article");
       h && Z(() => {
-        ua(
+        ra(
           h,
           f.value,
           a.placement ?? "bottom"
@@ -2769,60 +2782,60 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
       }, 1);
     }
     function s(h) {
-      var v, c;
-      (v = h == null ? void 0 : h.target) != null && v.contains && ((c = h == null ? void 0 : h.target) != null && c.contains(f.value)) && r();
+      var r, c;
+      (r = h == null ? void 0 : h.target) != null && r.contains && ((c = h == null ? void 0 : h.target) != null && c.contains(f.value)) && v();
     }
-    function p() {
-      var v;
-      e.value = !0, i.value = new Ie().addCallback(
+    function g() {
+      var r;
+      e.value = !0, i.value = new Be().addCallback(
         (c) => s(c)
-      ), r();
-      const h = S();
-      h && ((v = u.value) == null || v.observe(h));
+      ), v();
+      const h = w();
+      h && ((r = u.value) == null || r.observe(h));
     }
     function T(h) {
-      var v;
+      var r;
       {
-        e.value = !1, i.value && new Ie().removeCallback(
+        e.value = !1, i.value && new Be().removeCallback(
           i.value
         );
-        const c = S();
-        c && ((v = u.value) == null || v.unobserve(c));
+        const c = w();
+        c && ((r = u.value) == null || r.unobserve(c));
       }
     }
-    function S() {
+    function w() {
       var h;
       if (f.value) {
-        const v = Array.from(f.value.children);
-        if (v.length >= 2) {
-          const c = v[0];
+        const r = Array.from(f.value.children);
+        if (r.length >= 2) {
+          const c = r[0];
           return c.tagName.includes("-") ? ((h = c.children) == null ? void 0 : h.length) > 0 ? c.children[0] : null : c;
         }
       }
       return null;
     }
-    return (h, v) => (g(), B("div", {
+    return (h, r) => (m(), S("div", {
       ref_key: "_ref",
       ref: f,
       id: h.id,
-      class: z(n(q)("db-popover", a.class))
+      class: P(n(q)("db-popover", a.class))
     }, [
       A(h.$slots, "trigger"),
       _("article", {
         class: "db-popover-content",
         "data-spacing": h.spacing,
-        "data-gap": n(F)(h.gap),
-        "data-animation": n(F)(h.animation ?? !0),
-        "data-open": n(F)(h.open),
+        "data-gap": n(R)(h.gap),
+        "data-animation": n(R)(h.animation ?? !0),
+        "data-open": n(R)(h.open),
         "data-delay": h.delay,
         "data-width": h.width,
         "data-placement": h.placement
       }, [
         A(h.$slots, "default")
-      ], 8, gi)
-    ], 10, hi));
+      ], 8, mi)
+    ], 10, gi));
   }
-}), mi = ["data-size", "data-hide-label", "data-hide-asterisk", "for"], bi = ["aria-invalid", "data-custom-validity", "id", "name", "checked", "disabled", "value", "required"], yl = /* @__PURE__ */ P({
+}), bi = ["data-size", "data-hide-label", "data-hide-asterisk", "for"], yi = ["aria-invalid", "data-custom-validity", "id", "name", "checked", "disabled", "value", "required"], jo = /* @__PURE__ */ G({
   __name: "radio",
   props: {
     children: { default: void 0 },
@@ -2851,9 +2864,9 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
   },
   emits: ["update:value"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(!1), u = d(void 0), f = d(null);
+    const o = a, e = t, i = d(!1), u = d(void 0), f = d(null);
     Y(() => {
-      i.value = !0, u.value = e.id ?? `radio-${J()}`;
+      i.value = !0, u.value = e.id ?? `radio-${Q()}`;
     }), D(
       () => [i.value, f.value, e.checked],
       () => {
@@ -2864,44 +2877,44 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         flush: "post"
       }
     );
-    function m(p) {
-      e.onChange && e.onChange(p), de(l, p);
+    function p(g) {
+      e.onChange && e.onChange(g), de(o, g);
     }
-    function r(p) {
-      e.onBlur && e.onBlur(p);
+    function v(g) {
+      e.onBlur && e.onBlur(g);
     }
-    function s(p) {
-      e.onFocus && e.onFocus(p);
+    function s(g) {
+      e.onFocus && e.onFocus(g);
     }
-    return (p, T) => (g(), B("label", {
-      "data-size": p.size,
-      "data-hide-label": n(ie)(p.showLabel),
-      "data-hide-asterisk": n(ie)(p.showRequiredAsterisk),
-      class: z(n(q)("db-radio", e.class)),
+    return (g, T) => (m(), S("label", {
+      "data-size": g.size,
+      "data-hide-label": n(ie)(g.showLabel),
+      "data-hide-asterisk": n(ie)(g.showRequiredAsterisk),
+      class: P(n(q)("db-radio", e.class)),
       for: u.value
     }, [
       _("input", {
         type: "radio",
-        "aria-invalid": p.validation === "invalid",
-        "data-custom-validity": p.validation,
+        "aria-invalid": g.validation === "invalid",
+        "data-custom-validity": g.validation,
         ref_key: "_ref",
         ref: f,
         id: u.value,
-        name: p.name,
-        checked: n(R)(p.checked, "checked"),
-        disabled: n(R)(p.disabled, "disabled"),
-        value: p.value,
-        required: n(R)(p.required, "required"),
-        onChange: T[0] || (T[0] = async (S) => m(S)),
-        onBlur: T[1] || (T[1] = async (S) => r(S)),
-        onFocus: T[2] || (T[2] = async (S) => s(S))
-      }, null, 40, bi),
-      p.label ? (g(), B(U, { key: 0 }, [
-        N(L(p.label), 1)
-      ], 64)) : A(p.$slots, "default", { key: 1 })
-    ], 10, mi));
+        name: g.name,
+        checked: n(V)(g.checked, "checked"),
+        disabled: n(V)(g.disabled, "disabled"),
+        value: g.value,
+        required: n(V)(g.required, "required"),
+        onChange: T[0] || (T[0] = async (w) => p(w)),
+        onBlur: T[1] || (T[1] = async (w) => v(w)),
+        onFocus: T[2] || (T[2] = async (w) => s(w))
+      }, null, 40, yi),
+      g.label ? (m(), S(W, { key: 0 }, [
+        N($(g.label), 1)
+      ], 64)) : A(g.$slots, "default", { key: 1 })
+    ], 10, bi));
   }
-}), yi = ["id", "data-spacing", "data-width"], wl = /* @__PURE__ */ P({
+}), wi = ["id", "data-spacing", "data-width"], Yo = /* @__PURE__ */ G({
   __name: "section",
   props: {
     children: { default: void 0 },
@@ -2913,24 +2926,24 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     width: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(null);
+    const a = t, o = d(Te), e = d(null);
     return Y(() => {
-      l.value = a.id || "section-" + J();
-    }), (i, u) => (g(), B("section", {
+      o.value = a.id || "section-" + Q();
+    }), (i, u) => (m(), S("section", {
       ref_key: "_ref",
       ref: e,
-      id: l.value,
-      class: z(n(q)("db-section", a.class)),
+      id: o.value,
+      class: P(n(q)("db-section", a.class)),
       "data-spacing": i.spacing || "medium",
       "data-width": i.width
     }, [
       A(i.$slots, "default")
-    ], 10, yi));
+    ], 10, wi));
   }
-}), wi = ["data-variant", "data-hide-label", "data-hide-asterisk", "data-icon", "data-show-icon"], ki = ["for"], Si = ["aria-invalid", "data-custom-validity", "required", "disabled", "id", "name", "size", "value", "autocomplete", "multiple", "aria-describedby"], Bi = ["label"], Ii = ["value", "selected", "disabled"], $i = ["value", "disabled", "selected"], Li = ["id"], Ti = {
+}), ki = ["data-variant", "data-hide-label", "data-hide-asterisk", "data-icon", "data-show-icon"], Si = ["for"], Bi = ["aria-invalid", "data-custom-validity", "required", "disabled", "id", "name", "size", "value", "autocomplete", "multiple", "aria-describedby"], Li = ["label"], Ii = ["value", "selected", "disabled"], $i = ["value", "disabled", "selected"], Ti = ["id"], _i = {
   "data-visually-hidden": "true",
   role: "status"
-}, kl = /* @__PURE__ */ P({
+}, Ko = /* @__PURE__ */ G({
   __name: "select",
   props: {
     children: { default: void 0 },
@@ -2973,27 +2986,27 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
   },
   emits: ["update:value"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), m = d(void 0), r = d(void 0), s = d(""), p = d(""), T = d(""), S = d(!1), h = d(""), v = 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(""), g = d(void 0), T = d(""), w = d(!1), h = d(""), r = d(null);
     Y(() => {
-      S.value = !0;
-      const k = e.id ?? `select-${J()}`;
-      i.value = k, u.value = k + ve, f.value = k + fe, m.value = k + pe, s.value = k + Re, r.value = e.invalidMessage || te;
+      w.value = !0;
+      const B = e.id ?? `select-${Q()}`;
+      i.value = B, u.value = B + fe, f.value = B + pe, p.value = B + he, s.value = B + Re, v.value = e.invalidMessage || te;
     }), D(
-      () => [v.value, e.invalidMessage],
+      () => [r.value, e.invalidMessage],
       () => {
-        var k;
-        r.value = e.invalidMessage || ((k = v.value) == null ? void 0 : k.validationMessage) || te;
+        var B;
+        v.value = e.invalidMessage || ((B = r.value) == null ? void 0 : B.validationMessage) || te;
       },
       {
         immediate: !0,
         flush: "post"
       }
     ), D(
-      () => [i.value, S.value],
+      () => [i.value, w.value],
       () => {
-        if (i.value && S.value) {
-          const k = i.value + ve, X = i.value + Re;
-          u.value = k, f.value = i.value + fe, m.value = i.value + pe, s.value = X, x(e.message, e.showMessage) ? p.value = k : p.value = X, S.value = !1;
+        if (i.value && w.value) {
+          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;
         }
       },
       {
@@ -3013,118 +3026,118 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     function c() {
       return !!(e.validMessage ?? e.validation === "valid");
     }
-    function I() {
-      var k, X, le;
-      !((k = v.value) != null && k.validity.valid) || e.validation === "invalid" ? (p.value = m.value, r.value = e.invalidMessage || ((X = v.value) == null ? void 0 : X.validationMessage) || te, ge() && (h.value = r.value, Z(() => h.value = "", 1e3))) : c() && ((le = v.value) != null && le.validity.valid) && e.required ? (p.value = f.value, ge() && (h.value = e.validMessage ?? he, Z(() => h.value = "", 1e3))) : x(e.message, e.showMessage) ? p.value = u.value : p.value = s.value;
+    function L() {
+      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(k) {
-      e.onClick && e.onClick(k);
+    function C(B) {
+      e.onClick && e.onClick(B);
     }
-    function b(k) {
-      e.input && e.input(k), T.value = k.target.value, e.onInput && e.onInput(k), de(l, k), I();
+    function b(B) {
+      e.input && e.input(B), T.value = B.target.value, e.onInput && e.onInput(B), de(o, B), L();
     }
-    function w(k) {
-      e.onChange && e.onChange(k), de(l, k), I();
+    function k(B) {
+      e.onChange && e.onChange(B), de(o, B), L();
     }
-    function O(k) {
-      e.onBlur && e.onBlur(k);
+    function F(B) {
+      e.onBlur && e.onBlur(B);
     }
-    function y(k) {
-      e.onFocus && e.onFocus(k);
+    function y(B) {
+      e.onFocus && e.onFocus(B);
+    }
+    function X(B) {
+      var M;
+      return B.label ?? ((M = B.value) == null ? void 0 : M.toString());
     }
-    function H(k) {
-      var X;
-      return k.label ?? ((X = k.value) == null ? void 0 : X.toString());
-    }
-    return (k, X) => {
-      var le;
-      return g(), B("div", {
-        class: z(n(q)("db-select", e.class)),
-        "data-variant": k.variant,
-        "data-hide-label": n(ie)(k.showLabel),
-        "data-hide-asterisk": n(ie)(k.showRequiredAsterisk),
-        "data-icon": k.icon,
-        "data-show-icon": n(F)(k.showIcon)
+    return (B, M) => {
+      var oe;
+      return m(), S("div", {
+        class: P(n(q)("db-select", e.class)),
+        "data-variant": B.variant,
+        "data-hide-label": n(ie)(B.showLabel),
+        "data-hide-asterisk": n(ie)(B.showRequiredAsterisk),
+        "data-icon": B.icon,
+        "data-show-icon": n(R)(B.showIcon)
       }, [
-        _("label", { for: i.value }, L(k.label ?? n(ke)), 9, ki),
+        _("label", { for: i.value }, $(B.label ?? n(we)), 9, Si),
         _("select", {
-          "aria-invalid": k.validation === "invalid",
-          "data-custom-validity": k.validation,
+          "aria-invalid": B.validation === "invalid",
+          "data-custom-validity": B.validation,
           ref_key: "_ref",
-          ref: v,
-          required: n(R)(k.required, "required"),
-          disabled: n(R)(k.disabled, "disabled"),
+          ref: r,
+          required: n(V)(B.required, "required"),
+          disabled: n(V)(B.disabled, "disabled"),
           id: i.value,
-          name: k.name,
-          size: k.size,
-          value: k.value ?? T.value,
-          autocomplete: k.autocomplete,
-          multiple: k.multiple,
-          onInput: X[0] || (X[0] = async (K) => b(K)),
-          onClick: X[1] || (X[1] = async (K) => C(K)),
-          onChange: X[2] || (X[2] = async (K) => w(K)),
-          onBlur: X[3] || (X[3] = async (K) => O(K)),
-          onFocus: X[4] || (X[4] = async (K) => y(K)),
-          "aria-describedby": k.ariaDescribedBy ?? p.value
+          name: B.name,
+          size: B.size,
+          value: B.value ?? T.value,
+          autocomplete: B.autocomplete,
+          multiple: B.multiple,
+          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
         }, [
-          X[5] || (X[5] = _("option", { hidden: !0 }, null, -1)),
-          (le = k.options) != null && le.length ? (g(!0), B(U, { key: 0 }, be(k.options, (K, Ne) => (g(), B(U, { key: Ne }, [
-            K.options ? (g(), B("optgroup", {
+          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,
-              label: H(K)
+              label: X(K)
             }, [
-              (g(!0), B(U, null, be(K.options, (ye, _e) => (g(), B("option", {
-                key: _e,
-                value: ye.value,
-                selected: ye.selected,
-                disabled: ye.disabled
-              }, L(H(ye)), 9, Ii))), 128))
-            ], 8, Bi)) : (g(), B("option", {
+              (m(!0), S(W, null, ye(K.options, (Le, Ce) => (m(), S("option", {
+                key: Ce,
+                value: Le.value,
+                selected: Le.selected,
+                disabled: Le.disabled
+              }, $(X(Le)), 9, Ii))), 128))
+            ], 8, Li)) : (m(), S("option", {
               key: 1,
               value: K.value,
               disabled: K.disabled,
               selected: K.selected
-            }, L(H(K)), 9, $i))
-          ], 64))), 128)) : A(k.$slots, "default", { key: 1 })
-        ], 40, Si),
-        _("span", { id: s.value }, L(k.placeholder ?? k.label), 9, Li),
-        n(x)(k.message, k.showMessage) ? (g(), Q(ae, {
+            }, $(X(K)), 9, $i))
+          ], 64))), 128)) : A(B.$slots, "default", { key: 1 })
+        ], 40, Bi),
+        _("span", { id: s.value }, $(B.placeholder ?? B.label), 9, Ti),
+        n(x)(B.message, B.showMessage) ? (m(), J(ae, {
           key: 0,
           size: "small",
-          icon: k.messageIcon,
+          icon: B.messageIcon,
           id: u.value
         }, {
-          default: W(() => [
-            N(L(k.message), 1)
+          default: H(() => [
+            N($(B.message), 1)
           ]),
           _: 1
-        }, 8, ["icon", "id"])) : V("", !0),
-        c() ? (g(), Q(ae, {
+        }, 8, ["icon", "id"])) : U("", !0),
+        c() ? (m(), J(ae, {
           key: 1,
           size: "small",
           semantic: "successful",
           id: f.value
         }, {
-          default: W(() => [
-            N(L(k.validMessage || n(he)), 1)
+          default: H(() => [
+            N($(B.validMessage || n(ge)), 1)
           ]),
           _: 1
-        }, 8, ["id"])) : V("", !0),
+        }, 8, ["id"])) : U("", !0),
         ee(ae, {
           size: "small",
           semantic: "critical",
-          id: m.value
+          id: p.value
         }, {
-          default: W(() => [
-            N(L(r.value), 1)
+          default: H(() => [
+            N($(v.value), 1)
           ]),
           _: 1
         }, 8, ["id"]),
-        _("span", Ti, L(h.value), 1)
-      ], 10, wi);
+        _("span", _i, $(h.value), 1)
+      ], 10, ki);
     };
   }
-}), _i = ["id", "data-gap", "data-variant", "data-direction", "data-alignment", "data-justify-content", "data-wrap"], Sl = /* @__PURE__ */ P({
+}), Ci = ["id", "data-gap", "data-variant", "data-direction", "data-alignment", "data-justify-content", "data-wrap"], Jo = /* @__PURE__ */ G({
   __name: "stack",
   props: {
     variant: { default: void 0 },
@@ -3140,23 +3153,23 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     gap: { default: void 0 }
   },
   setup(t) {
-    const a = t, l = d(null);
-    return (e, i) => (g(), B("div", {
+    const a = t, o = d(null);
+    return (e, i) => (m(), S("div", {
       ref_key: "_ref",
-      ref: l,
+      ref: o,
       id: e.id,
-      class: z(n(q)("db-stack", a.class)),
+      class: P(n(q)("db-stack", a.class)),
       "data-gap": e.gap,
       "data-variant": e.variant,
       "data-direction": e.direction,
       "data-alignment": e.alignment,
       "data-justify-content": e.justifyContent,
-      "data-wrap": n(F)(e.wrap)
+      "data-wrap": n(R)(e.wrap)
     }, [
       A(e.$slots, "default")
-    ], 10, _i));
+    ], 10, Ci));
   }
-}), Ci = ["data-visual-aid", "data-size", "data-hide-label", "data-emphasis", "for", "data-hide-asterisk"], Ei = ["id", "checked", "value", "disabled", "aria-invalid", "data-custom-validity", "name", "required", "data-aid-icon", "data-aid-icon-trailing"], Bl = /* @__PURE__ */ P({
+}), Qo = ["simple", "divider"], Zo = ["row", "column"], xo = ["stretch", "start", "end", "center"], el = ["space-between", "start", "end", "center"], Ei = ["data-visual-aid", "data-size", "data-hide-label", "data-emphasis", "for", "data-hide-asterisk"], Ai = ["id", "checked", "value", "disabled", "aria-invalid", "data-custom-validity", "name", "required", "data-aid-icon", "data-aid-icon-trailing"], al = /* @__PURE__ */ G({
   __name: "switch",
   props: {
     visualAid: { type: [Boolean, String], default: void 0 },
@@ -3190,27 +3203,27 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
   },
   emits: ["update:checked"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(null);
+    const o = a, e = t, i = d(void 0), u = d(null);
     Y(() => {
-      i.value = e.id ?? `switch-${J()}`;
+      i.value = e.id ?? `switch-${Q()}`;
     });
     function f(s) {
-      e.onChange && e.onChange(s), de(l, s, "checked");
+      e.onChange && e.onChange(s), de(o, s, "checked");
     }
-    function m(s) {
+    function p(s) {
       e.onBlur && e.onBlur(s);
     }
-    function r(s) {
+    function v(s) {
       e.onFocus && e.onFocus(s);
     }
-    return (s, p) => (g(), B("label", {
-      "data-visual-aid": n(F)(s.visualAid),
+    return (s, g) => (m(), S("label", {
+      "data-visual-aid": n(R)(s.visualAid),
       "data-size": s.size,
       "data-hide-label": n(ie)(s.showLabel),
       "data-emphasis": s.emphasis,
       for: i.value,
       "data-hide-asterisk": n(ie)(s.showRequiredAsterisk),
-      class: z(n(q)("db-switch", e.class))
+      class: P(n(q)("db-switch", e.class))
     }, [
       _("input", {
         type: "checkbox",
@@ -3218,25 +3231,25 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         id: i.value,
         ref_key: "_ref",
         ref: u,
-        checked: n(R)(s.checked, "checked"),
+        checked: n(V)(s.checked, "checked"),
         value: s.value,
-        disabled: n(R)(s.disabled, "disabled"),
+        disabled: n(V)(s.disabled, "disabled"),
         "aria-invalid": s.validation === "invalid",
         "data-custom-validity": s.validation,
         name: s.name,
-        required: n(R)(s.required, "required"),
+        required: n(V)(s.required, "required"),
         "data-aid-icon": s.iconLeading ?? s.icon,
         "data-aid-icon-trailing": s.iconTrailing,
-        onChange: p[0] || (p[0] = async (T) => f(T)),
-        onBlur: p[1] || (p[1] = async (T) => m(T)),
-        onFocus: p[2] || (p[2] = async (T) => r(T))
-      }, null, 40, Ei),
-      s.label ? (g(), B(U, { key: 0 }, [
-        N(L(s.label), 1)
+        onChange: g[0] || (g[0] = async (T) => f(T)),
+        onBlur: g[1] || (g[1] = async (T) => p(T)),
+        onFocus: g[2] || (g[2] = async (T) => v(T))
+      }, null, 40, Ai),
+      s.label ? (m(), S(W, { key: 0 }, [
+        N($(s.label), 1)
       ], 64)) : A(s.$slots, "default", { key: 1 })
-    ], 10, Ci));
+    ], 10, Ei));
   }
-}), Ai = ["for", "data-icon", "data-icon-trailing", "data-show-icon", "data-show-icon-trailing", "data-no-text"], Di = ["disabled", "aria-selected", "checked", "name", "id"], Ni = /* @__PURE__ */ P({
+}), Di = ["for", "data-icon", "data-icon-trailing", "data-show-icon", "data-show-icon-trailing", "data-no-text"], Ni = ["disabled", "aria-selected", "checked", "name", "id"], Fi = /* @__PURE__ */ G({
   __name: "tab-item",
   props: {
     children: { default: void 0 },
@@ -3261,13 +3274,13 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
   },
   emits: ["update:checked"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(!1), u = d(void 0), f = d(!1), m = d(null);
+    const o = a, e = t, i = d(!1), u = d(void 0), f = d(!1), p = d(null);
     Y(() => {
       f.value = !0;
     }), D(
-      () => [m.value, f.value],
+      () => [p.value, f.value],
       () => {
-        f.value && m.value && (e.active && m.value.click(), f.value = !1);
+        f.value && p.value && (e.active && p.value.click(), f.value = !1);
       },
       {
         immediate: !0,
@@ -3283,42 +3296,42 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         flush: "post"
       }
     );
-    function r(s) {
-      var p;
-      s.stopPropagation(), e.onChange && e.onChange(s), i.value = (p = s.target) == null ? void 0 : p.checked, de(l, s, "checked");
+    function v(s) {
+      var g;
+      s.stopPropagation(), e.onChange && e.onChange(s), i.value = (g = s.target) == null ? void 0 : g.checked, de(o, s, "checked");
     }
-    return (s, p) => (g(), B("li", {
+    return (s, g) => (m(), S("li", {
       role: "none",
-      class: z(n(q)("db-tab-item", e.class))
+      class: P(n(q)("db-tab-item", e.class))
     }, [
       _("label", {
         for: s.id,
         "data-icon": s.iconLeading ?? s.icon,
         "data-icon-trailing": s.iconTrailing,
-        "data-show-icon": n(F)(s.showIconLeading ?? s.showIcon),
-        "data-show-icon-trailing": n(F)(s.showIconTrailing),
-        "data-no-text": n(F)(s.noText)
+        "data-show-icon": n(R)(s.showIconLeading ?? s.showIcon),
+        "data-show-icon-trailing": n(R)(s.showIconTrailing),
+        "data-no-text": n(R)(s.noText)
       }, [
         _("input", {
           type: "radio",
           role: "tab",
-          disabled: n(R)(s.disabled, "disabled"),
+          disabled: n(V)(s.disabled, "disabled"),
           "aria-selected": i.value,
-          checked: n(R)(s.checked, "checked"),
+          checked: n(V)(s.checked, "checked"),
           ref_key: "_ref",
-          ref: m,
+          ref: p,
           name: u.value,
           id: s.id,
-          onInput: p[0] || (p[0] = async (T) => r(T))
-        }, null, 40, Di),
-        s.label ? (g(), B(U, { key: 0 }, [
-          N(L(s.label), 1)
-        ], 64)) : V("", !0),
+          onInput: g[0] || (g[0] = async (T) => v(T))
+        }, null, 40, Ni),
+        s.label ? (m(), S(W, { key: 0 }, [
+          N($(s.label), 1)
+        ], 64)) : U("", !0),
         A(s.$slots, "default")
-      ], 8, Ai)
+      ], 8, Di)
     ], 2));
   }
-}), Fi = ["id"], Mi = { role: "tablist" }, Ri = /* @__PURE__ */ P({
+}), Mi = ["id"], Ri = { role: "tablist" }, zi = /* @__PURE__ */ G({
   __name: "tab-list",
   props: {
     children: { default: void 0 },
@@ -3328,21 +3341,21 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(Le), e = d(null);
+    const a = t, o = d(Te), e = d(null);
     return Y(() => {
-      l.value = a.id || "tab-list-" + J();
-    }), (i, u) => (g(), B("div", {
+      o.value = a.id || "tab-list-" + Q();
+    }), (i, u) => (m(), S("div", {
       ref_key: "_ref",
       ref: e,
-      id: l.value,
-      class: z(n(q)("db-tab-list", a.class))
+      id: o.value,
+      class: P(n(q)("db-tab-list", a.class))
     }, [
-      _("ul", Mi, [
+      _("ul", Ri, [
         A(i.$slots, "default")
       ])
-    ], 10, Fi));
+    ], 10, Mi));
   }
-}), zi = ["id"], qi = /* @__PURE__ */ P({
+}), Vi = ["id"], Pi = /* @__PURE__ */ G({
   __name: "tab-panel",
   props: {
     content: { default: void 0 },
@@ -3353,22 +3366,22 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     autofocus: { type: [Boolean, String] }
   },
   setup(t) {
-    const a = t, l = d(null);
+    const a = t, o = d(null);
     return Y(() => {
-    }), (e, i) => (g(), B("section", {
+    }), (e, i) => (m(), S("section", {
       role: "tabpanel",
       ref_key: "_ref",
-      ref: l,
-      class: z(n(q)("db-tab-panel", a.class)),
+      ref: o,
+      class: P(n(q)("db-tab-panel", a.class)),
       id: e.id
     }, [
-      e.content ? (g(), B(U, { key: 0 }, [
-        N(L(e.content), 1)
-      ], 64)) : V("", !0),
+      e.content ? (m(), S(W, { key: 0 }, [
+        N($(e.content), 1)
+      ], 64)) : U("", !0),
       A(e.$slots, "default")
-    ], 10, zi));
+    ], 10, Vi));
   }
-}), Vi = ["id", "data-orientation", "data-scroll-behavior", "data-alignment", "data-width"], Il = /* @__PURE__ */ P({
+}), qi = ["id", "data-orientation", "data-scroll-behavior", "data-alignment", "data-width"], tl = /* @__PURE__ */ G({
   __name: "tabs",
   props: {
     arrowScrollDistance: { default: void 0 },
@@ -3391,18 +3404,18 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     tabSelect: {}
   },
   setup(t) {
-    const a = t, l = d("tabs-" + J()), e = d(""), i = d(!1), u = d(!1), f = d(!1), m = d(null), r = d(null);
+    const a = t, o = d("tabs-" + Q()), e = d(""), i = d(!1), u = d(!1), f = d(!1), p = d(null), v = d(null);
     Y(() => {
-      l.value = a.id || l.value, e.value = `tabs-${a.name || J()}`, i.value = !0;
+      o.value = a.id || o.value, e.value = `tabs-${a.name || Q()}`, i.value = !0;
     }), D(
-      () => [r.value, i.value],
+      () => [v.value, i.value],
       () => {
-        if (r.value && i.value) {
-          S(), h(!0);
-          const c = r.value.querySelector(".db-tab-list");
+        if (v.value && i.value) {
+          w(), h(!0);
+          const c = v.value.querySelector(".db-tab-list");
           c && new MutationObserver((C) => {
             C.forEach((b) => {
-              (b.removedNodes.length || b.addedNodes.length) && (S(), h());
+              (b.removedNodes.length || b.addedNodes.length) && (w(), h());
             });
           }).observe(c, {
             childList: !0,
@@ -3423,92 +3436,94 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
       }
       return [];
     }
-    function p(c) {
-      const I = c.scrollWidth > c.clientWidth;
-      u.value = I && c.scrollLeft > 1, f.value = I && c.scrollLeft < c.scrollWidth - c.clientWidth;
+    function g(c) {
+      const L = c.scrollWidth > c.clientWidth;
+      u.value = L && c.scrollLeft > 1, f.value = L && c.scrollLeft < c.scrollWidth - c.clientWidth;
     }
     function T(c) {
       var C;
-      let I = Number(a.arrowScrollDistance) || 100;
-      c && (I *= -1), (C = m.value) == null || C.scrollBy({
+      let L = Number(a.arrowScrollDistance) || 100;
+      c && (L *= -1), (C = p.value) == null || C.scrollBy({
         top: 0,
-        left: I,
+        left: L,
         behavior: "smooth"
       });
     }
-    function S() {
-      if (r.value) {
-        const c = r.value.querySelector(".db-tab-list");
+    function w() {
+      if (v.value) {
+        const c = v.value.querySelector(".db-tab-list");
         if (c) {
-          const I = c.querySelector('[role="tablist"]');
-          I && (I.setAttribute(
+          const L = c.querySelector('[role="tablist"]');
+          L && (L.setAttribute(
             "aria-orientation",
             a.orientation || "horizontal"
-          ), a.behavior === "arrows" && (m.value = I, p(I), I.addEventListener("scroll", () => {
-            p(I);
+          ), a.behavior === "arrows" && (p.value = L, g(L), L.addEventListener("scroll", () => {
+            g(L);
           })));
         }
       }
     }
     function h(c) {
-      if (r.value) {
-        const I = Array.from(
-          r.value.getElementsByClassName("db-tab-item")
+      if (v.value) {
+        const L = Array.from(
+          v.value.getElementsByClassName("db-tab-item")
         ), C = Array.from(
-          r.value.querySelectorAll(
+          v.value.querySelectorAll(
             ":is(:scope > .db-tab-panel, :scope > db-tab-panel > .db-tab-panel)"
           )
         );
-        for (const b of I) {
-          const w = I.indexOf(b), O = b.querySelector("label"), y = b.querySelector("input");
-          if (y && O) {
+        for (const b of L) {
+          const k = L.indexOf(b), F = b.querySelector("label"), y = b.querySelector("input");
+          if (y && F) {
             if (!y.id) {
-              const H = `${e.value}-tab-${w}`;
-              O.setAttribute("for", H), y.id = H, y.setAttribute("name", e.value), C.length > w && y.setAttribute(
+              const X = `${e.value}-tab-${k}`;
+              F.setAttribute("for", X), y.id = X, y.setAttribute("name", e.value), C.length > k && y.setAttribute(
                 "aria-controls",
-                `${e.value}-tab-panel-${w}`
+                `${e.value}-tab-panel-${k}`
               );
             }
             if (c) {
-              const H = !a.initialSelectedMode || a.initialSelectedMode === "auto", k = a.initialSelectedIndex == null && w === 0 || Number(a.initialSelectedIndex) === w;
-              H && k && y.click();
+              const X = !a.initialSelectedMode || a.initialSelectedMode === "auto", B = a.initialSelectedIndex == null && k === 0 || Number(a.initialSelectedIndex) === k;
+              X && B && y.click();
             }
           }
         }
         for (const b of C) {
           if (b.id) continue;
-          const w = C.indexOf(b);
-          b.id = `${e.value}-tab-panel-${w}`, b.setAttribute("aria-labelledby", `${e.value}-tab-${w}`);
+          const k = C.indexOf(b);
+          b.id = `${e.value}-tab-panel-${k}`, b.setAttribute("aria-labelledby", `${e.value}-tab-${k}`);
         }
       }
     }
-    function v(c) {
-      var w;
-      c.stopPropagation();
-      const I = (w = c.target) == null ? void 0 : w.closest;
-      if (!I) return;
-      const C = I("ul"), b = (
-        // db-tab-item for angular and stencil wrapping elements
-        I("db-tab-item") ?? I("li")
-      );
-      if (C !== null && b !== null) {
-        const O = Array.from(C.childNodes).indexOf(b);
-        a.onIndexChange && a.onIndexChange(O);
+    function r(c) {
+      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, I) => (g(), B("div", {
+    return (c, L) => (m(), S("div", {
       ref_key: "_ref",
-      ref: r,
-      id: l.value,
-      class: z(n(q)("db-tabs", a.class)),
+      ref: v,
+      id: o.value,
+      class: P(n(q)("db-tabs", a.class)),
       "data-orientation": c.orientation,
       "data-scroll-behavior": c.behavior,
       "data-alignment": c.alignment ?? "start",
       "data-width": c.width ?? "auto",
-      onInput: I[0] || (I[0] = async (C) => v(C))
+      onInput: L[0] || (L[0] = async (C) => r(C)),
+      onChange: L[1] || (L[1] = async (C) => r(C))
     }, [
-      u.value ? (g(), Q(Be, {
+      u.value ? (m(), J(Se, {
         key: 0,
         class: "tabs-scroll-left",
         variant: "ghost",
@@ -3517,16 +3532,16 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         noText: !0,
         onClick: (C) => T(!0)
       }, {
-        default: W(() => I[1] || (I[1] = [
-          N(" Scroll left ")
+        default: H(() => L[2] || (L[2] = [
+          N(" Scroll left ", -1)
         ])),
         _: 1,
-        __: [1]
-      }, 8, ["onClick"])) : V("", !0),
-      c.tabs ? (g(), B(U, { key: 1 }, [
-        ee(Ri, null, {
-          default: W(() => [
-            (g(!0), B(U, null, be(s(), (C, b) => (g(), Q(Ni, {
+        __: [2]
+      }, 8, ["onClick"])) : U("", !0),
+      c.tabs ? (m(), S(W, { key: 1 }, [
+        ee(zi, null, {
+          default: H(() => [
+            (m(!0), S(W, null, ye(s(), (C, b) => (m(), J(Fi, {
               key: c.name + "tab-item" + b,
               active: C.active,
               label: C.label,
@@ -3537,17 +3552,17 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
           ]),
           _: 1
         }),
-        (g(!0), B(U, null, be(s(), (C, b) => (g(), Q(qi, {
+        (m(!0), S(W, null, ye(s(), (C, b) => (m(), J(Pi, {
           key: c.name + "tab-panel" + b,
           content: C.content
         }, {
-          default: W(() => [
-            N(L(C.children), 1)
+          default: H(() => [
+            N($(C.children), 1)
           ]),
           _: 2
         }, 1032, ["content"]))), 128))
-      ], 64)) : V("", !0),
-      f.value ? (g(), Q(Be, {
+      ], 64)) : U("", !0),
+      f.value ? (m(), J(Se, {
         key: 2,
         class: "tabs-scroll-right",
         variant: "ghost",
@@ -3556,19 +3571,19 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
         noText: !0,
         onClick: (C) => T()
       }, {
-        default: W(() => I[2] || (I[2] = [
-          N(" Scroll right ")
+        default: H(() => L[3] || (L[3] = [
+          N(" Scroll right ", -1)
         ])),
         _: 1,
-        __: [2]
-      }, 8, ["onClick"])) : V("", !0),
+        __: [3]
+      }, 8, ["onClick"])) : U("", !0),
       A(c.$slots, "default")
-    ], 42, Vi));
+    ], 42, qi));
   }
-}), Pi = ["data-variant", "data-hide-asterisk", "data-hide-label"], Ui = ["for"], Gi = ["aria-invalid", "data-custom-validity", "data-field-sizing", "id", "data-resize", "data-hide-resizer", "disabled", "required", "readOnly", "form", "maxLength", "minLength", "name", "wrap", "spellcheck", "autocomplete", "value", "aria-describedby", "placeholder", "rows", "cols"], Wi = {
+}), il = ["scrollbar", "arrows"], ol = ["auto", "manually"], ll = ["static", "removable"], Ui = ["data-variant", "data-hide-asterisk", "data-hide-label"], Gi = ["for"], Wi = ["aria-invalid", "data-custom-validity", "data-field-sizing", "id", "data-resize", "data-hide-resizer", "disabled", "required", "readOnly", "form", "maxLength", "minLength", "name", "wrap", "spellcheck", "autocomplete", "value", "aria-describedby", "placeholder", "rows", "cols"], Oi = {
   "data-visually-hidden": "true",
   role: "status"
-}, $l = /* @__PURE__ */ P({
+}, nl = /* @__PURE__ */ G({
   __name: "textarea",
   props: {
     cols: { default: void 0 },
@@ -3618,15 +3633,15 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
   },
   emits: ["update:value"],
   setup(t, { emit: a }) {
-    const l = a, e = t, i = d(void 0), u = d(void 0), f = d(void 0), m = d(void 0), r = d(void 0), s = d(""), p = d(""), T = d(""), S = 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(""), T = d(""), w = d(null);
     Y(() => {
-      const w = e.id ?? `textarea-${J()}`;
-      i.value = w, u.value = w + ve, f.value = w + fe, m.value = w + pe, r.value = e.invalidMessage || te;
+      const k = e.id ?? `textarea-${Q()}`;
+      i.value = k, u.value = k + fe, f.value = k + pe, p.value = k + he, v.value = e.invalidMessage || te;
     }), D(
-      () => [S.value, e.invalidMessage],
+      () => [w.value, e.invalidMessage],
       () => {
-        var w;
-        r.value = e.invalidMessage || ((w = S.value) == null ? void 0 : w.validationMessage) || te;
+        var k;
+        v.value = e.invalidMessage || ((k = w.value) == null ? void 0 : k.validationMessage) || te;
       },
       {
         immediate: !0,
@@ -3636,8 +3651,8 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
       () => [i.value],
       () => {
         if (i.value) {
-          const w = i.value + ve;
-          u.value = w, f.value = i.value + fe, m.value = i.value + pe, x(e.message, e.showMessage) && (s.value = w);
+          const k = i.value + fe;
+          u.value = k, f.value = i.value + pe, p.value = i.value + he, x(e.message, e.showMessage) && (s.value = k), r();
         }
       },
       {
@@ -3647,7 +3662,7 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     ), D(
       () => [e.value],
       () => {
-        p.value = e.value;
+        g.value = e.value;
       },
       {
         immediate: !0,
@@ -3657,200 +3672,242 @@ const Ht = ["id", "data-width", "data-on-forcing-mobile"], Xt = { class: "db-hea
     function h() {
       return !!(e.validMessage ?? e.validation === "valid");
     }
-    function v() {
-      var w, O, y;
-      !((w = S.value) != null && w.validity.valid) || e.validation === "invalid" ? (s.value = m.value, r.value = e.invalidMessage || ((O = S.value) == null ? void 0 : O.validationMessage) || te, ge() && (T.value = r.value, Z(() => T.value = "", 1e3))) : h() && ((y = S.value) != null && y.validity.valid) && (e.required || e.minLength || e.maxLength) ? (s.value = f.value, ge() && (T.value = e.validMessage ?? he, Z(() => T.value = "", 1e3))) : x(e.message, e.showMessage) ? s.value = u.value : s.value = "";
+    function r() {
+      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(w) {
-      e.input && e.input(w), p.value = w.target.value, e.onInput && e.onInput(w), de(l, w), v();
+    function c(k) {
+      e.input && e.input(k), g.value = k.target.value, e.onInput && e.onInput(k), de(o, k), r();
     }
-    function I(w) {
-      e.onChange && e.onChange(w), de(l, w), v();
+    function L(k) {
+      e.onChange && e.onChange(k), de(o, k), r();
     }
-    function C(w) {
-      e.onBlur && e.onBlur(w);
+    function C(k) {
+      e.onBlur && e.onBlur(k);
     }
-    function b(w) {
-      e.onFocus && e.onFocus(w);
+    function b(k) {
+      e.onFocus && e.onFocus(k);
     }
-    return (w, O) => (g(), B("div", {
-      class: z(n(q)("db-textarea", e.class)),
-      "data-variant": w.variant,
-      "data-hide-asterisk": n(ie)(w.showRequiredAsterisk),
-      "data-hide-label": n(ie)(w.showLabel)
+    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),
+      "data-hide-label": n(ie)(k.showLabel)
     }, [
-      _("label", { for: i.value }, L(w.label ?? n(ke)), 9, Ui),
+      _("label", { for: i.value }, $(k.label ?? n(we)), 9, Gi),
       _("textarea", {
-        "aria-invalid": w.validation === "invalid",
-        "data-custom-validity": w.validation,
-        "data-field-sizing": w.fieldSizing,
+        "aria-invalid": k.validation === "invalid",
+        "data-custom-validity": k.validation,
+        "data-field-sizing": k.fieldSizing,
         ref_key: "_ref",
-        ref: S,
+        ref: w,
         id: i.value,
-        "data-resize": w.resize,
-        "data-hide-resizer": n(ie)(w.showResizer ?? !0),
-        disabled: n(R)(w.disabled, "disabled"),
-        required: n(R)(w.required, "required"),
-        readOnly: n(R)(w.readOnly, "readOnly") || n(R)(w.readonly, "readonly"),
-        form: w.form,
-        maxLength: n(Se)(w.maxLength, w.maxlength),
-        minLength: n(Se)(w.minLength, w.minlength),
-        name: w.name,
-        wrap: w.wrap,
-        spellcheck: w.spellCheck,
-        autocomplete: w.autocomplete,
-        onInput: O[0] || (O[0] = async (y) => c(y)),
-        onChange: O[1] || (O[1] = async (y) => I(y)),
-        onBlur: O[2] || (O[2] = async (y) => C(y)),
-        onFocus: O[3] || (O[3] = async (y) => b(y)),
-        value: w.value ?? p.value,
-        "aria-describedby": w.ariaDescribedBy ?? s.value,
-        placeholder: w.placeholder ?? n(aa),
-        rows: n(Se)(w.rows, n(Fa)),
-        cols: n(Se)(w.cols)
-      }, null, 40, Gi),
-      n(x)(w.message, w.showMessage) ? (g(), Q(ae, {
+        "data-resize": k.resize,
+        "data-hide-resizer": n(ie)(k.showResizer ?? !0),
+        disabled: n(V)(k.disabled, "disabled"),
+        required: n(V)(k.required, "required"),
+        readOnly: n(V)(k.readOnly, "readOnly") || n(V)(k.readonly, "readonly"),
+        form: k.form,
+        maxLength: n(ke)(k.maxLength, k.maxlength),
+        minLength: n(ke)(k.minLength, k.minlength),
+        name: k.name,
+        wrap: k.wrap,
+        spellcheck: k.spellCheck,
+        autocomplete: k.autocomplete,
+        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),
+        rows: n(ke)(k.rows, n(Ma)),
+        cols: n(ke)(k.cols)
+      }, null, 40, Wi),
+      n(x)(k.message, k.showMessage) ? (m(), J(ae, {
         key: 0,
         size: "small",
-        icon: w.messageIcon,
+        icon: k.messageIcon,
         id: u.value
       }, {
-        default: W(() => [
-          N(L(w.message), 1)
+        default: H(() => [
+          N($(k.message), 1)
         ]),
         _: 1
-      }, 8, ["icon", "id"])) : V("", !0),
-      h() ? (g(), Q(ae, {
+      }, 8, ["icon", "id"])) : U("", !0),
+      h() ? (m(), J(ae, {
         key: 1,
         size: "small",
         semantic: "successful",
         id: f.value
       }, {
-        default: W(() => [
-          N(L(w.validMessage || n(he)), 1)
+        default: H(() => [
+          N($(k.validMessage || n(ge)), 1)
         ]),
         _: 1
-      }, 8, ["id"])) : V("", !0),
+      }, 8, ["id"])) : U("", !0),
       ee(ae, {
         size: "small",
         semantic: "critical",
-        id: m.value
+        id: p.value
       }, {
-        default: W(() => [
-          N(L(r.value), 1)
+        default: H(() => [
+          N($(v.value), 1)
         ]),
         _: 1
       }, 8, ["id"]),
-      _("span", Wi, L(T.value), 1)
-    ], 10, Pi));
+      _("span", Oi, $(T.value), 1)
+    ], 10, Ui));
   }
-}), Ll = ["adaptive", "neutral", "critical", "informational", "warning", "successful"], Tl = ["medium", "small", "large", "none"], _l = ["medium", "small", "large", "none"], Oi = ["left", "right", "left-start", "left-end", "right-start", "right-end"], Hi = ["top", "bottom", "top-start", "top-end", "bottom-start", "bottom-end"], Cl = [...Oi, ...Hi], El = ["none", "3x-large", "2x-large", "x-large", "large", "medium", "small", "x-small", "2x-small", "3x-small"], Al = ["horizontal", "vertical"], Dl = ["full", "auto"], Nl = ["full", "medium", "large", "small"], Fl = ["none", "slow", "fast"], Ml = ["auto", "fixed"], Rl = ["small", "medium"], zl = ["weak", "strong"], ql = ["invalid", "valid", "no-validation"], Vl = ["fixed", "content"], Pl = ["above", "floating"], Ul = ["off", "on", "name", "honorific-prefix", "given-name", "additional-name", "family-name", "honorific-suffix", "nickname", "email", "username", "new-password", "current-password", "one-time-code", "organization-title", "organization", "street-address", "shipping", "billing", "address-line1", "address-line2", "address-line3", "address-level4", "address-level3", "address-level2", "address-level1", "country", "country-name", "postal-code", "cc-name", "cc-given-name", "cc-additional-name", "cc-family-name", "cc-number", "cc-exp", "cc-exp-month", "cc-exp-year", "cc-csc", "cc-type", "transaction-currency", "transaction-amount", "language", "bday", "bday-day", "bday-month", "bday-year", "sex", "tel", "tel-country-code", "tel-national", "tel-area-code", "tel-local", "tel-extension", "impp", "url", "photo", "webauthn"], Gl = ["_self", "_blank", "_parent", "_top"], Wl = ["no-referrer", "no-referrer-when-downgrade", "origin", "origin-when-cross-origin", "same-origin", "strict-origin", "strict-origin-when-cross-origin", "unsafe-url"], Ol = ["start", "center"];
+}), sl = ["none", "both", "horizontal", "vertical"], dl = ["hard", "soft", "off"], ul = ["description", "label"], rl = ["adaptive", "neutral", "critical", "informational", "warning", "successful"], cl = ["medium", "small", "large", "none"], vl = ["medium", "small", "large", "none"], Hi = ["left", "right", "left-start", "left-end", "right-start", "right-end"], Xi = ["top", "bottom", "top-start", "top-end", "bottom-start", "bottom-end"], fl = [...Hi, ...Xi], pl = ["none", "3x-large", "2x-large", "x-large", "large", "medium", "small", "x-small", "2x-small", "3x-small"], hl = ["horizontal", "vertical"], gl = ["full", "auto"], ml = ["full", "medium", "large", "small"], bl = ["none", "slow", "fast"], yl = ["auto", "fixed"], wl = ["small", "medium"], kl = ["weak", "strong"], Sl = ["invalid", "valid", "no-validation"], Bl = ["fixed", "content"], Ll = ["above", "floating"], Il = ["off", "on", "name", "honorific-prefix", "given-name", "additional-name", "family-name", "honorific-suffix", "nickname", "email", "username", "new-password", "current-password", "one-time-code", "organization-title", "organization", "street-address", "shipping", "billing", "address-line1", "address-line2", "address-line3", "address-level4", "address-level3", "address-level2", "address-level1", "country", "country-name", "postal-code", "cc-name", "cc-given-name", "cc-additional-name", "cc-family-name", "cc-number", "cc-exp", "cc-exp-month", "cc-exp-year", "cc-csc", "cc-type", "transaction-currency", "transaction-amount", "language", "bday", "bday-day", "bday-month", "bday-year", "sex", "tel", "tel-country-code", "tel-national", "tel-area-code", "tel-local", "tel-extension", "impp", "url", "photo", "webauthn"], $l = ["_self", "_blank", "_parent", "_top"], Tl = ["no-referrer", "no-referrer-when-downgrade", "origin", "origin-when-cross-origin", "same-origin", "strict-origin", "strict-origin-when-cross-origin", "unsafe-url"], _l = ["start", "center"];
 export {
-  Ol as AlignmentList,
-  Ul as AutoCompleteList,
-  oa as COLOR,
-  Zi as COLORS,
-  xi as COLORS_SIMPLE,
-  Ji as COLOR_CONST,
+  no as AccordionBehaviorList,
+  lo as AccordionVariantList,
+  _l as AlignmentList,
+  Il as AutoCompleteList,
+  uo as BadgePlacementList,
+  vo as ButtonTypeList,
+  co as ButtonVariantList,
+  na as COLOR,
+  xi as COLORS,
+  eo as COLORS_SIMPLE,
+  Qi as COLOR_CONST,
   la as COLOR_SIMPLE,
-  il as DBAccordion,
-  Ga as DBAccordionItem,
-  ll as DBBadge,
-  ol as DBBrand,
-  Be as DBButton,
-  nl as DBCard,
-  sl as DBCheckbox,
-  dl as DBCustomSelect,
-  it as DBCustomSelectDropdown,
-  ul as DBCustomSelectFormField,
-  rt as DBCustomSelectList,
-  dt as DBCustomSelectListItem,
-  rl as DBDivider,
-  Gt as DBDrawer,
-  cl as DBHeader,
-  vl as DBIcon,
+  po as CardBehaviorList,
+  ho as CardElevationLevelList,
+  bo as CustomSelectDropdownWidthList,
+  wo as CustomSelectListItemTypeList,
+  oo as DBAccordion,
+  Wa as DBAccordionItem,
+  so as DBBadge,
+  ro as DBBrand,
+  Se as DBButton,
+  fo as DBCard,
+  go as DBCheckbox,
+  mo as DBCustomSelect,
+  ot as DBCustomSelectDropdown,
+  yo as DBCustomSelectFormField,
+  ct as DBCustomSelectList,
+  ut as DBCustomSelectListItem,
+  So as DBDivider,
+  Wt as DBDrawer,
+  Co as DBHeader,
+  Eo as DBIcon,
   ae as DBInfotext,
-  mt as DBInput,
-  fl as DBLink,
-  pl as DBNavigation,
-  hl as DBNavigationItem,
-  gl as DBNotification,
-  ml as DBPage,
-  bl as DBPopover,
-  yl as DBRadio,
-  wl as DBSection,
-  kl as DBSelect,
-  Sl as DBStack,
-  Bl as DBSwitch,
-  Ni as DBTabItem,
-  Ri as DBTabList,
-  qi as DBTabPanel,
-  Il as DBTabs,
-  wt as DBTag,
-  $l as DBTextarea,
-  ra as DBTooltip,
-  Ea as DEFAULT_BACK,
-  Da as DEFAULT_BURGER_MENU,
-  Ge as DEFAULT_CLOSE_BUTTON,
-  Ze as DEFAULT_DATALIST_ID_SUFFIX,
-  Na as DEFAULT_ICON,
-  Le as DEFAULT_ID,
+  bt as DBInput,
+  No as DBLink,
+  zo as DBNavigation,
+  Vo as DBNavigationItem,
+  Po as DBNotification,
+  Wo as DBPage,
+  Xo as DBPopover,
+  jo as DBRadio,
+  Yo as DBSection,
+  Ko as DBSelect,
+  Jo as DBStack,
+  al as DBSwitch,
+  Fi as DBTabItem,
+  zi as DBTabList,
+  Pi as DBTabPanel,
+  tl as DBTabs,
+  kt as DBTag,
+  nl as DBTextarea,
+  ca as DBTooltip,
+  Aa as DEFAULT_BACK,
+  Na as DEFAULT_BURGER_MENU,
+  We as DEFAULT_CLOSE_BUTTON,
+  xe as DEFAULT_DATALIST_ID_SUFFIX,
+  Fa as DEFAULT_ICON,
+  Te as DEFAULT_ID,
   te as DEFAULT_INVALID_MESSAGE,
-  pe as DEFAULT_INVALID_MESSAGE_ID_SUFFIX,
-  ke as DEFAULT_LABEL,
-  Je as DEFAULT_LABEL_ID_SUFFIX,
-  Ca as DEFAULT_MESSAGE,
-  ve as DEFAULT_MESSAGE_ID_SUFFIX,
-  aa as DEFAULT_PLACEHOLDER,
+  he as DEFAULT_INVALID_MESSAGE_ID_SUFFIX,
+  we as DEFAULT_LABEL,
+  Qe as DEFAULT_LABEL_ID_SUFFIX,
+  Ea as DEFAULT_MESSAGE,
+  fe as DEFAULT_MESSAGE_ID_SUFFIX,
+  ta as DEFAULT_PLACEHOLDER,
   Re as DEFAULT_PLACEHOLDER_ID_SUFFIX,
-  ta as DEFAULT_REMOVE,
-  Fa as DEFAULT_ROWS,
-  Aa as DEFAULT_SELECTED,
-  Qe as DEFAULT_SELECT_ID_SUFFIX,
-  he as DEFAULT_VALID_MESSAGE,
-  fe as DEFAULT_VALID_MESSAGE_ID_SUFFIX,
-  Ma as DEFAULT_VIEWPORT,
-  Qi as DENSITIES,
-  ia as DENSITY,
-  Ki as DENSITY_CONST,
-  Ra as DESKTOP_VIEWPORT,
-  zl as EmphasisList,
-  Vl as FieldSizingList,
-  El as GapSpacingList,
-  Pl as LabelVariantList,
-  Wl as LinkReferrerPolicyList,
-  Gl as LinkTargetList,
-  _l as MarginList,
-  Nl as MaxWidthList,
-  Ot as NavigationItemSafeTriangle,
-  Al as OrientationList,
-  Oi as PlacementHorizontalList,
-  Cl as PlacementList,
-  Hi as PlacementVerticalList,
-  Fl as PopoverDelayList,
-  Ml as PopoverWidthList,
-  na as SEMANTIC,
-  el as SEMANTICS,
-  Ll as SemanticList,
-  Rl as SizeList,
-  Tl as SpacingList,
-  al as TESTING_VIEWPORTS,
-  ql as ValidationList,
-  Dl as WidthList,
-  sa as addAttributeToChildren,
+  ia as DEFAULT_REMOVE,
+  Ma as DEFAULT_ROWS,
+  Da as DEFAULT_SELECTED,
+  Ze as DEFAULT_SELECT_ID_SUFFIX,
+  ge as DEFAULT_VALID_MESSAGE,
+  pe as DEFAULT_VALID_MESSAGE_ID_SUFFIX,
+  Ra as DEFAULT_VIEWPORT,
+  Zi as DENSITIES,
+  oa as DENSITY,
+  Ji as DENSITY_CONST,
+  za as DESKTOP_VIEWPORT,
+  Bo as DividerMarginList,
+  Lo as DividerVariantList,
+  ze as DocumentClickListener,
+  Be as DocumentScrollListener,
+  Io as DrawerBackdropList,
+  $o as DrawerDirectionList,
+  _o as DrawerPositionList,
+  To as DrawerVariantList,
+  kl as EmphasisList,
+  Bl as FieldSizingList,
+  pl as GapSpacingList,
+  Ao as IconWeightList,
+  Do as InputTypeList,
+  Ll as LabelVariantList,
+  Ro as LinkContentList,
+  Tl as LinkReferrerPolicyList,
+  Mo as LinkSizeList,
+  $l as LinkTargetList,
+  Fo as LinkVariantList,
+  vl as MarginList,
+  ml as MaxWidthList,
+  Ht as NavigationItemSafeTriangle,
+  Go as NotificationAriaLiveList,
+  Uo as NotificationLinkVariantList,
+  qo as NotificationVariantList,
+  hl as OrientationList,
+  Ho as PageDocumentOverflowList,
+  Oo as PageVariantList,
+  Hi as PlacementHorizontalList,
+  fl as PlacementList,
+  Xi as PlacementVerticalList,
+  bl as PopoverDelayList,
+  yl as PopoverWidthList,
+  sa as SEMANTIC,
+  ao as SEMANTICS,
+  ko as SelectedTypeList,
+  rl as SemanticList,
+  wl as SizeList,
+  cl as SpacingList,
+  xo as StackAlignmentList,
+  Zo as StackDirectionList,
+  el as StackJustifyContentList,
+  Qo as StackVariantList,
+  to as TESTING_VIEWPORTS,
+  il as TabsBehaviorList,
+  ol as TabsInitialSelectedModeList,
+  ll as TagBehaviorList,
+  sl as TextareaResizeList,
+  dl as TextareaWrapList,
+  ul as TooltipVariantList,
+  Sl as ValidationList,
+  gl as WidthList,
+  da as addAttributeToChildren,
   q as cls,
   Z as delay,
-  R as getBoolean,
-  F as getBooleanAsString,
+  V as getBoolean,
+  R as getBooleanAsString,
+  ua as getFloatingProps,
   ie as getHideProp,
-  xe as getInputValue,
-  Se as getNumber,
-  tl as getOptionKey,
-  ea as getSearchInput,
-  ge as hasVoiceOver,
-  za as isArrayOfStrings,
-  Wt as isEventTargetNavigationItem,
-  Va as isKeyboardEvent,
+  ea as getInputValue,
+  ke as getNumber,
+  io as getOptionKey,
+  aa as getSearchInput,
+  at as handleDataOutside,
+  tt as handleFixedDropdown,
+  ra as handleFixedPopover,
+  me as hasVoiceOver,
+  Va as isArrayOfStrings,
+  Ot as isEventTargetNavigationItem,
+  qa as isKeyboardEvent,
   x as stringPropVisible,
-  J as uuid
+  Q as uuid
 };