@salesql/sql_components_vue3 2.0.0 → 2.1.1

package/dist/index.es.js

@@ -1,37 +1,56 @@
-import { defineComponent as $, openBlock as t, createElementBlock as a, normalizeStyle as L, normalizeClass as m, computed as h, createBlock as D, unref as S, createCommentVNode as u, renderSlot as I, createElementVNode as d, toDisplayString as v, Fragment as A, renderList as V, createTextVNode as O, useModel as Q, useSlots as oe, ref as R, withDirectives as Z, vModelDynamic as ye, mergeModels as U, vModelText as ve, onMounted as se, watch as de, vModelCheckbox as be, onBeforeUnmount as j, Teleport as re, createVNode as p, Transition as ce, withCtx as J, nextTick as me, withModifiers as ue } from "vue";
-const W = {
+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 = {
   DARK: "dark",
   // slate ring — for light surfaces (default)
   LIGHT: "light",
   // white ring — for dark surfaces / solid buttons
   ACCENT: "accent"
   // accent ring
-}, ge = ["aria-label"], he = /* @__PURE__ */ $({
+}, Ce = {
+  SMALL: "small",
+  // 20px
+  MEDIUM: "medium",
+  // 32px
+  LARGE: "large"
+  // 48px
+}, bt = ["aria-label"], vt = /* @__PURE__ */ x({
   __name: "DsSpinner",
   props: {
-    size: { type: Number, default: 24 },
+    // Diameter in px, or a named size ("small" 20 / "medium" 32 / "large" 48).
+    // Default (24) is unchanged and isn't one of the named steps.
+    size: { type: [Number, String], default: 24 },
     tone: {
       type: String,
-      default: W.DARK
+      default: ge.DARK
     },
     // Accessible name (DS default "Loading"); the consuming app can override for
     // i18n. role="status" + aria-label are always present, never opt-in.
     label: { type: String, default: "Loading" }
   },
   setup(e) {
-    return (i, l) => (t(), a("span", {
-      class: m(["ds-spinner", `ds-spinner--${e.tone}`]),
+    const n = {
+      [Ce.SMALL]: 20,
+      [Ce.MEDIUM]: 32,
+      [Ce.LARGE]: 48
+    }, t = e, o = g(
+      () => {
+        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}`]),
       role: "status",
-      style: L({ width: `${e.size}px`, height: `${e.size}px` }),
+      style: F({ width: `${o.value}px`, height: `${o.value}px` }),
       "aria-label": e.label || void 0
-    }, null, 14, ge));
+    }, null, 14, bt));
   }
-}), T = (e, i) => {
-  const l = e.__vccOpts || e;
-  for (const [r, s] of i)
-    l[r] = s;
-  return l;
-}, Se = /* @__PURE__ */ T(he, [["__scopeId", "data-v-4d32b0a5"]]), ee = "click", C = "close", F = "focus", z = "blur", G = "copy", _ = "correct", P = "incorrect", te = "sort", ae = "edit", H = {
+}), M = (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 = {
   DEFAULT: "default",
   // white surface, dark text (the default value; == tertiary)
   PRIMARY: "primary",
@@ -41,14 +60,20 @@ const W = {
   TERTIARY: "tertiary",
   // white surface, dark text (low-emphasis row action)
   QUATERNARY: "quaternary",
-  // accent text + accent-mid border on white
+  // accent text + accent-mid border on white (former "special")
   QUINARY: "quinary",
-  // accent text on white, no border (link-style)
-  WARNING: "warning",
-  // solid red fill, white text — destructive / delete
-  DOTTED: "dotted"
+  // accent text on white, no border (link-style) (former "special2")
+  SENARY: "senary",
+  // accent text on accent-tint; hover fills solid accent (former "special3")
+  DOTTED: "dotted",
   // transparent, dashed border, 24px radius — "add" affordance
-}, ie = {
+  DANGER: "danger",
+  // destructive/delete — error text on error-tint (DS tint style)
+  // Legacy: solid-red fill (white text) kept for back-compat. The DS treats
+  // `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 = {
   SMALL: "small",
   // 24px
   MEDIUM: "medium",
@@ -57,33 +82,33 @@ const W = {
   // 36px
   XLARGE: "xlarge"
   // 48px
-}, ke = {
+}, yt = {
   BUTTON: "button",
   SUBMIT: "submit",
   RESET: "reset"
-}, $e = ["type", "disabled", "autofocus", "aria-busy", "aria-disabled", "aria-pressed", "aria-label"], Te = {
-  key: 1,
+}, mt = ["type", "disabled", "autofocus", "aria-busy", "aria-disabled", "aria-pressed", "aria-label"], ht = ["aria-hidden"], gt = {
+  key: 0,
   class: "ds-button__icon ds-button__icon--leading"
-}, Ie = {
+}, St = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Ce = {
-  key: 2,
+}, kt = {
+  key: 1,
   class: "ds-button__label"
-}, Ee = {
-  key: 3,
+}, pt = {
+  key: 2,
   class: "ds-button__icon ds-button__icon--trailing"
-}, we = {
+}, $t = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Le = /* @__PURE__ */ $({
+}, Tt = /* @__PURE__ */ x({
   __name: "DsButton",
   props: {
-    variant: { type: String, default: H.DEFAULT },
-    size: { type: String, default: ie.MEDIUM },
+    variant: { type: String, default: Ae.DEFAULT },
+    size: { type: String, default: Ke.MEDIUM },
     nativeType: {
       type: String,
-      default: ke.BUTTON
+      default: yt.BUTTON
     },
     // Material Icon names (rendered via <i class="material-icons">); a leading/
     // trailing slot overrides. Icon-only buttons (circle/square) need ariaLabel.
@@ -97,20 +122,23 @@ const W = {
     // Flat 4px-radius icon-only button (the DS `*-square` sizes): symmetric padding
     // per size, height === width.
     square: Boolean,
+    // Zero the square padding for a tight, edge-to-edge glyph (DS `small-square-no-padding`).
+    // Only takes effect together with `square`.
+    noPadding: Boolean,
     // Toggle state: accent outline + fill; sets aria-pressed (DS `selected`).
     selected: Boolean,
     autofocus: Boolean
   },
-  emits: [ee],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = h(() => l.size === ie.SMALL ? 14 : 20), n = h(
-      () => l.variant === H.PRIMARY || l.variant === H.WARNING ? W.LIGHT : W.DARK
+  emits: [Z],
+  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
     );
-    function o(c) {
-      l.disabled || l.loading || r(ee, c);
+    function k(f) {
+      t.disabled || t.loading || o(Z, f);
     }
-    return (c, b) => (t(), a("button", {
-      class: m(["ds-button", [
+    return (f, y) => (a(), l("button", {
+      class: $(["ds-button", [
         `ds-button--${e.variant}`,
         `ds-button--${e.size}`,
         {
@@ -118,6 +146,7 @@ const W = {
           "is-loading": e.loading,
           "is-circle": e.circle,
           "is-square": e.square,
+          "is-no-padding": e.noPadding,
           "is-selected": e.selected
         }
       ]]),
@@ -128,30 +157,35 @@ const W = {
       "aria-disabled": e.disabled || e.loading || void 0,
       "aria-pressed": e.selected || void 0,
       "aria-label": e.ariaLabel || void 0,
-      onClick: o
+      onClick: k
     }, [
-      e.loading ? (t(), D(S(Se), {
+      e.loading ? (a(), G(_(fe), {
         key: 0,
         class: "ds-button__spinner",
-        size: s.value,
-        tone: n.value
-      }, null, 8, ["size", "tone"])) : u("", !0),
-      !e.loading && (e.leftIcon || c.$slots.leading) ? (t(), a("span", Te, [
-        I(c.$slots, "leading", {}, () => [
-          d("i", Ie, v(e.leftIcon), 1)
-        ], !0)
-      ])) : u("", !0),
-      !e.loading && c.$slots.default ? (t(), a("span", Ce, [
-        I(c.$slots, "default", {}, void 0, !0)
-      ])) : u("", !0),
-      !e.loading && (e.rightIcon || c.$slots.trailing) ? (t(), a("span", Ee, [
-        I(c.$slots, "trailing", {}, () => [
-          d("i", we, v(e.rightIcon), 1)
-        ], !0)
-      ])) : u("", !0)
-    ], 10, $e));
+        size: i.value,
+        tone: c.value
+      }, null, 8, ["size", "tone"])) : m("", !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)
+          ], !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)
+          ], !0)
+        ])) : m("", !0)
+      ], 8, ht)
+    ], 10, mt));
   }
-}), K = /* @__PURE__ */ T(Le, [["__scopeId", "data-v-2d17382d"]]), De = {
+}), oe = /* @__PURE__ */ M(Tt, [["__scopeId", "data-v-61354b19"]]), Et = {
   DEFAULT: "default",
   // white bg, slate-tint border, muted text
   GREY: "grey",
@@ -164,44 +198,58 @@ const W = {
   // e.g. Pending
   ERROR: "error"
   // e.g. Bounced
-}, Ne = ["aria-label"], Re = /* @__PURE__ */ $({
+}, Lt = { class: "ds-tag__label" }, wt = ["aria-label"], It = /* @__PURE__ */ x({
   __name: "DsTag",
   props: {
     tone: {
       type: String,
-      default: De.DEFAULT
+      default: Et.DEFAULT
     },
     // Semicircular sides (DS `rounded`): radius-round vs the default radius-control.
     rounded: Boolean,
     // Show a × close control that emits `close`.
     closable: Boolean,
+    // Clickable affordance (DS: presence of `onClick` toggles cursor: pointer).
+    // Vue can't cheaply detect an attached native @click listener, so this is an
+    // explicit opt-in; it only sets cursor styling and doesn't touch the native
+    // @click fallthrough behavior.
+    clickable: Boolean,
+    // Opt-in single-line truncation for long labels (default off). The consuming
+    // app sets the ceiling via the `--ds-tag-max-width` CSS custom property; the
+    // label then clips with an ellipsis while the close control stays intact.
+    truncate: Boolean,
     // Accessible name for the × control (the app owns the wording / i18n).
     closeLabel: {
       type: String,
       default: ""
     }
   },
-  setup(e, { emit: i }) {
-    const l = i;
-    return (r, s) => (t(), a("span", {
-      class: m(["ds-tag", [`ds-tag--${e.tone}`, { "is-rounded": e.rounded }]])
+  setup(e, { emit: n }) {
+    const t = n;
+    return (o, i) => (a(), l("span", {
+      class: $(["ds-tag", [
+        `ds-tag--${e.tone}`,
+        { "is-rounded": e.rounded, "is-clickable": e.clickable, "is-truncate": e.truncate }
+      ]])
     }, [
-      I(r.$slots, "default", {}, void 0, !0),
-      e.closable ? (t(), a("button", {
+      s("span", Lt, [
+        A(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: s[0] || (s[0] = (n) => l(S(C)))
-      }, [...s[1] || (s[1] = [
-        d("i", {
+        onClick: i[0] || (i[0] = ve((c) => t(_(X)), ["stop"]))
+      }, [...i[1] || (i[1] = [
+        s("i", {
           class: "material-icons",
           "aria-hidden": "true"
         }, "close", -1)
-      ])], 8, Ne)) : u("", !0)
+      ])], 8, wt)) : m("", !0)
     ], 2));
   }
-}), ea = /* @__PURE__ */ T(Re, [["__scopeId", "data-v-fc383bb9"]]), X = {
+}), xi = /* @__PURE__ */ M(It, [["__scopeId", "data-v-0540d9b3"]]), Re = {
   ACCENT: "accent",
   // e.g. Work (purple)
   GREY: "grey",
@@ -214,82 +262,193 @@ const W = {
   // coral
   WARNING: "warning"
   // orange
-}, Be = /* @__PURE__ */ $({
+}, Ct = /* @__PURE__ */ x({
   __name: "DsBadge",
   props: {
     tone: {
       type: String,
-      default: X.ACCENT
+      default: Re.ACCENT
     }
   },
   setup(e) {
-    return (i, l) => (t(), a("span", {
-      class: m(["ds-badge", `ds-badge--${e.tone}`])
+    return (n, t) => (a(), l("span", {
+      class: $(["ds-badge", `ds-badge--${e.tone}`])
     }, [
-      I(i.$slots, "default", {}, void 0, !0)
+      A(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), Ae = /* @__PURE__ */ T(Be, [["__scopeId", "data-v-f10a17a0"]]), Oe = ["src", "alt"], xe = ["aria-label"], Me = /* @__PURE__ */ $({
+}), _t = /* @__PURE__ */ M(Ct, [["__scopeId", "data-v-f10a17a0"]]), Dt = ["src", "alt"], At = ["aria-label"], Nt = /* @__PURE__ */ x({
   __name: "DsAvatar",
   props: {
     image: { type: String, default: "" },
     firstName: { type: String, default: "" },
     lastName: { type: String, default: "" },
+    // Explicit initials (DS `letters`) — overrides the computed firstName+lastName
+    // initials when non-empty. Passed through as-is (no uppercase transform),
+    // matching the DS: only the firstName+lastName path uppercases.
+    letters: { type: String, default: "" },
     uid: { type: String, default: "" },
     size: { type: Number, default: 40 },
+    // Explicit width/height (DS parity) — override `size` per-axis when present.
+    width: { type: Number, default: void 0 },
+    height: { type: Number, default: void 0 },
+    // Initials font-size in px — overrides the computed ~40%-of-box value when present.
+    textSize: { type: Number, default: void 0 },
+    // Initials font-weight — overrides the default token weight (900) when present.
+    fontWeight: { type: [Number, String], default: void 0 },
     circular: Boolean,
-    // Accessible label (defaults to "firstName lastName").
-    alt: { type: String, default: "" }
+    // Accessible label. Omitted → falls back to the computed name/letters. An explicit
+    // value wins — including `alt=""` for a deliberately decorative image (default is
+    // `undefined`, so "" is distinguishable from "not provided").
+    alt: { type: String, default: void 0 }
   },
   setup(e) {
-    const i = e, l = h(
-      () => i.firstName && i.lastName ? (i.firstName.charAt(0) + i.lastName.charAt(0)).toUpperCase() : ""
-    ), r = h(() => i.alt || `${i.firstName} ${i.lastName}`.trim()), s = h(() => ({ width: `${i.size}px`, height: `${i.size}px` })), n = h(() => {
-      const o = i.uid || i.firstName + i.lastName;
-      let c = 0;
-      for (let f = 0; f < o.length; f++)
-        c = o.charCodeAt(f) + ((c << 5) - c), c = c & c;
-      const b = [0, 0, 0];
-      for (let f = 0; f < 3; f++) b[f] = c >> f * 8 & 255;
-      const y = b[0] >= 200 && b[1] >= 200 && b[2] >= 200;
-      return { bg: `rgb(${b[0]}, ${b[1]}, ${b[2]})`, fg: y ? "#323f4b" : "#fff" };
+    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(() => {
+      var d;
+      return (d = n.alt) != null ? d : o.value;
+    }), c = g(() => {
+      var d;
+      return (d = n.width) != null ? d : n.size;
+    }), k = g(() => {
+      var d;
+      return (d = n.height) != null ? d : n.size;
+    }), f = g(() => ({ width: `${c.value}px`, height: `${k.value}px` })), y = g(
+      () => {
+        var d;
+        return (d = n.textSize) != null ? d : Math.round(Math.min(c.value, k.value) * 0.4);
+      }
+    ), r = g(() => {
+      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" };
     });
-    return (o, c) => e.image ? (t(), a("img", {
+    return (d, b) => e.image ? (a(), l("img", {
       key: 0,
-      class: m(["ds-avatar", { "is-circular": e.circular }]),
+      class: $(["ds-avatar", { "is-circular": e.circular }]),
       src: e.image,
-      alt: e.alt,
-      style: L(s.value)
-    }, null, 14, Oe)) : l.value ? (t(), a("div", {
+      alt: i.value,
+      style: F(f.value)
+    }, null, 14, Dt)) : t.value ? (a(), l("div", {
       key: 1,
-      class: m(["ds-avatar ds-avatar--initials", { "is-circular": e.circular }]),
+      class: $(["ds-avatar ds-avatar--initials", { "is-circular": e.circular }]),
       role: "img",
-      "aria-label": r.value || void 0,
-      style: L([
-        s.value,
-        { background: n.value.bg, color: n.value.fg, fontSize: `${Math.round(e.size * 0.4)}px` }
+      "aria-label": i.value || void 0,
+      style: F([
+        f.value,
+        {
+          background: r.value.bg,
+          color: r.value.fg,
+          fontSize: `${y.value}px`,
+          fontWeight: e.fontWeight
+        }
       ])
-    }, v(l.value), 15, xe)) : (t(), a("div", {
+    }, S(t.value), 15, At)) : (a(), l("div", {
       key: 2,
-      class: m(["ds-avatar ds-avatar--placeholder", { "is-circular": e.circular }]),
-      style: L(s.value),
+      class: $(["ds-avatar ds-avatar--placeholder", { "is-circular": e.circular }]),
+      style: F(f.value),
       "aria-hidden": "true"
     }, null, 6));
   }
-}), ta = /* @__PURE__ */ T(Me, [["__scopeId", "data-v-e965ed47"]]), le = {
+}), Mi = /* @__PURE__ */ M(Nt, [["__scopeId", "data-v-4faae4da"]]), Rt = ["disabled", "name", "aria-label"], Bt = {
+  key: 0,
+  class: "ds-checkbox__mark",
+  viewBox: "0 0 16 16",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2.5"
+}, xt = {
+  key: 1,
+  class: "ds-checkbox__mark",
+  viewBox: "0 0 16 16",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2.5"
+}, Mt = {
+  key: 0,
+  class: "ds-checkbox__label"
+}, Ot = /* @__PURE__ */ x({
+  __name: "DsCheckbox",
+  props: /* @__PURE__ */ Q({
+    indeterminate: Boolean,
+    disabled: Boolean,
+    name: { type: String, default: "" },
+    // Label text (DS `label` prop); a default slot overrides it.
+    label: { type: String, default: "" },
+    // Accessible name when there is no visible label (e.g. a select-all in a table).
+    ariaLabel: { type: String, default: "" }
+  }, {
+    modelValue: { type: Boolean, default: !1 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const n = de(e, "modelValue"), t = e, o = U(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 }])
+    }, [
+      Be(s("input", {
+        ref_key: "inputRef",
+        ref: o,
+        "onUpdate:modelValue": k[0] || (k[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]
+      ]),
+      s("span", {
+        class: $(["ds-checkbox__box", { "is-active": n.value || e.indeterminate }]),
+        "aria-hidden": "true"
+      }, [
+        e.indeterminate ? (a(), l("svg", Bt, [...k[1] || (k[1] = [
+          s("line", {
+            x1: "4",
+            y1: "8",
+            x2: "12",
+            y2: "8"
+          }, null, -1)
+        ])])) : n.value ? (a(), l("svg", xt, [...k[2] || (k[2] = [
+          s("path", { d: "M3.5 8.5l3 3 6-6" }, null, -1)
+        ])])) : m("", !0)
+      ], 2),
+      c.$slots.default || e.label ? (a(), l("span", Mt, [
+        A(c.$slots, "default", {}, () => [
+          H(S(e.label), 1)
+        ], !0)
+      ])) : m("", !0)
+    ], 2));
+  }
+}), et = /* @__PURE__ */ M(Ot, [["__scopeId", "data-v-2da3772e"]]), Ye = {
   LEFT: "left",
   CENTER: "center",
   RIGHT: "right"
-}, Ue = { class: "ds-table" }, Ve = { class: "ds-table__wrapper" }, Fe = { key: 0 }, ze = ["colspan"], Ge = /* @__PURE__ */ $({
+}, ee = {
+  LEFT: "left",
+  RIGHT: "right"
+}, Pt = ["aria-busy"], Ft = { class: "ds-table__table" }, zt = { class: "ds-table__head" }, Vt = {
+  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({
   __name: "DsTable",
   props: {
+    // --- Declarative API (default): the table builds itself from columns + rows. ---
     columns: {
       type: Array,
-      required: !0
+      default: () => []
     },
     rows: {
       type: Array,
-      required: !0
+      default: () => []
     },
     emptyMessage: {
       type: String,
@@ -306,67 +465,259 @@ const W = {
     rowHeight: {
       type: [String, Number],
       default: null
-    }
+    },
+    // --- Compound API (opt-in): compose DsTableRow + DsTableCell in the default slot. ---
+    // When true, the table renders a shell (headers + a sticky thead) and the body
+    // comes from the default slot instead of `rows`. Coexists with the declarative API.
+    compound: { type: Boolean, default: !1 },
+    // Header labels for the compound shell. Plain strings, or the DsTableHeader
+    // object form when a header column needs to be pinned (mirror its `width` on
+    // the matching DsCell so the sticky columns line up).
+    headers: { type: Array, default: () => [] },
+    // Render a leading select-all checkbox column (compound mode).
+    selectable: { type: Boolean, default: !1 },
+    allSelected: { type: Boolean, default: !1 },
+    someSelected: { type: Boolean, default: !1 },
+    // Accessible name for the select-all checkbox (no visible text in a 52px column).
+    selectAllLabel: { type: String, default: "" },
+    // Fixed height enabling the sticky-header scroll (compound mode).
+    height: {
+      type: [String, Number],
+      default: null
+    },
+    // --- Loading state (both APIs) ---
+    // When true, the body is a single centered spinner row spanning every column,
+    // shown INSTEAD of the empty state or the rows/slot (loading wins over both).
+    loading: { type: Boolean, default: !1 },
+    // Accessible name for the loading spinner (the app owns i18n); when omitted it
+    // falls back to DsSpinner's own default. Overridable per row via the #loading slot.
+    loadingLabel: { type: String, default: "" }
   },
-  setup(e) {
-    const i = e, l = h(
-      () => i.rowHeight == null ? void 0 : {
-        "--ds-table-row-height": typeof i.rowHeight == "number" ? `${i.rowHeight}px` : i.rowHeight
+  emits: [ze],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = g(
+      () => Math.max(1, t.headers.length + (t.selectable ? 1 : 0))
+    ), c = g(
+      () => t.rowHeight == null ? void 0 : {
+        "--ds-table-row-height": typeof t.rowHeight == "number" ? `${t.rowHeight}px` : t.rowHeight
       }
+    ), k = g(
+      () => t.height == null ? void 0 : { height: typeof t.height == "number" ? `${t.height}px` : t.height }
     );
-    return (r, s) => (t(), a("div", Ue, [
-      d("div", Ve, [
-        d("table", {
-          class: m(["ds-table__table", { "has-row-height": e.rowHeight != null }]),
-          style: L(l.value)
+    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));
+      }
+      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;
+    });
+    function b(v) {
+      if (v.pinned)
+        return {
+          "ds-table__pin": !0,
+          [`ds-table__pin--${v.pinned}`]: !0,
+          "ds-table__pin--edge": d.value.has(v.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));
+      });
+      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;
+    });
+    function E(v, D) {
+      if (v.pinned)
+        return {
+          "ds-table__pin": !0,
+          [`ds-table__pin--${v.pinned}`]: !0,
+          "ds-table__pin--edge": C.value.has(D)
+        };
+    }
+    function N(v, D) {
+      const w = V.value[D], I = v.width ? { width: v.width } : void 0;
+      if (!(!w && !I))
+        return { ...I, ...w };
+    }
+    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);
+    }
+    function re(v) {
+      v == null || v.removeEventListener("scroll", ae), W == null || W.disconnect(), W = 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());
+      },
+      { immediate: !0 }
+    ), be(() => re(R.value)), te(
+      () => [t.columns.length, t.rows.length, t.headers.length, t.compound],
+      () => ue(ae)
+    ), (v, D) => 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)
+      }, [
+        s("table", Ft, [
+          s("thead", zt, [
+            s("tr", null, [
+              e.selectable ? (a(), l("th", Vt, [
+                j(_(et), {
+                  "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))
+            ])
+          ]),
+          s("tbody", null, [
+            e.loading ? (a(), l("tr", Ut, [
+              s("td", {
+                class: "ds-table__loading",
+                colspan: i.value,
+                "data-testid": "ds-table-loading"
+              }, [
+                A(v.$slots, "loading", {}, () => [
+                  j(_(fe), {
+                    label: e.loadingLabel || void 0
+                  }, null, 8, ["label"])
+                ], !0)
+              ], 8, Gt)
+            ])) : A(v.$slots, "default", { key: 1 }, void 0, !0)
+          ])
+        ])
+      ], 6)
+    ], 8, Pt)) : (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 }])
+      }, [
+        s("table", {
+          class: $(["ds-table__table", { "has-row-height": e.rowHeight != null }]),
+          style: F(c.value)
         }, [
-          d("thead", null, [
-            d("tr", null, [
-              (t(!0), a(A, null, V(e.columns, (n) => {
-                var o;
-                return t(), a("th", {
-                  key: n.key,
-                  class: m(`ds-table__th--${(o = n.align) != null ? o : S(le).LEFT}`),
-                  style: L(n.width ? { width: n.width } : void 0)
-                }, v(n.label), 7);
+          s("thead", null, [
+            s("tr", null, [
+              (a(!0), l(z, null, Y(e.columns, (w) => {
+                var I;
+                return a(), l("th", {
+                  key: w.key,
+                  class: $([
+                    `ds-table__th--${(I = w.align) != null ? I : _(Ye).LEFT}`,
+                    b(w)
+                  ]),
+                  style: F(h(w))
+                }, S(w.label), 7);
               }), 128))
             ])
           ]),
-          d("tbody", null, [
-            e.rows.length === 0 ? (t(), a("tr", Fe, [
-              d("td", {
+          s("tbody", null, [
+            e.loading ? (a(), l("tr", Wt, [
+              s("td", {
+                class: "ds-table__loading",
+                colspan: Math.max(1, e.columns.length),
+                "data-testid": "ds-table-loading"
+              }, [
+                A(v.$slots, "loading", {}, () => [
+                  j(_(fe), {
+                    label: e.loadingLabel || void 0
+                  }, null, 8, ["label"])
+                ], !0)
+              ], 8, Kt)
+            ])) : e.rows.length === 0 ? (a(), l("tr", Yt, [
+              s("td", {
                 class: "ds-table__empty",
-                colspan: e.columns.length,
+                colspan: Math.max(1, e.columns.length),
                 "data-testid": "ds-table-empty"
               }, [
-                I(r.$slots, "empty", {}, () => [
-                  O(v(e.emptyMessage), 1)
+                A(v.$slots, "empty", {}, () => [
+                  H(S(e.emptyMessage), 1)
                 ], !0)
-              ], 8, ze)
-            ])) : u("", !0),
-            (t(!0), a(A, null, V(e.rows, (n) => (t(), a("tr", {
-              key: n.id,
-              class: m({ "is-highlighted": n.id === e.highlightRowId }),
+              ], 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 }),
               "data-testid": "ds-table-row"
             }, [
-              (t(!0), a(A, null, V(e.columns, (o) => {
-                var c;
-                return t(), a("td", {
-                  key: o.key,
-                  class: m(`ds-table__td--${(c = o.align) != null ? c : S(le).LEFT}`)
+              (a(!0), l(z, null, Y(e.columns, (I) => {
+                var P;
+                return a(), l("td", {
+                  key: I.key,
+                  class: $([
+                    `ds-table__td--${(P = I.align) != null ? P : _(Ye).LEFT}`,
+                    b(I)
+                  ]),
+                  style: F(T(I)),
+                  title: e.rowHeight != null && !v.$slots[`cell-${I.key}`] && w[I.key] != null ? String(w[I.key]) : void 0
                 }, [
-                  I(r.$slots, `cell-${o.key}`, { row: n }, () => [
-                    O(v(n[o.key]), 1)
+                  A(v.$slots, `cell-${I.key}`, { row: w }, () => [
+                    H(S(w[I.key]), 1)
                   ], !0)
-                ], 2);
+                ], 14, jt);
               }), 128))
             ], 2))), 128))
           ])
         ], 6)
-      ])
-    ]));
+      ], 2)
+    ], 8, Ht));
   }
-}), aa = /* @__PURE__ */ T(Ge, [["__scopeId", "data-v-45342363"]]), Y = {
+}), Oi = /* @__PURE__ */ M(Xt, [["__scopeId", "data-v-7a5bb12f"]]), ce = {
   TEXT: "text",
   EMAIL: "email",
   PASSWORD: "password",
@@ -374,26 +725,30 @@ const W = {
   NUMBER: "number",
   SEARCH: "search",
   URL: "url"
-}, _e = {
+}, Zt = {
   SM: "sm",
   // 36px
   MD: "md"
   // 48px
-}, Pe = { class: "ds-input__wrap" }, pe = ["id", "type", "placeholder", "disabled", "name", "autocomplete", "aria-invalid", "aria-describedby"], He = {
+}, Qt = { class: "ds-input__wrap" }, Jt = {
   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 = {
+  key: 1,
   class: "ds-input__suffix"
-}, Ye = {
+}, aa = {
   key: 0,
   class: "material-icons ds-input__error-icon",
   "aria-hidden": "true"
-}, qe = ["aria-label", "aria-pressed"], We = {
+}, la = ["disabled", "aria-label", "aria-pressed"], ia = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Ke = ["id"], Xe = /* @__PURE__ */ $({
+}, na = ["id"], sa = /* @__PURE__ */ x({
   __name: "DsInput",
-  props: /* @__PURE__ */ U({
-    type: { type: String, default: Y.TEXT },
-    size: { type: String, default: _e.SM },
+  props: /* @__PURE__ */ Q({
+    type: { type: String, default: ce.TEXT },
+    size: { type: String, default: Zt.SM },
     placeholder: { type: String, default: "" },
     disabled: Boolean,
     error: Boolean,
@@ -403,82 +758,134 @@ const W = {
     id: { type: String, default: "" },
     autocomplete: { type: String, default: "" },
     // Accessible name for the password visibility toggle.
-    toggleLabel: { type: String, default: "" }
+    toggleLabel: { type: String, default: "" },
+    // Native number-input constraints — only meaningful for type="number", forwarded
+    // to the real <input>. String is allowed so `step="any"` is expressible.
+    min: { type: [Number, String], default: void 0 },
+    max: { type: [Number, String], default: void 0 },
+    step: { type: [Number, String], default: void 0 }
   }, {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ U([F, z], ["update:modelValue"]),
-  setup(e, { emit: i }) {
-    const l = Q(e, "modelValue"), r = e, s = i, n = oe(), o = R(!1), c = h(() => r.type === Y.PASSWORD), b = h(
-      () => c.value && o.value ? Y.TEXT : r.type
-    ), y = h(
-      () => !!n.suffix || r.error && r.showErrorIcon || c.value
+  emits: /* @__PURE__ */ Q([Se, ke, Me, Oe], ["update:modelValue"]),
+  setup(e, { expose: n, emit: t }) {
+    const o = de(e, "modelValue"), i = e, c = t, k = U();
+    function f(C) {
+      const E = C.relatedTarget, N = C.currentTarget;
+      E && (N != null && N.contains(E)) || c(Oe, C);
+    }
+    const y = Ee(), r = U(!1);
+    function d() {
+      i.disabled || (r.value = !r.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
     );
-    return (f, g) => (t(), a("div", {
-      class: m(["ds-input", [`ds-input--${e.size}`, { "is-error": e.error, "is-disabled": e.disabled }]])
+    return n({
+      focus: () => {
+        var C;
+        return (C = k.value) == null ? void 0 : C.focus();
+      },
+      focusAtEnd: async () => {
+        await ue();
+        const C = k.value;
+        if (!C) return;
+        C.focus();
+        const E = C.value.length;
+        try {
+          C.setSelectionRange(E, E);
+        } catch {
+        }
+      }
+    }), (C, E) => (a(), l("div", {
+      class: $(["ds-input", [
+        `ds-input--${e.size}`,
+        { "is-error": e.error, "is-disabled": e.disabled, "is-search": h.value }
+      ]]),
+      onFocusout: f
     }, [
-      d("div", Pe, [
-        Z(d("input", {
+      s("div", Qt, [
+        h.value ? (a(), l("i", Jt, "search")) : m("", !0),
+        Be(s("input", {
           id: e.id || void 0,
-          "onUpdate:modelValue": g[0] || (g[0] = (k) => l.value = k),
-          class: m(["ds-input__control", { "has-suffix": y.value }]),
-          type: b.value,
+          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,
           placeholder: e.placeholder,
+          min: e.min,
+          max: e.max,
+          step: e.step,
           disabled: e.disabled,
           name: e.name || void 0,
           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: g[1] || (g[1] = (k) => s(S(F), k)),
-          onBlur: g[2] || (g[2] = (k) => s(S(z), k))
-        }, null, 42, pe), [
-          [ye, l.value]
+          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]
         ]),
-        y.value ? (t(), a("div", He, [
-          I(f.$slots, "suffix", {}, void 0, !0),
-          e.error && e.showErrorIcon ? (t(), a("i", Ye, "warning")) : c.value ? (t(), a("button", {
+        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", {
             key: 1,
             type: "button",
             class: "ds-input__toggle",
+            disabled: e.disabled,
             "aria-label": e.toggleLabel || void 0,
-            "aria-pressed": o.value,
-            onClick: g[3] || (g[3] = (k) => o.value = !o.value)
+            "aria-pressed": r.value,
+            onClick: d
           }, [
-            d("i", We, v(o.value ? "visibility" : "visibility_off"), 1)
-          ], 8, qe)) : u("", !0)
-        ])) : u("", !0)
+            s("i", ia, S(r.value ? "visibility" : "visibility_off"), 1)
+          ], 8, la)) : m("", !0)
+        ])) : m("", !0)
       ]),
-      e.error && e.errorMessage ? (t(), a("p", {
+      e.error && e.errorMessage ? (a(), l("p", {
         key: 0,
         id: e.id ? `${e.id}-error` : void 0,
         class: "ds-input__error"
-      }, v(e.errorMessage), 9, Ke)) : u("", !0)
-    ], 2));
+      }, S(e.errorMessage), 9, na)) : m("", !0)
+    ], 34));
   }
-}), ia = /* @__PURE__ */ T(Xe, [["__scopeId", "data-v-fb36e573"]]), Qe = ["id", "placeholder", "rows", "disabled", "name", "aria-invalid", "aria-describedby"], Ze = ["id"], je = /* @__PURE__ */ $({
+}), Pi = /* @__PURE__ */ M(sa, [["__scopeId", "data-v-a7832472"]]), oa = {
+  VERTICAL: "vertical"
+}, da = ["id", "placeholder", "rows", "disabled", "name", "aria-invalid", "aria-describedby"], ra = ["id"], ca = /* @__PURE__ */ x({
+  inheritAttrs: !1,
   __name: "DsTextarea",
-  props: /* @__PURE__ */ U({
+  props: /* @__PURE__ */ Q({
     placeholder: { type: String, default: "" },
     rows: { type: Number, default: 4 },
     disabled: Boolean,
     error: Boolean,
     errorMessage: { type: String, default: "" },
     name: { type: String, default: "" },
-    id: { type: String, default: "" }
+    id: { type: String, default: "" },
+    // CSS resize behavior of the control (default vertical, mirrors the DS).
+    resize: {
+      type: String,
+      default: oa.VERTICAL
+    }
   }, {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ U([F, z], ["update:modelValue"]),
-  setup(e, { emit: i }) {
-    const l = Q(e, "modelValue"), r = i;
-    return (s, n) => (t(), a("div", {
-      class: m(["ds-textarea", { "is-error": e.error, "is-disabled": e.disabled }])
-    }, [
-      Z(d("textarea", {
+  emits: /* @__PURE__ */ Q([Se, ke], ["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)))
+    );
+    return (y, r) => (a(), l("div", he({
+      class: ["ds-textarea", [`ds-textarea--resize-${e.resize}`, { "is-error": e.error, "is-disabled": e.disabled }]]
+    }, k.value), [
+      Be(s("textarea", he(f.value, {
         id: e.id || void 0,
-        "onUpdate:modelValue": n[0] || (n[0] = (o) => l.value = o),
+        "onUpdate:modelValue": r[0] || (r[0] = (d) => t.value = d),
         class: "ds-textarea__control",
         placeholder: e.placeholder,
         rows: e.rows,
@@ -486,372 +893,459 @@ const W = {
         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: n[1] || (n[1] = (o) => r(S(F), o)),
-        onBlur: n[2] || (n[2] = (o) => r(S(z), o))
-      }, null, 40, Qe), [
-        [ve, l.value]
+        onFocus: r[1] || (r[1] = (d) => o(_(Se), d)),
+        onBlur: r[2] || (r[2] = (d) => o(_(ke), d))
+      }), null, 16, da), [
+        [rt, t.value]
       ]),
-      e.error && e.errorMessage ? (t(), a("p", {
+      e.error && e.errorMessage ? (a(), l("p", {
         key: 0,
         id: e.id ? `${e.id}-error` : void 0,
         class: "ds-textarea__error"
-      }, v(e.errorMessage), 9, Ze)) : u("", !0)
-    ], 2));
+      }, S(e.errorMessage), 9, ra)) : m("", !0)
+    ], 16));
   }
-}), la = /* @__PURE__ */ T(je, [["__scopeId", "data-v-54fc312a"]]), Je = ["disabled", "name"], et = {
-  key: 0,
-  class: "ds-checkbox__mark",
-  viewBox: "0 0 16 16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2.5"
-}, tt = {
-  key: 1,
-  class: "ds-checkbox__mark",
-  viewBox: "0 0 16 16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2.5"
-}, at = {
-  key: 0,
-  class: "ds-checkbox__label"
-}, it = /* @__PURE__ */ $({
-  __name: "DsCheckbox",
-  props: /* @__PURE__ */ U({
-    indeterminate: Boolean,
-    disabled: Boolean,
-    name: { type: String, default: "" },
-    // Label text (DS `label` prop); a default slot overrides it.
-    label: { type: String, default: "" }
-  }, {
-    modelValue: { type: Boolean, default: !1 },
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const i = Q(e, "modelValue"), l = e, r = R(null);
-    function s() {
-      r.value && (r.value.indeterminate = l.indeterminate);
-    }
-    return se(s), de(() => l.indeterminate, s), (n, o) => (t(), a("label", {
-      class: m(["ds-checkbox", { "is-disabled": e.disabled }])
-    }, [
-      Z(d("input", {
-        ref_key: "inputRef",
-        ref: r,
-        "onUpdate:modelValue": o[0] || (o[0] = (c) => i.value = c),
-        type: "checkbox",
-        class: "ds-checkbox__native",
-        disabled: e.disabled,
-        name: e.name || void 0
-      }, null, 8, Je), [
-        [be, i.value]
-      ]),
-      d("span", {
-        class: m(["ds-checkbox__box", { "is-active": i.value || e.indeterminate }]),
-        "aria-hidden": "true"
-      }, [
-        e.indeterminate ? (t(), a("svg", et, [...o[1] || (o[1] = [
-          d("line", {
-            x1: "4",
-            y1: "8",
-            x2: "12",
-            y2: "8"
-          }, null, -1)
-        ])])) : i.value ? (t(), a("svg", tt, [...o[2] || (o[2] = [
-          d("path", { d: "M3.5 8.5l3 3 6-6" }, null, -1)
-        ])])) : u("", !0)
-      ], 2),
-      n.$slots.default || e.label ? (t(), a("span", at, [
-        I(n.$slots, "default", {}, () => [
-          O(v(e.label), 1)
-        ], !0)
-      ])) : u("", !0)
-    ], 2));
-  }
-}), na = /* @__PURE__ */ T(it, [["__scopeId", "data-v-8ccdf847"]]), lt = {
+}), Fi = /* @__PURE__ */ M(ca, [["__scopeId", "data-v-745c01de"]]), ua = {
   SUCCESS: "success",
   INFO: "info",
   WARNING: "warning",
   ERROR: "error"
-}, nt = {
+}, fa = {
   LIGHT: "light",
   // tinted: family tint bg + mid border + shadow text
   DARK: "dark"
   // solid: family shadow bg + white text
-}, ot = {
+}, ba = {
   success: "check_circle",
   info: "info",
   warning: "warning",
   error: "error"
-}, st = {
+}, va = {
   key: 0,
   class: "material-icons ds-alert__icon",
   "aria-hidden": "true"
-}, dt = { class: "ds-alert__content" }, rt = {
+}, ya = { class: "ds-alert__content" }, ma = {
   key: 1,
   class: "ds-alert__body"
-}, ct = ["aria-label"], ut = /* @__PURE__ */ $({
+}, ha = ["aria-label"], ga = /* @__PURE__ */ x({
   __name: "DsAlert",
-  props: {
-    type: { type: String, default: lt.INFO },
-    effect: { type: String, default: nt.LIGHT },
+  props: /* @__PURE__ */ Q({
+    type: { type: String, default: ua.INFO },
+    effect: { type: String, default: fa.LIGHT },
     title: { type: String, default: "" },
     description: { type: String, default: "" },
     showIcon: Boolean,
     closable: Boolean,
     center: Boolean,
+    // Bold the title even without a body (DS: fontWeight = body || boldTitle ? 700 : 400).
+    boldTitle: Boolean,
     closeLabel: { type: String, default: "" }
-  },
-  emits: [C],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = oe(), n = R(!0), o = h(() => ot[l.type]), c = h(() => !!s.default || l.description.length > 0);
-    function b() {
-      n.value = !1, r(C);
+  }, {
+    visible: { type: Boolean, default: !0 },
+    visibleModifiers: {}
+  }),
+  emits: /* @__PURE__ */ Q([X], ["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);
     }
-    return (y, f) => n.value ? (t(), a("div", {
-      key: 0,
-      class: m(["ds-alert", [`ds-alert--${e.type}`, `ds-alert--${e.effect}`, { "is-center": e.center }]]),
-      role: "alert"
-    }, [
-      e.showIcon ? (t(), a("i", st, v(o.value), 1)) : u("", !0),
-      d("div", dt, [
-        e.title ? (t(), a("div", {
+    return (d, b) => (a(), G(Le, { name: "ds-alert-fade" }, {
+      default: ie(() => [
+        i.value ? (a(), l("div", {
           key: 0,
-          class: m(["ds-alert__title", { "has-body": c.value }])
-        }, v(e.title), 3)) : u("", !0),
-        c.value ? (t(), a("div", rt, [
-          I(y.$slots, "default", {}, () => [
-            O(v(e.description), 1)
-          ], !0)
-        ])) : u("", !0)
+          class: $(["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, [
+            y.value ? (a(), l("div", {
+              key: 0,
+              class: $(["ds-alert__title", { "has-body": f.value, "is-bold": f.value || e.boldTitle }])
+            }, [
+              A(d.$slots, "title", {}, () => [
+                H(S(e.title), 1)
+              ], !0)
+            ], 2)) : m("", !0),
+            f.value ? (a(), l("div", ma, [
+              A(d.$slots, "default", {}, () => [
+                H(S(e.description), 1)
+              ], !0)
+            ])) : m("", !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] = [
+            s("i", {
+              class: "material-icons",
+              "aria-hidden": "true"
+            }, "close", -1)
+          ])], 8, ha)) : m("", !0)
+        ], 2)) : m("", !0)
       ]),
-      e.closable ? (t(), a("button", {
-        key: 1,
-        type: "button",
-        class: "ds-alert__close",
-        "aria-label": e.closeLabel || void 0,
-        onClick: b
-      }, [...f[0] || (f[0] = [
-        d("i", {
-          class: "material-icons",
-          "aria-hidden": "true"
-        }, "close", -1)
-      ])], 8, ct)) : u("", !0)
-    ], 2)) : u("", !0);
+      _: 3
+    }));
   }
-}), oa = /* @__PURE__ */ T(ut, [["__scopeId", "data-v-03bbe700"]]), ft = {
+}), zi = /* @__PURE__ */ M(ga, [["__scopeId", "data-v-9ced26d6"]]), Sa = {
   SUCCESS: "success",
   INFO: "info",
   WARNING: "warning",
   ERROR: "error"
-}, yt = {
+}, ka = {
   TOP_LEFT: "top-left",
   TOP_RIGHT: "top-right",
   BOTTOM_LEFT: "bottom-left",
   BOTTOM_RIGHT: "bottom-right"
-}, vt = {
+}, pa = {
   success: "check_circle",
   info: "mode_edit",
   warning: "warning",
   error: "error"
-}, bt = {
+}, qe = {
+  BLANK: "_blank",
+  SELF: "_self",
+  PARENT: "_parent",
+  TOP: "_top"
+}, $a = {
   class: "material-icons ds-notification__icon",
   "aria-hidden": "true"
-}, mt = { class: "ds-notification__content" }, gt = {
+}, Ta = { class: "ds-notification__content" }, Ea = {
   key: 0,
   class: "ds-notification__title"
-}, ht = {
+}, La = {
   key: 1,
   class: "ds-notification__desc"
-}, St = ["href"], kt = ["aria-label"], $t = /* @__PURE__ */ $({
+}, wa = ["href", "target", "rel"], Ia = ["aria-label"], Ca = /* @__PURE__ */ x({
   __name: "DsNotification",
   props: {
-    type: { type: String, default: ft.INFO },
+    type: { type: String, default: Sa.INFO },
     position: {
       type: String,
-      default: yt.BOTTOM_LEFT
+      default: ka.BOTTOM_LEFT
     },
     title: { type: String, default: "" },
     description: { type: String, default: "" },
     linkTitle: { type: String, default: "" },
     link: { type: String, default: "" },
+    // `target` del <a> del link. Default `_blank` para no romper el comportamiento
+    // histórico. Con `_blank` se emite `rel="noopener noreferrer"` (seguridad). Para
+    // navegación in-app (SPA) escuchá `navigate` y enrutá con el router de la app.
+    linkTarget: {
+      type: String,
+      default: qe.BLANK
+    },
     showClose: { type: Boolean, default: !0 },
+    // Accessible name for the icon-only close button — provide it whenever
+    // `showClose` is on, or the button has no name for screen readers (as with any
+    // icon-only control, cf. DsButton circle/square requiring `ariaLabel`). The
+    // library never hardcodes copy; the consuming app owns i18n.
     closeLabel: { type: String, default: "" },
     // Auto-dismiss delay in ms (DS default 3500). 0 disables it. The timer pauses
     // while the pointer is over the card and resumes with the remaining time.
     duration: { type: Number, default: 3500 }
   },
-  emits: [C],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = R(!0), n = h(() => vt[l.type]);
-    let o, c = 0, b = l.duration;
-    function y() {
-      o && (clearTimeout(o), o = void 0);
+  emits: [X, We],
+  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
+    );
+    let f, y = 0, r = t.duration;
+    function d() {
+      f && (clearTimeout(f), f = void 0);
     }
-    function f(x) {
-      y(), !(l.duration <= 0 || !s.value) && (c = Date.now(), o = setTimeout(N, x));
+    function b(C) {
+      d(), !(t.duration <= 0 || !i.value) && (y = Date.now(), f = setTimeout(p, C));
     }
-    function g() {
-      o && (b -= Date.now() - c, y());
+    function h() {
+      f && (r -= Date.now() - y, d());
     }
-    function k() {
-      f(b > 0 ? b : l.duration);
+    function T() {
+      b(r > 0 ? r : t.duration);
     }
-    function N() {
-      y(), s.value = !1, r(C);
+    function p() {
+      d(), i.value = !1, o(X);
     }
-    return se(() => f(l.duration)), j(y), (x, M) => (t(), D(re, { to: "body" }, [
-      p(ce, {
+    function V(C) {
+      o(We, C);
+    }
+    return Qe(() => b(t.duration)), be(d), (C, E) => (a(), G(Je, { to: "body" }, [
+      j(Le, {
         name: "ds-notification",
         appear: ""
       }, {
-        default: J(() => [
-          s.value ? (t(), a("div", {
+        default: ie(() => [
+          i.value ? (a(), l("div", {
             key: 0,
-            class: m(["ds-notification", `ds-notification--${e.position}`])
+            class: $(["ds-notification", `ds-notification--${e.position}`])
           }, [
-            d("div", {
-              class: m(["ds-notification__card", `ds-notification__card--${e.type}`]),
+            s("div", {
+              class: $(["ds-notification__card", `ds-notification__card--${e.type}`]),
               role: "alert",
-              onMouseenter: g,
-              onMouseleave: k
+              onMouseenter: h,
+              onMouseleave: T
             }, [
-              d("i", bt, v(n.value), 1),
-              d("div", mt, [
-                e.title ? (t(), a("span", gt, v(e.title), 1)) : u("", !0),
-                e.description ? (t(), a("p", ht, v(e.description), 1)) : u("", !0),
-                e.linkTitle ? (t(), a("a", {
+              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),
+                e.linkTitle ? (a(), l("a", {
                   key: 2,
                   class: "ds-notification__link",
                   href: e.link || void 0,
-                  target: "_blank",
-                  rel: "noreferrer"
-                }, v(e.linkTitle), 9, St)) : u("", !0)
+                  target: e.linkTarget,
+                  rel: k.value,
+                  onClick: V
+                }, S(e.linkTitle), 9, wa)) : m("", !0)
               ]),
-              e.showClose ? (t(), a("button", {
+              e.showClose ? (a(), l("button", {
                 key: 0,
                 type: "button",
                 class: "ds-notification__close",
                 "aria-label": e.closeLabel || void 0,
-                onClick: N
-              }, [...M[0] || (M[0] = [
-                d("i", {
+                onClick: p
+              }, [...E[0] || (E[0] = [
+                s("i", {
                   class: "material-icons",
                   "aria-hidden": "true"
                 }, "close", -1)
-              ])], 8, kt)) : u("", !0)
+              ])], 8, Ia)) : m("", !0)
             ], 34)
-          ], 2)) : u("", !0)
+          ], 2)) : m("", !0)
         ]),
         _: 1
       })
     ]));
   }
-}), sa = /* @__PURE__ */ T($t, [["__scopeId", "data-v-dff620c6"]]), Tt = ["aria-label"], It = {
+}), Vi = /* @__PURE__ */ M(Ca, [["__scopeId", "data-v-f1d76da5"]]), _a = ["aria-modal", "aria-labelledby", "aria-label"], Da = {
   key: 0,
   class: "ds-modal__header"
-}, Ct = { class: "ds-modal__title" }, Et = { class: "ds-modal__body" }, wt = {
+}, Aa = ["id"], Na = { class: "ds-modal__body" }, Ra = {
   key: 1,
   class: "ds-modal__footer"
-}, Lt = /* @__PURE__ */ $({
+}, Ba = /* @__PURE__ */ x({
   __name: "DsModal",
   props: {
     open: Boolean,
     title: { type: String, default: "" },
     showClose: { type: Boolean, default: !0 },
     width: { type: String, default: "440px" },
+    // Explicit dialog height (any CSS length). Unset = content height.
+    height: { type: String, default: "" },
+    // Top offset of the dialog inside the fixed backdrop.
+    top: { type: String, default: "15vh" },
+    // Center the body text.
+    center: Boolean,
+    // false = render in-flow (no backdrop / portal / scroll-lock) for specimen cards.
+    fixed: { type: Boolean, default: !0 },
     closeOnBackdrop: { type: Boolean, default: !0 },
-    closeLabel: { type: String, default: "" }
+    // Symmetric with closeOnBackdrop: a non-dismissable flow (closeOnBackdrop=false)
+    // can also opt out of Escape-to-close. Default true (Escape closes).
+    closeOnEscape: { type: Boolean, default: !0 },
+    // Accessible name for the icon-only close button; English default (app owns i18n),
+    // matching DsDataCard so the control is never unnamed.
+    closeLabel: { type: String, default: "Close" }
   },
-  emits: [C],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = R(null);
-    let n = null;
-    function o() {
-      l.closeOnBackdrop && r(C);
+  emits: [X],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = U(null);
+    let c = null;
+    const k = xe(), f = g(() => ({
+      width: t.width,
+      ...t.height ? { height: t.height } : {}
+    }));
+    function y() {
+      t.fixed && t.closeOnBackdrop && o(X);
     }
-    function c() {
-      return s.value ? Array.from(s.value.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(
-        (f) => f.offsetParent !== null
+    function r() {
+      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
       ) : [];
     }
-    function b(y) {
-      var N;
-      if (y.key === "Escape") {
-        r(C);
+    function d(T) {
+      var E;
+      if (T.key === "Escape") {
+        t.closeOnEscape && o(X);
         return;
       }
-      if (y.key !== "Tab") return;
-      const f = c();
-      if (f.length === 0) {
-        y.preventDefault(), (N = s.value) == null || N.focus();
+      if (T.key !== "Tab") return;
+      const p = r();
+      if (p.length === 0) {
+        T.preventDefault(), (E = i.value) == null || E.focus();
         return;
       }
-      const g = f[0], k = f[f.length - 1];
-      y.shiftKey && document.activeElement === g ? (y.preventDefault(), k.focus()) : !y.shiftKey && document.activeElement === k && (y.preventDefault(), g.focus());
-    }
-    return de(
-      () => l.open,
-      (y) => {
-        var f;
-        typeof document != "undefined" && (y ? (n = document.activeElement, document.addEventListener("keydown", b), document.body.style.overflow = "hidden", me(() => {
-          var g, k;
-          return (k = (g = c()[0]) != null ? g : s.value) == null ? void 0 : k.focus();
-        })) : (document.removeEventListener("keydown", b), document.body.style.overflow = "", (f = n == null ? void 0 : n.focus) == null || f.call(n)));
+      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());
+    }
+    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 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));
+    }
+    return te(
+      () => t.open && t.fixed,
+      (T, p) => {
+        typeof document != "undefined" && (T ? b() : p && h());
       },
       { immediate: !0 }
-    ), j(() => {
-      typeof document != "undefined" && (document.removeEventListener("keydown", b), document.body.style.overflow = "");
-    }), (y, f) => (t(), D(re, { to: "body" }, [
-      p(ce, { name: "ds-modal" }, {
-        default: J(() => [
-          e.open ? (t(), a("div", {
+    ), be(() => {
+      typeof document != "undefined" && h(!1);
+    }), (T, p) => (a(), G(Je, {
+      to: "body",
+      disabled: !e.fixed
+    }, [
+      j(Le, { name: "ds-modal" }, {
+        default: ie(() => [
+          e.open ? (a(), l("div", {
             key: 0,
-            class: "ds-modal",
-            onClick: o
+            class: $(["ds-modal", { "is-fixed": e.fixed }]),
+            style: F(e.fixed ? { paddingTop: e.top } : void 0),
+            onClick: y
           }, [
-            d("div", {
+            s("div", {
               ref_key: "dialogRef",
-              ref: s,
-              class: "ds-modal__dialog",
+              ref: i,
+              class: $(["ds-modal__dialog", { "is-center": e.center }]),
               role: "dialog",
-              "aria-modal": "true",
-              "aria-label": e.title || "dialog",
+              "aria-modal": e.fixed ? "true" : "false",
+              "aria-labelledby": e.title ? _(k) : void 0,
+              "aria-label": e.title ? void 0 : "dialog",
               tabindex: "-1",
-              style: L({ width: e.width }),
-              onClick: f[1] || (f[1] = ue(() => {
+              style: F(f.value),
+              onClick: p[1] || (p[1] = ve(() => {
               }, ["stop"]))
             }, [
-              e.title || e.showClose ? (t(), a("div", It, [
-                d("span", Ct, v(e.title), 1),
-                e.showClose ? (t(), D(S(K), {
+              e.title || e.showClose ? (a(), l("div", Da, [
+                s("span", {
+                  id: _(k),
+                  class: "ds-modal__title"
+                }, S(e.title), 9, Aa),
+                e.showClose ? (a(), G(_(oe), {
                   key: 0,
                   variant: "tertiary",
                   circle: "",
                   "left-icon": "close",
                   "aria-label": e.closeLabel || void 0,
-                  onClick: f[0] || (f[0] = (g) => r(S(C)))
-                }, null, 8, ["aria-label"])) : u("", !0)
-              ])) : u("", !0),
-              d("div", Et, [
-                I(y.$slots, "default", {}, void 0, !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)
               ]),
-              y.$slots.footer ? (t(), a("div", wt, [
-                I(y.$slots, "footer", {}, void 0, !0)
-              ])) : u("", !0)
-            ], 12, Tt)
-          ])) : u("", !0)
+              T.$slots.footer ? (a(), l("div", Ra, [
+                A(T.$slots, "footer", {}, void 0, !0)
+              ])) : m("", !0)
+            ], 14, _a)
+          ], 6)) : m("", !0)
         ]),
         _: 3
       })
-    ]));
+    ], 8, ["disabled"]));
   }
-}), da = /* @__PURE__ */ T(Lt, [["__scopeId", "data-v-19866588"]]), q = {
+}), Ui = /* @__PURE__ */ M(Ba, [["__scopeId", "data-v-a759ae72"]]), xa = {
+  TOP: "top",
+  BOTTOM: "bottom",
+  LEFT: "left",
+  RIGHT: "right"
+}, Ma = ["id"], Oa = /* @__PURE__ */ x({
+  __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
+    },
+    // Hover delay before showing, ms. Focus always shows immediately (no delay).
+    delay: { type: Number, default: 300 },
+    // Wrap a full-width/block trigger (DsInput/DsTextarea) — the wrapper becomes
+    // `display: block` instead of the default inline-flex, so it doesn't squash the control.
+    block: { type: Boolean, default: !1 },
+    // Force the tooltip off regardless of content/slot. Lets a consumer show it only
+    // under a condition (e.g. only-if-truncated) without emptying the content prop —
+    // the #content slot is always truthy, so it's the only way to suppress that path.
+    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(
+      () => n.disabled,
+      (R) => {
+        R && N();
+      }
+    );
+    let k = !1, f = !1, y = null, r = null, d = null;
+    function b() {
+      y !== null && (clearTimeout(y), y = null);
+    }
+    function h(R) {
+      R && (r && r !== R && T(), r !== R && (r = R, d = R.getAttribute("aria-describedby"), R.setAttribute(
+        "aria-describedby",
+        d ? `${d} ${o}` : o
+      )));
+    }
+    function T() {
+      r && (d !== null ? r.setAttribute("aria-describedby", d) : r.removeAttribute("aria-describedby"), r = null, d = null);
+    }
+    function p() {
+      c.value && (k = !0, b(), y = setTimeout(() => {
+        i.value = !0;
+      }, n.delay));
+    }
+    function V() {
+      k = !1, b(), f || N();
+    }
+    function C(R) {
+      c.value && (f = !0, b(), i.value = !0, h(R.target));
+    }
+    function E(R) {
+      const q = R.relatedTarget, J = R.currentTarget;
+      q && (J != null && J.contains(q)) || (f = !1, k || N());
+    }
+    function N() {
+      b(), i.value = !1, T();
+    }
+    return be(() => {
+      b(), T();
+    }), (R, q) => (a(), l("div", {
+      class: $(["ds-tooltip", { "ds-tooltip--block": e.block }]),
+      onMouseenter: p,
+      onMouseleave: V,
+      onFocusin: C,
+      onFocusout: E,
+      onKeydown: ct(N, ["esc"])
+    }, [
+      A(R.$slots, "default", {}, void 0, !0),
+      j(Le, { 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"
+          }, [
+            A(R.$slots, "content", {}, () => [
+              H(S(e.content), 1)
+            ], !0)
+          ], 10, Ma)) : m("", !0)
+        ]),
+        _: 3
+      })
+    ], 34));
+  }
+}), Gi = /* @__PURE__ */ M(Oa, [["__scopeId", "data-v-26c35ba5"]]), Ne = {
   VERIFIED: "verified",
   UNVERIFIED: "unverified",
   NEW: "new"
-}, Dt = ["aria-label", "title"], Nt = /* @__PURE__ */ $({
+}, Pa = ["aria-label", "title"], Fa = /* @__PURE__ */ x({
   __name: "DsVerificationIcon",
   props: {
     // true = verified · false = not verified · null/undefined = newly found.
@@ -876,38 +1370,38 @@ const W = {
     }
   },
   setup(e) {
-    const i = e, l = h(() => i.verified === null || i.verified === void 0 ? {
-      state: q.NEW,
+    const n = e, t = g(() => n.verified === null || n.verified === void 0 ? {
+      state: Ne.NEW,
       icon: "new_releases",
       label: "Newly found"
-    } : i.verified ? {
-      state: q.VERIFIED,
+    } : n.verified ? {
+      state: Ne.VERIFIED,
       icon: "verified",
       label: "Verified"
     } : {
-      state: q.UNVERIFIED,
-      icon: i.isContactData ? "dangerous" : "error",
+      state: Ne.UNVERIFIED,
+      icon: n.isContactData ? "dangerous" : "error",
       label: "Not verified"
     });
-    return (r, s) => (t(), a("i", {
-      class: m(["material-icons ds-verification-icon", [
-        `ds-verification-icon--${l.value.state}`,
+    return (o, i) => (a(), l("i", {
+      class: $(["material-icons ds-verification-icon", [
+        `ds-verification-icon--${t.value.state}`,
         { "ds-verification-icon--email": e.isContactData }
       ]]),
-      style: L({ fontSize: `${e.size}px` }),
+      style: F({ fontSize: `${e.size}px` }),
       role: "img",
-      "aria-label": e.label || l.value.label,
-      title: e.label || l.value.label
+      "aria-label": e.label || t.value.label,
+      title: e.label || t.value.label
     }, [
-      I(r.$slots, "default", {}, () => [
-        O(v(l.value.icon), 1)
+      A(o.$slots, "default", {}, () => [
+        H(S(t.value.icon), 1)
       ], !0)
-    ], 14, Dt));
+    ], 14, Pa));
   }
-}), Rt = /* @__PURE__ */ T(Nt, [["__scopeId", "data-v-0fd84040"]]), Bt = ["title"], At = { class: "ds-contact-value__marquee" }, Ot = { class: "ds-contact-value__actions" }, xt = ["aria-label", "title"], Mt = {
+}), 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 = {
   class: "material-icons",
   "aria-hidden": "true"
-}, Ut = ["aria-label", "aria-pressed", "title"], Vt = ["aria-label", "aria-pressed", "title"], Ft = /* @__PURE__ */ $({
+}, Ya = ["aria-label", "aria-pressed", "title"], qa = ["aria-label", "aria-pressed", "title"], ja = /* @__PURE__ */ x({
   __name: "DsContactValue",
   props: {
     value: { type: String, required: !0 },
@@ -917,117 +1411,150 @@ const W = {
     isContactData: { type: Boolean, default: !1 },
     showRate: { type: Boolean, default: !1 },
     correct: { type: Boolean, default: null },
+    // Locks the value: on hover a static lock glyph shows instead of copy/rate.
+    hideValue: { type: Boolean, default: !1 },
     // User-facing labels (the app owns i18n); English DS defaults.
     copyLabel: { type: String, default: "Copy" },
     copiedLabel: { type: String, default: "Copied!" },
     correctLabel: { type: String, default: "Correct" },
-    incorrectLabel: { type: String, default: "Incorrect" }
+    incorrectLabel: { type: String, default: "Incorrect" },
+    // Accessible name for the lock glyph (empty → decorative/aria-hidden).
+    hideValueLabel: { type: String, default: "" }
   },
-  emits: [G, _, P],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = R(!1);
-    let n;
-    function o() {
-      typeof navigator != "undefined" && navigator.clipboard && navigator.clipboard.writeText(l.value).catch(() => {
-      }), s.value = !0, clearTimeout(n), n = setTimeout(() => {
-        s.value = !1;
-      }, 1200), r(G, l.value);
+  emits: [pe, $e, Te],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = U(!1);
+    let c;
+    function k() {
+      typeof navigator != "undefined" && navigator.clipboard && navigator.clipboard.writeText(t.value).catch(() => {
+      }), i.value = !0, clearTimeout(c), c = setTimeout(() => {
+        i.value = !1;
+      }, 1200), o(pe, t.value);
     }
-    function c() {
-      r(_);
+    function f() {
+      o($e);
     }
-    function b() {
-      r(P);
+    function y() {
+      o(Te);
     }
-    return j(() => clearTimeout(n)), (y, f) => (t(), a("div", {
-      class: m(["ds-contact-value", { "ds-contact-value--main": e.main }])
+    return be(() => clearTimeout(c)), (r, d) => (a(), l("div", {
+      class: $(["ds-contact-value", { "ds-contact-value--main": e.main }])
     }, [
-      p(S(Rt), {
+      j(_(za), {
         verified: e.verified,
         "is-contact-data": e.isContactData
       }, null, 8, ["verified", "is-contact-data"]),
-      d("span", {
+      s("span", {
         class: "ds-contact-value__value",
         title: e.value
-      }, v(e.value), 9, Bt),
-      d("span", At, [
-        e.valueType ? (t(), D(S(Ae), {
+      }, S(e.value), 9, Va),
+      s("span", Ua, [
+        e.valueType ? (a(), G(_(_t), {
           key: 0,
           class: "ds-contact-value__badge",
-          tone: e.main ? S(X).ACCENT : S(X).GREY,
-          "aria-hidden": "true"
+          tone: e.main ? _(Re).ACCENT : _(Re).GREY,
+          title: e.valueType
         }, {
-          default: J(() => [
-            O(v(e.valueType), 1)
+          default: ie(() => [
+            H(S(e.valueType), 1)
           ]),
           _: 1
-        }, 8, ["tone"])) : u("", !0),
-        d("span", Ot, [
-          d("button", {
-            type: "button",
-            class: m(["ds-contact-value__action", { "is-copied": s.value }]),
-            "aria-label": s.value ? e.copiedLabel : e.copyLabel,
-            title: s.value ? e.copiedLabel : e.copyLabel,
-            onClick: o
-          }, [
-            d("i", Mt, v(s.value ? "check" : "content_copy"), 1)
-          ], 10, xt),
-          e.showRate ? (t(), a(A, { key: 0 }, [
-            d("button", {
-              type: "button",
-              class: "ds-contact-value__action",
-              "aria-label": e.correctLabel,
-              "aria-pressed": e.correct === !0,
-              title: e.correctLabel,
-              onClick: c
-            }, [
-              d("i", {
-                class: m(e.correct === !0 ? "material-icons" : "material-icons-outlined"),
-                "aria-hidden": "true"
-              }, "thumb_up", 2)
-            ], 8, Ut),
-            d("button", {
+        }, 8, ["tone", "title"])) : m("", !0),
+        s("span", Ga, [
+          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 }, [
+            s("button", {
               type: "button",
-              class: "ds-contact-value__action",
-              "aria-label": e.incorrectLabel,
-              "aria-pressed": e.correct === !1,
-              title: e.incorrectLabel,
-              onClick: b
+              class: $(["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
             }, [
-              d("i", {
-                class: m(e.correct === !1 ? "material-icons" : "material-icons-outlined"),
-                "aria-hidden": "true"
-              }, "thumb_down", 2)
-            ], 8, Vt)
-          ], 64)) : u("", !0)
+              s("i", Ka, S(i.value ? "check" : "content_copy"), 1)
+            ], 10, Wa),
+            e.showRate ? (a(), l(z, { key: 0 }, [
+              s("button", {
+                type: "button",
+                class: "ds-contact-value__action",
+                "aria-label": e.correctLabel,
+                "aria-pressed": e.correct === !0,
+                title: e.correctLabel,
+                onClick: f
+              }, [
+                s("i", {
+                  class: $(e.correct === !0 ? "material-icons" : "material-icons-outlined"),
+                  "aria-hidden": "true"
+                }, "thumb_up", 2)
+              ], 8, Ya),
+              s("button", {
+                type: "button",
+                class: "ds-contact-value__action",
+                "aria-label": e.incorrectLabel,
+                "aria-pressed": e.correct === !1,
+                title: e.incorrectLabel,
+                onClick: y
+              }, [
+                s("i", {
+                  class: $(e.correct === !1 ? "material-icons" : "material-icons-outlined"),
+                  "aria-hidden": "true"
+                }, "thumb_down", 2)
+              ], 8, qa)
+            ], 64)) : m("", !0)
+          ], 64))
         ])
       ])
     ], 2));
   }
-}), ne = /* @__PURE__ */ T(Ft, [["__scopeId", "data-v-75a78ae2"]]), zt = ["aria-label"], Gt = { class: "ds-data-card__heading" }, _t = {
+}), je = /* @__PURE__ */ M(ja, [["__scopeId", "data-v-4f2d5d85"]]), Xa = ["aria-label", "aria-busy"], Za = { class: "ds-data-card__heading" }, Qa = {
   class: "material-icons ds-data-card__icon",
   "aria-hidden": "true"
-}, Pt = { class: "ds-data-card__title" }, pt = ["aria-label"], Ht = {
+}, Ja = { class: "ds-data-card__title" }, el = ["aria-label"], tl = {
   key: 0,
   class: "ds-data-card__body"
-}, Yt = {
+}, al = {
   key: 0,
+  class: "ds-data-card__loading"
+}, ll = {
+  key: 1,
+  class: "ds-data-card__locked"
+}, il = { class: "ds-data-card__state-text" }, nl = { class: "ds-data-card__state-title" }, sl = {
+  key: 2,
   class: "ds-data-card__empty"
-}, qt = {
-  class: "material-icons-outlined ds-data-card__empty-icon",
+}, ol = { class: "ds-data-card__state-badge" }, dl = {
+  class: "material-icons ds-data-card__state-icon",
   "aria-hidden": "true"
-}, Wt = { key: 0 }, Kt = {
+}, rl = { class: "ds-data-card__state-text" }, cl = { class: "ds-data-card__state-title" }, ul = {
+  key: 0,
+  class: "ds-data-card__state-subtitle"
+}, fl = { key: 0 }, bl = {
   key: 0,
   class: "ds-data-card__section"
-}, Xt = { key: 1 }, Qt = {
+}, vl = { key: 1 }, yl = {
   key: 0,
   class: "ds-data-card__section"
-}, Zt = { class: "ds-data-card__more" }, jt = /* @__PURE__ */ $({
+}, ml = { class: "ds-data-card__more" }, hl = /* @__PURE__ */ x({
   __name: "DsDataCard",
   props: {
     title: { type: String, required: !0 },
     // Material Icon name for the header (e.g. "email", "call").
     icon: { type: String, default: "email" },
+    // Loading state: swaps the body for a centered spinner (wins over empty/data).
+    // Override the spinner (e.g. an i18n'd label) via the #loading slot.
+    loading: { type: Boolean, default: !1 },
+    // Accessible name for the loading spinner (the app owns i18n); when omitted it
+    // falls back to DsSpinner's own default. Overridable via the #loading slot.
+    loadingLabel: { type: String, default: "" },
+    // Locked/upsell state: the data is gated (plan/permission), so the body shows a
+    // banner instead of the content (wins over empty/data; loading still wins over
+    // it). Presentational only — the app decides when to gate and supplies the CTA
+    // via the #locked slot. Additive/opt-in. NB: the header actions still render
+    // while locked — turn them off yourself (showSort / showEdit) when gating.
+    locked: { type: Boolean, default: !1 },
     mostLikely: { type: Object, default: null },
     more: { type: Array, default: () => [] },
     collapsible: { type: Boolean, default: !1 },
@@ -1039,164 +1566,1224 @@ const W = {
     // User-facing labels (the app owns i18n); English DS defaults.
     editLabel: { type: String, default: "Edit" },
     emptyLabel: { type: String, default: "No data found" },
+    // Optional muted line under the empty title (DS DsDataCard `emptySubtitle`),
+    // e.g. "We couldn't find any phone numbers for this contact."
+    emptySubtitle: { type: String, default: "" },
+    // Fallback text for the locked banner when no #locked slot is provided.
+    lockedLabel: { type: String, default: "Locked" },
     mostLikelyLabel: { type: String, default: "MOST LIKELY" },
     moreLabel: { type: String, default: "MORE" },
     sortLabel: { type: String, default: "Sort" },
     toggleLabel: { type: String, default: "Toggle" },
     closeLabel: { type: String, default: "Close" }
   },
-  emits: [G, te, ae, C, _, P],
-  setup(e, { emit: i }) {
-    const l = e, r = i, s = R(!1), n = h(() => l.more.length + (l.mostLikely ? 1 : 0)), o = h(() => n.value > 3), c = h(() => n.value === 0), b = h(() => l.collapsible && s.value);
-    function y() {
-      s.value = !s.value;
+  emits: [pe, Pe, Fe, X, $e, Te],
+  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() {
+      i.value = !i.value;
     }
-    function f(B) {
-      r(G, B);
+    function d(C) {
+      o(pe, C);
     }
-    function g() {
-      r(te);
+    function b() {
+      o(Pe);
     }
-    function k() {
-      r(ae);
+    function h() {
+      o(Fe);
     }
-    function N() {
-      r(C);
+    function T() {
+      o(X);
     }
-    function x(B) {
-      r(_, B);
+    function p(C) {
+      o($e, C);
     }
-    function M(B) {
-      r(P, B);
+    function V(C) {
+      o(Te, C);
     }
-    return (B, E) => (t(), a("section", {
+    return (C, E) => (a(), l("section", {
       class: "ds-data-card",
-      "aria-label": e.title
+      "aria-label": e.title,
+      "aria-busy": e.loading ? "true" : void 0
     }, [
-      d("div", {
-        class: m(["ds-data-card__header", { "is-collapsed": b.value, "is-collapsible": e.collapsible }]),
-        onClick: E[1] || (E[1] = (w) => e.collapsible && y())
+      s("div", {
+        class: $(["ds-data-card__header", { "is-collapsed": y.value, "is-collapsible": e.collapsible }]),
+        onClick: E[1] || (E[1] = (N) => e.collapsible && r())
       }, [
-        d("div", Gt, [
-          d("i", _t, v(e.icon), 1),
-          d("span", Pt, v(e.title), 1)
+        s("div", Za, [
+          s("i", Qa, S(e.icon), 1),
+          s("span", Ja, S(e.title), 1)
         ]),
-        d("div", {
+        s("div", {
           class: "ds-data-card__actions",
-          onClick: E[0] || (E[0] = ue(() => {
+          onClick: E[0] || (E[0] = ve(() => {
           }, ["stop"]))
         }, [
-          !b.value && e.showEdit ? (t(), a("button", {
+          !y.value && e.showEdit ? (a(), l("button", {
             key: 0,
             type: "button",
             class: "ds-data-card__edit",
-            onClick: k
-          }, v(e.editLabel), 1)) : u("", !0),
-          !b.value && e.showSort ? (t(), D(S(K), {
+            onClick: h
+          }, S(e.editLabel), 1)) : m("", !0),
+          !y.value && e.showSort ? (a(), G(_(oe), {
             key: 1,
             variant: "tertiary",
             size: "medium",
             circle: "",
             "left-icon": "swap_vert",
             "aria-label": e.sortLabel,
-            onClick: g
-          }, null, 8, ["aria-label"])) : u("", !0),
-          e.collapsible ? (t(), D(S(K), {
+            onClick: b
+          }, null, 8, ["aria-label"])) : m("", !0),
+          e.collapsible ? (a(), G(_(oe), {
             key: 2,
             variant: "tertiary",
             size: "medium",
             circle: "",
-            "left-icon": s.value ? "keyboard_arrow_down" : "keyboard_arrow_up",
+            "left-icon": i.value ? "keyboard_arrow_down" : "keyboard_arrow_up",
             "aria-label": e.toggleLabel,
-            onClick: y
-          }, null, 8, ["left-icon", "aria-label"])) : u("", !0),
-          e.showClose ? (t(), a("button", {
+            onClick: r
+          }, null, 8, ["left-icon", "aria-label"])) : m("", !0),
+          e.showClose ? (a(), l("button", {
             key: 3,
             type: "button",
             class: "ds-data-card__close",
             "aria-label": e.closeLabel,
-            onClick: N
+            onClick: T
           }, [...E[4] || (E[4] = [
-            d("i", {
+            s("i", {
               class: "material-icons",
               "aria-hidden": "true"
             }, "close", -1)
-          ])], 8, pt)) : u("", !0)
+          ])], 8, el)) : m("", !0)
         ])
       ], 2),
-      b.value ? u("", !0) : (t(), a("div", Ht, [
-        c.value ? (t(), a("div", Yt, [
-          d("i", qt, v(e.icon), 1),
-          d("span", null, v(e.emptyLabel), 1)
-        ])) : (t(), a(A, { key: 1 }, [
-          e.mostLikely ? (t(), a("div", Wt, [
-            o.value ? (t(), a("div", Kt, v(e.mostLikelyLabel), 1)) : u("", !0),
-            p(S(ne), {
+      y.value ? m("", !0) : (a(), l("div", tl, [
+        e.loading ? (a(), l("div", al, [
+          A(C.$slots, "loading", {}, () => [
+            j(_(fe), {
+              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" }, [
+              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)
+            ])
+          ], !0)
+        ])) : f.value ? (a(), l("div", sl, [
+          s("span", ol, [
+            s("i", dl, S(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)
+          ])
+        ])) : (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), {
               value: e.mostLikely.value,
               "value-type": e.mostLikely.type,
               verified: e.mostLikely.verified,
               correct: e.mostLikely.correct,
+              "hide-value": e.mostLikely.hideValue,
               main: "",
               "is-contact-data": e.isContactData,
               "show-rate": e.showRate,
-              onCopy: f,
-              onCorrect: E[2] || (E[2] = (w) => x(e.mostLikely)),
-              onIncorrect: E[3] || (E[3] = (w) => M(e.mostLikely))
-            }, null, 8, ["value", "value-type", "verified", "correct", "is-contact-data", "show-rate"])
-          ])) : u("", !0),
-          e.more.length > 0 ? (t(), a("div", Xt, [
-            o.value ? (t(), a("div", Qt, v(e.moreLabel), 1)) : u("", !0),
-            d("div", Zt, [
-              (t(!0), a(A, null, V(e.more, (w) => (t(), D(S(ne), {
-                key: w.value,
-                value: w.value,
-                "value-type": w.type,
-                verified: w.verified,
-                correct: w.correct,
+              onCopy: d,
+              onCorrect: E[2] || (E[2] = (N) => p(e.mostLikely)),
+              onIncorrect: E[3] || (E[3] = (N) => V(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,
                 "is-contact-data": e.isContactData,
                 "show-rate": e.showRate,
-                onCopy: f,
-                onCorrect: (fe) => x(w),
-                onIncorrect: (fe) => M(w)
-              }, null, 8, ["value", "value-type", "verified", "correct", "is-contact-data", "show-rate", "onCorrect", "onIncorrect"]))), 128))
+                onCopy: d,
+                onCorrect: (R) => p(N),
+                onIncorrect: (R) => V(N)
+              }, null, 8, ["value", "value-type", "verified", "correct", "hide-value", "is-contact-data", "show-rate", "onCorrect", "onIncorrect"]))), 128))
             ])
-          ])) : u("", !0)
+          ])) : m("", !0)
         ], 64))
       ]))
-    ], 8, zt));
+    ], 8, Xa));
+  }
+}), Hi = /* @__PURE__ */ M(hl, [["__scopeId", "data-v-a062c3ae"]]), gl = ["name", "value", "checked", "disabled"], Sl = {
+  key: 0,
+  class: "ds-radio__label"
+}, kl = /* @__PURE__ */ x({
+  __name: "DsRadio",
+  props: /* @__PURE__ */ Q({
+    disabled: Boolean,
+    // Label text (DS `label` prop); a default slot overrides it.
+    label: { type: String, default: "" },
+    name: { type: String, default: "" },
+    value: { type: String, default: "" }
+  }, {
+    modelValue: { type: Boolean, default: !1 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const n = de(e, "modelValue"), t = e;
+    function o() {
+      t.disabled || (n.value = !0);
+    }
+    return (i, c) => (a(), l("label", {
+      class: $(["ds-radio", { "is-disabled": e.disabled }])
+    }, [
+      s("input", {
+        type: "radio",
+        class: "ds-radio__native",
+        name: e.name || void 0,
+        value: e.value || void 0,
+        checked: n.value,
+        disabled: e.disabled,
+        onChange: o
+      }, null, 40, gl),
+      s("span", {
+        class: $(["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)
+        ], !0)
+      ])) : m("", !0)
+    ], 2));
+  }
+}), Wi = /* @__PURE__ */ M(kl, [["__scopeId", "data-v-96b70404"]]), pl = ["aria-checked", "aria-busy", "aria-disabled", "aria-label", "disabled"], $l = {
+  class: "ds-switch__thumb",
+  "aria-hidden": "true"
+}, Tl = /* @__PURE__ */ x({
+  __name: "DsSwitch",
+  props: /* @__PURE__ */ Q({
+    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
+    // resolves. Presentational-only: the app owns the optimistic value + revert; the
+    // component just reflects the `loading` and `modelValue` it's handed.
+    loading: Boolean,
+    // Accessible name for the switch (a control with no visible text). See
+    // DsSwitch.types.ts for why this stays optional rather than a required prop.
+    ariaLabel: { type: String, default: "" }
+  }, {
+    modelValue: { type: Boolean, default: !1 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const n = de(e, "modelValue"), t = e;
+    function o() {
+      t.disabled || t.loading || (n.value = !n.value);
+    }
+    return (i, c) => (a(), l("button", {
+      type: "button",
+      role: "switch",
+      class: $(["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,
+      "aria-label": e.ariaLabel || void 0,
+      disabled: e.disabled || e.loading,
+      onClick: o
+    }, [
+      s("span", $l, [
+        e.loading ? (a(), G(_(fe), {
+          key: 0,
+          class: "ds-switch__spinner",
+          size: 12,
+          tone: _(ge).DARK,
+          label: ""
+        }, null, 8, ["tone"])) : m("", !0)
+      ])
+    ], 10, pl));
+  }
+}), Ki = /* @__PURE__ */ M(Tl, [["__scopeId", "data-v-f8073b3b"]]), El = ["aria-label", "disabled"], Ll = { class: "ds-item-selector-button__label" }, wl = /* @__PURE__ */ x({
+  __name: "DsItemSelectorButton",
+  props: {
+    item: { type: Object, default: null },
+    // Material Icons ligature (e.g. `folder`); omitted entirely when unset.
+    icon: { type: String, default: "" },
+    emptyTitle: { type: String, default: "" },
+    // Accessible name (see .types.ts). Required in the empty state when there's no
+    // `emptyTitle`; the visible text (item.name / emptyTitle) names it otherwise.
+    ariaLabel: { type: String, default: "" },
+    disabled: Boolean
+  },
+  emits: [Z],
+  setup(e, { emit: n }) {
+    const t = e, o = n;
+    function i(c) {
+      t.disabled || o(Z, c);
+    }
+    return (c, k) => {
+      var f;
+      return a(), l("button", {
+        type: "button",
+        class: $(["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),
+        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),
+          "aria-hidden": "true"
+        }, S(e.icon), 7)) : m("", !0)
+      ], 10, El);
+    };
+  }
+}), Yi = /* @__PURE__ */ M(wl, [["__scopeId", "data-v-92d8d822"]]), Xe = {
+  DEFAULT: "default",
+  FILTER_SUMMARY: "filterSummary"
+}, Ze = {
+  AUTO: "auto",
+  // shrink to content — resizes with the selected label (default)
+  SMALL: "small",
+  // 128px
+  MEDIUM: "medium",
+  // 200px
+  LARGE: "large",
+  // 280px
+  FULL: "full"
+  // 100% of the container
+}, Il = ["disabled", "aria-expanded", "aria-controls", "aria-activedescendant"], Cl = ["title"], _l = ["disabled", "aria-label"], Dl = {
+  key: 1,
+  class: "material-icons ds-select__chevron",
+  "aria-hidden": "true"
+}, Al = {
+  key: 0,
+  class: "ds-select__popup"
+}, Nl = {
+  key: 0,
+  class: "ds-select__search"
+}, Rl = ["aria-activedescendant", "aria-label", "placeholder", "value"], Bl = ["aria-multiselectable", "aria-busy"], xl = {
+  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 = {
+  key: 0,
+  class: "ds-select__option-sublabel"
+}, Vl = {
+  key: 0,
+  class: "ds-select__empty",
+  role: "presentation"
+}, Ul = /* @__PURE__ */ x({
+  __name: "DsSelect",
+  props: /* @__PURE__ */ Q({
+    options: { type: Array, required: !0 },
+    placeholder: { type: String, default: "Select an option" },
+    multiple: Boolean,
+    selectType: { type: String, default: Xe.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'
+    // (shrink-to-content — the historical behaviour, kept so this stays a
+    // non-breaking, opt-in feature); pass a fixed step for a width that doesn't
+    // resize with the selected label. See DsSelect.types.ts `DS_SELECT_WIDTHS`.
+    width: {
+      type: [Number, String],
+      default: Ze.AUTO
+    },
+    disabled: Boolean,
+    // Opt-in type-to-filter: renders a search input inside the open dropdown.
+    // Off by default, so existing usages keep the plain select-only behaviour.
+    filterable: Boolean,
+    // Remote filtering: skip the built-in local filter and let the app own it by
+    // replacing `options` in response to the `search` event. Prevents a double
+    // filter (local re-filtering of already server-filtered results). No effect
+    // unless `filterable` is also set.
+    remote: Boolean,
+    // Async loading state: while true the listbox shows a spinner + aria-busy
+    // instead of options/empty. A #loading slot overrides the default DsSpinner.
+    loading: Boolean,
+    // Accessible name for the filter search input (a placeholder is not a reliable
+    // accessible name). English default; the app owns i18n.
+    searchLabel: { type: String, default: "Filter options" },
+    // Visible placeholder for the filter search input.
+    searchPlaceholder: { type: String, default: "Search" },
+    // Accessible name for the filterSummary clear (×) control. The app can override
+    // the wording (e.g. localized), but we default to a non-empty fallback so the
+    // icon-only button is never left without an accessible name for screen readers.
+    clearLabel: { type: String, default: "Clear selection" },
+    // Shown when the visible list is empty (no options, or a filtered list with no
+    // matches). English default (the app owns i18n); a #empty slot overrides it.
+    emptyText: { type: String, default: "No options" }
+  }, {
+    modelValue: { default: null },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ Q([_e], ["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)
+      ) : t.options;
+    }), E = g(
+      () => 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({
+          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(
+      () => t.options,
+      (u) => u.forEach((L) => ae.set(L.value, L.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)
+        return { width: typeof t.width == "number" ? `${t.width}px` : t.width };
+    }), P = g(
+      () => b.value && h.value >= 0 ? f(h.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(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 tt() {
+      t.disabled || (b.value ? le() : ye());
+    }
+    function we(u) {
+      if (t.disabled) return;
+      if (t.multiple) {
+        const O = R.value;
+        i.value = O.includes(u) ? O.filter((B) => B !== u) : [...O, u];
+        return;
+      }
+      const L = W(u);
+      i.value = L && t.showCheckbox ? null : u, le();
+    }
+    function at() {
+      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 lt(u) {
+      if (!t.disabled)
+        switch (u.key) {
+          case "ArrowDown":
+            u.preventDefault(), b.value ? me(1) : ye();
+            break;
+          case "ArrowUp":
+            u.preventDefault(), b.value ? me(-1) : ye();
+            break;
+          case "Home":
+            b.value && (u.preventDefault(), h.value = 0);
+            break;
+          case "End":
+            b.value && (u.preventDefault(), h.value = E.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);
+            }
+            break;
+          case "Escape":
+            b.value && (u.preventDefault(), u.stopPropagation(), le());
+            break;
+          case "Tab":
+            b.value && le(!1);
+            break;
+        }
+    }
+    function it(u) {
+      if (!t.disabled)
+        switch (u.key) {
+          case "ArrowDown":
+            u.preventDefault(), me(1);
+            break;
+          case "ArrowUp":
+            u.preventDefault(), me(-1);
+            break;
+          case "Enter":
+            if (u.preventDefault(), h.value >= 0) {
+              const L = E.value[h.value];
+              L && we(L.value);
+            }
+            break;
+          case "Escape":
+            u.preventDefault(), u.stopPropagation(), le();
+            break;
+          case "Tab":
+            b.value && le(!1);
+            break;
+        }
+    }
+    function nt(u) {
+      T.value = u.target.value, o(_e, T.value);
+    }
+    te(E, (u) => {
+      b.value && (u.length === 0 ? h.value = -1 : (h.value < 0 || h.value >= u.length) && (h.value = 0));
+    });
+    function Ie(u) {
+      y.value && !y.value.contains(u.target) && le(!1);
+    }
+    return te(b, (u) => {
+      typeof document != "undefined" && (u ? document.addEventListener("mousedown", Ie) : document.removeEventListener("mousedown", Ie));
+    }), te(
+      () => t.disabled,
+      (u) => {
+        u && b.value && le(!1);
+      }
+    ), be(() => {
+      typeof document != "undefined" && document.removeEventListener("mousedown", Ie);
+    }), (u, L) => (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)
+    }, [
+      s("div", {
+        class: $(["ds-select__control", { "is-disabled": e.disabled, "is-filter-selected": J.value }])
+      }, [
+        s("button", {
+          ref_key: "triggerRef",
+          ref: r,
+          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
+        }, [
+          s("span", {
+            class: "ds-select__summary",
+            title: v.value
+          }, S(v.value), 9, Cl)
+        ], 40, Il),
+        p.value && q.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] = [
+          s("i", {
+            class: "material-icons",
+            "aria-hidden": "true"
+          }, "close", -1)
+        ])], 8, _l)) : (a(), l("i", Dl, "keyboard_arrow_down"))
+      ], 2),
+      b.value ? (a(), l("div", Al, [
+        e.filterable ? (a(), l("div", Nl, [
+          L[2] || (L[2] = s("i", {
+            class: "material-icons ds-select__search-icon",
+            "aria-hidden": "true"
+          }, "search", -1)),
+          s("input", {
+            ref_key: "searchRef",
+            ref: d,
+            type: "text",
+            class: "ds-select__search-input",
+            role: "combobox",
+            "aria-expanded": "true",
+            "aria-controls": k,
+            "aria-activedescendant": P.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),
+        s("ul", {
+          id: k,
+          class: "ds-select__listbox",
+          role: "listbox",
+          "aria-multiselectable": e.multiple || void 0,
+          "aria-busy": e.loading || void 0,
+          onMousedown: L[0] || (L[0] = ve(() => {
+          }, ["prevent"]))
+        }, [
+          e.loading ? (a(), l("li", xl, [
+            A(u.$slots, "loading", {}, () => [
+              j(_(fe), { 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")
+            }, [
+              O.kind === "group" ? (a(), l("span", {
+                key: 0,
+                id: O.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,
+                  "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
+              }, [
+                e.showCheckbox ? (a(), G(_(et), {
+                  key: 0,
+                  class: "ds-select__option-check",
+                  "model-value": W(B.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
+                }, () => [
+                  B.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),
+                    "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)
+                  ])
+                ], !0)
+              ], 42, Pl))), 128))
+            ], 10, Ml))), 128)),
+            E.value.length === 0 ? (a(), l("li", Vl, [
+              A(u.$slots, "empty", {}, () => [
+                H(S(e.emptyText), 1)
+              ], !0)
+            ])) : m("", !0)
+          ], 64))
+        ], 40, Bl)
+      ])) : m("", !0)
+    ], 6));
+  }
+}), qi = /* @__PURE__ */ M(Ul, [["__scopeId", "data-v-47964929"]]), Gl = ["tabindex"], Hl = /* @__PURE__ */ x({
+  __name: "DsRow",
+  props: {
+    selected: { type: Boolean, default: !1 },
+    clickable: { type: Boolean, default: !1 }
+  },
+  emits: [Z],
+  setup(e, { emit: n }) {
+    const t = e, o = n;
+    function i() {
+      t.clickable && o(Z);
+    }
+    function c(k) {
+      t.clickable && (k.key === "Enter" || k.key === " ") && (k.preventDefault(), o(Z));
+    }
+    return (k, f) => (a(), l("tr", {
+      class: $(["ds-row", { "is-selected": e.selected, "is-clickable": e.clickable }]),
+      tabindex: e.clickable ? 0 : void 0,
+      onClick: i,
+      onKeydown: c
+    }, [
+      A(k.$slots, "default", {}, void 0, !0)
+    ], 42, Gl));
+  }
+}), ji = /* @__PURE__ */ M(Hl, [["__scopeId", "data-v-c2d6c50b"]]), Wl = /* @__PURE__ */ x({
+  __name: "DsCell",
+  props: {
+    first: { type: Boolean, default: !1 },
+    selected: { type: Boolean, default: !1 },
+    width: { type: [String, Number], default: null },
+    // Opt-in single-line ellipsis. Default off preserves the 72px multi-line cell.
+    truncate: { type: Boolean, default: !1 },
+    // Pin to the left/right edge (position: sticky) for horizontal scroll.
+    pinned: { type: String, default: null },
+    // Cumulative offset from the pinned edge when stacking multiple pins per side
+    // (number → px, or any CSS length). Defaults to 0 (single pin per side).
+    pinnedOffset: {
+      type: [String, Number],
+      default: null
+    }
+  },
+  setup(e) {
+    const n = e, t = (i) => typeof i == "number" ? `${i}px` : i, o = g(() => {
+      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;
+      }
+      return Object.keys(i).length ? i : void 0;
+    });
+    return (i, c) => (a(), l("td", {
+      class: $(["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)
+    }, [
+      A(i.$slots, "default", {}, void 0, !0)
+    ], 6));
+  }
+}), Xi = /* @__PURE__ */ M(Wl, [["__scopeId", "data-v-727b775d"]]), Kl = {
+  SUCCESS: "success",
+  WARNING: "warning",
+  DANGER: "danger",
+  // maps to $error-* tokens, not $danger-*
+  INFO: "info",
+  DRAFT: "draft",
+  // the only solid-fill variant
+  ACCENT: "accent"
+  // maps to $info-* tokens, not $accent-*
+}, Yl = /* @__PURE__ */ x({
+  __name: "DsCustomTag",
+  props: {
+    type: {
+      type: String,
+      default: Kl.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 }]])
+    }, [
+      A(n.$slots, "default", {}, void 0, !0)
+    ], 2));
+  }
+}), Zi = /* @__PURE__ */ M(Yl, [["__scopeId", "data-v-c0220631"]]), ql = { class: "ds-pill__text" }, jl = ["aria-label"], Xl = {
+  class: "material-icons",
+  "aria-hidden": "true"
+}, Zl = /* @__PURE__ */ x({
+  __name: "DsPill",
+  props: {
+    // Material Icons ligature name; when set, renders a trailing icon button.
+    icon: {
+      type: String,
+      default: ""
+    },
+    // Free-form CSS color (e.g. a dynamic tag/folder color); when empty, falls
+    // back to the default token background ($slate-soft).
+    background: {
+      type: String,
+      default: ""
+    },
+    // Accessible name for the trailing icon button (icon-only control).
+    iconLabel: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: [Z],
+  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)
+    }, [
+      s("span", ql, [
+        A(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)))
+      }, [
+        s("i", Xl, S(e.icon), 1)
+      ], 8, jl)) : m("", !0)
+    ], 6));
+  }
+}), Qi = /* @__PURE__ */ M(Zl, [["__scopeId", "data-v-a8d4ddbb"]]), Ql = {
+  key: 0,
+  class: "ds-pill-with-border__icon"
+}, Jl = { class: "ds-pill-with-border__label" }, ei = /* @__PURE__ */ x({
+  __name: "DsPillWithBorder",
+  emits: [Z],
+  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)))
+    }, [
+      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)
+      ])
+    ]));
+  }
+}), Ji = /* @__PURE__ */ M(ei, [["__scopeId", "data-v-8db4dcaf"]]), ti = ["aria-label"], ai = ["title"], li = {
+  key: 1,
+  class: "ds-segmented-progress-bar-wrapper"
+}, ii = ["aria-label"], ni = ["title"], si = {
+  class: "ds-segmented-progress-bar__legend",
+  "aria-hidden": "true"
+}, oi = { class: "ds-segmented-progress-bar__legend-label" }, di = /* @__PURE__ */ x({
+  inheritAttrs: !1,
+  __name: "DsSegmentedProgressBar",
+  props: {
+    segments: {
+      type: Array,
+      default: () => []
+    },
+    total: { type: Number, default: 100 },
+    height: { type: Number, default: 8 },
+    // Accessible name for the whole track — the DS source has zero ARIA on this
+    // element, so role="img" + this label are the only a11y surface. Left empty
+    // by default: omitted from the DOM until the consumer supplies a meaningful
+    // summary (e.g. "55% verified, 25% risky, 20% invalid").
+    label: { type: String, default: "" },
+    // Opt-in: render a legend (color swatch + name) summarising every segment
+    // below the track. Off by default so the render stays identical. A `#legend`
+    // slot also opts in and replaces the auto legend with custom content.
+    showLegend: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const n = e, t = Ee(), o = g(() => n.segments.filter((c) => !!c.name)), i = g(
+      () => !!t.legend || n.showLegend && o.value.length > 0
+    );
+    return (c, k) => i.value ? (a(), l("div", li, [
+      s("div", he(c.$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;
+          return a(), l("div", {
+            key: `${(r = f.name) != null ? r : ""}-${y}`,
+            class: "ds-segmented-progress-bar__segment",
+            style: F({
+              width: `${e.total > 0 ? f.amount * 100 / e.total : 0}%`,
+              backgroundColor: f.color
+            }),
+            title: f.name || void 0
+          }, null, 12, ni);
+        }), 128))
+      ], 16, ii),
+      A(c.$slots, "legend", {}, () => [
+        s("ul", si, [
+          (a(!0), l(z, null, Y(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 })
+            }, null, 4),
+            s("span", oi, S(f.name), 1)
+          ]))), 128))
+        ])
+      ], !0)
+    ])) : (a(), l("div", he({ key: 0 }, c.$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;
+        return a(), l("div", {
+          key: `${(r = f.name) != null ? r : ""}-${y}`,
+          class: "ds-segmented-progress-bar__segment",
+          style: F({
+            width: `${e.total > 0 ? f.amount * 100 / e.total : 0}%`,
+            backgroundColor: f.color
+          }),
+          title: f.name || void 0
+        }, null, 12, ai);
+      }), 128))
+    ], 16, ti));
+  }
+}), en = /* @__PURE__ */ M(di, [["__scopeId", "data-v-89dc768c"]]), ri = {
+  key: 0,
+  class: "ds-empty-state__header"
+}, ci = { class: "ds-empty-state__body" }, ui = ["src"], fi = { class: "ds-empty-state__title" }, bi = {
+  key: 1,
+  class: "ds-empty-state__subtitle"
+}, vi = /* @__PURE__ */ x({
+  __name: "DsEmptyState",
+  props: {
+    // Illustration URL; decorative (rendered with alt="").
+    image: { type: String, default: "" },
+    title: { type: String, default: "" },
+    subtitle: { type: String, default: "" },
+    // DS `radius-card-lg` corners instead of the default square edge.
+    roundedBorder: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    return (n, t) => (a(), l("div", {
+      class: $(["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, [
+        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)
+      ])
+    ], 2));
+  }
+}), tn = /* @__PURE__ */ M(vi, [["__scopeId", "data-v-159c48f9"]]), yi = ["aria-label"], mi = {
+  key: 0,
+  class: "ds-paginator__limit-message"
+}, hi = { class: "ds-paginator__pager" }, gi = {
+  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({
+  __name: "DsPaginator",
+  props: {
+    total: { type: Number, required: !0 },
+    pageSize: { type: Number, default: 25 },
+    currentPage: { type: Number, default: 1 },
+    pageSizes: { type: Array, default: () => [10, 25, 50, 100] },
+    limitMessage: { type: String, default: "" },
+    // Appended to each page-size option label (e.g. consumer passes "/page").
+    pageSizeSuffix: { type: String, default: "" },
+    // aria-labels for the icon-only chevron buttons — DS has none; empty unless
+    // the consumer supplies one (see the a11y note on `.types.ts`).
+    prevLabel: { type: String, default: "" },
+    nextLabel: { type: String, default: "" },
+    paginationLabel: { type: String, default: "" },
+    pageSizeLabel: { type: String, default: "" }
+  },
+  emits: [Ve, Ue],
+  setup(e, { emit: n }) {
+    const t = e, o = n, i = g(() => Math.max(1, Math.ceil(t.total / t.pageSize))), c = g(() => {
+      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;
+    });
+    function k(y) {
+      y < 1 || y > i.value || o(Ve, y);
+    }
+    function f(y) {
+      const r = y.target;
+      o(Ue, Number(r.value));
+    }
+    return (y, r) => (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), {
+          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))
+        }, 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", {
+            key: 1,
+            type: "button",
+            class: $(["ds-paginator__page", { "is-active": d === e.currentPage }]),
+            "aria-current": d === e.currentPage ? "page" : void 0,
+            onClick: (b) => k(d)
+          }, S(d), 11, Si))
+        ], 64))), 128)),
+        j(_(oe), {
+          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))
+        }, null, 8, ["aria-label", "disabled"])
+      ]),
+      s("select", {
+        class: "ds-paginator__page-size",
+        "aria-label": e.pageSizeLabel || void 0,
+        value: e.pageSize,
+        onChange: f
+      }, [
+        (a(!0), l(z, null, Y(e.pageSizes, (d) => (a(), l("option", {
+          key: d,
+          value: d
+        }, S(d) + S(e.pageSizeSuffix), 9, pi))), 128))
+      ], 40, ki)
+    ], 8, yi));
+  }
+}), an = /* @__PURE__ */ M(Ei, [["__scopeId", "data-v-a42e7bb4"]]), Li = ["aria-current", "title"], wi = {
+  class: "ds-menu-item__icon material-icons",
+  "aria-hidden": "true"
+}, Ii = {
+  key: 0,
+  class: "ds-menu-item__label"
+}, Ci = /* @__PURE__ */ x({
+  __name: "DsMenuItem",
+  props: {
+    // Material Icons ligature name (rendered via <i class="material-icons">).
+    icon: { type: String, required: !0 },
+    // Row label; a default slot overrides it. Hidden (not removed) when collapsed.
+    text: { type: String, default: "" },
+    // Current row: white surface + tint border, aria-current="page".
+    active: Boolean,
+    // Icon-only collapsed rail.
+    collapsed: Boolean
+  },
+  emits: [Ge],
+  setup(e, { emit: n }) {
+    const t = n;
+    function o(i) {
+      t(Ge, i);
+    }
+    return (i, c) => (a(), l("button", {
+      type: "button",
+      class: $(["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)
+        ], !0)
+      ])) : m("", !0)
+    ], 10, Li));
+  }
+}), ln = /* @__PURE__ */ M(Ci, [["__scopeId", "data-v-0fe17e63"]]), se = {
+  ACTIVE: "active",
+  // current step — accent-tint chip, filled marker
+  COMPLETED: "completed",
+  // done — filled accent marker
+  INCOMPLETE: "incomplete",
+  // visited but unfinished — red "!" chip
+  NEUTRAL: "neutral"
+  // upcoming — outlined marker
+}, _i = { class: "ds-wizard-stepper" }, Di = { class: "ds-wizard-stepper__steps" }, Ai = {
+  class: "ds-wizard-step__marker",
+  "aria-hidden": "true"
+}, Ni = { class: "ds-wizard-step__label" }, Ri = /* @__PURE__ */ x({
+  __name: "DsWizardStepper",
+  props: {
+    steps: { type: Array, default: () => [] },
+    // Current step (1-based).
+    value: { type: Number, default: 1 },
+    // Button labels — consumer-owned copy (no hardcoded text in the library).
+    nextLabel: { type: String, default: "" },
+    finalStepLabel: { type: String, default: "" },
+    // Whether the step chips are interactive (advance buttons are always active).
+    clickable: { type: Boolean, default: !0 }
+  },
+  emits: [De, He],
+  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)
+        };
+      })
+    );
+    function k(r) {
+      t.clickable && o(De, r);
+    }
+    function f() {
+      t.value < t.steps.length && o(De, t.value + 1);
+    }
+    function y() {
+      o(He);
+    }
+    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,
+          class: "ds-wizard-stepper__item"
+        }, [
+          (a(), G(ft(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)
+          }, {
+            default: ie(() => [
+              s("span", Ai, S(b.marker), 1),
+              s("span", Ni, S(b.label), 1)
+            ]),
+            _: 2
+          }, 1032, ["type", "class", "aria-current", "onClick"]))
+        ]))), 128))
+      ]),
+      !i.value && e.nextLabel ? (a(), G(_(oe), {
+        key: 0,
+        variant: "primary",
+        size: "large",
+        "right-icon": "keyboard_arrow_right",
+        onClick: f
+      }, {
+        default: ie(() => [
+          H(S(e.nextLabel), 1)
+        ]),
+        _: 1
+      })) : m("", !0),
+      i.value && e.finalStepLabel ? (a(), G(_(oe), {
+        key: 1,
+        variant: "primary",
+        size: "large",
+        onClick: y
+      }, {
+        default: ie(() => [
+          H(S(e.finalStepLabel), 1)
+        ]),
+        _: 1
+      })) : m("", !0)
+    ]));
   }
-}), ra = /* @__PURE__ */ T(jt, [["__scopeId", "data-v-86467226"]]);
+}), nn = /* @__PURE__ */ M(Ri, [["__scopeId", "data-v-d6f1e6d7"]]);
 export {
-  nt as DS_ALERT_EFFECTS,
-  ot as DS_ALERT_ICONS,
-  lt as DS_ALERT_TYPES,
-  X as DS_BADGE_TONES,
-  ke as DS_BUTTON_NATIVE_TYPES,
-  ie as DS_BUTTON_SIZES,
-  H as DS_BUTTON_VARIANTS,
-  _e as DS_INPUT_SIZES,
-  Y as DS_INPUT_TYPES,
-  vt as DS_NOTIFICATION_ICONS,
-  yt as DS_NOTIFICATION_POSITIONS,
-  ft as DS_NOTIFICATION_TYPES,
-  W as DS_SPINNER_TONES,
-  le as DS_TABLE_ALIGN,
-  De as DS_TAG_TONES,
-  q as DS_VERIFICATION_STATES,
-  oa as DsAlert,
-  ta as DsAvatar,
-  Ae as DsBadge,
-  K as DsButton,
-  na as DsCheckbox,
-  ne as DsContactValue,
-  ra as DsDataCard,
-  ia as DsInput,
-  da as DsModal,
-  sa as DsNotification,
-  Se as DsSpinner,
-  aa as DsTable,
-  ea as DsTag,
-  la as DsTextarea,
-  Rt as DsVerificationIcon
+  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
 };
 //# sourceMappingURL=index.es.js.map