@salesql/sql_components_vue3 2.1.1 → 3.1.0

package/dist/index.es.js

@@ -1,19 +1,19 @@
-import { defineComponent as x, computed as g, openBlock as a, createElementBlock as l, normalizeStyle as F, normalizeClass as $, createBlock as G, unref as _, createCommentVNode as m, createElementVNode as s, renderSlot as A, toDisplayString as S, withModifiers as ve, useModel as de, ref as U, onMounted as Qe, watch as te, withDirectives as Be, vModelCheckbox as st, createTextVNode as H, mergeModels as Q, onBeforeUnmount as be, nextTick as ue, createVNode as j, Fragment as z, renderList as Y, useSlots as Ee, vModelDynamic as ot, useAttrs as dt, mergeProps as he, vModelText as rt, Transition as Le, withCtx as ie, Teleport as Je, useId as xe, withKeys as ct, reactive as ut, resolveDynamicComponent as ft } from "vue";
-const ge = {
+import { defineComponent as B, computed as S, openBlock as a, createElementBlock as l, normalizeStyle as U, normalizeClass as L, createBlock as K, unref as D, createCommentVNode as g, createElementVNode as s, renderSlot as _, toDisplayString as T, withModifiers as ue, useModel as ve, ref as F, onMounted as nt, watch as Z, withDirectives as Me, vModelCheckbox as bt, createTextVNode as q, mergeModels as te, onBeforeUnmount as de, nextTick as se, createVNode as Y, Fragment as W, renderList as Q, useSlots as he, vModelDynamic as yt, useAttrs as mt, mergeProps as ke, vModelText as ht, Transition as me, withCtx as ie, Teleport as Pe, useId as ge, withKeys as st, reactive as gt, resolveDynamicComponent as pt } from "vue";
+const $e = {
   DARK: "dark",
   // slate ring — for light surfaces (default)
   LIGHT: "light",
   // white ring — for dark surfaces / solid buttons
   ACCENT: "accent"
   // accent ring
-}, Ce = {
+}, De = {
   SMALL: "small",
   // 20px
   MEDIUM: "medium",
   // 32px
   LARGE: "large"
   // 48px
-}, bt = ["aria-label"], vt = /* @__PURE__ */ x({
+}, St = ["aria-label"], kt = /* @__PURE__ */ B({
   __name: "DsSpinner",
   props: {
     // Diameter in px, or a named size ("small" 20 / "medium" 32 / "large" 48).
@@ -21,7 +21,7 @@ const ge = {
     size: { type: [Number, String], default: 24 },
     tone: {
       type: String,
-      default: ge.DARK
+      default: $e.DARK
     },
     // Accessible name (DS default "Loading"); the consuming app can override for
     // i18n. role="status" + aria-label are always present, never opt-in.
@@ -29,28 +29,28 @@ const ge = {
   },
   setup(e) {
     const n = {
-      [Ce.SMALL]: 20,
-      [Ce.MEDIUM]: 32,
-      [Ce.LARGE]: 48
-    }, t = e, o = g(
+      [De.SMALL]: 20,
+      [De.MEDIUM]: 32,
+      [De.LARGE]: 48
+    }, t = e, o = S(
       () => {
         var i;
         return typeof t.size == "string" ? (i = n[t.size]) != null ? i : 24 : t.size;
       }
     );
-    return (i, c) => (a(), l("span", {
-      class: $(["ds-spinner", `ds-spinner--${e.tone}`]),
+    return (i, r) => (a(), l("span", {
+      class: L(["ds-spinner", `ds-spinner--${e.tone}`]),
       role: "status",
-      style: F({ width: `${o.value}px`, height: `${o.value}px` }),
+      style: U({ width: `${o.value}px`, height: `${o.value}px` }),
       "aria-label": e.label || void 0
-    }, null, 14, bt));
+    }, null, 14, St));
   }
-}), M = (e, n) => {
+}), O = (e, n) => {
   const t = e.__vccOpts || e;
   for (const [o, i] of n)
     t[o] = i;
   return t;
-}, fe = /* @__PURE__ */ M(vt, [["__scopeId", "data-v-aaf2f048"]]), Z = "click", X = "close", Se = "focus", ke = "blur", Me = "change", Oe = "field-blur", pe = "copy", $e = "correct", Te = "incorrect", Pe = "sort", Fe = "edit", ze = "select-all", Ve = "page-change", Ue = "page-size-change", _e = "search", Ge = "select", De = "step", He = "final-step", We = "navigate", Ae = {
+}, ye = /* @__PURE__ */ O(kt, [["__scopeId", "data-v-aaf2f048"]]), ee = "click", J = "close", we = "focus", Ee = "blur", ze = "change", Ve = "field-blur", Te = "copy", Le = "correct", Ce = "incorrect", Fe = "sort", Ue = "edit", Ge = "select-all", We = "page-change", He = "page-size-change", Re = "search", Ke = "select", Ae = "step", Ye = "final-step", qe = "navigate", je = "resize-start", Xe = "resize", Ze = "resize-end", Ne = "update:open", Be = {
   DEFAULT: "default",
   // white surface, dark text (the default value; == tertiary)
   PRIMARY: "primary",
@@ -73,7 +73,7 @@ const ge = {
   // `warning` as a deprecated alias of `danger` (tint), but app consumers already
   // ship this solid look — kept unchanged to avoid a visual regression. Prefer `danger`.
   WARNING: "warning"
-}, Ke = {
+}, Qe = {
   SMALL: "small",
   // 24px
   MEDIUM: "medium",
@@ -82,33 +82,33 @@ const ge = {
   // 36px
   XLARGE: "xlarge"
   // 48px
-}, yt = {
+}, $t = {
   BUTTON: "button",
   SUBMIT: "submit",
   RESET: "reset"
-}, mt = ["type", "disabled", "autofocus", "aria-busy", "aria-disabled", "aria-pressed", "aria-label"], ht = ["aria-hidden"], gt = {
+}, wt = ["type", "disabled", "autofocus", "aria-busy", "aria-disabled", "aria-pressed", "aria-label"], Et = ["aria-hidden"], Tt = {
   key: 0,
   class: "ds-button__icon ds-button__icon--leading"
-}, St = {
+}, Lt = {
   class: "material-icons",
   "aria-hidden": "true"
-}, kt = {
+}, Ct = {
   key: 1,
   class: "ds-button__label"
-}, pt = {
+}, _t = {
   key: 2,
   class: "ds-button__icon ds-button__icon--trailing"
-}, $t = {
+}, It = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Tt = /* @__PURE__ */ x({
+}, Dt = /* @__PURE__ */ B({
   __name: "DsButton",
   props: {
-    variant: { type: String, default: Ae.DEFAULT },
-    size: { type: String, default: Ke.MEDIUM },
+    variant: { type: String, default: Be.DEFAULT },
+    size: { type: String, default: Qe.MEDIUM },
     nativeType: {
       type: String,
-      default: yt.BUTTON
+      default: $t.BUTTON
     },
     // Material Icon names (rendered via <i class="material-icons">); a leading/
     // trailing slot overrides. Icon-only buttons (circle/square) need ariaLabel.
@@ -129,16 +129,16 @@ const ge = {
     selected: Boolean,
     autofocus: Boolean
   },
-  emits: [Z],
+  emits: [ee],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = g(() => t.size === Ke.SMALL ? 14 : 20), c = g(
-      () => t.variant === Ae.PRIMARY || t.variant === Ae.WARNING ? ge.LIGHT : ge.DARK
+    const t = e, o = n, i = S(() => t.size === Qe.SMALL ? 14 : 20), r = S(
+      () => t.variant === Be.PRIMARY || t.variant === Be.WARNING ? $e.LIGHT : $e.DARK
     );
-    function k(f) {
-      t.disabled || t.loading || o(Z, f);
+    function E(f) {
+      t.disabled || t.loading || o(ee, f);
     }
     return (f, y) => (a(), l("button", {
-      class: $(["ds-button", [
+      class: L(["ds-button", [
         `ds-button--${e.variant}`,
         `ds-button--${e.size}`,
         {
@@ -157,35 +157,35 @@ const ge = {
       "aria-disabled": e.disabled || e.loading || void 0,
       "aria-pressed": e.selected || void 0,
       "aria-label": e.ariaLabel || void 0,
-      onClick: k
+      onClick: E
     }, [
-      e.loading ? (a(), G(_(fe), {
+      e.loading ? (a(), K(D(ye), {
         key: 0,
         class: "ds-button__spinner",
         size: i.value,
-        tone: c.value
-      }, null, 8, ["size", "tone"])) : m("", !0),
+        tone: r.value
+      }, null, 8, ["size", "tone"])) : g("", !0),
       s("span", {
         class: "ds-button__content",
         "aria-hidden": e.loading || void 0
       }, [
-        e.leftIcon || f.$slots.leading ? (a(), l("span", gt, [
-          A(f.$slots, "leading", {}, () => [
-            s("i", St, S(e.leftIcon), 1)
+        e.leftIcon || f.$slots.leading ? (a(), l("span", Tt, [
+          _(f.$slots, "leading", {}, () => [
+            s("i", Lt, T(e.leftIcon), 1)
           ], !0)
-        ])) : m("", !0),
-        f.$slots.default && !e.circle && !e.square ? (a(), l("span", kt, [
-          A(f.$slots, "default", {}, void 0, !0)
-        ])) : m("", !0),
-        e.rightIcon || f.$slots.trailing ? (a(), l("span", pt, [
-          A(f.$slots, "trailing", {}, () => [
-            s("i", $t, S(e.rightIcon), 1)
+        ])) : g("", !0),
+        f.$slots.default && !e.circle && !e.square ? (a(), l("span", Ct, [
+          _(f.$slots, "default", {}, void 0, !0)
+        ])) : g("", !0),
+        e.rightIcon || f.$slots.trailing ? (a(), l("span", _t, [
+          _(f.$slots, "trailing", {}, () => [
+            s("i", It, T(e.rightIcon), 1)
           ], !0)
-        ])) : m("", !0)
-      ], 8, ht)
-    ], 10, mt));
+        ])) : g("", !0)
+      ], 8, Et)
+    ], 10, wt));
   }
-}), oe = /* @__PURE__ */ M(Tt, [["__scopeId", "data-v-61354b19"]]), Et = {
+}), fe = /* @__PURE__ */ O(Dt, [["__scopeId", "data-v-61354b19"]]), Rt = {
   DEFAULT: "default",
   // white bg, slate-tint border, muted text
   GREY: "grey",
@@ -198,12 +198,12 @@ const ge = {
   // e.g. Pending
   ERROR: "error"
   // e.g. Bounced
-}, Lt = { class: "ds-tag__label" }, wt = ["aria-label"], It = /* @__PURE__ */ x({
+}, At = { class: "ds-tag__label" }, Nt = ["aria-label"], Bt = /* @__PURE__ */ B({
   __name: "DsTag",
   props: {
     tone: {
       type: String,
-      default: Et.DEFAULT
+      default: Rt.DEFAULT
     },
     // Semicircular sides (DS `rounded`): radius-round vs the default radius-control.
     rounded: Boolean,
@@ -227,29 +227,29 @@ const ge = {
   setup(e, { emit: n }) {
     const t = n;
     return (o, i) => (a(), l("span", {
-      class: $(["ds-tag", [
+      class: L(["ds-tag", [
         `ds-tag--${e.tone}`,
         { "is-rounded": e.rounded, "is-clickable": e.clickable, "is-truncate": e.truncate }
       ]])
     }, [
-      s("span", Lt, [
-        A(o.$slots, "default", {}, void 0, !0)
+      s("span", At, [
+        _(o.$slots, "default", {}, void 0, !0)
       ]),
       e.closable ? (a(), l("button", {
         key: 0,
         type: "button",
         class: "ds-tag__close",
         "aria-label": e.closeLabel || void 0,
-        onClick: i[0] || (i[0] = ve((c) => t(_(X)), ["stop"]))
+        onClick: i[0] || (i[0] = ue((r) => t(D(J)), ["stop"]))
       }, [...i[1] || (i[1] = [
         s("i", {
           class: "material-icons",
           "aria-hidden": "true"
         }, "close", -1)
-      ])], 8, wt)) : m("", !0)
+      ])], 8, Nt)) : g("", !0)
     ], 2));
   }
-}), xi = /* @__PURE__ */ M(It, [["__scopeId", "data-v-0540d9b3"]]), Re = {
+}), tn = /* @__PURE__ */ O(Bt, [["__scopeId", "data-v-0540d9b3"]]), xe = {
   ACCENT: "accent",
   // e.g. Work (purple)
   GREY: "grey",
@@ -262,22 +262,22 @@ const ge = {
   // coral
   WARNING: "warning"
   // orange
-}, Ct = /* @__PURE__ */ x({
+}, Ot = /* @__PURE__ */ B({
   __name: "DsBadge",
   props: {
     tone: {
       type: String,
-      default: Re.ACCENT
+      default: xe.ACCENT
     }
   },
   setup(e) {
     return (n, t) => (a(), l("span", {
-      class: $(["ds-badge", `ds-badge--${e.tone}`])
+      class: L(["ds-badge", `ds-badge--${e.tone}`])
     }, [
-      A(n.$slots, "default", {}, void 0, !0)
+      _(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), _t = /* @__PURE__ */ M(Ct, [["__scopeId", "data-v-f10a17a0"]]), Dt = ["src", "alt"], At = ["aria-label"], Nt = /* @__PURE__ */ x({
+}), xt = /* @__PURE__ */ O(Ot, [["__scopeId", "data-v-f10a17a0"]]), Mt = ["src", "alt"], Pt = ["aria-label"], zt = /* @__PURE__ */ B({
   __name: "DsAvatar",
   props: {
     image: { type: String, default: "" },
@@ -303,77 +303,77 @@ const ge = {
     alt: { type: String, default: void 0 }
   },
   setup(e) {
-    const n = e, t = g(() => n.letters ? n.letters : n.firstName && n.lastName ? (n.firstName.charAt(0) + n.lastName.charAt(0)).toUpperCase() : ""), o = g(() => `${n.firstName} ${n.lastName}`.trim() || n.letters), i = g(() => {
+    const n = e, t = S(() => n.letters ? n.letters : n.firstName && n.lastName ? (n.firstName.charAt(0) + n.lastName.charAt(0)).toUpperCase() : ""), o = S(() => `${n.firstName} ${n.lastName}`.trim() || n.letters), i = S(() => {
       var d;
       return (d = n.alt) != null ? d : o.value;
-    }), c = g(() => {
+    }), r = S(() => {
       var d;
       return (d = n.width) != null ? d : n.size;
-    }), k = g(() => {
+    }), E = S(() => {
       var d;
       return (d = n.height) != null ? d : n.size;
-    }), f = g(() => ({ width: `${c.value}px`, height: `${k.value}px` })), y = g(
+    }), f = S(() => ({ width: `${r.value}px`, height: `${E.value}px` })), y = S(
       () => {
         var d;
-        return (d = n.textSize) != null ? d : Math.round(Math.min(c.value, k.value) * 0.4);
+        return (d = n.textSize) != null ? d : Math.round(Math.min(r.value, E.value) * 0.4);
       }
-    ), r = g(() => {
+    ), v = S(() => {
       const d = n.uid || n.firstName + n.lastName || n.letters;
-      let b = 0;
-      for (let p = 0; p < d.length; p++)
-        b = d.charCodeAt(p) + ((b << 5) - b), b = b & b;
-      const h = [0, 0, 0];
-      for (let p = 0; p < 3; p++) h[p] = b >> p * 8 & 255;
-      const T = h[0] >= 200 && h[1] >= 200 && h[2] >= 200;
-      return { bg: `rgb(${h[0]}, ${h[1]}, ${h[2]})`, fg: T ? "#323f4b" : "#fff" };
+      let c = 0;
+      for (let w = 0; w < d.length; w++)
+        c = d.charCodeAt(w) + ((c << 5) - c), c = c & c;
+      const m = [0, 0, 0];
+      for (let w = 0; w < 3; w++) m[w] = c >> w * 8 & 255;
+      const k = m[0] >= 200 && m[1] >= 200 && m[2] >= 200;
+      return { bg: `rgb(${m[0]}, ${m[1]}, ${m[2]})`, fg: k ? "#323f4b" : "#fff" };
     });
-    return (d, b) => e.image ? (a(), l("img", {
+    return (d, c) => e.image ? (a(), l("img", {
       key: 0,
-      class: $(["ds-avatar", { "is-circular": e.circular }]),
+      class: L(["ds-avatar", { "is-circular": e.circular }]),
       src: e.image,
       alt: i.value,
-      style: F(f.value)
-    }, null, 14, Dt)) : t.value ? (a(), l("div", {
+      style: U(f.value)
+    }, null, 14, Mt)) : t.value ? (a(), l("div", {
       key: 1,
-      class: $(["ds-avatar ds-avatar--initials", { "is-circular": e.circular }]),
+      class: L(["ds-avatar ds-avatar--initials", { "is-circular": e.circular }]),
       role: "img",
       "aria-label": i.value || void 0,
-      style: F([
+      style: U([
         f.value,
         {
-          background: r.value.bg,
-          color: r.value.fg,
+          background: v.value.bg,
+          color: v.value.fg,
           fontSize: `${y.value}px`,
           fontWeight: e.fontWeight
         }
       ])
-    }, S(t.value), 15, At)) : (a(), l("div", {
+    }, T(t.value), 15, Pt)) : (a(), l("div", {
       key: 2,
-      class: $(["ds-avatar ds-avatar--placeholder", { "is-circular": e.circular }]),
-      style: F(f.value),
+      class: L(["ds-avatar ds-avatar--placeholder", { "is-circular": e.circular }]),
+      style: U(f.value),
       "aria-hidden": "true"
     }, null, 6));
   }
-}), Mi = /* @__PURE__ */ M(Nt, [["__scopeId", "data-v-4faae4da"]]), Rt = ["disabled", "name", "aria-label"], Bt = {
+}), an = /* @__PURE__ */ O(zt, [["__scopeId", "data-v-4faae4da"]]), Vt = ["disabled", "name", "aria-label"], Ft = {
   key: 0,
   class: "ds-checkbox__mark",
   viewBox: "0 0 16 16",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2.5"
-}, xt = {
+}, Ut = {
   key: 1,
   class: "ds-checkbox__mark",
   viewBox: "0 0 16 16",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2.5"
-}, Mt = {
+}, Gt = {
   key: 0,
   class: "ds-checkbox__label"
-}, Ot = /* @__PURE__ */ x({
+}, Wt = /* @__PURE__ */ B({
   __name: "DsCheckbox",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ te({
     indeterminate: Boolean,
     disabled: Boolean,
     name: { type: String, default: "" },
@@ -387,58 +387,58 @@ const ge = {
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const n = de(e, "modelValue"), t = e, o = U(null);
+    const n = ve(e, "modelValue"), t = e, o = F(null);
     function i() {
       o.value && (o.value.indeterminate = t.indeterminate);
     }
-    return Qe(i), te(() => t.indeterminate, i), (c, k) => (a(), l("label", {
-      class: $(["ds-checkbox", { "is-disabled": e.disabled }])
+    return nt(i), Z(() => t.indeterminate, i), (r, E) => (a(), l("label", {
+      class: L(["ds-checkbox", { "is-disabled": e.disabled }])
     }, [
-      Be(s("input", {
+      Me(s("input", {
         ref_key: "inputRef",
         ref: o,
-        "onUpdate:modelValue": k[0] || (k[0] = (f) => n.value = f),
+        "onUpdate:modelValue": E[0] || (E[0] = (f) => n.value = f),
         type: "checkbox",
         class: "ds-checkbox__native",
         disabled: e.disabled,
         name: e.name || void 0,
         "aria-label": e.ariaLabel || void 0
-      }, null, 8, Rt), [
-        [st, n.value]
+      }, null, 8, Vt), [
+        [bt, n.value]
       ]),
       s("span", {
-        class: $(["ds-checkbox__box", { "is-active": n.value || e.indeterminate }]),
+        class: L(["ds-checkbox__box", { "is-active": n.value || e.indeterminate }]),
         "aria-hidden": "true"
       }, [
-        e.indeterminate ? (a(), l("svg", Bt, [...k[1] || (k[1] = [
+        e.indeterminate ? (a(), l("svg", Ft, [...E[1] || (E[1] = [
           s("line", {
             x1: "4",
             y1: "8",
             x2: "12",
             y2: "8"
           }, null, -1)
-        ])])) : n.value ? (a(), l("svg", xt, [...k[2] || (k[2] = [
+        ])])) : n.value ? (a(), l("svg", Ut, [...E[2] || (E[2] = [
           s("path", { d: "M3.5 8.5l3 3 6-6" }, null, -1)
-        ])])) : m("", !0)
+        ])])) : g("", !0)
       ], 2),
-      c.$slots.default || e.label ? (a(), l("span", Mt, [
-        A(c.$slots, "default", {}, () => [
-          H(S(e.label), 1)
+      r.$slots.default || e.label ? (a(), l("span", Gt, [
+        _(r.$slots, "default", {}, () => [
+          q(T(e.label), 1)
         ], !0)
-      ])) : m("", !0)
+      ])) : g("", !0)
     ], 2));
   }
-}), et = /* @__PURE__ */ M(Ot, [["__scopeId", "data-v-2da3772e"]]), Ye = {
+}), ot = /* @__PURE__ */ O(Wt, [["__scopeId", "data-v-2da3772e"]]), Je = {
   LEFT: "left",
   CENTER: "center",
   RIGHT: "right"
-}, ee = {
+}, ne = {
   LEFT: "left",
   RIGHT: "right"
-}, Pt = ["aria-busy"], Ft = { class: "ds-table__table" }, zt = { class: "ds-table__head" }, Vt = {
+}, Ht = ["aria-busy"], Kt = { class: "ds-table__table" }, Yt = { class: "ds-table__head" }, qt = {
   key: 0,
   class: "ds-table__select-all"
-}, Ut = { key: 0 }, Gt = ["colspan"], Ht = ["aria-busy"], Wt = { key: 0 }, Kt = ["colspan"], Yt = { key: 1 }, qt = ["colspan"], jt = ["title"], Xt = /* @__PURE__ */ x({
+}, jt = { key: 0 }, Xt = ["colspan"], Zt = ["aria-busy"], Qt = { key: 0 }, Jt = ["colspan"], ea = { key: 1 }, ta = ["colspan"], aa = ["title"], la = /* @__PURE__ */ B({
   __name: "DsTable",
   props: {
     // --- Declarative API (default): the table builds itself from columns + rows. ---
@@ -493,231 +493,231 @@ const ge = {
     // falls back to DsSpinner's own default. Overridable per row via the #loading slot.
     loadingLabel: { type: String, default: "" }
   },
-  emits: [ze],
+  emits: [Ge],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = g(
+    const t = e, o = n, i = S(
       () => Math.max(1, t.headers.length + (t.selectable ? 1 : 0))
-    ), c = g(
+    ), r = S(
       () => t.rowHeight == null ? void 0 : {
         "--ds-table-row-height": typeof t.rowHeight == "number" ? `${t.rowHeight}px` : t.rowHeight
       }
-    ), k = g(
+    ), E = S(
       () => t.height == null ? void 0 : { height: typeof t.height == "number" ? `${t.height}px` : t.height }
     );
-    function f(v) {
-      o(ze, v);
-    }
-    function y(v) {
-      if (!v) return 0;
-      const D = /^(\d+(?:\.\d+)?)px$/.exec(v.trim());
-      return D ? parseFloat(D[1]) : 0;
-    }
-    const r = g(() => {
-      const v = {};
-      let D = 0;
-      for (const I of t.columns)
-        I.pinned === ee.LEFT && (v[I.key] = { position: "sticky", left: `${D}px` }, D += y(I.width));
-      let w = 0;
-      for (let I = t.columns.length - 1; I >= 0; I--) {
-        const P = t.columns[I];
-        P.pinned === ee.RIGHT && (v[P.key] = { position: "sticky", right: `${w}px` }, w += y(P.width));
+    function f(b) {
+      o(Ge, b);
+    }
+    function y(b) {
+      if (!b) return 0;
+      const R = /^(\d+(?:\.\d+)?)px$/.exec(b.trim());
+      return R ? parseFloat(R[1]) : 0;
+    }
+    const v = S(() => {
+      const b = {};
+      let R = 0;
+      for (const p of t.columns)
+        p.pinned === ne.LEFT && (b[p.key] = { position: "sticky", left: `${R}px` }, R += y(p.width));
+      let u = 0;
+      for (let p = t.columns.length - 1; p >= 0; p--) {
+        const x = t.columns[p];
+        x.pinned === ne.RIGHT && (b[x.key] = { position: "sticky", right: `${u}px` }, u += y(x.width));
       }
-      return v;
-    }), d = g(() => {
-      const v = t.columns.filter((I) => I.pinned === ee.LEFT), D = t.columns.filter((I) => I.pinned === ee.RIGHT), w = /* @__PURE__ */ new Set();
-      return v.length && w.add(v[v.length - 1].key), D.length && w.add(D[0].key), w;
+      return b;
+    }), d = S(() => {
+      const b = t.columns.filter((p) => p.pinned === ne.LEFT), R = t.columns.filter((p) => p.pinned === ne.RIGHT), u = /* @__PURE__ */ new Set();
+      return b.length && u.add(b[b.length - 1].key), R.length && u.add(R[0].key), u;
     });
-    function b(v) {
-      if (v.pinned)
+    function c(b) {
+      if (b.pinned)
         return {
           "ds-table__pin": !0,
-          [`ds-table__pin--${v.pinned}`]: !0,
-          "ds-table__pin--edge": d.value.has(v.key)
+          [`ds-table__pin--${b.pinned}`]: !0,
+          "ds-table__pin--edge": d.value.has(b.key)
         };
     }
-    function h(v) {
-      const D = r.value[v.key], w = v.width ? { width: v.width } : void 0;
-      if (!(!D && !w))
-        return { ...w, ...D };
-    }
-    function T(v) {
-      const D = r.value[v.key];
-      if (D)
-        return v.width ? { ...D, width: v.width } : D;
-    }
-    const p = g(
-      () => t.headers.map((v) => typeof v == "string" ? { label: v } : v)
-    ), V = g(() => {
-      const v = {}, D = p.value;
-      let w = 0;
-      D.forEach((P, ne) => {
-        P.pinned === ee.LEFT && (v[ne] = { position: "sticky", left: `${w}px` }, w += y(P.width));
+    function m(b) {
+      const R = v.value[b.key], u = b.width ? { width: b.width } : void 0;
+      if (!(!R && !u))
+        return { ...u, ...R };
+    }
+    function k(b) {
+      const R = v.value[b.key];
+      if (R)
+        return b.width ? { ...R, width: b.width } : R;
+    }
+    const w = S(
+      () => t.headers.map((b) => typeof b == "string" ? { label: b } : b)
+    ), N = S(() => {
+      const b = {}, R = w.value;
+      let u = 0;
+      R.forEach((x, le) => {
+        x.pinned === ne.LEFT && (b[le] = { position: "sticky", left: `${u}px` }, u += y(x.width));
       });
-      let I = 0;
-      for (let P = D.length - 1; P >= 0; P--)
-        D[P].pinned === ee.RIGHT && (v[P] = { position: "sticky", right: `${I}px` }, I += y(D[P].width));
-      return v;
-    }), C = g(() => {
-      const v = p.value, D = v.map((P, ne) => ({ h: P, i: ne })).filter(({ h: P }) => P.pinned === ee.LEFT), w = v.map((P, ne) => ({ h: P, i: ne })).filter(({ h: P }) => P.pinned === ee.RIGHT), I = /* @__PURE__ */ new Set();
-      return D.length && I.add(D[D.length - 1].i), w.length && I.add(w[0].i), I;
+      let p = 0;
+      for (let x = R.length - 1; x >= 0; x--)
+        R[x].pinned === ne.RIGHT && (b[x] = { position: "sticky", right: `${p}px` }, p += y(R[x].width));
+      return b;
+    }), C = S(() => {
+      const b = w.value, R = b.map((x, le) => ({ h: x, i: le })).filter(({ h: x }) => x.pinned === ne.LEFT), u = b.map((x, le) => ({ h: x, i: le })).filter(({ h: x }) => x.pinned === ne.RIGHT), p = /* @__PURE__ */ new Set();
+      return R.length && p.add(R[R.length - 1].i), u.length && p.add(u[0].i), p;
     });
-    function E(v, D) {
-      if (v.pinned)
+    function $(b, R) {
+      if (b.pinned)
         return {
           "ds-table__pin": !0,
-          [`ds-table__pin--${v.pinned}`]: !0,
-          "ds-table__pin--edge": C.value.has(D)
+          [`ds-table__pin--${b.pinned}`]: !0,
+          "ds-table__pin--edge": C.value.has(R)
         };
     }
-    function N(v, D) {
-      const w = V.value[D], I = v.width ? { width: v.width } : void 0;
-      if (!(!w && !I))
-        return { ...I, ...w };
+    function A(b, R) {
+      const u = N.value[R], p = b.width ? { width: b.width } : void 0;
+      if (!(!u && !p))
+        return { ...p, ...u };
     }
-    const R = U(null), q = U(!1), J = U(!1);
-    let W = null;
-    function ae() {
-      const v = R.value;
-      v && (q.value = v.scrollLeft > 0, J.value = v.scrollLeft + v.clientWidth < v.scrollWidth - 1);
+    const V = F(null), H = F(!1), ae = F(!1);
+    let G = null;
+    function M() {
+      const b = V.value;
+      b && (H.value = b.scrollLeft > 0, ae.value = b.scrollLeft + b.clientWidth < b.scrollWidth - 1);
     }
-    function re(v) {
-      v == null || v.removeEventListener("scroll", ae), W == null || W.disconnect(), W = null;
+    function j(b) {
+      b == null || b.removeEventListener("scroll", M), G == null || G.disconnect(), G = null;
     }
-    return te(
-      R,
-      (v, D) => {
-        re(D != null ? D : null), v && (v.addEventListener("scroll", ae, { passive: !0 }), typeof ResizeObserver != "undefined" && (W = new ResizeObserver(ae), W.observe(v)), ae());
+    return Z(
+      V,
+      (b, R) => {
+        j(R != null ? R : null), b && (b.addEventListener("scroll", M, { passive: !0 }), typeof ResizeObserver != "undefined" && (G = new ResizeObserver(M), G.observe(b)), M());
       },
       { immediate: !0 }
-    ), be(() => re(R.value)), te(
+    ), de(() => j(V.value)), Z(
       () => [t.columns.length, t.rows.length, t.headers.length, t.compound],
-      () => ue(ae)
-    ), (v, D) => e.compound ? (a(), l("div", {
+      () => se(M)
+    ), (b, R) => e.compound ? (a(), l("div", {
       key: 0,
       class: "ds-table ds-table--compound",
       "aria-busy": e.loading ? "true" : void 0
     }, [
       s("div", {
         ref_key: "wrapperRef",
-        ref: R,
-        class: $(["ds-table__wrapper", { "is-scrolled-start": q.value, "is-scrolled-end": J.value }]),
-        style: F(k.value)
+        ref: V,
+        class: L(["ds-table__wrapper", { "is-scrolled-start": H.value, "is-scrolled-end": ae.value }]),
+        style: U(E.value)
       }, [
-        s("table", Ft, [
-          s("thead", zt, [
+        s("table", Kt, [
+          s("thead", Yt, [
             s("tr", null, [
-              e.selectable ? (a(), l("th", Vt, [
-                j(_(et), {
+              e.selectable ? (a(), l("th", qt, [
+                Y(D(ot), {
                   "model-value": e.allSelected,
                   indeterminate: !e.allSelected && e.someSelected,
                   "aria-label": e.selectAllLabel || void 0,
                   "onUpdate:modelValue": f
                 }, null, 8, ["model-value", "indeterminate", "aria-label"])
-              ])) : m("", !0),
-              (a(!0), l(z, null, Y(p.value, (w, I) => (a(), l("th", {
-                key: w.label,
-                class: $(E(w, I)),
-                style: F(N(w, I))
-              }, S(w.label), 7))), 128))
+              ])) : g("", !0),
+              (a(!0), l(W, null, Q(w.value, (u, p) => (a(), l("th", {
+                key: u.label,
+                class: L($(u, p)),
+                style: U(A(u, p))
+              }, T(u.label), 7))), 128))
             ])
           ]),
           s("tbody", null, [
-            e.loading ? (a(), l("tr", Ut, [
+            e.loading ? (a(), l("tr", jt, [
               s("td", {
                 class: "ds-table__loading",
                 colspan: i.value,
                 "data-testid": "ds-table-loading"
               }, [
-                A(v.$slots, "loading", {}, () => [
-                  j(_(fe), {
+                _(b.$slots, "loading", {}, () => [
+                  Y(D(ye), {
                     label: e.loadingLabel || void 0
                   }, null, 8, ["label"])
                 ], !0)
-              ], 8, Gt)
-            ])) : A(v.$slots, "default", { key: 1 }, void 0, !0)
+              ], 8, Xt)
+            ])) : _(b.$slots, "default", { key: 1 }, void 0, !0)
           ])
         ])
       ], 6)
-    ], 8, Pt)) : (a(), l("div", {
+    ], 8, Ht)) : (a(), l("div", {
       key: 1,
       class: "ds-table",
       "aria-busy": e.loading ? "true" : void 0
     }, [
       s("div", {
         ref_key: "wrapperRef",
-        ref: R,
-        class: $(["ds-table__wrapper", { "is-scrolled-start": q.value, "is-scrolled-end": J.value }])
+        ref: V,
+        class: L(["ds-table__wrapper", { "is-scrolled-start": H.value, "is-scrolled-end": ae.value }])
       }, [
         s("table", {
-          class: $(["ds-table__table", { "has-row-height": e.rowHeight != null }]),
-          style: F(c.value)
+          class: L(["ds-table__table", { "has-row-height": e.rowHeight != null }]),
+          style: U(r.value)
         }, [
           s("thead", null, [
             s("tr", null, [
-              (a(!0), l(z, null, Y(e.columns, (w) => {
-                var I;
+              (a(!0), l(W, null, Q(e.columns, (u) => {
+                var p;
                 return a(), l("th", {
-                  key: w.key,
-                  class: $([
-                    `ds-table__th--${(I = w.align) != null ? I : _(Ye).LEFT}`,
-                    b(w)
+                  key: u.key,
+                  class: L([
+                    `ds-table__th--${(p = u.align) != null ? p : D(Je).LEFT}`,
+                    c(u)
                   ]),
-                  style: F(h(w))
-                }, S(w.label), 7);
+                  style: U(m(u))
+                }, T(u.label), 7);
               }), 128))
             ])
           ]),
           s("tbody", null, [
-            e.loading ? (a(), l("tr", Wt, [
+            e.loading ? (a(), l("tr", Qt, [
               s("td", {
                 class: "ds-table__loading",
                 colspan: Math.max(1, e.columns.length),
                 "data-testid": "ds-table-loading"
               }, [
-                A(v.$slots, "loading", {}, () => [
-                  j(_(fe), {
+                _(b.$slots, "loading", {}, () => [
+                  Y(D(ye), {
                     label: e.loadingLabel || void 0
                   }, null, 8, ["label"])
                 ], !0)
-              ], 8, Kt)
-            ])) : e.rows.length === 0 ? (a(), l("tr", Yt, [
+              ], 8, Jt)
+            ])) : e.rows.length === 0 ? (a(), l("tr", ea, [
               s("td", {
                 class: "ds-table__empty",
                 colspan: Math.max(1, e.columns.length),
                 "data-testid": "ds-table-empty"
               }, [
-                A(v.$slots, "empty", {}, () => [
-                  H(S(e.emptyMessage), 1)
+                _(b.$slots, "empty", {}, () => [
+                  q(T(e.emptyMessage), 1)
                 ], !0)
-              ], 8, qt)
-            ])) : (a(!0), l(z, { key: 2 }, Y(e.rows, (w) => (a(), l("tr", {
-              key: w.id,
-              class: $({ "is-highlighted": w.id === e.highlightRowId }),
+              ], 8, ta)
+            ])) : (a(!0), l(W, { key: 2 }, Q(e.rows, (u) => (a(), l("tr", {
+              key: u.id,
+              class: L({ "is-highlighted": u.id === e.highlightRowId }),
               "data-testid": "ds-table-row"
             }, [
-              (a(!0), l(z, null, Y(e.columns, (I) => {
-                var P;
+              (a(!0), l(W, null, Q(e.columns, (p) => {
+                var x;
                 return a(), l("td", {
-                  key: I.key,
-                  class: $([
-                    `ds-table__td--${(P = I.align) != null ? P : _(Ye).LEFT}`,
-                    b(I)
+                  key: p.key,
+                  class: L([
+                    `ds-table__td--${(x = p.align) != null ? x : D(Je).LEFT}`,
+                    c(p)
                   ]),
-                  style: F(T(I)),
-                  title: e.rowHeight != null && !v.$slots[`cell-${I.key}`] && w[I.key] != null ? String(w[I.key]) : void 0
+                  style: U(k(p)),
+                  title: e.rowHeight != null && !b.$slots[`cell-${p.key}`] && u[p.key] != null ? String(u[p.key]) : void 0
                 }, [
-                  A(v.$slots, `cell-${I.key}`, { row: w }, () => [
-                    H(S(w[I.key]), 1)
+                  _(b.$slots, `cell-${p.key}`, { row: u }, () => [
+                    q(T(u[p.key]), 1)
                   ], !0)
-                ], 14, jt);
+                ], 14, aa);
               }), 128))
             ], 2))), 128))
           ])
         ], 6)
       ], 2)
-    ], 8, Ht));
+    ], 8, Zt));
   }
-}), Oi = /* @__PURE__ */ M(Xt, [["__scopeId", "data-v-7a5bb12f"]]), ce = {
+}), ln = /* @__PURE__ */ O(la, [["__scopeId", "data-v-7a5bb12f"]]), be = {
   TEXT: "text",
   EMAIL: "email",
   PASSWORD: "password",
@@ -725,30 +725,30 @@ const ge = {
   NUMBER: "number",
   SEARCH: "search",
   URL: "url"
-}, Zt = {
+}, ia = {
   SM: "sm",
   // 36px
   MD: "md"
   // 48px
-}, Qt = { class: "ds-input__wrap" }, Jt = {
+}, na = { class: "ds-input__wrap" }, sa = {
   key: 0,
   class: "material-icons ds-input__search-icon",
   "aria-hidden": "true"
-}, ea = ["id", "type", "placeholder", "min", "max", "step", "disabled", "name", "autocomplete", "aria-invalid", "aria-describedby"], ta = {
+}, oa = ["id", "type", "placeholder", "min", "max", "step", "disabled", "name", "autocomplete", "aria-invalid", "aria-describedby"], da = {
   key: 1,
   class: "ds-input__suffix"
-}, aa = {
+}, ra = {
   key: 0,
   class: "material-icons ds-input__error-icon",
   "aria-hidden": "true"
-}, la = ["disabled", "aria-label", "aria-pressed"], ia = {
+}, ca = ["disabled", "aria-label", "aria-pressed"], ua = {
   class: "material-icons",
   "aria-hidden": "true"
-}, na = ["id"], sa = /* @__PURE__ */ x({
+}, fa = ["id"], va = /* @__PURE__ */ B({
   __name: "DsInput",
-  props: /* @__PURE__ */ Q({
-    type: { type: String, default: ce.TEXT },
-    size: { type: String, default: Zt.SM },
+  props: /* @__PURE__ */ te({
+    type: { type: String, default: be.TEXT },
+    size: { type: String, default: ia.SM },
     placeholder: { type: String, default: "" },
     disabled: Boolean,
     error: Boolean,
@@ -768,52 +768,52 @@ const ge = {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q([Se, ke, Me, Oe], ["update:modelValue"]),
+  emits: /* @__PURE__ */ te([we, Ee, ze, Ve], ["update:modelValue"]),
   setup(e, { expose: n, emit: t }) {
-    const o = de(e, "modelValue"), i = e, c = t, k = U();
+    const o = ve(e, "modelValue"), i = e, r = t, E = F();
     function f(C) {
-      const E = C.relatedTarget, N = C.currentTarget;
-      E && (N != null && N.contains(E)) || c(Oe, C);
+      const $ = C.relatedTarget, A = C.currentTarget;
+      $ && (A != null && A.contains($)) || r(Ve, C);
     }
-    const y = Ee(), r = U(!1);
+    const y = he(), v = F(!1);
     function d() {
-      i.disabled || (r.value = !r.value);
+      i.disabled || (v.value = !v.value);
     }
-    const b = g(() => i.type === ce.PASSWORD), h = g(() => i.type === ce.SEARCH), T = g(() => b.value ? r.value ? ce.TEXT : ce.PASSWORD : h.value ? ce.TEXT : i.type), p = g(() => b.value && !!i.toggleLabel), V = g(
-      () => !!y.suffix || i.error && i.showErrorIcon || p.value
+    const c = S(() => i.type === be.PASSWORD), m = S(() => i.type === be.SEARCH), k = S(() => c.value ? v.value ? be.TEXT : be.PASSWORD : m.value ? be.TEXT : i.type), w = S(() => c.value && !!i.toggleLabel), N = S(
+      () => !!y.suffix || i.error && i.showErrorIcon || w.value
     );
     return n({
       focus: () => {
         var C;
-        return (C = k.value) == null ? void 0 : C.focus();
+        return (C = E.value) == null ? void 0 : C.focus();
       },
       focusAtEnd: async () => {
-        await ue();
-        const C = k.value;
+        await se();
+        const C = E.value;
         if (!C) return;
         C.focus();
-        const E = C.value.length;
+        const $ = C.value.length;
         try {
-          C.setSelectionRange(E, E);
+          C.setSelectionRange($, $);
         } catch {
         }
       }
-    }), (C, E) => (a(), l("div", {
-      class: $(["ds-input", [
+    }), (C, $) => (a(), l("div", {
+      class: L(["ds-input", [
         `ds-input--${e.size}`,
-        { "is-error": e.error, "is-disabled": e.disabled, "is-search": h.value }
+        { "is-error": e.error, "is-disabled": e.disabled, "is-search": m.value }
       ]]),
       onFocusout: f
     }, [
-      s("div", Qt, [
-        h.value ? (a(), l("i", Jt, "search")) : m("", !0),
-        Be(s("input", {
+      s("div", na, [
+        m.value ? (a(), l("i", sa, "search")) : g("", !0),
+        Me(s("input", {
           id: e.id || void 0,
           ref_key: "inputEl",
-          ref: k,
-          "onUpdate:modelValue": E[0] || (E[0] = (N) => o.value = N),
-          class: $(["ds-input__control", { "has-suffix": V.value }]),
-          type: T.value,
+          ref: E,
+          "onUpdate:modelValue": $[0] || ($[0] = (A) => o.value = A),
+          class: L(["ds-input__control", { "has-suffix": N.value }]),
+          type: k.value,
           placeholder: e.placeholder,
           min: e.min,
           max: e.max,
@@ -823,40 +823,40 @@ const ge = {
           autocomplete: e.autocomplete || void 0,
           "aria-invalid": e.error || void 0,
           "aria-describedby": e.error && e.errorMessage && e.id ? `${e.id}-error` : void 0,
-          onFocus: E[1] || (E[1] = (N) => c(_(Se), N)),
-          onBlur: E[2] || (E[2] = (N) => c(_(ke), N)),
-          onChange: E[3] || (E[3] = (N) => c(_(Me), N))
-        }, null, 42, ea), [
-          [ot, o.value]
+          onFocus: $[1] || ($[1] = (A) => r(D(we), A)),
+          onBlur: $[2] || ($[2] = (A) => r(D(Ee), A)),
+          onChange: $[3] || ($[3] = (A) => r(D(ze), A))
+        }, null, 42, oa), [
+          [yt, o.value]
         ]),
-        V.value ? (a(), l("div", ta, [
-          A(C.$slots, "suffix", {}, void 0, !0),
-          e.error && e.showErrorIcon ? (a(), l("i", aa, "warning")) : p.value ? (a(), l("button", {
+        N.value ? (a(), l("div", da, [
+          _(C.$slots, "suffix", {}, void 0, !0),
+          e.error && e.showErrorIcon ? (a(), l("i", ra, "warning")) : w.value ? (a(), l("button", {
             key: 1,
             type: "button",
             class: "ds-input__toggle",
             disabled: e.disabled,
             "aria-label": e.toggleLabel || void 0,
-            "aria-pressed": r.value,
+            "aria-pressed": v.value,
             onClick: d
           }, [
-            s("i", ia, S(r.value ? "visibility" : "visibility_off"), 1)
-          ], 8, la)) : m("", !0)
-        ])) : m("", !0)
+            s("i", ua, T(v.value ? "visibility" : "visibility_off"), 1)
+          ], 8, ca)) : g("", !0)
+        ])) : g("", !0)
       ]),
       e.error && e.errorMessage ? (a(), l("p", {
         key: 0,
         id: e.id ? `${e.id}-error` : void 0,
         class: "ds-input__error"
-      }, S(e.errorMessage), 9, na)) : m("", !0)
+      }, T(e.errorMessage), 9, fa)) : g("", !0)
     ], 34));
   }
-}), Pi = /* @__PURE__ */ M(sa, [["__scopeId", "data-v-a7832472"]]), oa = {
+}), nn = /* @__PURE__ */ O(va, [["__scopeId", "data-v-a7832472"]]), ba = {
   VERTICAL: "vertical"
-}, da = ["id", "placeholder", "rows", "disabled", "name", "aria-invalid", "aria-describedby"], ra = ["id"], ca = /* @__PURE__ */ x({
+}, ya = ["id", "placeholder", "rows", "disabled", "name", "aria-invalid", "aria-describedby"], ma = ["id"], ha = /* @__PURE__ */ B({
   inheritAttrs: !1,
   __name: "DsTextarea",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ te({
     placeholder: { type: String, default: "" },
     rows: { type: Number, default: 4 },
     disabled: Boolean,
@@ -867,25 +867,25 @@ const ge = {
     // CSS resize behavior of the control (default vertical, mirrors the DS).
     resize: {
       type: String,
-      default: oa.VERTICAL
+      default: ba.VERTICAL
     }
   }, {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q([Se, ke], ["update:modelValue"]),
+  emits: /* @__PURE__ */ te([we, Ee], ["update:modelValue"]),
   setup(e, { emit: n }) {
-    const t = de(e, "modelValue"), o = n, i = dt(), c = (y) => y === "class" || y === "style" || y.startsWith("data-"), k = g(
-      () => Object.fromEntries(Object.entries(i).filter(([y]) => c(y)))
-    ), f = g(
-      () => Object.fromEntries(Object.entries(i).filter(([y]) => !c(y)))
+    const t = ve(e, "modelValue"), o = n, i = mt(), r = (y) => y === "class" || y === "style" || y.startsWith("data-"), E = S(
+      () => Object.fromEntries(Object.entries(i).filter(([y]) => r(y)))
+    ), f = S(
+      () => Object.fromEntries(Object.entries(i).filter(([y]) => !r(y)))
     );
-    return (y, r) => (a(), l("div", he({
+    return (y, v) => (a(), l("div", ke({
       class: ["ds-textarea", [`ds-textarea--resize-${e.resize}`, { "is-error": e.error, "is-disabled": e.disabled }]]
-    }, k.value), [
-      Be(s("textarea", he(f.value, {
+    }, E.value), [
+      Me(s("textarea", ke(f.value, {
         id: e.id || void 0,
-        "onUpdate:modelValue": r[0] || (r[0] = (d) => t.value = d),
+        "onUpdate:modelValue": v[0] || (v[0] = (d) => t.value = d),
         class: "ds-textarea__control",
         placeholder: e.placeholder,
         rows: e.rows,
@@ -893,45 +893,45 @@ const ge = {
         name: e.name || void 0,
         "aria-invalid": e.error || void 0,
         "aria-describedby": e.error && e.errorMessage && e.id ? `${e.id}-error` : void 0,
-        onFocus: r[1] || (r[1] = (d) => o(_(Se), d)),
-        onBlur: r[2] || (r[2] = (d) => o(_(ke), d))
-      }), null, 16, da), [
-        [rt, t.value]
+        onFocus: v[1] || (v[1] = (d) => o(D(we), d)),
+        onBlur: v[2] || (v[2] = (d) => o(D(Ee), d))
+      }), null, 16, ya), [
+        [ht, t.value]
       ]),
       e.error && e.errorMessage ? (a(), l("p", {
         key: 0,
         id: e.id ? `${e.id}-error` : void 0,
         class: "ds-textarea__error"
-      }, S(e.errorMessage), 9, ra)) : m("", !0)
+      }, T(e.errorMessage), 9, ma)) : g("", !0)
     ], 16));
   }
-}), Fi = /* @__PURE__ */ M(ca, [["__scopeId", "data-v-745c01de"]]), ua = {
+}), sn = /* @__PURE__ */ O(ha, [["__scopeId", "data-v-745c01de"]]), ga = {
   SUCCESS: "success",
   INFO: "info",
   WARNING: "warning",
   ERROR: "error"
-}, fa = {
+}, pa = {
   LIGHT: "light",
   // tinted: family tint bg + mid border + shadow text
   DARK: "dark"
   // solid: family shadow bg + white text
-}, ba = {
+}, Sa = {
   success: "check_circle",
   info: "info",
   warning: "warning",
   error: "error"
-}, va = {
+}, ka = {
   key: 0,
   class: "material-icons ds-alert__icon",
   "aria-hidden": "true"
-}, ya = { class: "ds-alert__content" }, ma = {
+}, $a = { class: "ds-alert__content" }, wa = {
   key: 1,
   class: "ds-alert__body"
-}, ha = ["aria-label"], ga = /* @__PURE__ */ x({
+}, Ea = ["aria-label"], Ta = /* @__PURE__ */ B({
   __name: "DsAlert",
-  props: /* @__PURE__ */ Q({
-    type: { type: String, default: ua.INFO },
-    effect: { type: String, default: fa.LIGHT },
+  props: /* @__PURE__ */ te({
+    type: { type: String, default: ga.INFO },
+    effect: { type: String, default: pa.LIGHT },
     title: { type: String, default: "" },
     description: { type: String, default: "" },
     showIcon: Boolean,
@@ -944,88 +944,88 @@ const ge = {
     visible: { type: Boolean, default: !0 },
     visibleModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q([X], ["update:visible"]),
+  emits: /* @__PURE__ */ te([J], ["update:visible"]),
   setup(e, { emit: n }) {
-    const t = e, o = n, i = de(e, "visible"), c = Ee(), k = g(() => ba[t.type]), f = g(() => !!c.default || t.description.length > 0), y = g(() => !!c.title || t.title.length > 0);
-    function r() {
-      i.value = !1, o(X);
+    const t = e, o = n, i = ve(e, "visible"), r = he(), E = S(() => Sa[t.type]), f = S(() => !!r.default || t.description.length > 0), y = S(() => !!r.title || t.title.length > 0);
+    function v() {
+      i.value = !1, o(J);
     }
-    return (d, b) => (a(), G(Le, { name: "ds-alert-fade" }, {
+    return (d, c) => (a(), K(me, { name: "ds-alert-fade" }, {
       default: ie(() => [
         i.value ? (a(), l("div", {
           key: 0,
-          class: $(["ds-alert", [`ds-alert--${e.type}`, `ds-alert--${e.effect}`, { "is-center": e.center }]]),
+          class: L(["ds-alert", [`ds-alert--${e.type}`, `ds-alert--${e.effect}`, { "is-center": e.center }]]),
           role: "alert"
         }, [
-          e.showIcon ? (a(), l("i", va, S(k.value), 1)) : m("", !0),
-          s("div", ya, [
+          e.showIcon ? (a(), l("i", ka, T(E.value), 1)) : g("", !0),
+          s("div", $a, [
             y.value ? (a(), l("div", {
               key: 0,
-              class: $(["ds-alert__title", { "has-body": f.value, "is-bold": f.value || e.boldTitle }])
+              class: L(["ds-alert__title", { "has-body": f.value, "is-bold": f.value || e.boldTitle }])
             }, [
-              A(d.$slots, "title", {}, () => [
-                H(S(e.title), 1)
+              _(d.$slots, "title", {}, () => [
+                q(T(e.title), 1)
               ], !0)
-            ], 2)) : m("", !0),
-            f.value ? (a(), l("div", ma, [
-              A(d.$slots, "default", {}, () => [
-                H(S(e.description), 1)
+            ], 2)) : g("", !0),
+            f.value ? (a(), l("div", wa, [
+              _(d.$slots, "default", {}, () => [
+                q(T(e.description), 1)
               ], !0)
-            ])) : m("", !0)
+            ])) : g("", !0)
           ]),
           e.closable ? (a(), l("button", {
             key: 1,
             type: "button",
             class: "ds-alert__close",
             "aria-label": e.closeLabel || void 0,
-            onClick: r
-          }, [...b[0] || (b[0] = [
+            onClick: v
+          }, [...c[0] || (c[0] = [
             s("i", {
               class: "material-icons",
               "aria-hidden": "true"
             }, "close", -1)
-          ])], 8, ha)) : m("", !0)
-        ], 2)) : m("", !0)
+          ])], 8, Ea)) : g("", !0)
+        ], 2)) : g("", !0)
       ]),
       _: 3
     }));
   }
-}), zi = /* @__PURE__ */ M(ga, [["__scopeId", "data-v-9ced26d6"]]), Sa = {
+}), on = /* @__PURE__ */ O(Ta, [["__scopeId", "data-v-9ced26d6"]]), La = {
   SUCCESS: "success",
   INFO: "info",
   WARNING: "warning",
   ERROR: "error"
-}, ka = {
+}, Ca = {
   TOP_LEFT: "top-left",
   TOP_RIGHT: "top-right",
   BOTTOM_LEFT: "bottom-left",
   BOTTOM_RIGHT: "bottom-right"
-}, pa = {
+}, _a = {
   success: "check_circle",
   info: "mode_edit",
   warning: "warning",
   error: "error"
-}, qe = {
+}, et = {
   BLANK: "_blank",
   SELF: "_self",
   PARENT: "_parent",
   TOP: "_top"
-}, $a = {
+}, Ia = {
   class: "material-icons ds-notification__icon",
   "aria-hidden": "true"
-}, Ta = { class: "ds-notification__content" }, Ea = {
+}, Da = { class: "ds-notification__content" }, Ra = {
   key: 0,
   class: "ds-notification__title"
-}, La = {
+}, Aa = {
   key: 1,
   class: "ds-notification__desc"
-}, wa = ["href", "target", "rel"], Ia = ["aria-label"], Ca = /* @__PURE__ */ x({
+}, Na = ["href", "target", "rel"], Ba = ["aria-label"], Oa = /* @__PURE__ */ B({
   __name: "DsNotification",
   props: {
-    type: { type: String, default: Sa.INFO },
+    type: { type: String, default: La.INFO },
     position: {
       type: String,
-      default: ka.BOTTOM_LEFT
+      default: Ca.BOTTOM_LEFT
     },
     title: { type: String, default: "" },
     description: { type: String, default: "" },
@@ -1036,7 +1036,7 @@ const ge = {
     // navegación in-app (SPA) escuchá `navigate` y enrutá con el router de la app.
     linkTarget: {
       type: String,
-      default: qe.BLANK
+      default: et.BLANK
     },
     showClose: { type: Boolean, default: !0 },
     // Accessible name for the icon-only close button — provide it whenever
@@ -1048,85 +1048,85 @@ const ge = {
     // while the pointer is over the card and resumes with the remaining time.
     duration: { type: Number, default: 3500 }
   },
-  emits: [X, We],
+  emits: [J, qe],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = U(!0), c = g(() => pa[t.type]), k = g(
-      () => t.linkTarget === qe.BLANK ? "noopener noreferrer" : void 0
+    const t = e, o = n, i = F(!0), r = S(() => _a[t.type]), E = S(
+      () => t.linkTarget === et.BLANK ? "noopener noreferrer" : void 0
     );
-    let f, y = 0, r = t.duration;
+    let f, y = 0, v = t.duration;
     function d() {
       f && (clearTimeout(f), f = void 0);
     }
-    function b(C) {
-      d(), !(t.duration <= 0 || !i.value) && (y = Date.now(), f = setTimeout(p, C));
+    function c(C) {
+      d(), !(t.duration <= 0 || !i.value) && (y = Date.now(), f = setTimeout(w, C));
     }
-    function h() {
-      f && (r -= Date.now() - y, d());
+    function m() {
+      f && (v -= Date.now() - y, d());
     }
-    function T() {
-      b(r > 0 ? r : t.duration);
+    function k() {
+      c(v > 0 ? v : t.duration);
     }
-    function p() {
-      d(), i.value = !1, o(X);
+    function w() {
+      d(), i.value = !1, o(J);
     }
-    function V(C) {
-      o(We, C);
+    function N(C) {
+      o(qe, C);
     }
-    return Qe(() => b(t.duration)), be(d), (C, E) => (a(), G(Je, { to: "body" }, [
-      j(Le, {
+    return nt(() => c(t.duration)), de(d), (C, $) => (a(), K(Pe, { to: "body" }, [
+      Y(me, {
         name: "ds-notification",
         appear: ""
       }, {
         default: ie(() => [
           i.value ? (a(), l("div", {
             key: 0,
-            class: $(["ds-notification", `ds-notification--${e.position}`])
+            class: L(["ds-notification", `ds-notification--${e.position}`])
           }, [
             s("div", {
-              class: $(["ds-notification__card", `ds-notification__card--${e.type}`]),
+              class: L(["ds-notification__card", `ds-notification__card--${e.type}`]),
               role: "alert",
-              onMouseenter: h,
-              onMouseleave: T
+              onMouseenter: m,
+              onMouseleave: k
             }, [
-              s("i", $a, S(c.value), 1),
-              s("div", Ta, [
-                e.title ? (a(), l("span", Ea, S(e.title), 1)) : m("", !0),
-                e.description ? (a(), l("p", La, S(e.description), 1)) : m("", !0),
+              s("i", Ia, T(r.value), 1),
+              s("div", Da, [
+                e.title ? (a(), l("span", Ra, T(e.title), 1)) : g("", !0),
+                e.description ? (a(), l("p", Aa, T(e.description), 1)) : g("", !0),
                 e.linkTitle ? (a(), l("a", {
                   key: 2,
                   class: "ds-notification__link",
                   href: e.link || void 0,
                   target: e.linkTarget,
-                  rel: k.value,
-                  onClick: V
-                }, S(e.linkTitle), 9, wa)) : m("", !0)
+                  rel: E.value,
+                  onClick: N
+                }, T(e.linkTitle), 9, Na)) : g("", !0)
               ]),
               e.showClose ? (a(), l("button", {
                 key: 0,
                 type: "button",
                 class: "ds-notification__close",
                 "aria-label": e.closeLabel || void 0,
-                onClick: p
-              }, [...E[0] || (E[0] = [
+                onClick: w
+              }, [...$[0] || ($[0] = [
                 s("i", {
                   class: "material-icons",
                   "aria-hidden": "true"
                 }, "close", -1)
-              ])], 8, Ia)) : m("", !0)
+              ])], 8, Ba)) : g("", !0)
             ], 34)
-          ], 2)) : m("", !0)
+          ], 2)) : g("", !0)
         ]),
         _: 1
       })
     ]));
   }
-}), Vi = /* @__PURE__ */ M(Ca, [["__scopeId", "data-v-f1d76da5"]]), _a = ["aria-modal", "aria-labelledby", "aria-label"], Da = {
+}), dn = /* @__PURE__ */ O(Oa, [["__scopeId", "data-v-f1d76da5"]]), xa = ["aria-modal", "aria-labelledby", "aria-label"], Ma = {
   key: 0,
   class: "ds-modal__header"
-}, Aa = ["id"], Na = { class: "ds-modal__body" }, Ra = {
+}, Pa = ["id"], za = { class: "ds-modal__body" }, Va = {
   key: 1,
   class: "ds-modal__footer"
-}, Ba = /* @__PURE__ */ x({
+}, Fa = /* @__PURE__ */ B({
   __name: "DsModal",
   props: {
     open: Boolean,
@@ -1149,120 +1149,141 @@ const ge = {
     // matching DsDataCard so the control is never unnamed.
     closeLabel: { type: String, default: "Close" }
   },
-  emits: [X],
+  emits: [J],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = U(null);
-    let c = null;
-    const k = xe(), f = g(() => ({
+    const t = e, o = n, i = F(null);
+    let r = null;
+    const E = ge(), f = S(() => ({
       width: t.width,
       ...t.height ? { height: t.height } : {}
     }));
     function y() {
-      t.fixed && t.closeOnBackdrop && o(X);
+      t.fixed && t.closeOnBackdrop && o(J);
     }
-    function r() {
+    function v() {
       return i.value ? Array.from(i.value.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(
-        (p) => p.offsetParent !== null
+        (w) => w.offsetParent !== null
       ) : [];
     }
-    function d(T) {
-      var E;
-      if (T.key === "Escape") {
-        t.closeOnEscape && o(X);
+    function d(k) {
+      var $;
+      if (k.key === "Escape") {
+        t.closeOnEscape && o(J);
         return;
       }
-      if (T.key !== "Tab") return;
-      const p = r();
-      if (p.length === 0) {
-        T.preventDefault(), (E = i.value) == null || E.focus();
+      if (k.key !== "Tab") return;
+      const w = v();
+      if (w.length === 0) {
+        k.preventDefault(), ($ = i.value) == null || $.focus();
         return;
       }
-      const V = p[0], C = p[p.length - 1];
-      T.shiftKey && document.activeElement === V ? (T.preventDefault(), C.focus()) : !T.shiftKey && document.activeElement === C && (T.preventDefault(), V.focus());
+      const N = w[0], C = w[w.length - 1];
+      k.shiftKey && document.activeElement === N ? (k.preventDefault(), C.focus()) : !k.shiftKey && document.activeElement === C && (k.preventDefault(), N.focus());
     }
-    function b() {
-      c = document.activeElement, document.addEventListener("keydown", d), document.body.style.overflow = "hidden", ue(() => {
-        var T, p;
-        return (p = (T = r()[0]) != null ? T : i.value) == null ? void 0 : p.focus();
+    function c() {
+      r = document.activeElement, document.addEventListener("keydown", d), document.body.style.overflow = "hidden", se(() => {
+        var k, w;
+        return (w = (k = v()[0]) != null ? k : i.value) == null ? void 0 : w.focus();
       });
     }
-    function h(T = !0) {
-      var p;
-      document.removeEventListener("keydown", d), document.body.style.overflow = "", T && ((p = c == null ? void 0 : c.focus) == null || p.call(c));
+    function m(k = !0) {
+      var w;
+      document.removeEventListener("keydown", d), document.body.style.overflow = "", k && ((w = r == null ? void 0 : r.focus) == null || w.call(r));
     }
-    return te(
+    return Z(
       () => t.open && t.fixed,
-      (T, p) => {
-        typeof document != "undefined" && (T ? b() : p && h());
+      (k, w) => {
+        typeof document != "undefined" && (k ? c() : w && m());
       },
       { immediate: !0 }
-    ), be(() => {
-      typeof document != "undefined" && h(!1);
-    }), (T, p) => (a(), G(Je, {
+    ), de(() => {
+      typeof document != "undefined" && m(!1);
+    }), (k, w) => (a(), K(Pe, {
       to: "body",
       disabled: !e.fixed
     }, [
-      j(Le, { name: "ds-modal" }, {
+      Y(me, { name: "ds-modal" }, {
         default: ie(() => [
           e.open ? (a(), l("div", {
             key: 0,
-            class: $(["ds-modal", { "is-fixed": e.fixed }]),
-            style: F(e.fixed ? { paddingTop: e.top } : void 0),
+            class: L(["ds-modal", { "is-fixed": e.fixed }]),
+            style: U(e.fixed ? { paddingTop: e.top } : void 0),
             onClick: y
           }, [
             s("div", {
               ref_key: "dialogRef",
               ref: i,
-              class: $(["ds-modal__dialog", { "is-center": e.center }]),
+              class: L(["ds-modal__dialog", { "is-center": e.center }]),
               role: "dialog",
               "aria-modal": e.fixed ? "true" : "false",
-              "aria-labelledby": e.title ? _(k) : void 0,
+              "aria-labelledby": e.title ? D(E) : void 0,
               "aria-label": e.title ? void 0 : "dialog",
               tabindex: "-1",
-              style: F(f.value),
-              onClick: p[1] || (p[1] = ve(() => {
+              style: U(f.value),
+              onClick: w[1] || (w[1] = ue(() => {
               }, ["stop"]))
             }, [
-              e.title || e.showClose ? (a(), l("div", Da, [
+              e.title || e.showClose ? (a(), l("div", Ma, [
                 s("span", {
-                  id: _(k),
+                  id: D(E),
                   class: "ds-modal__title"
-                }, S(e.title), 9, Aa),
-                e.showClose ? (a(), G(_(oe), {
+                }, T(e.title), 9, Pa),
+                e.showClose ? (a(), K(D(fe), {
                   key: 0,
                   variant: "tertiary",
                   circle: "",
                   "left-icon": "close",
                   "aria-label": e.closeLabel || void 0,
-                  onClick: p[0] || (p[0] = (V) => o(_(X)))
-                }, null, 8, ["aria-label"])) : m("", !0)
-              ])) : m("", !0),
-              s("div", Na, [
-                A(T.$slots, "default", {}, void 0, !0)
+                  onClick: w[0] || (w[0] = (N) => o(D(J)))
+                }, null, 8, ["aria-label"])) : g("", !0)
+              ])) : g("", !0),
+              s("div", za, [
+                _(k.$slots, "default", {}, void 0, !0)
               ]),
-              T.$slots.footer ? (a(), l("div", Ra, [
-                A(T.$slots, "footer", {}, void 0, !0)
-              ])) : m("", !0)
-            ], 14, _a)
-          ], 6)) : m("", !0)
+              k.$slots.footer ? (a(), l("div", Va, [
+                _(k.$slots, "footer", {}, void 0, !0)
+              ])) : g("", !0)
+            ], 14, xa)
+          ], 6)) : g("", !0)
         ]),
         _: 3
       })
     ], 8, ["disabled"]));
   }
-}), Ui = /* @__PURE__ */ M(Ba, [["__scopeId", "data-v-a759ae72"]]), xa = {
+}), rn = /* @__PURE__ */ O(Fa, [["__scopeId", "data-v-a759ae72"]]), Ua = "--ds-overlay-shift", Se = 8;
+function dt(e, n) {
+  const t = F(0), o = S(
+    () => t.value ? { [Ua]: `${Math.round(t.value)}px` } : null
+  );
+  async function i() {
+    if (typeof window == "undefined") return;
+    t.value = 0, await se();
+    const f = e.value;
+    if (!f) return;
+    const y = f.getBoundingClientRect(), v = n() === "top" || n() === "bottom", [d, c, m] = v ? [y.left, y.right, window.innerWidth] : [y.top, y.bottom, window.innerHeight];
+    d < Se ? t.value = Se - d : c > m - Se && (t.value = m - Se - c);
+  }
+  function r() {
+    typeof window != "undefined" && (window.addEventListener("resize", i), window.addEventListener("scroll", i, { capture: !0, passive: !0 }), i());
+  }
+  function E() {
+    typeof window != "undefined" && (window.removeEventListener("resize", i), window.removeEventListener("scroll", i, { capture: !0 }), t.value = 0);
+  }
+  return { shift: t, shiftStyle: o, measure: i, activate: r, deactivate: E };
+}
+const Ga = {
   TOP: "top",
   BOTTOM: "bottom",
   LEFT: "left",
   RIGHT: "right"
-}, Ma = ["id"], Oa = /* @__PURE__ */ x({
+}, Wa = ["id"], Ha = /* @__PURE__ */ B({
   __name: "DsTooltip",
   props: {
     // Bubble text. Rich content can be provided via the #content slot instead.
     content: { type: String, default: "" },
     placement: {
       type: String,
-      default: xa.TOP
+      default: Ga.TOP
     },
     // Hover delay before showing, ms. Focus always shows immediately (no delay).
     delay: { type: Number, default: 300 },
@@ -1275,77 +1296,88 @@ const ge = {
     disabled: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const n = e, t = Ee(), o = xe(), i = U(!1), c = g(() => !n.disabled && (n.content.length > 0 || !!t.content));
-    te(
+    const n = e, t = he(), o = ge(), i = F(!1), r = F(null), {
+      shiftStyle: E,
+      activate: f,
+      deactivate: y
+    } = dt(r, () => n.placement);
+    Z(i, (M) => {
+      M ? f() : y();
+    });
+    const v = S(() => !n.disabled && (n.content.length > 0 || !!t.content));
+    Z(
       () => n.disabled,
-      (R) => {
-        R && N();
+      (M) => {
+        M && G();
       }
     );
-    let k = !1, f = !1, y = null, r = null, d = null;
-    function b() {
-      y !== null && (clearTimeout(y), y = null);
+    let d = !1, c = !1, m = null, k = null, w = null;
+    function N() {
+      m !== null && (clearTimeout(m), m = null);
     }
-    function h(R) {
-      R && (r && r !== R && T(), r !== R && (r = R, d = R.getAttribute("aria-describedby"), R.setAttribute(
+    function C(M) {
+      M && (k && k !== M && $(), k !== M && (k = M, w = M.getAttribute("aria-describedby"), M.setAttribute(
         "aria-describedby",
-        d ? `${d} ${o}` : o
+        w ? `${w} ${o}` : o
       )));
     }
-    function T() {
-      r && (d !== null ? r.setAttribute("aria-describedby", d) : r.removeAttribute("aria-describedby"), r = null, d = null);
+    function $() {
+      k && (w !== null ? k.setAttribute("aria-describedby", w) : k.removeAttribute("aria-describedby"), k = null, w = null);
     }
-    function p() {
-      c.value && (k = !0, b(), y = setTimeout(() => {
+    function A() {
+      v.value && (d = !0, N(), m = setTimeout(() => {
         i.value = !0;
       }, n.delay));
     }
     function V() {
-      k = !1, b(), f || N();
+      d = !1, N(), c || G();
     }
-    function C(R) {
-      c.value && (f = !0, b(), i.value = !0, h(R.target));
+    function H(M) {
+      v.value && (c = !0, N(), i.value = !0, C(M.target));
     }
-    function E(R) {
-      const q = R.relatedTarget, J = R.currentTarget;
-      q && (J != null && J.contains(q)) || (f = !1, k || N());
+    function ae(M) {
+      const j = M.relatedTarget, b = M.currentTarget;
+      j && (b != null && b.contains(j)) || (c = !1, d || G());
     }
-    function N() {
-      b(), i.value = !1, T();
+    function G() {
+      N(), i.value = !1, $();
     }
-    return be(() => {
-      b(), T();
-    }), (R, q) => (a(), l("div", {
-      class: $(["ds-tooltip", { "ds-tooltip--block": e.block }]),
-      onMouseenter: p,
+    return de(() => {
+      N(), $(), y();
+    }), (M, j) => (a(), l("div", {
+      class: L(["ds-tooltip", { "ds-tooltip--block": e.block }]),
+      onMouseenter: A,
       onMouseleave: V,
-      onFocusin: C,
-      onFocusout: E,
-      onKeydown: ct(N, ["esc"])
+      onFocusin: H,
+      onFocusout: ae,
+      onKeydown: st(G, ["esc"])
     }, [
-      A(R.$slots, "default", {}, void 0, !0),
-      j(Le, { name: "ds-tooltip-fade" }, {
+      _(M.$slots, "default", {}, void 0, !0),
+      Y(me, { name: "ds-tooltip-fade" }, {
         default: ie(() => [
           i.value ? (a(), l("div", {
             key: 0,
-            id: _(o),
-            class: $(["ds-tooltip__bubble", `ds-tooltip__bubble--${e.placement}`]),
-            role: "tooltip"
+            id: D(o),
+            ref_key: "bubbleRef",
+            ref: r,
+            class: L(["ds-tooltip__bubble", `ds-tooltip__bubble--${e.placement}`]),
+            role: "tooltip",
+            style: U(D(E))
           }, [
-            A(R.$slots, "content", {}, () => [
-              H(S(e.content), 1)
+            _(M.$slots, "content", {}, () => [
+              q(T(e.content), 1)
             ], !0)
-          ], 10, Ma)) : m("", !0)
+          ], 14, Wa)) : g("", !0)
         ]),
         _: 3
       })
     ], 34));
   }
-}), Gi = /* @__PURE__ */ M(Oa, [["__scopeId", "data-v-26c35ba5"]]), Ne = {
+}), cn = /* @__PURE__ */ O(Ha, [["__scopeId", "data-v-ca1ba028"]]), Oe = {
   VERIFIED: "verified",
   UNVERIFIED: "unverified",
   NEW: "new"
-}, Pa = ["aria-label", "title"], Fa = /* @__PURE__ */ x({
+}, Ka = ["aria-label", "title"], Ya = /* @__PURE__ */ B({
   __name: "DsVerificationIcon",
   props: {
     // true = verified · false = not verified · null/undefined = newly found.
@@ -1370,38 +1402,38 @@ const ge = {
     }
   },
   setup(e) {
-    const n = e, t = g(() => n.verified === null || n.verified === void 0 ? {
-      state: Ne.NEW,
+    const n = e, t = S(() => n.verified === null || n.verified === void 0 ? {
+      state: Oe.NEW,
       icon: "new_releases",
       label: "Newly found"
     } : n.verified ? {
-      state: Ne.VERIFIED,
+      state: Oe.VERIFIED,
       icon: "verified",
       label: "Verified"
     } : {
-      state: Ne.UNVERIFIED,
+      state: Oe.UNVERIFIED,
       icon: n.isContactData ? "dangerous" : "error",
       label: "Not verified"
     });
     return (o, i) => (a(), l("i", {
-      class: $(["material-icons ds-verification-icon", [
+      class: L(["material-icons ds-verification-icon", [
         `ds-verification-icon--${t.value.state}`,
         { "ds-verification-icon--email": e.isContactData }
       ]]),
-      style: F({ fontSize: `${e.size}px` }),
+      style: U({ fontSize: `${e.size}px` }),
       role: "img",
       "aria-label": e.label || t.value.label,
       title: e.label || t.value.label
     }, [
-      A(o.$slots, "default", {}, () => [
-        H(S(t.value.icon), 1)
+      _(o.$slots, "default", {}, () => [
+        q(T(t.value.icon), 1)
       ], !0)
-    ], 14, Pa));
+    ], 14, Ka));
   }
-}), za = /* @__PURE__ */ M(Fa, [["__scopeId", "data-v-0fd84040"]]), Va = ["title"], Ua = { class: "ds-contact-value__marquee" }, Ga = { class: "ds-contact-value__actions" }, Ha = ["role", "aria-label", "aria-hidden"], Wa = ["aria-label", "title"], Ka = {
+}), qa = /* @__PURE__ */ O(Ya, [["__scopeId", "data-v-0fd84040"]]), ja = ["title"], Xa = { class: "ds-contact-value__marquee" }, Za = { class: "ds-contact-value__actions" }, Qa = ["role", "aria-label", "aria-hidden"], Ja = ["aria-label", "title"], el = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Ya = ["aria-label", "aria-pressed", "title"], qa = ["aria-label", "aria-pressed", "title"], ja = /* @__PURE__ */ x({
+}, tl = ["aria-label", "aria-pressed", "title"], al = ["aria-label", "aria-pressed", "title"], ll = /* @__PURE__ */ B({
   __name: "DsContactValue",
   props: {
     value: { type: String, required: !0 },
@@ -1421,63 +1453,63 @@ const ge = {
     // Accessible name for the lock glyph (empty → decorative/aria-hidden).
     hideValueLabel: { type: String, default: "" }
   },
-  emits: [pe, $e, Te],
+  emits: [Te, Le, Ce],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = U(!1);
-    let c;
-    function k() {
+    const t = e, o = n, i = F(!1);
+    let r;
+    function E() {
       typeof navigator != "undefined" && navigator.clipboard && navigator.clipboard.writeText(t.value).catch(() => {
-      }), i.value = !0, clearTimeout(c), c = setTimeout(() => {
+      }), i.value = !0, clearTimeout(r), r = setTimeout(() => {
         i.value = !1;
-      }, 1200), o(pe, t.value);
+      }, 1200), o(Te, t.value);
     }
     function f() {
-      o($e);
+      o(Le);
     }
     function y() {
-      o(Te);
+      o(Ce);
     }
-    return be(() => clearTimeout(c)), (r, d) => (a(), l("div", {
-      class: $(["ds-contact-value", { "ds-contact-value--main": e.main }])
+    return de(() => clearTimeout(r)), (v, d) => (a(), l("div", {
+      class: L(["ds-contact-value", { "ds-contact-value--main": e.main }])
     }, [
-      j(_(za), {
+      Y(D(qa), {
         verified: e.verified,
         "is-contact-data": e.isContactData
       }, null, 8, ["verified", "is-contact-data"]),
       s("span", {
         class: "ds-contact-value__value",
         title: e.value
-      }, S(e.value), 9, Va),
-      s("span", Ua, [
-        e.valueType ? (a(), G(_(_t), {
+      }, T(e.value), 9, ja),
+      s("span", Xa, [
+        e.valueType ? (a(), K(D(xt), {
           key: 0,
           class: "ds-contact-value__badge",
-          tone: e.main ? _(Re).ACCENT : _(Re).GREY,
+          tone: e.main ? D(xe).ACCENT : D(xe).GREY,
           title: e.valueType
         }, {
           default: ie(() => [
-            H(S(e.valueType), 1)
+            q(T(e.valueType), 1)
           ]),
           _: 1
-        }, 8, ["tone", "title"])) : m("", !0),
-        s("span", Ga, [
+        }, 8, ["tone", "title"])) : g("", !0),
+        s("span", Za, [
           e.hideValue ? (a(), l("i", {
             key: 0,
             class: "material-icons ds-contact-value__lock",
             role: e.hideValueLabel ? "img" : void 0,
             "aria-label": e.hideValueLabel || void 0,
             "aria-hidden": e.hideValueLabel ? void 0 : "true"
-          }, "lock", 8, Ha)) : (a(), l(z, { key: 1 }, [
+          }, "lock", 8, Qa)) : (a(), l(W, { key: 1 }, [
             s("button", {
               type: "button",
-              class: $(["ds-contact-value__action", { "is-copied": i.value }]),
+              class: L(["ds-contact-value__action", { "is-copied": i.value }]),
               "aria-label": i.value ? e.copiedLabel : e.copyLabel,
               title: i.value ? e.copiedLabel : e.copyLabel,
-              onClick: k
+              onClick: E
             }, [
-              s("i", Ka, S(i.value ? "check" : "content_copy"), 1)
-            ], 10, Wa),
-            e.showRate ? (a(), l(z, { key: 0 }, [
+              s("i", el, T(i.value ? "check" : "content_copy"), 1)
+            ], 10, Ja),
+            e.showRate ? (a(), l(W, { key: 0 }, [
               s("button", {
                 type: "button",
                 class: "ds-contact-value__action",
@@ -1487,10 +1519,10 @@ const ge = {
                 onClick: f
               }, [
                 s("i", {
-                  class: $(e.correct === !0 ? "material-icons" : "material-icons-outlined"),
+                  class: L(e.correct === !0 ? "material-icons" : "material-icons-outlined"),
                   "aria-hidden": "true"
                 }, "thumb_up", 2)
-              ], 8, Ya),
+              ], 8, tl),
               s("button", {
                 type: "button",
                 class: "ds-contact-value__action",
@@ -1500,44 +1532,44 @@ const ge = {
                 onClick: y
               }, [
                 s("i", {
-                  class: $(e.correct === !1 ? "material-icons" : "material-icons-outlined"),
+                  class: L(e.correct === !1 ? "material-icons" : "material-icons-outlined"),
                   "aria-hidden": "true"
                 }, "thumb_down", 2)
-              ], 8, qa)
-            ], 64)) : m("", !0)
+              ], 8, al)
+            ], 64)) : g("", !0)
           ], 64))
         ])
       ])
     ], 2));
   }
-}), je = /* @__PURE__ */ M(ja, [["__scopeId", "data-v-4f2d5d85"]]), Xa = ["aria-label", "aria-busy"], Za = { class: "ds-data-card__heading" }, Qa = {
+}), tt = /* @__PURE__ */ O(ll, [["__scopeId", "data-v-4f2d5d85"]]), il = ["aria-label", "aria-busy"], nl = { class: "ds-data-card__heading" }, sl = {
   class: "material-icons ds-data-card__icon",
   "aria-hidden": "true"
-}, Ja = { class: "ds-data-card__title" }, el = ["aria-label"], tl = {
+}, ol = { class: "ds-data-card__title" }, dl = ["aria-label"], rl = {
   key: 0,
   class: "ds-data-card__body"
-}, al = {
+}, cl = {
   key: 0,
   class: "ds-data-card__loading"
-}, ll = {
+}, ul = {
   key: 1,
   class: "ds-data-card__locked"
-}, il = { class: "ds-data-card__state-text" }, nl = { class: "ds-data-card__state-title" }, sl = {
+}, fl = { class: "ds-data-card__state-text" }, vl = { class: "ds-data-card__state-title" }, bl = {
   key: 2,
   class: "ds-data-card__empty"
-}, ol = { class: "ds-data-card__state-badge" }, dl = {
+}, yl = { class: "ds-data-card__state-badge" }, ml = {
   class: "material-icons ds-data-card__state-icon",
   "aria-hidden": "true"
-}, rl = { class: "ds-data-card__state-text" }, cl = { class: "ds-data-card__state-title" }, ul = {
+}, hl = { class: "ds-data-card__state-text" }, gl = { class: "ds-data-card__state-title" }, pl = {
   key: 0,
   class: "ds-data-card__state-subtitle"
-}, fl = { key: 0 }, bl = {
+}, Sl = { key: 0 }, kl = {
   key: 0,
   class: "ds-data-card__section"
-}, vl = { key: 1 }, yl = {
+}, $l = { key: 1 }, wl = {
   key: 0,
   class: "ds-data-card__section"
-}, ml = { class: "ds-data-card__more" }, hl = /* @__PURE__ */ x({
+}, El = { class: "ds-data-card__more" }, Tl = /* @__PURE__ */ B({
   __name: "DsDataCard",
   props: {
     title: { type: String, required: !0 },
@@ -1577,117 +1609,117 @@ const ge = {
     toggleLabel: { type: String, default: "Toggle" },
     closeLabel: { type: String, default: "Close" }
   },
-  emits: [pe, Pe, Fe, X, $e, Te],
+  emits: [Te, Fe, Ue, J, Le, Ce],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = U(!1), c = g(() => t.more.length + (t.mostLikely ? 1 : 0)), k = g(() => c.value > 3), f = g(() => c.value === 0), y = g(() => t.collapsible && i.value);
-    function r() {
+    const t = e, o = n, i = F(!1), r = S(() => t.more.length + (t.mostLikely ? 1 : 0)), E = S(() => r.value > 3), f = S(() => r.value === 0), y = S(() => t.collapsible && i.value);
+    function v() {
       i.value = !i.value;
     }
     function d(C) {
-      o(pe, C);
-    }
-    function b() {
-      o(Pe);
+      o(Te, C);
     }
-    function h() {
+    function c() {
       o(Fe);
     }
-    function T() {
-      o(X);
+    function m() {
+      o(Ue);
     }
-    function p(C) {
-      o($e, C);
+    function k() {
+      o(J);
     }
-    function V(C) {
-      o(Te, C);
+    function w(C) {
+      o(Le, C);
     }
-    return (C, E) => (a(), l("section", {
+    function N(C) {
+      o(Ce, C);
+    }
+    return (C, $) => (a(), l("section", {
       class: "ds-data-card",
       "aria-label": e.title,
       "aria-busy": e.loading ? "true" : void 0
     }, [
       s("div", {
-        class: $(["ds-data-card__header", { "is-collapsed": y.value, "is-collapsible": e.collapsible }]),
-        onClick: E[1] || (E[1] = (N) => e.collapsible && r())
+        class: L(["ds-data-card__header", { "is-collapsed": y.value, "is-collapsible": e.collapsible }]),
+        onClick: $[1] || ($[1] = (A) => e.collapsible && v())
       }, [
-        s("div", Za, [
-          s("i", Qa, S(e.icon), 1),
-          s("span", Ja, S(e.title), 1)
+        s("div", nl, [
+          s("i", sl, T(e.icon), 1),
+          s("span", ol, T(e.title), 1)
         ]),
         s("div", {
           class: "ds-data-card__actions",
-          onClick: E[0] || (E[0] = ve(() => {
+          onClick: $[0] || ($[0] = ue(() => {
           }, ["stop"]))
         }, [
           !y.value && e.showEdit ? (a(), l("button", {
             key: 0,
             type: "button",
             class: "ds-data-card__edit",
-            onClick: h
-          }, S(e.editLabel), 1)) : m("", !0),
-          !y.value && e.showSort ? (a(), G(_(oe), {
+            onClick: m
+          }, T(e.editLabel), 1)) : g("", !0),
+          !y.value && e.showSort ? (a(), K(D(fe), {
             key: 1,
             variant: "tertiary",
             size: "medium",
             circle: "",
             "left-icon": "swap_vert",
             "aria-label": e.sortLabel,
-            onClick: b
-          }, null, 8, ["aria-label"])) : m("", !0),
-          e.collapsible ? (a(), G(_(oe), {
+            onClick: c
+          }, null, 8, ["aria-label"])) : g("", !0),
+          e.collapsible ? (a(), K(D(fe), {
             key: 2,
             variant: "tertiary",
             size: "medium",
             circle: "",
             "left-icon": i.value ? "keyboard_arrow_down" : "keyboard_arrow_up",
             "aria-label": e.toggleLabel,
-            onClick: r
-          }, null, 8, ["left-icon", "aria-label"])) : m("", !0),
+            onClick: v
+          }, null, 8, ["left-icon", "aria-label"])) : g("", !0),
           e.showClose ? (a(), l("button", {
             key: 3,
             type: "button",
             class: "ds-data-card__close",
             "aria-label": e.closeLabel,
-            onClick: T
-          }, [...E[4] || (E[4] = [
+            onClick: k
+          }, [...$[4] || ($[4] = [
             s("i", {
               class: "material-icons",
               "aria-hidden": "true"
             }, "close", -1)
-          ])], 8, el)) : m("", !0)
+          ])], 8, dl)) : g("", !0)
         ])
       ], 2),
-      y.value ? m("", !0) : (a(), l("div", tl, [
-        e.loading ? (a(), l("div", al, [
-          A(C.$slots, "loading", {}, () => [
-            j(_(fe), {
+      y.value ? g("", !0) : (a(), l("div", rl, [
+        e.loading ? (a(), l("div", cl, [
+          _(C.$slots, "loading", {}, () => [
+            Y(D(ye), {
               label: e.loadingLabel || void 0
             }, null, 8, ["label"])
           ], !0)
-        ])) : e.locked ? (a(), l("div", ll, [
-          A(C.$slots, "locked", {}, () => [
-            E[5] || (E[5] = s("span", { class: "ds-data-card__state-badge ds-data-card__state-badge--accent" }, [
+        ])) : e.locked ? (a(), l("div", ul, [
+          _(C.$slots, "locked", {}, () => [
+            $[5] || ($[5] = s("span", { class: "ds-data-card__state-badge ds-data-card__state-badge--accent" }, [
               s("i", {
                 class: "material-icons ds-data-card__state-icon",
                 "aria-hidden": "true"
               }, "lock")
             ], -1)),
-            s("div", il, [
-              s("span", nl, S(e.lockedLabel), 1)
+            s("div", fl, [
+              s("span", vl, T(e.lockedLabel), 1)
             ])
           ], !0)
-        ])) : f.value ? (a(), l("div", sl, [
-          s("span", ol, [
-            s("i", dl, S(e.icon), 1)
+        ])) : f.value ? (a(), l("div", bl, [
+          s("span", yl, [
+            s("i", ml, T(e.icon), 1)
           ]),
-          s("div", rl, [
-            s("span", cl, S(e.emptyLabel), 1),
-            e.emptySubtitle ? (a(), l("span", ul, S(e.emptySubtitle), 1)) : m("", !0)
+          s("div", hl, [
+            s("span", gl, T(e.emptyLabel), 1),
+            e.emptySubtitle ? (a(), l("span", pl, T(e.emptySubtitle), 1)) : g("", !0)
           ])
-        ])) : (a(), l(z, { key: 3 }, [
-          e.mostLikely ? (a(), l("div", fl, [
-            k.value ? (a(), l("div", bl, S(e.mostLikelyLabel), 1)) : m("", !0),
-            j(_(je), {
+        ])) : (a(), l(W, { key: 3 }, [
+          e.mostLikely ? (a(), l("div", Sl, [
+            E.value ? (a(), l("div", kl, T(e.mostLikelyLabel), 1)) : g("", !0),
+            Y(D(tt), {
               value: e.mostLikely.value,
               "value-type": e.mostLikely.type,
               verified: e.mostLikely.verified,
@@ -1697,38 +1729,38 @@ const ge = {
               "is-contact-data": e.isContactData,
               "show-rate": e.showRate,
               onCopy: d,
-              onCorrect: E[2] || (E[2] = (N) => p(e.mostLikely)),
-              onIncorrect: E[3] || (E[3] = (N) => V(e.mostLikely))
+              onCorrect: $[2] || ($[2] = (A) => w(e.mostLikely)),
+              onIncorrect: $[3] || ($[3] = (A) => N(e.mostLikely))
             }, null, 8, ["value", "value-type", "verified", "correct", "hide-value", "is-contact-data", "show-rate"])
-          ])) : m("", !0),
-          e.more.length > 0 ? (a(), l("div", vl, [
-            k.value ? (a(), l("div", yl, S(e.moreLabel), 1)) : m("", !0),
-            s("div", ml, [
-              (a(!0), l(z, null, Y(e.more, (N) => (a(), G(_(je), {
-                key: N.value,
-                value: N.value,
-                "value-type": N.type,
-                verified: N.verified,
-                correct: N.correct,
-                "hide-value": N.hideValue,
+          ])) : g("", !0),
+          e.more.length > 0 ? (a(), l("div", $l, [
+            E.value ? (a(), l("div", wl, T(e.moreLabel), 1)) : g("", !0),
+            s("div", El, [
+              (a(!0), l(W, null, Q(e.more, (A) => (a(), K(D(tt), {
+                key: A.value,
+                value: A.value,
+                "value-type": A.type,
+                verified: A.verified,
+                correct: A.correct,
+                "hide-value": A.hideValue,
                 "is-contact-data": e.isContactData,
                 "show-rate": e.showRate,
                 onCopy: d,
-                onCorrect: (R) => p(N),
-                onIncorrect: (R) => V(N)
+                onCorrect: (V) => w(A),
+                onIncorrect: (V) => N(A)
               }, null, 8, ["value", "value-type", "verified", "correct", "hide-value", "is-contact-data", "show-rate", "onCorrect", "onIncorrect"]))), 128))
             ])
-          ])) : m("", !0)
+          ])) : g("", !0)
         ], 64))
       ]))
-    ], 8, Xa));
+    ], 8, il));
   }
-}), Hi = /* @__PURE__ */ M(hl, [["__scopeId", "data-v-a062c3ae"]]), gl = ["name", "value", "checked", "disabled"], Sl = {
+}), un = /* @__PURE__ */ O(Tl, [["__scopeId", "data-v-a062c3ae"]]), Ll = ["name", "value", "checked", "disabled"], Cl = {
   key: 0,
   class: "ds-radio__label"
-}, kl = /* @__PURE__ */ x({
+}, _l = /* @__PURE__ */ B({
   __name: "DsRadio",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ te({
     disabled: Boolean,
     // Label text (DS `label` prop); a default slot overrides it.
     label: { type: String, default: "" },
@@ -1740,12 +1772,12 @@ const ge = {
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const n = de(e, "modelValue"), t = e;
+    const n = ve(e, "modelValue"), t = e;
     function o() {
       t.disabled || (n.value = !0);
     }
-    return (i, c) => (a(), l("label", {
-      class: $(["ds-radio", { "is-disabled": e.disabled }])
+    return (i, r) => (a(), l("label", {
+      class: L(["ds-radio", { "is-disabled": e.disabled }])
     }, [
       s("input", {
         type: "radio",
@@ -1755,24 +1787,24 @@ const ge = {
         checked: n.value,
         disabled: e.disabled,
         onChange: o
-      }, null, 40, gl),
+      }, null, 40, Ll),
       s("span", {
-        class: $(["ds-radio__dot", { "is-active": n.value }]),
+        class: L(["ds-radio__dot", { "is-active": n.value }]),
         "aria-hidden": "true"
       }, null, 2),
-      i.$slots.default || e.label ? (a(), l("span", Sl, [
-        A(i.$slots, "default", {}, () => [
-          H(S(e.label), 1)
+      i.$slots.default || e.label ? (a(), l("span", Cl, [
+        _(i.$slots, "default", {}, () => [
+          q(T(e.label), 1)
         ], !0)
-      ])) : m("", !0)
+      ])) : g("", !0)
     ], 2));
   }
-}), Wi = /* @__PURE__ */ M(kl, [["__scopeId", "data-v-96b70404"]]), pl = ["aria-checked", "aria-busy", "aria-disabled", "aria-label", "disabled"], $l = {
+}), fn = /* @__PURE__ */ O(_l, [["__scopeId", "data-v-96b70404"]]), Il = ["aria-checked", "aria-busy", "aria-disabled", "aria-label", "disabled"], Dl = {
   class: "ds-switch__thumb",
   "aria-hidden": "true"
-}, Tl = /* @__PURE__ */ x({
+}, Rl = /* @__PURE__ */ B({
   __name: "DsSwitch",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ te({
     disabled: Boolean,
     // Async busy state for a toggle whose commit is pending (e.g. a server round-trip
     // that may revert). Blocks interaction and shows a spinner in the thumb while it
@@ -1788,14 +1820,14 @@ const ge = {
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const n = de(e, "modelValue"), t = e;
+    const n = ve(e, "modelValue"), t = e;
     function o() {
       t.disabled || t.loading || (n.value = !n.value);
     }
-    return (i, c) => (a(), l("button", {
+    return (i, r) => (a(), l("button", {
       type: "button",
       role: "switch",
-      class: $(["ds-switch", { "is-disabled": e.disabled, "is-loading": e.loading }]),
+      class: L(["ds-switch", { "is-disabled": e.disabled, "is-loading": e.loading }]),
       "aria-checked": n.value,
       "aria-busy": e.loading || void 0,
       "aria-disabled": e.disabled || e.loading || void 0,
@@ -1803,18 +1835,18 @@ const ge = {
       disabled: e.disabled || e.loading,
       onClick: o
     }, [
-      s("span", $l, [
-        e.loading ? (a(), G(_(fe), {
+      s("span", Dl, [
+        e.loading ? (a(), K(D(ye), {
           key: 0,
           class: "ds-switch__spinner",
           size: 12,
-          tone: _(ge).DARK,
+          tone: D($e).DARK,
           label: ""
-        }, null, 8, ["tone"])) : m("", !0)
+        }, null, 8, ["tone"])) : g("", !0)
       ])
-    ], 10, pl));
+    ], 10, Il));
   }
-}), Ki = /* @__PURE__ */ M(Tl, [["__scopeId", "data-v-f8073b3b"]]), El = ["aria-label", "disabled"], Ll = { class: "ds-item-selector-button__label" }, wl = /* @__PURE__ */ x({
+}), vn = /* @__PURE__ */ O(Rl, [["__scopeId", "data-v-f8073b3b"]]), Al = ["aria-label", "disabled"], Nl = { class: "ds-item-selector-button__label" }, Bl = /* @__PURE__ */ B({
   __name: "DsItemSelectorButton",
   props: {
     item: { type: Object, default: null },
@@ -1826,36 +1858,36 @@ const ge = {
     ariaLabel: { type: String, default: "" },
     disabled: Boolean
   },
-  emits: [Z],
+  emits: [ee],
   setup(e, { emit: n }) {
     const t = e, o = n;
-    function i(c) {
-      t.disabled || o(Z, c);
+    function i(r) {
+      t.disabled || o(ee, r);
     }
-    return (c, k) => {
+    return (r, E) => {
       var f;
       return a(), l("button", {
         type: "button",
-        class: $(["ds-item-selector-button", { "is-empty": !e.item, "is-disabled": e.disabled }]),
+        class: L(["ds-item-selector-button", { "is-empty": !e.item, "is-disabled": e.disabled }]),
         "aria-haspopup": "listbox",
         "aria-label": e.ariaLabel || void 0,
         disabled: e.disabled,
         onClick: i
       }, [
-        s("span", Ll, S(e.item ? e.item.name : e.emptyTitle), 1),
+        s("span", Nl, T(e.item ? e.item.name : e.emptyTitle), 1),
         e.icon ? (a(), l("i", {
           key: 0,
-          class: $(["ds-item-selector-button__icon", e.item ? "material-icons" : "material-icons-outlined"]),
-          style: F((f = e.item) != null && f.color ? { color: e.item.color } : void 0),
+          class: L(["ds-item-selector-button__icon", e.item ? "material-icons" : "material-icons-outlined"]),
+          style: U((f = e.item) != null && f.color ? { color: e.item.color } : void 0),
           "aria-hidden": "true"
-        }, S(e.icon), 7)) : m("", !0)
-      ], 10, El);
+        }, T(e.icon), 7)) : g("", !0)
+      ], 10, Al);
     };
   }
-}), Yi = /* @__PURE__ */ M(wl, [["__scopeId", "data-v-92d8d822"]]), Xe = {
+}), bn = /* @__PURE__ */ O(Bl, [["__scopeId", "data-v-92d8d822"]]), at = {
   DEFAULT: "default",
   FILTER_SUMMARY: "filterSummary"
-}, Ze = {
+}, lt = {
   AUTO: "auto",
   // shrink to content — resizes with the selected label (default)
   SMALL: "small",
@@ -1866,34 +1898,34 @@ const ge = {
   // 280px
   FULL: "full"
   // 100% of the container
-}, Il = ["disabled", "aria-expanded", "aria-controls", "aria-activedescendant"], Cl = ["title"], _l = ["disabled", "aria-label"], Dl = {
+}, Ol = ["disabled", "aria-expanded", "aria-controls", "aria-activedescendant"], xl = ["title"], Ml = ["disabled", "aria-label"], Pl = {
   key: 1,
   class: "material-icons ds-select__chevron",
   "aria-hidden": "true"
-}, Al = {
+}, zl = {
   key: 0,
   class: "ds-select__popup"
-}, Nl = {
+}, Vl = {
   key: 0,
   class: "ds-select__search"
-}, Rl = ["aria-activedescendant", "aria-label", "placeholder", "value"], Bl = ["aria-multiselectable", "aria-busy"], xl = {
+}, Fl = ["aria-activedescendant", "aria-label", "placeholder", "value"], Ul = ["aria-multiselectable", "aria-busy"], Gl = {
   key: 0,
   class: "ds-select__loading",
   role: "presentation"
-}, Ml = ["role", "aria-labelledby"], Ol = ["id"], Pl = ["id", "aria-selected", "onClick", "onMouseenter"], Fl = { class: "ds-select__option-label" }, zl = {
+}, Wl = ["role", "aria-labelledby"], Hl = ["id"], Kl = ["id", "aria-selected", "onClick", "onMouseenter"], Yl = { class: "ds-select__option-label" }, ql = {
   key: 0,
   class: "ds-select__option-sublabel"
-}, Vl = {
+}, jl = {
   key: 0,
   class: "ds-select__empty",
   role: "presentation"
-}, Ul = /* @__PURE__ */ x({
+}, Xl = /* @__PURE__ */ B({
   __name: "DsSelect",
-  props: /* @__PURE__ */ Q({
+  props: /* @__PURE__ */ te({
     options: { type: Array, required: !0 },
     placeholder: { type: String, default: "Select an option" },
     multiple: Boolean,
-    selectType: { type: String, default: Xe.DEFAULT },
+    selectType: { type: String, default: at.DEFAULT },
     showCheckbox: Boolean,
     // Named step ('small'|'medium'|'large'|'full'|'auto') for a STABLE width, or a
     // custom width (number → px, or any CSS string). Defaults to 'auto'
@@ -1902,7 +1934,7 @@ const ge = {
     // resize with the selected label. See DsSelect.types.ts `DS_SELECT_WIDTHS`.
     width: {
       type: [Number, String],
-      default: Ze.AUTO
+      default: lt.AUTO
     },
     disabled: Boolean,
     // Opt-in type-to-filter: renders a search input inside the open dropdown.
@@ -1932,208 +1964,208 @@ const ge = {
     modelValue: { default: null },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Q([_e], ["update:modelValue"]),
+  emits: /* @__PURE__ */ te([Re], ["update:modelValue"]),
   setup(e, { emit: n }) {
-    const t = e, o = n, i = de(e, "modelValue"), c = `ds-select-${xe()}`, k = `${c}-listbox`, f = (u) => `${c}-option-${u}`, y = U(null), r = U(null), d = U(null), b = U(!1), h = U(-1), T = U(""), p = g(() => t.selectType === Xe.FILTER_SUMMARY), V = g(() => t.filterable && !t.remote), C = g(() => {
-      if (!V.value) return t.options;
-      const u = T.value.trim().toLowerCase();
-      return u ? t.options.filter(
-        (L) => L.label.toLowerCase().includes(u) || (L.subLabel ? L.subLabel.toLowerCase().includes(u) : !1)
+    const t = e, o = n, i = ve(e, "modelValue"), r = `ds-select-${ge()}`, E = `${r}-listbox`, f = (h) => `${r}-option-${h}`, y = F(null), v = F(null), d = F(null), c = F(!1), m = F(-1), k = F(""), w = S(() => t.selectType === at.FILTER_SUMMARY), N = S(() => t.filterable && !t.remote), C = S(() => {
+      if (!N.value) return t.options;
+      const h = k.value.trim().toLowerCase();
+      return h ? t.options.filter(
+        (I) => I.label.toLowerCase().includes(h) || (I.subLabel ? I.subLabel.toLowerCase().includes(h) : !1)
       ) : t.options;
-    }), E = g(
+    }), $ = S(
       () => t.loading ? [] : C.value
-    ), N = g(() => {
-      const u = [];
-      return E.value.forEach((L, O) => {
-        const B = L.group, K = u[u.length - 1];
-        B ? (K == null ? void 0 : K.kind) === "group" && K.label === B ? K.items.push({ option: L, index: O }) : u.push({
+    ), A = S(() => {
+      const h = [];
+      return $.value.forEach((I, z) => {
+        const P = I.group, X = h[h.length - 1];
+        P ? (X == null ? void 0 : X.kind) === "group" && X.label === P ? X.items.push({ option: I, index: z }) : h.push({
           kind: "group",
-          label: B,
-          headerId: `${c}-group-${O}`,
-          key: `g-${O}`,
-          items: [{ option: L, index: O }]
-        }) : (K == null ? void 0 : K.kind) === "plain" ? K.items.push({ option: L, index: O }) : u.push({ kind: "plain", key: `p-${O}`, items: [{ option: L, index: O }] });
-      }), u;
-    }), R = g(() => t.multiple ? Array.isArray(i.value) ? i.value : [] : i.value !== null && i.value !== void 0 ? [i.value] : []), q = g(() => R.value.length > 0), J = g(() => p.value && q.value);
-    function W(u) {
-      return R.value.includes(u);
-    }
-    const ae = ut(/* @__PURE__ */ new Map());
-    te(
+          label: P,
+          headerId: `${r}-group-${z}`,
+          key: `g-${z}`,
+          items: [{ option: I, index: z }]
+        }) : (X == null ? void 0 : X.kind) === "plain" ? X.items.push({ option: I, index: z }) : h.push({ kind: "plain", key: `p-${z}`, items: [{ option: I, index: z }] });
+      }), h;
+    }), V = S(() => t.multiple ? Array.isArray(i.value) ? i.value : [] : i.value !== null && i.value !== void 0 ? [i.value] : []), H = S(() => V.value.length > 0), ae = S(() => w.value && H.value);
+    function G(h) {
+      return V.value.includes(h);
+    }
+    const M = gt(/* @__PURE__ */ new Map());
+    Z(
       () => t.options,
-      (u) => u.forEach((L) => ae.set(L.value, L.label)),
+      (h) => h.forEach((I) => M.set(I.value, I.label)),
       { immediate: !0, deep: !0 }
     );
-    function re(u) {
-      var L, O, B;
-      return (B = (O = (L = t.options.find((K) => K.value === u)) == null ? void 0 : L.label) != null ? O : ae.get(u)) != null ? B : String(u);
-    }
-    const v = g(() => p.value ? q.value ? t.multiple ? `${t.placeholder} (${R.value.length})` : re(R.value[0]) : t.placeholder : q.value ? t.multiple ? R.value.map(re).join(", ") : re(R.value[0]) : t.placeholder), D = Object.values(Ze), w = g(
-      () => typeof t.width == "string" && D.includes(t.width) ? `ds-select--w-${t.width}` : null
-    ), I = g(() => {
-      if (!w.value)
+    function j(h) {
+      var I, z, P;
+      return (P = (z = (I = t.options.find((X) => X.value === h)) == null ? void 0 : I.label) != null ? z : M.get(h)) != null ? P : String(h);
+    }
+    const b = S(() => w.value ? H.value ? t.multiple ? `${t.placeholder} (${V.value.length})` : j(V.value[0]) : t.placeholder : H.value ? t.multiple ? V.value.map(j).join(", ") : j(V.value[0]) : t.placeholder), R = Object.values(lt), u = S(
+      () => typeof t.width == "string" && R.includes(t.width) ? `ds-select--w-${t.width}` : null
+    ), p = S(() => {
+      if (!u.value)
         return { width: typeof t.width == "number" ? `${t.width}px` : t.width };
-    }), P = g(
-      () => b.value && h.value >= 0 ? f(h.value) : void 0
+    }), x = S(
+      () => c.value && m.value >= 0 ? f(m.value) : void 0
     );
-    function ne() {
-      if (E.value.length === 0) return -1;
-      const u = E.value.findIndex((L) => W(L.value));
-      return u >= 0 ? u : 0;
-    }
-    function ye() {
-      t.disabled || (b.value = !0, h.value = ne(), t.filterable && ue(() => {
-        var u;
-        return (u = d.value) == null ? void 0 : u.focus();
+    function le() {
+      if ($.value.length === 0) return -1;
+      const h = $.value.findIndex((I) => G(I.value));
+      return h >= 0 ? h : 0;
+    }
+    function re() {
+      t.disabled || (c.value = !0, m.value = le(), t.filterable && se(() => {
+        var h;
+        return (h = d.value) == null ? void 0 : h.focus();
       }));
     }
-    function le(u = !0) {
-      b.value = !1, h.value = -1, T.value && (T.value = "", o(_e, "")), u && ue(() => {
-        var L;
-        return (L = r.value) == null ? void 0 : L.focus();
+    function oe(h = !0) {
+      c.value = !1, m.value = -1, k.value && (k.value = "", o(Re, "")), h && se(() => {
+        var I;
+        return (I = v.value) == null ? void 0 : I.focus();
       });
     }
-    function tt() {
-      t.disabled || (b.value ? le() : ye());
+    function rt() {
+      t.disabled || (c.value ? oe() : re());
     }
-    function we(u) {
+    function _e(h) {
       if (t.disabled) return;
       if (t.multiple) {
-        const O = R.value;
-        i.value = O.includes(u) ? O.filter((B) => B !== u) : [...O, u];
+        const z = V.value;
+        i.value = z.includes(h) ? z.filter((P) => P !== h) : [...z, h];
         return;
       }
-      const L = W(u);
-      i.value = L && t.showCheckbox ? null : u, le();
+      const I = G(h);
+      i.value = I && t.showCheckbox ? null : h, oe();
     }
-    function at() {
+    function ct() {
       t.disabled || (i.value = t.multiple ? [] : null);
     }
-    function me(u) {
-      const L = E.value.length;
-      L !== 0 && (h.value < 0 ? h.value = u > 0 ? 0 : L - 1 : h.value = (h.value + u + L) % L, ue(() => {
-        var O, B;
-        (B = (O = document.getElementById(f(h.value))) == null ? void 0 : O.scrollIntoView) == null || B.call(O, { block: "nearest" });
+    function pe(h) {
+      const I = $.value.length;
+      I !== 0 && (m.value < 0 ? m.value = h > 0 ? 0 : I - 1 : m.value = (m.value + h + I) % I, se(() => {
+        var z, P;
+        (P = (z = document.getElementById(f(m.value))) == null ? void 0 : z.scrollIntoView) == null || P.call(z, { block: "nearest" });
       }));
     }
-    function lt(u) {
+    function ut(h) {
       if (!t.disabled)
-        switch (u.key) {
+        switch (h.key) {
           case "ArrowDown":
-            u.preventDefault(), b.value ? me(1) : ye();
+            h.preventDefault(), c.value ? pe(1) : re();
             break;
           case "ArrowUp":
-            u.preventDefault(), b.value ? me(-1) : ye();
+            h.preventDefault(), c.value ? pe(-1) : re();
             break;
           case "Home":
-            b.value && (u.preventDefault(), h.value = 0);
+            c.value && (h.preventDefault(), m.value = 0);
             break;
           case "End":
-            b.value && (u.preventDefault(), h.value = E.value.length - 1);
+            c.value && (h.preventDefault(), m.value = $.value.length - 1);
             break;
           case "Enter":
           case " ":
           case "Spacebar":
-            if (u.preventDefault(), !b.value)
-              ye();
-            else if (h.value >= 0) {
-              const L = E.value[h.value];
-              L && we(L.value);
+            if (h.preventDefault(), !c.value)
+              re();
+            else if (m.value >= 0) {
+              const I = $.value[m.value];
+              I && _e(I.value);
             }
             break;
           case "Escape":
-            b.value && (u.preventDefault(), u.stopPropagation(), le());
+            c.value && (h.preventDefault(), h.stopPropagation(), oe());
             break;
           case "Tab":
-            b.value && le(!1);
+            c.value && oe(!1);
             break;
         }
     }
-    function it(u) {
+    function ft(h) {
       if (!t.disabled)
-        switch (u.key) {
+        switch (h.key) {
           case "ArrowDown":
-            u.preventDefault(), me(1);
+            h.preventDefault(), pe(1);
             break;
           case "ArrowUp":
-            u.preventDefault(), me(-1);
+            h.preventDefault(), pe(-1);
             break;
           case "Enter":
-            if (u.preventDefault(), h.value >= 0) {
-              const L = E.value[h.value];
-              L && we(L.value);
+            if (h.preventDefault(), m.value >= 0) {
+              const I = $.value[m.value];
+              I && _e(I.value);
             }
             break;
           case "Escape":
-            u.preventDefault(), u.stopPropagation(), le();
+            h.preventDefault(), h.stopPropagation(), oe();
             break;
           case "Tab":
-            b.value && le(!1);
+            c.value && oe(!1);
             break;
         }
     }
-    function nt(u) {
-      T.value = u.target.value, o(_e, T.value);
+    function vt(h) {
+      k.value = h.target.value, o(Re, k.value);
     }
-    te(E, (u) => {
-      b.value && (u.length === 0 ? h.value = -1 : (h.value < 0 || h.value >= u.length) && (h.value = 0));
+    Z($, (h) => {
+      c.value && (h.length === 0 ? m.value = -1 : (m.value < 0 || m.value >= h.length) && (m.value = 0));
     });
-    function Ie(u) {
-      y.value && !y.value.contains(u.target) && le(!1);
+    function Ie(h) {
+      y.value && !y.value.contains(h.target) && oe(!1);
     }
-    return te(b, (u) => {
-      typeof document != "undefined" && (u ? document.addEventListener("mousedown", Ie) : document.removeEventListener("mousedown", Ie));
-    }), te(
+    return Z(c, (h) => {
+      typeof document != "undefined" && (h ? document.addEventListener("mousedown", Ie) : document.removeEventListener("mousedown", Ie));
+    }), Z(
       () => t.disabled,
-      (u) => {
-        u && b.value && le(!1);
+      (h) => {
+        h && c.value && oe(!1);
       }
-    ), be(() => {
+    ), de(() => {
       typeof document != "undefined" && document.removeEventListener("mousedown", Ie);
-    }), (u, L) => (a(), l("div", {
+    }), (h, I) => (a(), l("div", {
       ref_key: "rootRef",
       ref: y,
-      class: $(["ds-select", [`ds-select--${e.selectType}`, w.value, { "is-open": b.value }]]),
-      style: F(I.value)
+      class: L(["ds-select", [`ds-select--${e.selectType}`, u.value, { "is-open": c.value }]]),
+      style: U(p.value)
     }, [
       s("div", {
-        class: $(["ds-select__control", { "is-disabled": e.disabled, "is-filter-selected": J.value }])
+        class: L(["ds-select__control", { "is-disabled": e.disabled, "is-filter-selected": ae.value }])
       }, [
         s("button", {
           ref_key: "triggerRef",
-          ref: r,
+          ref: v,
           type: "button",
           class: "ds-select__trigger",
           disabled: e.disabled,
           "aria-haspopup": "listbox",
-          "aria-expanded": b.value,
-          "aria-controls": b.value ? k : void 0,
-          "aria-activedescendant": e.filterable ? void 0 : P.value,
-          onClick: tt,
-          onKeydown: lt
+          "aria-expanded": c.value,
+          "aria-controls": c.value ? E : void 0,
+          "aria-activedescendant": e.filterable ? void 0 : x.value,
+          onClick: rt,
+          onKeydown: ut
         }, [
           s("span", {
             class: "ds-select__summary",
-            title: v.value
-          }, S(v.value), 9, Cl)
-        ], 40, Il),
-        p.value && q.value ? (a(), l("button", {
+            title: b.value
+          }, T(b.value), 9, xl)
+        ], 40, Ol),
+        w.value && H.value ? (a(), l("button", {
           key: 0,
           type: "button",
           class: "ds-select__clear",
           disabled: e.disabled,
           "aria-label": e.clearLabel || void 0,
-          onClick: at
-        }, [...L[1] || (L[1] = [
+          onClick: ct
+        }, [...I[1] || (I[1] = [
           s("i", {
             class: "material-icons",
             "aria-hidden": "true"
           }, "close", -1)
-        ])], 8, _l)) : (a(), l("i", Dl, "keyboard_arrow_down"))
+        ])], 8, Ml)) : (a(), l("i", Pl, "keyboard_arrow_down"))
       ], 2),
-      b.value ? (a(), l("div", Al, [
-        e.filterable ? (a(), l("div", Nl, [
-          L[2] || (L[2] = s("i", {
+      c.value ? (a(), l("div", zl, [
+        e.filterable ? (a(), l("div", Vl, [
+          I[2] || (I[2] = s("i", {
             class: "material-icons ds-select__search-icon",
             "aria-hidden": "true"
           }, "search", -1)),
@@ -2144,115 +2176,115 @@ const ge = {
             class: "ds-select__search-input",
             role: "combobox",
             "aria-expanded": "true",
-            "aria-controls": k,
-            "aria-activedescendant": P.value,
+            "aria-controls": E,
+            "aria-activedescendant": x.value,
             "aria-autocomplete": "list",
             autocomplete: "off",
             "aria-label": e.searchLabel,
             placeholder: e.searchPlaceholder,
-            value: T.value,
-            onInput: nt,
-            onKeydown: it
-          }, null, 40, Rl)
-        ])) : m("", !0),
+            value: k.value,
+            onInput: vt,
+            onKeydown: ft
+          }, null, 40, Fl)
+        ])) : g("", !0),
         s("ul", {
-          id: k,
+          id: E,
           class: "ds-select__listbox",
           role: "listbox",
           "aria-multiselectable": e.multiple || void 0,
           "aria-busy": e.loading || void 0,
-          onMousedown: L[0] || (L[0] = ve(() => {
+          onMousedown: I[0] || (I[0] = ue(() => {
           }, ["prevent"]))
         }, [
-          e.loading ? (a(), l("li", xl, [
-            A(u.$slots, "loading", {}, () => [
-              j(_(fe), { size: "small" })
+          e.loading ? (a(), l("li", Gl, [
+            _(h.$slots, "loading", {}, () => [
+              Y(D(ye), { size: "small" })
             ], !0)
-          ])) : (a(), l(z, { key: 1 }, [
-            (a(!0), l(z, null, Y(N.value, (O) => (a(), l("li", {
-              key: O.key,
-              role: O.kind === "group" ? "group" : "presentation",
-              "aria-labelledby": O.kind === "group" ? O.headerId : void 0,
-              class: $(O.kind === "group" ? "ds-select__group" : "ds-select__run")
+          ])) : (a(), l(W, { key: 1 }, [
+            (a(!0), l(W, null, Q(A.value, (z) => (a(), l("li", {
+              key: z.key,
+              role: z.kind === "group" ? "group" : "presentation",
+              "aria-labelledby": z.kind === "group" ? z.headerId : void 0,
+              class: L(z.kind === "group" ? "ds-select__group" : "ds-select__run")
             }, [
-              O.kind === "group" ? (a(), l("span", {
+              z.kind === "group" ? (a(), l("span", {
                 key: 0,
-                id: O.headerId,
+                id: z.headerId,
                 class: "ds-select__group-header"
-              }, S(O.label), 9, Ol)) : m("", !0),
-              (a(!0), l(z, null, Y(O.items, (B) => (a(), l("div", {
-                id: f(B.index),
-                key: B.option.value,
-                class: $(["ds-select__option", {
-                  "is-selected": W(B.option.value),
-                  "is-active": B.index === h.value,
+              }, T(z.label), 9, Hl)) : g("", !0),
+              (a(!0), l(W, null, Q(z.items, (P) => (a(), l("div", {
+                id: f(P.index),
+                key: P.option.value,
+                class: L(["ds-select__option", {
+                  "is-selected": G(P.option.value),
+                  "is-active": P.index === m.value,
                   "ds-select__option--checkbox": e.showCheckbox
                 }]),
                 role: "option",
-                "aria-selected": W(B.option.value),
-                onClick: ve((K) => we(B.option.value), ["prevent"]),
-                onMouseenter: (K) => h.value = B.index
+                "aria-selected": G(P.option.value),
+                onClick: ue((X) => _e(P.option.value), ["prevent"]),
+                onMouseenter: (X) => m.value = P.index
               }, [
-                e.showCheckbox ? (a(), G(_(et), {
+                e.showCheckbox ? (a(), K(D(ot), {
                   key: 0,
                   class: "ds-select__option-check",
-                  "model-value": W(B.option.value),
+                  "model-value": G(P.option.value),
                   disabled: "",
                   "aria-hidden": "true"
-                }, null, 8, ["model-value"])) : m("", !0),
-                A(u.$slots, "option", {
-                  option: B.option,
-                  selected: W(B.option.value),
-                  active: B.index === h.value
+                }, null, 8, ["model-value"])) : g("", !0),
+                _(h.$slots, "option", {
+                  option: P.option,
+                  selected: G(P.option.value),
+                  active: P.index === m.value
                 }, () => [
-                  B.option.icon ? (a(), l("i", {
+                  P.option.icon ? (a(), l("i", {
                     key: 0,
                     class: "material-icons ds-select__option-icon",
-                    style: F(B.option.color ? { color: B.option.color } : void 0),
+                    style: U(P.option.color ? { color: P.option.color } : void 0),
                     "aria-hidden": "true"
-                  }, S(B.option.icon), 5)) : m("", !0),
-                  s("span", Fl, [
-                    H(S(B.option.label), 1),
-                    B.option.subLabel ? (a(), l("span", zl, ", " + S(B.option.subLabel), 1)) : m("", !0)
+                  }, T(P.option.icon), 5)) : g("", !0),
+                  s("span", Yl, [
+                    q(T(P.option.label), 1),
+                    P.option.subLabel ? (a(), l("span", ql, ", " + T(P.option.subLabel), 1)) : g("", !0)
                   ])
                 ], !0)
-              ], 42, Pl))), 128))
-            ], 10, Ml))), 128)),
-            E.value.length === 0 ? (a(), l("li", Vl, [
-              A(u.$slots, "empty", {}, () => [
-                H(S(e.emptyText), 1)
+              ], 42, Kl))), 128))
+            ], 10, Wl))), 128)),
+            $.value.length === 0 ? (a(), l("li", jl, [
+              _(h.$slots, "empty", {}, () => [
+                q(T(e.emptyText), 1)
               ], !0)
-            ])) : m("", !0)
+            ])) : g("", !0)
           ], 64))
-        ], 40, Bl)
-      ])) : m("", !0)
+        ], 40, Ul)
+      ])) : g("", !0)
     ], 6));
   }
-}), qi = /* @__PURE__ */ M(Ul, [["__scopeId", "data-v-47964929"]]), Gl = ["tabindex"], Hl = /* @__PURE__ */ x({
+}), yn = /* @__PURE__ */ O(Xl, [["__scopeId", "data-v-47964929"]]), Zl = ["tabindex"], Ql = /* @__PURE__ */ B({
   __name: "DsRow",
   props: {
     selected: { type: Boolean, default: !1 },
     clickable: { type: Boolean, default: !1 }
   },
-  emits: [Z],
+  emits: [ee],
   setup(e, { emit: n }) {
     const t = e, o = n;
     function i() {
-      t.clickable && o(Z);
+      t.clickable && o(ee);
     }
-    function c(k) {
-      t.clickable && (k.key === "Enter" || k.key === " ") && (k.preventDefault(), o(Z));
+    function r(E) {
+      t.clickable && (E.key === "Enter" || E.key === " ") && (E.preventDefault(), o(ee));
     }
-    return (k, f) => (a(), l("tr", {
-      class: $(["ds-row", { "is-selected": e.selected, "is-clickable": e.clickable }]),
+    return (E, f) => (a(), l("tr", {
+      class: L(["ds-row", { "is-selected": e.selected, "is-clickable": e.clickable }]),
       tabindex: e.clickable ? 0 : void 0,
       onClick: i,
-      onKeydown: c
+      onKeydown: r
     }, [
-      A(k.$slots, "default", {}, void 0, !0)
-    ], 42, Gl));
+      _(E.$slots, "default", {}, void 0, !0)
+    ], 42, Zl));
   }
-}), ji = /* @__PURE__ */ M(Hl, [["__scopeId", "data-v-c2d6c50b"]]), Wl = /* @__PURE__ */ x({
+}), mn = /* @__PURE__ */ O(Ql, [["__scopeId", "data-v-c2d6c50b"]]), Jl = /* @__PURE__ */ B({
   __name: "DsCell",
   props: {
     first: { type: Boolean, default: !1 },
@@ -2270,29 +2302,29 @@ const ge = {
     }
   },
   setup(e) {
-    const n = e, t = (i) => typeof i == "number" ? `${i}px` : i, o = g(() => {
+    const n = e, t = (i) => typeof i == "number" ? `${i}px` : i, o = S(() => {
       const i = {};
       if (n.width != null && (i.width = t(n.width)), n.pinned) {
         i.position = "sticky";
-        const c = n.pinnedOffset == null ? "0px" : t(n.pinnedOffset);
-        i[n.pinned === ee.LEFT ? "left" : "right"] = c;
+        const r = n.pinnedOffset == null ? "0px" : t(n.pinnedOffset);
+        i[n.pinned === ne.LEFT ? "left" : "right"] = r;
       }
       return Object.keys(i).length ? i : void 0;
     });
-    return (i, c) => (a(), l("td", {
-      class: $(["ds-cell", {
+    return (i, r) => (a(), l("td", {
+      class: L(["ds-cell", {
         "is-accent": e.first && e.selected,
         "is-truncated": e.truncate,
         "is-selected": e.selected,
         "is-pinned": !!e.pinned,
         [`is-pinned--${e.pinned}`]: !!e.pinned
       }]),
-      style: F(o.value)
+      style: U(o.value)
     }, [
-      A(i.$slots, "default", {}, void 0, !0)
+      _(i.$slots, "default", {}, void 0, !0)
     ], 6));
   }
-}), Xi = /* @__PURE__ */ M(Wl, [["__scopeId", "data-v-727b775d"]]), Kl = {
+}), hn = /* @__PURE__ */ O(Jl, [["__scopeId", "data-v-727b775d"]]), ei = {
   SUCCESS: "success",
   WARNING: "warning",
   DANGER: "danger",
@@ -2302,27 +2334,27 @@ const ge = {
   // the only solid-fill variant
   ACCENT: "accent"
   // maps to $info-* tokens, not $accent-*
-}, Yl = /* @__PURE__ */ x({
+}, ti = /* @__PURE__ */ B({
   __name: "DsCustomTag",
   props: {
     type: {
       type: String,
-      default: Kl.INFO
+      default: ei.INFO
     },
     // Fully rounded (radius-full) sides vs the default radius-control.
     round: Boolean
   },
   setup(e) {
     return (n, t) => (a(), l("span", {
-      class: $(["ds-custom-tag", [`ds-custom-tag--${e.type}`, { "is-round": e.round }]])
+      class: L(["ds-custom-tag", [`ds-custom-tag--${e.type}`, { "is-round": e.round }]])
     }, [
-      A(n.$slots, "default", {}, void 0, !0)
+      _(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), Zi = /* @__PURE__ */ M(Yl, [["__scopeId", "data-v-c0220631"]]), ql = { class: "ds-pill__text" }, jl = ["aria-label"], Xl = {
+}), gn = /* @__PURE__ */ O(ti, [["__scopeId", "data-v-c0220631"]]), ai = { class: "ds-pill__text" }, li = ["aria-label"], ii = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Zl = /* @__PURE__ */ x({
+}, ni = /* @__PURE__ */ B({
   __name: "DsPill",
   props: {
     // Material Icons ligature name; when set, renders a trailing icon button.
@@ -2342,55 +2374,55 @@ const ge = {
       default: ""
     }
   },
-  emits: [Z],
+  emits: [ee],
   setup(e, { emit: n }) {
     const t = n;
     return (o, i) => (a(), l("span", {
-      class: $(["ds-pill", { "ds-pill--has-icon": e.icon }]),
-      style: F(e.background ? { background: e.background } : void 0)
+      class: L(["ds-pill", { "ds-pill--has-icon": e.icon }]),
+      style: U(e.background ? { background: e.background } : void 0)
     }, [
-      s("span", ql, [
-        A(o.$slots, "default", {}, void 0, !0)
+      s("span", ai, [
+        _(o.$slots, "default", {}, void 0, !0)
       ]),
       e.icon ? (a(), l("button", {
         key: 0,
         type: "button",
         class: "ds-pill__icon",
         "aria-label": e.iconLabel || void 0,
-        onClick: i[0] || (i[0] = (c) => t(_(Z)))
+        onClick: i[0] || (i[0] = (r) => t(D(ee)))
       }, [
-        s("i", Xl, S(e.icon), 1)
-      ], 8, jl)) : m("", !0)
+        s("i", ii, T(e.icon), 1)
+      ], 8, li)) : g("", !0)
     ], 6));
   }
-}), Qi = /* @__PURE__ */ M(Zl, [["__scopeId", "data-v-a8d4ddbb"]]), Ql = {
+}), pn = /* @__PURE__ */ O(ni, [["__scopeId", "data-v-a8d4ddbb"]]), si = {
   key: 0,
   class: "ds-pill-with-border__icon"
-}, Jl = { class: "ds-pill-with-border__label" }, ei = /* @__PURE__ */ x({
+}, oi = { class: "ds-pill-with-border__label" }, di = /* @__PURE__ */ B({
   __name: "DsPillWithBorder",
-  emits: [Z],
+  emits: [ee],
   setup(e, { emit: n }) {
     const t = n;
     return (o, i) => (a(), l("button", {
       type: "button",
       class: "ds-pill-with-border",
-      onClick: i[0] || (i[0] = (c) => t(_(Z)))
+      onClick: i[0] || (i[0] = (r) => t(D(ee)))
     }, [
-      o.$slots.icon ? (a(), l("span", Ql, [
-        A(o.$slots, "icon", {}, void 0, !0)
-      ])) : m("", !0),
-      s("span", Jl, [
-        A(o.$slots, "default", {}, void 0, !0)
+      o.$slots.icon ? (a(), l("span", si, [
+        _(o.$slots, "icon", {}, void 0, !0)
+      ])) : g("", !0),
+      s("span", oi, [
+        _(o.$slots, "default", {}, void 0, !0)
       ])
     ]));
   }
-}), Ji = /* @__PURE__ */ M(ei, [["__scopeId", "data-v-8db4dcaf"]]), ti = ["aria-label"], ai = ["title"], li = {
+}), Sn = /* @__PURE__ */ O(di, [["__scopeId", "data-v-8db4dcaf"]]), ri = ["aria-label"], ci = ["title"], ui = {
   key: 1,
   class: "ds-segmented-progress-bar-wrapper"
-}, ii = ["aria-label"], ni = ["title"], si = {
+}, fi = ["aria-label"], vi = ["title"], bi = {
   class: "ds-segmented-progress-bar__legend",
   "aria-hidden": "true"
-}, oi = { class: "ds-segmented-progress-bar__legend-label" }, di = /* @__PURE__ */ x({
+}, yi = { class: "ds-segmented-progress-bar__legend-label" }, mi = /* @__PURE__ */ B({
   inheritAttrs: !1,
   __name: "DsSegmentedProgressBar",
   props: {
@@ -2411,70 +2443,70 @@ const ge = {
     showLegend: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const n = e, t = Ee(), o = g(() => n.segments.filter((c) => !!c.name)), i = g(
+    const n = e, t = he(), o = S(() => n.segments.filter((r) => !!r.name)), i = S(
       () => !!t.legend || n.showLegend && o.value.length > 0
     );
-    return (c, k) => i.value ? (a(), l("div", li, [
-      s("div", he(c.$attrs, {
+    return (r, E) => i.value ? (a(), l("div", ui, [
+      s("div", ke(r.$attrs, {
         class: "ds-segmented-progress-bar",
         role: "img",
         "aria-label": e.label || void 0,
         style: { height: `${e.height}px` }
       }), [
-        (a(!0), l(z, null, Y(e.segments, (f, y) => {
-          var r;
+        (a(!0), l(W, null, Q(e.segments, (f, y) => {
+          var v;
           return a(), l("div", {
-            key: `${(r = f.name) != null ? r : ""}-${y}`,
+            key: `${(v = f.name) != null ? v : ""}-${y}`,
             class: "ds-segmented-progress-bar__segment",
-            style: F({
+            style: U({
               width: `${e.total > 0 ? f.amount * 100 / e.total : 0}%`,
               backgroundColor: f.color
             }),
             title: f.name || void 0
-          }, null, 12, ni);
+          }, null, 12, vi);
         }), 128))
-      ], 16, ii),
-      A(c.$slots, "legend", {}, () => [
-        s("ul", si, [
-          (a(!0), l(z, null, Y(o.value, (f, y) => (a(), l("li", {
+      ], 16, fi),
+      _(r.$slots, "legend", {}, () => [
+        s("ul", bi, [
+          (a(!0), l(W, null, Q(o.value, (f, y) => (a(), l("li", {
             key: `${f.name}-${y}`,
             class: "ds-segmented-progress-bar__legend-item"
           }, [
             s("span", {
               class: "ds-segmented-progress-bar__legend-swatch",
-              style: F({ backgroundColor: f.color })
+              style: U({ backgroundColor: f.color })
             }, null, 4),
-            s("span", oi, S(f.name), 1)
+            s("span", yi, T(f.name), 1)
           ]))), 128))
         ])
       ], !0)
-    ])) : (a(), l("div", he({ key: 0 }, c.$attrs, {
+    ])) : (a(), l("div", ke({ key: 0 }, r.$attrs, {
       class: "ds-segmented-progress-bar",
       role: "img",
       "aria-label": e.label || void 0,
       style: { height: `${e.height}px` }
     }), [
-      (a(!0), l(z, null, Y(e.segments, (f, y) => {
-        var r;
+      (a(!0), l(W, null, Q(e.segments, (f, y) => {
+        var v;
         return a(), l("div", {
-          key: `${(r = f.name) != null ? r : ""}-${y}`,
+          key: `${(v = f.name) != null ? v : ""}-${y}`,
           class: "ds-segmented-progress-bar__segment",
-          style: F({
+          style: U({
             width: `${e.total > 0 ? f.amount * 100 / e.total : 0}%`,
             backgroundColor: f.color
           }),
           title: f.name || void 0
-        }, null, 12, ai);
+        }, null, 12, ci);
       }), 128))
-    ], 16, ti));
+    ], 16, ri));
   }
-}), en = /* @__PURE__ */ M(di, [["__scopeId", "data-v-89dc768c"]]), ri = {
+}), kn = /* @__PURE__ */ O(mi, [["__scopeId", "data-v-89dc768c"]]), hi = {
   key: 0,
   class: "ds-empty-state__header"
-}, ci = { class: "ds-empty-state__body" }, ui = ["src"], fi = { class: "ds-empty-state__title" }, bi = {
+}, gi = { class: "ds-empty-state__body" }, pi = ["src"], Si = { class: "ds-empty-state__title" }, ki = {
   key: 1,
   class: "ds-empty-state__subtitle"
-}, vi = /* @__PURE__ */ x({
+}, $i = /* @__PURE__ */ B({
   __name: "DsEmptyState",
   props: {
     // Illustration URL; decorative (rendered with alt="").
@@ -2486,32 +2518,32 @@ const ge = {
   },
   setup(e) {
     return (n, t) => (a(), l("div", {
-      class: $(["ds-empty-state", { "is-rounded": e.roundedBorder }])
+      class: L(["ds-empty-state", { "is-rounded": e.roundedBorder }])
     }, [
-      n.$slots["table-header"] ? (a(), l("div", ri, [
-        A(n.$slots, "table-header", {}, void 0, !0)
-      ])) : m("", !0),
-      s("div", ci, [
+      n.$slots["table-header"] ? (a(), l("div", hi, [
+        _(n.$slots, "table-header", {}, void 0, !0)
+      ])) : g("", !0),
+      s("div", gi, [
         e.image ? (a(), l("img", {
           key: 0,
           src: e.image,
           alt: "",
           class: "ds-empty-state__image"
-        }, null, 8, ui)) : m("", !0),
-        s("p", fi, S(e.title), 1),
-        e.subtitle ? (a(), l("p", bi, S(e.subtitle), 1)) : m("", !0),
-        A(n.$slots, "button", {}, void 0, !0)
+        }, null, 8, pi)) : g("", !0),
+        s("p", Si, T(e.title), 1),
+        e.subtitle ? (a(), l("p", ki, T(e.subtitle), 1)) : g("", !0),
+        _(n.$slots, "button", {}, void 0, !0)
       ])
     ], 2));
   }
-}), tn = /* @__PURE__ */ M(vi, [["__scopeId", "data-v-159c48f9"]]), yi = ["aria-label"], mi = {
+}), $n = /* @__PURE__ */ O($i, [["__scopeId", "data-v-159c48f9"]]), wi = ["aria-label"], Ei = {
   key: 0,
   class: "ds-paginator__limit-message"
-}, hi = { class: "ds-paginator__pager" }, gi = {
+}, Ti = { class: "ds-paginator__pager" }, Li = {
   key: 0,
   class: "ds-paginator__ellipsis",
   "aria-hidden": "true"
-}, Si = ["aria-current", "onClick"], ki = ["aria-label", "value"], pi = ["value"], $i = "…l", Ti = "…r", Ei = /* @__PURE__ */ x({
+}, Ci = ["aria-current", "onClick"], _i = ["aria-label", "value"], Ii = ["value"], Di = "…l", Ri = "…r", Ai = /* @__PURE__ */ B({
   __name: "DsPaginator",
   props: {
     total: { type: Number, required: !0 },
@@ -2528,58 +2560,58 @@ const ge = {
     paginationLabel: { type: String, default: "" },
     pageSizeLabel: { type: String, default: "" }
   },
-  emits: [Ve, Ue],
+  emits: [We, He],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = g(() => Math.max(1, Math.ceil(t.total / t.pageSize))), c = g(() => {
+    const t = e, o = n, i = S(() => Math.max(1, Math.ceil(t.total / t.pageSize))), r = S(() => {
       const y = i.value;
       if (y <= 7)
-        return Array.from({ length: y }, (T, p) => p + 1);
-      const r = t.currentPage, d = [1];
-      r > 4 && d.push($i);
-      const b = Math.max(2, r - 2), h = Math.min(y - 1, r + 2);
-      for (let T = b; T <= h; T++)
-        d.push(T);
-      return r < y - 3 && d.push(Ti), d.push(y), d;
+        return Array.from({ length: y }, (k, w) => w + 1);
+      const v = t.currentPage, d = [1];
+      v > 4 && d.push(Di);
+      const c = Math.max(2, v - 2), m = Math.min(y - 1, v + 2);
+      for (let k = c; k <= m; k++)
+        d.push(k);
+      return v < y - 3 && d.push(Ri), d.push(y), d;
     });
-    function k(y) {
-      y < 1 || y > i.value || o(Ve, y);
+    function E(y) {
+      y < 1 || y > i.value || o(We, y);
     }
     function f(y) {
-      const r = y.target;
-      o(Ue, Number(r.value));
+      const v = y.target;
+      o(He, Number(v.value));
     }
-    return (y, r) => (a(), l("nav", {
+    return (y, v) => (a(), l("nav", {
       class: "ds-paginator",
       "aria-label": e.paginationLabel || void 0
     }, [
-      e.limitMessage ? (a(), l("span", mi, S(e.limitMessage), 1)) : m("", !0),
-      s("div", hi, [
-        j(_(oe), {
+      e.limitMessage ? (a(), l("span", Ei, T(e.limitMessage), 1)) : g("", !0),
+      s("div", Ti, [
+        Y(D(fe), {
           variant: "tertiary",
           circle: "",
           size: "medium",
           "left-icon": "chevron_left",
           "aria-label": e.prevLabel || void 0,
           disabled: e.currentPage <= 1,
-          onClick: r[0] || (r[0] = (d) => k(e.currentPage - 1))
+          onClick: v[0] || (v[0] = (d) => E(e.currentPage - 1))
         }, null, 8, ["aria-label", "disabled"]),
-        (a(!0), l(z, null, Y(c.value, (d) => (a(), l(z, { key: d }, [
-          typeof d == "string" ? (a(), l("span", gi, "…")) : (a(), l("button", {
+        (a(!0), l(W, null, Q(r.value, (d) => (a(), l(W, { key: d }, [
+          typeof d == "string" ? (a(), l("span", Li, "…")) : (a(), l("button", {
             key: 1,
             type: "button",
-            class: $(["ds-paginator__page", { "is-active": d === e.currentPage }]),
+            class: L(["ds-paginator__page", { "is-active": d === e.currentPage }]),
             "aria-current": d === e.currentPage ? "page" : void 0,
-            onClick: (b) => k(d)
-          }, S(d), 11, Si))
+            onClick: (c) => E(d)
+          }, T(d), 11, Ci))
         ], 64))), 128)),
-        j(_(oe), {
+        Y(D(fe), {
           variant: "tertiary",
           circle: "",
           size: "medium",
           "left-icon": "chevron_right",
           "aria-label": e.nextLabel || void 0,
           disabled: e.currentPage >= i.value,
-          onClick: r[1] || (r[1] = (d) => k(e.currentPage + 1))
+          onClick: v[1] || (v[1] = (d) => E(e.currentPage + 1))
         }, null, 8, ["aria-label", "disabled"])
       ]),
       s("select", {
@@ -2588,20 +2620,20 @@ const ge = {
         value: e.pageSize,
         onChange: f
       }, [
-        (a(!0), l(z, null, Y(e.pageSizes, (d) => (a(), l("option", {
+        (a(!0), l(W, null, Q(e.pageSizes, (d) => (a(), l("option", {
           key: d,
           value: d
-        }, S(d) + S(e.pageSizeSuffix), 9, pi))), 128))
-      ], 40, ki)
-    ], 8, yi));
+        }, T(d) + T(e.pageSizeSuffix), 9, Ii))), 128))
+      ], 40, _i)
+    ], 8, wi));
   }
-}), an = /* @__PURE__ */ M(Ei, [["__scopeId", "data-v-a42e7bb4"]]), Li = ["aria-current", "title"], wi = {
+}), wn = /* @__PURE__ */ O(Ai, [["__scopeId", "data-v-a42e7bb4"]]), Ni = ["aria-current", "title"], Bi = {
   class: "ds-menu-item__icon material-icons",
   "aria-hidden": "true"
-}, Ii = {
+}, Oi = {
   key: 0,
   class: "ds-menu-item__label"
-}, Ci = /* @__PURE__ */ x({
+}, xi = /* @__PURE__ */ B({
   __name: "DsMenuItem",
   props: {
     // Material Icons ligature name (rendered via <i class="material-icons">).
@@ -2613,28 +2645,28 @@ const ge = {
     // Icon-only collapsed rail.
     collapsed: Boolean
   },
-  emits: [Ge],
+  emits: [Ke],
   setup(e, { emit: n }) {
     const t = n;
     function o(i) {
-      t(Ge, i);
+      t(Ke, i);
     }
-    return (i, c) => (a(), l("button", {
+    return (i, r) => (a(), l("button", {
       type: "button",
-      class: $(["ds-menu-item", { "is-active": e.active, "is-collapsed": e.collapsed }]),
+      class: L(["ds-menu-item", { "is-active": e.active, "is-collapsed": e.collapsed }]),
       "aria-current": e.active ? "page" : void 0,
       title: e.text || void 0,
       onClick: o
     }, [
-      s("i", wi, S(e.icon), 1),
-      e.text || i.$slots.default ? (a(), l("span", Ii, [
-        A(i.$slots, "default", {}, () => [
-          H(S(e.text), 1)
+      s("i", Bi, T(e.icon), 1),
+      e.text || i.$slots.default ? (a(), l("span", Oi, [
+        _(i.$slots, "default", {}, () => [
+          q(T(e.text), 1)
         ], !0)
-      ])) : m("", !0)
-    ], 10, Li));
+      ])) : g("", !0)
+    ], 10, Ni));
   }
-}), ln = /* @__PURE__ */ M(Ci, [["__scopeId", "data-v-0fe17e63"]]), se = {
+}), En = /* @__PURE__ */ O(xi, [["__scopeId", "data-v-0fe17e63"]]), ce = {
   ACTIVE: "active",
   // current step — accent-tint chip, filled marker
   COMPLETED: "completed",
@@ -2643,10 +2675,10 @@ const ge = {
   // visited but unfinished — red "!" chip
   NEUTRAL: "neutral"
   // upcoming — outlined marker
-}, _i = { class: "ds-wizard-stepper" }, Di = { class: "ds-wizard-stepper__steps" }, Ai = {
+}, Mi = { class: "ds-wizard-stepper" }, Pi = { class: "ds-wizard-stepper__steps" }, zi = {
   class: "ds-wizard-step__marker",
   "aria-hidden": "true"
-}, Ni = { class: "ds-wizard-step__label" }, Ri = /* @__PURE__ */ x({
+}, Vi = { class: "ds-wizard-step__label" }, Fi = /* @__PURE__ */ B({
   __name: "DsWizardStepper",
   props: {
     steps: { type: Array, default: () => [] },
@@ -2658,53 +2690,53 @@ const ge = {
     // Whether the step chips are interactive (advance buttons are always active).
     clickable: { type: Boolean, default: !0 }
   },
-  emits: [De, He],
+  emits: [Ae, Ye],
   setup(e, { emit: n }) {
-    const t = e, o = n, i = g(() => t.value === t.steps.length), c = g(
-      () => t.steps.map((r, d) => {
-        var T;
-        const b = d + 1;
-        let h;
-        return b === t.value ? h = se.ACTIVE : r.completed ? h = se.COMPLETED : r.visited ? h = se.INCOMPLETE : b < t.value ? h = se.COMPLETED : h = se.NEUTRAL, {
-          key: (T = r.key) != null ? T : b,
-          index: b,
-          label: r.label,
-          state: h,
-          current: h === se.ACTIVE,
-          marker: h === se.INCOMPLETE ? "!" : String(b)
+    const t = e, o = n, i = S(() => t.value === t.steps.length), r = S(
+      () => t.steps.map((v, d) => {
+        var k;
+        const c = d + 1;
+        let m;
+        return c === t.value ? m = ce.ACTIVE : v.completed ? m = ce.COMPLETED : v.visited ? m = ce.INCOMPLETE : c < t.value ? m = ce.COMPLETED : m = ce.NEUTRAL, {
+          key: (k = v.key) != null ? k : c,
+          index: c,
+          label: v.label,
+          state: m,
+          current: m === ce.ACTIVE,
+          marker: m === ce.INCOMPLETE ? "!" : String(c)
         };
       })
     );
-    function k(r) {
-      t.clickable && o(De, r);
+    function E(v) {
+      t.clickable && o(Ae, v);
     }
     function f() {
-      t.value < t.steps.length && o(De, t.value + 1);
+      t.value < t.steps.length && o(Ae, t.value + 1);
     }
     function y() {
-      o(He);
+      o(Ye);
     }
-    return (r, d) => (a(), l("div", _i, [
-      s("ol", Di, [
-        (a(!0), l(z, null, Y(c.value, (b) => (a(), l("li", {
-          key: b.key,
+    return (v, d) => (a(), l("div", Mi, [
+      s("ol", Pi, [
+        (a(!0), l(W, null, Q(r.value, (c) => (a(), l("li", {
+          key: c.key,
           class: "ds-wizard-stepper__item"
         }, [
-          (a(), G(ft(e.clickable ? "button" : "div"), {
+          (a(), K(pt(e.clickable ? "button" : "div"), {
             type: e.clickable ? "button" : void 0,
-            class: $(["ds-wizard-step", [`ds-wizard-step--${b.state}`, { "is-clickable": e.clickable }]]),
-            "aria-current": b.current ? "step" : void 0,
-            onClick: (h) => k(b.index)
+            class: L(["ds-wizard-step", [`ds-wizard-step--${c.state}`, { "is-clickable": e.clickable }]]),
+            "aria-current": c.current ? "step" : void 0,
+            onClick: (m) => E(c.index)
           }, {
             default: ie(() => [
-              s("span", Ai, S(b.marker), 1),
-              s("span", Ni, S(b.label), 1)
+              s("span", zi, T(c.marker), 1),
+              s("span", Vi, T(c.label), 1)
             ]),
             _: 2
           }, 1032, ["type", "class", "aria-current", "onClick"]))
         ]))), 128))
       ]),
-      !i.value && e.nextLabel ? (a(), G(_(oe), {
+      !i.value && e.nextLabel ? (a(), K(D(fe), {
         key: 0,
         variant: "primary",
         size: "large",
@@ -2712,78 +2744,361 @@ const ge = {
         onClick: f
       }, {
         default: ie(() => [
-          H(S(e.nextLabel), 1)
+          q(T(e.nextLabel), 1)
         ]),
         _: 1
-      })) : m("", !0),
-      i.value && e.finalStepLabel ? (a(), G(_(oe), {
+      })) : g("", !0),
+      i.value && e.finalStepLabel ? (a(), K(D(fe), {
         key: 1,
         variant: "primary",
         size: "large",
         onClick: y
       }, {
         default: ie(() => [
-          H(S(e.finalStepLabel), 1)
+          q(T(e.finalStepLabel), 1)
         ]),
         _: 1
-      })) : m("", !0)
+      })) : g("", !0)
     ]));
   }
-}), nn = /* @__PURE__ */ M(Ri, [["__scopeId", "data-v-d6f1e6d7"]]);
+}), Tn = /* @__PURE__ */ O(Fi, [["__scopeId", "data-v-d6f1e6d7"]]), it = {
+  /** Right-to-left: panel pinned to the right edge, ring on its left border. */
+  RTL: "rtl",
+  /** Left-to-right: panel pinned to the left edge, ring on its right border. */
+  LTR: "ltr"
+}, Ui = ["aria-modal", "aria-labelledby", "aria-label"], Gi = {
+  key: 1,
+  class: "ds-drawer__header"
+}, Wi = ["id"], Hi = {
+  key: 0,
+  class: "ds-drawer__controls"
+}, Ki = {
+  key: 0,
+  class: "ds-drawer__actions"
+}, Yi = ["aria-label"], qi = { class: "ds-drawer__body" }, ji = {
+  key: 2,
+  class: "ds-drawer__footer"
+}, Xi = /* @__PURE__ */ B({
+  __name: "DsDrawer",
+  props: {
+    open: Boolean,
+    title: { type: String, default: "" },
+    showClose: { type: Boolean, default: !0 },
+    // Accessible name for the icon-only close button; English default (app owns i18n),
+    // matching DsModal so the control is never unnamed.
+    closeLabel: { type: String, default: "Close" },
+    direction: {
+      type: String,
+      default: it.RTL
+    },
+    // Width in px (a number, not a CSS length): the drag math and the min/max bounds
+    // are numeric, and the consumer's stored width is a number too.
+    width: { type: Number, default: 440 },
+    resizable: Boolean,
+    minWidth: { type: Number, default: 360 },
+    maxWidth: { type: Number, default: 720 },
+    closeOnOverlay: { type: Boolean, default: !0 },
+    closeOnEscape: { type: Boolean, default: !0 },
+    // Cancelable close guard: return false to keep the drawer open. Gates Escape,
+    // the overlay click and the × button alike.
+    beforeClose: { type: Function, default: null },
+    // false = render in-flow (no portal / backdrop / scroll-lock) for specimen cards.
+    fixed: { type: Boolean, default: !0 }
+  },
+  emits: [J, je, Xe, Ze],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = F(null);
+    let r = null;
+    const E = he(), f = ge(), y = S(() => t.title && !E.header ? f : void 0), v = (u) => Math.min(Math.max(u, t.minWidth), Math.max(t.minWidth, t.maxWidth)), d = F(v(t.width));
+    Z(
+      () => [t.width, t.minWidth, t.maxWidth],
+      () => {
+        N.value || (d.value = v(t.width));
+      }
+    );
+    const c = S(() => ({ width: `${d.value}px` }));
+    async function m() {
+      t.beforeClose && await t.beforeClose() === !1 || o(J);
+    }
+    let k = !1;
+    function w() {
+      if (k) {
+        k = !1;
+        return;
+      }
+      t.fixed && t.closeOnOverlay && m();
+    }
+    const N = F(!1);
+    let C = 0, $ = 0;
+    function A(u) {
+      const p = u.clientX - C, x = t.direction === it.RTL ? $ - p : $ + p;
+      return v(x);
+    }
+    function V(u) {
+      t.resizable && (N.value = !0, C = u.clientX, $ = d.value, document.addEventListener("mousemove", H), document.addEventListener("mouseup", ae), o(je, d.value));
+    }
+    function H(u) {
+      N.value && (d.value = A(u), o(Xe, d.value));
+    }
+    function ae() {
+      N.value && (G(), N.value = !1, k = !0, setTimeout(() => k = !1, 0), o(Ze, d.value));
+    }
+    function G() {
+      document.removeEventListener("mousemove", H), document.removeEventListener("mouseup", ae);
+    }
+    function M() {
+      return i.value ? Array.from(i.value.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(
+        (p) => !p.closest("[hidden]") && p.getAttribute("aria-hidden") !== "true"
+      ) : [];
+    }
+    function j(u) {
+      var re;
+      if (u.key === "Escape") {
+        t.closeOnEscape && m();
+        return;
+      }
+      if (u.key !== "Tab") return;
+      const p = M();
+      if (p.length === 0) {
+        u.preventDefault(), (re = i.value) == null || re.focus();
+        return;
+      }
+      const x = p[0], le = p[p.length - 1];
+      u.shiftKey && document.activeElement === x ? (u.preventDefault(), le.focus()) : !u.shiftKey && document.activeElement === le && (u.preventDefault(), x.focus());
+    }
+    function b() {
+      r = document.activeElement, document.addEventListener("keydown", j), document.body.style.overflow = "hidden", se(() => {
+        var u, p;
+        return (p = (u = M()[0]) != null ? u : i.value) == null ? void 0 : p.focus();
+      });
+    }
+    function R(u = !0) {
+      var p;
+      document.removeEventListener("keydown", j), document.body.style.overflow = "", u && ((p = r == null ? void 0 : r.focus) == null || p.call(r));
+    }
+    return Z(
+      () => t.open && t.fixed,
+      (u, p) => {
+        typeof document != "undefined" && (u ? b() : p && R());
+      },
+      { immediate: !0 }
+    ), de(() => {
+      typeof document != "undefined" && (G(), R(!1));
+    }), (u, p) => (a(), K(Pe, {
+      to: "body",
+      disabled: !e.fixed
+    }, [
+      Y(me, {
+        name: `ds-drawer-${e.direction}`
+      }, {
+        default: ie(() => [
+          e.open ? (a(), l("div", {
+            key: 0,
+            class: L(["ds-drawer", [`ds-drawer--${e.direction}`, { "is-fixed": e.fixed, "is-resizing": N.value }]]),
+            onClick: ue(w, ["self"])
+          }, [
+            s("aside", {
+              ref_key: "panelRef",
+              ref: i,
+              class: "ds-drawer__panel",
+              role: "dialog",
+              "aria-modal": e.fixed ? "true" : "false",
+              "aria-labelledby": y.value,
+              "aria-label": y.value ? void 0 : "drawer",
+              tabindex: "-1",
+              style: U(c.value)
+            }, [
+              e.resizable ? (a(), l("div", {
+                key: 0,
+                class: "ds-drawer__dragger",
+                "aria-hidden": "true",
+                onMousedown: ue(V, ["stop", "prevent"])
+              }, null, 32)) : g("", !0),
+              e.title || e.showClose || u.$slots.header || u.$slots.actions ? (a(), l("header", Gi, [
+                _(u.$slots, "header", {}, () => [
+                  s("h4", {
+                    id: D(f),
+                    class: "ds-drawer__title"
+                  }, T(e.title), 9, Wi)
+                ], !0),
+                e.showClose || u.$slots.actions ? (a(), l("div", Hi, [
+                  u.$slots.actions ? (a(), l("div", Ki, [
+                    _(u.$slots, "actions", {}, void 0, !0)
+                  ])) : g("", !0),
+                  e.showClose ? (a(), l("button", {
+                    key: 1,
+                    type: "button",
+                    class: "ds-drawer__close",
+                    "aria-label": e.closeLabel || void 0,
+                    onClick: m
+                  }, [...p[0] || (p[0] = [
+                    s("i", {
+                      class: "material-icons",
+                      "aria-hidden": "true"
+                    }, "close", -1)
+                  ])], 8, Yi)) : g("", !0)
+                ])) : g("", !0)
+              ])) : g("", !0),
+              s("div", qi, [
+                _(u.$slots, "default", {}, void 0, !0)
+              ]),
+              u.$slots.footer ? (a(), l("footer", ji, [
+                _(u.$slots, "footer", {}, void 0, !0)
+              ])) : g("", !0)
+            ], 12, Ui)
+          ], 2)) : g("", !0)
+        ]),
+        _: 3
+      }, 8, ["name"])
+    ], 8, ["disabled"]));
+  }
+}), Ln = /* @__PURE__ */ O(Xi, [["__scopeId", "data-v-ff99c607"]]), Zi = {
+  TOP: "top",
+  BOTTOM: "bottom",
+  LEFT: "left",
+  RIGHT: "right"
+}, Qi = ["id"], Ji = /* @__PURE__ */ B({
+  __name: "DsPopover",
+  props: {
+    open: Boolean,
+    placement: {
+      type: String,
+      default: Zi.BOTTOM
+    },
+    // Panel width (any CSS length). Empty = fit content.
+    width: { type: String, default: "" },
+    closeOnEscape: { type: Boolean, default: !0 },
+    closeOnOutside: { type: Boolean, default: !0 },
+    // Let the trigger slot toggle the panel. Off when the consumer drives `open` itself.
+    triggerOnClick: { type: Boolean, default: !0 }
+  },
+  emits: [Ne],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = F(null), r = F(null), E = ge(), {
+      shiftStyle: f,
+      activate: y,
+      deactivate: v
+    } = dt(r, () => t.placement), d = S(() => {
+      const C = { ...t.width ? { width: t.width } : {}, ...f.value };
+      return Object.keys(C).length > 0 ? C : void 0;
+    });
+    let c = null;
+    function m() {
+      o(Ne, !1);
+    }
+    function k() {
+      t.triggerOnClick && o(Ne, !t.open);
+    }
+    function w() {
+      t.closeOnEscape && t.open && m();
+    }
+    function N(C) {
+      var A;
+      const $ = C.target;
+      !$ || (A = i.value) != null && A.contains($) || m();
+    }
+    return Z(
+      () => t.open,
+      (C, $) => {
+        var A;
+        typeof document != "undefined" && (C ? (c = document.activeElement, t.closeOnOutside && document.addEventListener("mousedown", N), se(() => {
+          var V, H;
+          (H = (V = r.value) == null ? void 0 : V.focus) == null || H.call(V, { preventScroll: !0 }), y();
+        })) : $ && (document.removeEventListener("mousedown", N), v(), (A = c == null ? void 0 : c.focus) == null || A.call(c, { preventScroll: !0 })));
+      },
+      { immediate: !0 }
+    ), de(() => {
+      typeof document != "undefined" && (document.removeEventListener("mousedown", N), v());
+    }), (C, $) => (a(), l("div", {
+      ref_key: "rootRef",
+      ref: i,
+      class: "ds-popover",
+      onKeydown: st(w, ["esc"])
+    }, [
+      s("div", {
+        class: "ds-popover__trigger",
+        onClick: k
+      }, [
+        _(C.$slots, "trigger", {}, void 0, !0)
+      ]),
+      Y(me, { name: "ds-popover-fade" }, {
+        default: ie(() => [
+          e.open ? (a(), l("div", {
+            key: 0,
+            id: D(E),
+            ref_key: "panelRef",
+            ref: r,
+            class: L(["ds-popover__panel", `ds-popover__panel--${e.placement}`]),
+            role: "dialog",
+            tabindex: "-1",
+            style: U(d.value)
+          }, [
+            _(C.$slots, "default", {}, void 0, !0)
+          ], 14, Qi)) : g("", !0)
+        ]),
+        _: 3
+      })
+    ], 544));
+  }
+}), Cn = /* @__PURE__ */ O(Ji, [["__scopeId", "data-v-d016aa25"]]);
 export {
-  fa as DS_ALERT_EFFECTS,
-  ba as DS_ALERT_ICONS,
-  ua as DS_ALERT_TYPES,
-  Re as DS_BADGE_TONES,
-  yt as DS_BUTTON_NATIVE_TYPES,
-  Ke as DS_BUTTON_SIZES,
-  Ae as DS_BUTTON_VARIANTS,
-  Kl as DS_CUSTOM_TAG_TYPES,
-  Zt as DS_INPUT_SIZES,
-  ce as DS_INPUT_TYPES,
-  pa as DS_NOTIFICATION_ICONS,
-  qe as DS_NOTIFICATION_LINK_TARGETS,
-  ka as DS_NOTIFICATION_POSITIONS,
-  Sa as DS_NOTIFICATION_TYPES,
-  Xe as DS_SELECT_TYPES,
-  Ze as DS_SELECT_WIDTHS,
-  Ce as DS_SPINNER_SIZES,
-  ge as DS_SPINNER_TONES,
-  Ye as DS_TABLE_ALIGN,
-  ee as DS_TABLE_PIN,
-  Et as DS_TAG_TONES,
-  xa as DS_TOOLTIP_PLACEMENTS,
-  Ne as DS_VERIFICATION_STATES,
-  se as DS_WIZARD_STEP_STATES,
-  zi as DsAlert,
-  Mi as DsAvatar,
-  _t as DsBadge,
-  oe as DsButton,
-  Xi as DsCell,
-  et as DsCheckbox,
-  je as DsContactValue,
-  Zi as DsCustomTag,
-  Hi as DsDataCard,
-  tn as DsEmptyState,
-  Pi as DsInput,
-  Yi as DsItemSelectorButton,
-  ln as DsMenuItem,
-  Ui as DsModal,
-  Vi as DsNotification,
-  an as DsPaginator,
-  Qi as DsPill,
-  Ji as DsPillWithBorder,
-  Wi as DsRadio,
-  ji as DsRow,
-  en as DsSegmentedProgressBar,
-  qi as DsSelect,
-  fe as DsSpinner,
-  Ki as DsSwitch,
-  Oi as DsTable,
-  xi as DsTag,
-  Fi as DsTextarea,
-  Gi as DsTooltip,
-  za as DsVerificationIcon,
-  nn as DsWizardStepper
+  pa as DS_ALERT_EFFECTS,
+  Sa as DS_ALERT_ICONS,
+  ga as DS_ALERT_TYPES,
+  xe as DS_BADGE_TONES,
+  $t as DS_BUTTON_NATIVE_TYPES,
+  Qe as DS_BUTTON_SIZES,
+  Be as DS_BUTTON_VARIANTS,
+  ei as DS_CUSTOM_TAG_TYPES,
+  it as DS_DRAWER_DIRECTIONS,
+  ia as DS_INPUT_SIZES,
+  be as DS_INPUT_TYPES,
+  _a as DS_NOTIFICATION_ICONS,
+  et as DS_NOTIFICATION_LINK_TARGETS,
+  Ca as DS_NOTIFICATION_POSITIONS,
+  La as DS_NOTIFICATION_TYPES,
+  Zi as DS_POPOVER_PLACEMENTS,
+  at as DS_SELECT_TYPES,
+  lt as DS_SELECT_WIDTHS,
+  De as DS_SPINNER_SIZES,
+  $e as DS_SPINNER_TONES,
+  Je as DS_TABLE_ALIGN,
+  ne as DS_TABLE_PIN,
+  Rt as DS_TAG_TONES,
+  Ga as DS_TOOLTIP_PLACEMENTS,
+  Oe as DS_VERIFICATION_STATES,
+  ce as DS_WIZARD_STEP_STATES,
+  on as DsAlert,
+  an as DsAvatar,
+  xt as DsBadge,
+  fe as DsButton,
+  hn as DsCell,
+  ot as DsCheckbox,
+  tt as DsContactValue,
+  gn as DsCustomTag,
+  un as DsDataCard,
+  Ln as DsDrawer,
+  $n as DsEmptyState,
+  nn as DsInput,
+  bn as DsItemSelectorButton,
+  En as DsMenuItem,
+  rn as DsModal,
+  dn as DsNotification,
+  wn as DsPaginator,
+  pn as DsPill,
+  Sn as DsPillWithBorder,
+  Cn as DsPopover,
+  fn as DsRadio,
+  mn as DsRow,
+  kn as DsSegmentedProgressBar,
+  yn as DsSelect,
+  ye as DsSpinner,
+  vn as DsSwitch,
+  ln as DsTable,
+  tn as DsTag,
+  sn as DsTextarea,
+  cn as DsTooltip,
+  qa as DsVerificationIcon,
+  Tn as DsWizardStepper
 };
 //# sourceMappingURL=index.es.js.map