@dialpad/dialtone-vue 3.102.0 → 3.103.0

package/dist/{stack-FdfddyeK.js → stack-5arAdMmw.js}

@@ -1,17 +1,17 @@
-import { _ as y, g as N, a as U, u as Y, b as $, B as Z, h as M, c as X, i as J, d as Q, e as ee, f as x } from "./tooltip-Cr_G7ib3.js";
-import { openBlock as n, createElementBlock as l, toDisplayString as O, createCommentVNode as d, createElementVNode as _, normalizeClass as u, resolveComponent as m, createBlock as h, resolveDynamicComponent as k, withCtx as p, mergeProps as T, renderSlot as c, withKeys as b, withModifiers as I, createVNode as A, toHandlers as j, createSlots as te, renderList as se, Teleport as oe } from "vue";
-import { w as P, I as ae, L as ne, A as ie, B as K } from "./emoji-w7mkBLzY.js";
-const S = {
+import { _ as y, g as N, a as G, u as U, b as Y, B as Z, h as j, c as X, i as J, d as Q, e as ee, f as F } from "./tooltip-Cr_G7ib3.js";
+import { openBlock as i, createElementBlock as r, toDisplayString as T, createCommentVNode as d, createElementVNode as E, normalizeClass as u, resolveComponent as m, createBlock as h, resolveDynamicComponent as b, withCtx as f, mergeProps as w, renderSlot as c, withKeys as g, withModifiers as A, createVNode as P, toHandlers as K, createSlots as te, renderList as se, Teleport as ne } from "vue";
+import { A as ae, w as k, I as ie, L as oe, B as le, C as z } from "./emoji-qCvCxNzD.js";
+const C = {
   BUSY: "busy",
   AWAY: "away",
   OFFLINE: "offline",
   ACTIVE: "active"
 }, re = [
-  S.BUSY,
-  S.AWAY,
-  S.OFFLINE,
-  S.ACTIVE
-], le = {
+  C.BUSY,
+  C.AWAY,
+  C.OFFLINE,
+  C.ACTIVE
+], de = {
   name: "DtPresence",
   props: {
     /**
@@ -21,7 +21,7 @@ const S = {
      */
     presence: {
       type: String,
-      default: S.ACTIVE,
+      default: C.ACTIVE,
       validator: (e) => re.includes(e)
     },
     /**
@@ -34,20 +34,20 @@ const S = {
       default: null
     }
   }
-}, de = ["aria-live"], ce = {
+}, ce = ["aria-live"], ue = {
   key: 0,
   "data-qa": "dt-presence-sr-text",
   class: "sr-only"
 };
-function ue(e, t, s, i, a, o) {
-  return n(), l("div", {
+function he(e, t, s, o, a, n) {
+  return i(), r("div", {
     class: "d-presence",
     "data-qa": "dt-presence",
     role: "status",
     "aria-live": e.$attrs.ariaLive || "off"
   }, [
-    s.srText ? (n(), l("span", ce, O(s.srText), 1)) : d("", !0),
-    _("div", {
+    s.srText ? (i(), r("span", ue, T(s.srText), 1)) : d("", !0),
+    E("div", {
       class: u(["d-presence__inner", {
         "d-presence__inner--active": s.presence === "active",
         "d-presence__inner--away": s.presence === "away",
@@ -55,9 +55,9 @@ function ue(e, t, s, i, a, o) {
         "d-presence__inner--offline": s.presence === "offline"
       }])
     }, null, 2)
-  ], 8, de);
+  ], 8, ce);
 }
-const he = /* @__PURE__ */ y(le, [["render", ue]]), L = {
+const fe = /* @__PURE__ */ y(de, [["render", he]]), L = {
   xs: "d-avatar--xs",
   sm: "d-avatar--sm",
   md: "d-avatar--md",
@@ -67,22 +67,22 @@ const he = /* @__PURE__ */ y(le, [["render", ue]]), L = {
   default: "",
   icon: "d-avatar__icon",
   initials: "d-avatar__initials"
-}, fe = {
+}, me = {
   md: "d-avatar__presence--md",
   lg: "d-avatar__presence--lg"
-}, F = {
+}, H = {
   NONE: "",
   BUSY: "busy",
   AWAY: "away",
   OFFLINE: "offline",
   ACTIVE: "active"
-}, me = {
+}, ye = {
   xs: "100",
   sm: "200",
   md: "300",
   lg: "500",
   xl: "600"
-}, ye = [
+}, ve = [
   "100",
   "200",
   "300",
@@ -101,558 +101,18 @@ const he = /* @__PURE__ */ y(le, [["render", ue]]), L = {
   "1600",
   "1700",
   "1800"
-], z = (e) => e > 1, ge = [
-  "accessibility",
-  "activity",
-  "add-task",
-  "agent-assist",
-  "ai-notes",
-  "airplay",
-  "airtable",
-  "alarm-check",
-  "alarm-clock-off",
-  "alarm-minus",
-  "alarm-plus",
-  "album",
-  "alert-circle",
-  "alert-triangle",
-  "amex",
-  "app-store-badge",
-  "apple",
-  "archive",
-  "archive-restore",
-  "arrow-down",
-  "arrow-down-left",
-  "arrow-down-right",
-  "arrow-left",
-  "arrow-left-right",
-  "arrow-right",
-  "arrow-up",
-  "arrow-up-down",
-  "arrow-up-left",
-  "arrow-up-right",
-  "asana",
-  "asterisk",
-  "at-sign",
-  "ata-adapter",
-  "attestation",
-  "attestation-outline",
-  "axis-3d",
-  "bar-chart",
-  "bar-chart-2",
-  "bar-chart-3",
-  "bar-chart-4",
-  "bar-chart-horizontal",
-  "barge",
-  "baseline",
-  "battery",
-  "battery-charging",
-  "battery-full",
-  "battery-low",
-  "battery-medium",
-  "bell",
-  "bell-minus",
-  "bell-off",
-  "bell-plus",
-  "bell-ring",
-  "binary",
-  "bluetooth",
-  "bluetooth-connected",
-  "bluetooth-off",
-  "bluetooth-searching",
-  "blur-background",
-  "bold",
-  "book",
-  "book-open",
-  "bookmark",
-  "bookmark-minus",
-  "bookmark-plus",
-  "box",
-  "box-select",
-  "boxes",
-  "branch",
-  "brand-dialpad",
-  "brand-dialpad-meetings",
-  "briefcase",
-  "building",
-  "building-2",
-  "bullhorn",
-  "calculator",
-  "calendar",
-  "calendar-check",
-  "calendar-check-2",
-  "calendar-clock",
-  "calendar-days",
-  "calendar-heart",
-  "calendar-minus",
-  "calendar-off",
-  "calendar-plus",
-  "calendar-range",
-  "calendar-search",
-  "calendar-x",
-  "call-abandoned",
-  "call-merge",
-  "call-rejected",
-  "camera",
-  "camera-off",
-  "camera-tracking",
-  "cast",
-  "check",
-  "check-circle",
-  "check-circle-filled",
-  "chevron-down",
-  "chevron-first",
-  "chevron-last",
-  "chevron-left",
-  "chevron-right",
-  "chevron-up",
-  "chevrons-down",
-  "chevrons-down-up",
-  "chevrons-left",
-  "chevrons-left-right",
-  "chevrons-right",
-  "chevrons-right-left",
-  "chevrons-up",
-  "chevrons-up-down",
-  "circle-half-filled",
-  "circle-slashed",
-  "clipboard",
-  "clipboard-check",
-  "clipboard-copy",
-  "clipboard-edit",
-  "clipboard-list",
-  "clipboard-signature",
-  "clipboard-type",
-  "clipboard-x",
-  "clock",
-  "clock-1",
-  "clock-10",
-  "clock-11",
-  "clock-12",
-  "clock-2",
-  "clock-3",
-  "clock-4",
-  "clock-5",
-  "clock-6",
-  "clock-7",
-  "clock-8",
-  "clock-9",
-  "clockify",
-  "close",
-  "cloud",
-  "cloud-cog",
-  "cloud-drizzle",
-  "cloud-fog",
-  "cloud-hail",
-  "cloud-lightning",
-  "cloud-moon",
-  "cloud-moon-rain",
-  "cloud-off",
-  "cloud-rain",
-  "cloud-rain-wind",
-  "cloud-snow",
-  "cloud-sun",
-  "cloud-sun-rain",
-  "cloudy",
-  "coaching-hub",
-  "code",
-  "command",
-  "concierge-bell",
-  "contacts",
-  "copper-crm",
-  "copy",
-  "copyright",
-  "corner-down-left",
-  "corner-down-right",
-  "corner-left-down",
-  "corner-left-up",
-  "corner-right-down",
-  "corner-right-up",
-  "corner-up-left",
-  "corner-up-right",
-  "cpu",
-  "credit-card",
-  "dash",
-  "dect-base-station",
-  "dect-handset",
-  "delete",
-  "deskphone",
-  "dialbot",
-  "dialer",
-  "dialpad-ai",
-  "dialpad-ai-color",
-  "dialpad-logomark",
-  "digital-whisper",
-  "diners-club",
-  "discover",
-  "dissatisfied",
-  "double-check",
-  "download",
-  "download-cloud",
-  "dp-phone",
-  "edit",
-  "edit-2",
-  "empty",
-  "end-chat",
-  "equal",
-  "eraser",
-  "evernote",
-  "expand",
-  "expert-node",
-  "external-link",
-  "eye",
-  "eye-off",
-  "facebook",
-  "factory",
-  "fast-forward",
-  "file",
-  "file-audio",
-  "files",
-  "film",
-  "filter",
-  "fingerprint",
-  "flag",
-  "flag-off",
-  "flame",
-  "focus",
-  "folder",
-  "folder-tree",
-  "folders",
-  "food",
-  "form-input",
-  "forward",
-  "freshsales-crm",
-  "front",
-  "gamepad",
-  "gauge",
-  "gif-filled",
-  "gif-outline",
-  "giphy",
-  "globe-2",
-  "gmail",
-  "google-business-messaging",
-  "google-calendar",
-  "google-docs",
-  "google-drive",
-  "google-glyph",
-  "google-sheets",
-  "google-slides",
-  "greenhouse",
-  "grid",
-  "grip-horizontal",
-  "grip-vertical",
-  "hand",
-  "hard-drive",
-  "hash",
-  "hash-bold",
-  "haze",
-  "hd",
-  "headphones",
-  "hear",
-  "heart",
-  "help-circle",
-  "highfive",
-  "history",
-  "hold",
-  "home",
-  "hourglass",
-  "hubspot",
-  "image",
-  "import",
-  "inbox",
-  "indent",
-  "infinity",
-  "info",
-  "inspect",
-  "instagram",
-  "intercom",
-  "isolated-queries",
-  "italic",
-  "jcb",
-  "jira-service-desk",
-  "key",
-  "keyboard",
-  "keypad",
-  "languages",
-  "laptop-2",
-  "large-self-view",
-  "layout",
-  "layout-dashboard",
-  "layout-filmstrip",
-  "layout-grid",
-  "layout-template",
-  "library",
-  "life-buoy",
-  "lightbulb",
-  "lightbulb-off",
-  "lightning-bolt",
-  "line-chart",
-  "line-messenger",
-  "link-2",
-  "link-2-off",
-  "linkedin",
-  "list-add",
-  "list-bullet",
-  "list-checks",
-  "list-ordered",
-  "listen",
-  "listen",
-  "listening",
-  "live-queue",
-  "living-thing",
-  "loading",
-  "lock",
-  "lock-filled",
-  "log-in",
-  "log-out",
-  "maestro",
-  "mail",
-  "mail-open",
-  "mails",
-  "map",
-  "map-pin",
-  "mastercard",
-  "maximize",
-  "megaphone",
-  "megaphone-off",
-  "menu",
-  "message",
-  "messenger",
-  "mic",
-  "mic-off",
-  "microsoft",
-  "microsoft-dynamics-365",
-  "microsoft-teams",
-  "minimize",
-  "minimize-alt",
-  "minus-circle",
-  "miro",
-  "monday-com",
-  "monitor",
-  "monitor-off",
-  "monitor-speaker",
-  "moon",
-  "more-horizontal",
-  "more-vertical",
-  "mouse",
-  "multi-line-dept",
-  "music",
-  "music-off",
-  "network",
-  "neutral",
-  "newspaper",
-  "not-enough-queries",
-  "notes",
-  "object",
-  "office-365",
-  "option",
-  "package",
-  "paperclip",
-  "park",
-  "party-popper",
-  "past-conversations",
-  "pause",
-  "pause-circle",
-  "phone",
-  "phone-call",
-  "phone-forward",
-  "phone-hang-up",
-  "phone-hang-up",
-  "phone-hold",
-  "phone-incoming",
-  "phone-missed",
-  "phone-off",
-  "phone-outgoing",
-  "picture-in-picture",
-  "pie-chart",
-  "pin",
-  "pin-off",
-  "pipedrive",
-  "play",
-  "play-circle",
-  "play-filled",
-  "play-store-badge",
-  "plug",
-  "plus",
-  "plus-circle",
-  "power",
-  "print-fax",
-  "printer",
-  "puzzle",
-  "qr-code",
-  "queries",
-  "quote",
-  "record",
-  "record-filled",
-  "redo",
-  "refresh",
-  "repeat",
-  "reply",
-  "reply-all",
-  "rewind",
-  "rewind-15-sec",
-  "salesforce-glyph",
-  "salesforce-logo",
-  "satisfied",
-  "save",
-  "scan",
-  "scan-face",
-  "scissors",
-  "screen-share-off",
-  "scroll",
-  "search",
-  "send",
-  "servicenow",
-  "settings",
-  "share",
-  "share-2",
-  "share-screen",
-  "sheet",
-  "shield",
-  "shield-alert",
-  "shield-check",
-  "shield-close",
-  "shield-off",
-  "shortcuts",
-  "shuffle",
-  "sidebar",
-  "sidebar-close",
-  "sidebar-open",
-  "signal-best",
-  "signal-high",
-  "signal-low",
-  "signal-medium",
-  "signal-zero",
-  "siren",
-  "skip-15-sec",
-  "skip-back",
-  "skip-back-ten",
-  "skip-forward",
-  "skip-forward-ten",
-  "slack",
-  "slash",
-  "sliders",
-  "sliders-horizontal",
-  "small-self-view",
-  "smartphone",
-  "smartphone-charging",
-  "snapchat",
-  "snooze",
-  "snowflake",
-  "somewhat-dissatisfied",
-  "somewhat-satisfied",
-  "sort-asc",
-  "sort-desc",
-  "sparkle",
-  "speaker",
-  "star",
-  "star-filled",
-  "sticker",
-  "stop-circle",
-  "stop-filled",
-  "strikethrough",
-  "sun",
-  "sun-dim",
-  "sun-medium",
-  "sunrise",
-  "sunset",
-  "switch-to-cellular",
-  "switch-to-hd",
-  "table",
-  "tag",
-  "tags",
-  "takeover",
-  "task",
-  "telegram",
-  "text-cursor",
-  "text-cursor-input",
-  "thermometer",
-  "thermometer-snowflake",
-  "thermometer-sun",
-  "thread",
-  "threads",
-  "thumbs-down",
-  "thumbs-up",
-  "tiktok",
-  "timer",
-  "timer-off",
-  "timer-reset",
-  "toggl",
-  "too-many-queries",
-  "tools",
-  "toy-brick",
-  "transfer",
-  "transfer-webchat",
-  "transportation",
-  "trash",
-  "trending-down",
-  "trending-up",
-  "triangle",
-  "twitter",
-  "type",
-  "umbrella",
-  "underline",
-  "undo-2",
-  "union-pay",
-  "unlink-2",
-  "unlock",
-  "unlock-filled",
-  "unread",
-  "upload",
-  "upload-cloud",
-  "usb",
-  "user",
-  "user-check",
-  "user-minus",
-  "user-plus",
-  "user-rematch",
-  "user-remove",
-  "users",
-  "very-dissatisfied",
-  "very-satisfied",
-  "viber",
-  "video",
-  "video-off",
-  "video-settings",
-  "visa",
-  "voicemail",
-  "voicemail-drop",
-  "volume",
-  "volume-1",
-  "volume-2",
-  "volume-x",
-  "waveform",
-  "we-chat",
-  "webcam",
-  "webchat",
-  "whatsapp",
-  "whisper",
-  "wifi",
-  "wifi-off",
-  "wind",
-  "x-brand",
-  "x-circle",
-  "zap-off",
-  "zendesk",
-  "zoho",
-  "zoho-crm",
-  "zoho-desk",
-  "zoom",
-  "zoom-in",
-  "zoom-logo",
-  "zoom-out"
-];
-function ve() {
-  return [void 0, ...ge];
+], V = (e) => e > 1;
+function _e() {
+  return [void 0, ...ae];
 }
-const be = (e) => {
+const ge = (e) => {
   if (typeof e != "string" || !e.trim())
     return "";
   const t = e.trim().split(/\s+/g);
-  return t.length === 1 ? t.join("").substring(0, 2) : t.filter((s, i) => i === 0 || i === t.length - 1).map((s) => s.slice(0, 1).toUpperCase()).join("");
-}, _e = ve(), ke = {
+  return t.length === 1 ? t.join("").substring(0, 2) : t.filter((s, o) => o === 0 || o === t.length - 1).map((s) => s.slice(0, 1).toUpperCase()).join("");
+}, Ee = _e(), be = {
   name: "DtAvatar",
-  components: { DtPresence: he, DtIcon: P },
+  components: { DtPresence: fe, DtIcon: k },
   inheritAttrs: !1,
   props: {
     /**
@@ -718,8 +178,8 @@ const be = (e) => {
      */
     presence: {
       type: String,
-      default: F.NONE,
-      validator: (e) => Object.values(F).includes(e)
+      default: H.NONE,
+      validator: (e) => Object.values(H).includes(e)
     },
     /**
      * A set of props to be passed into the presence component.
@@ -736,7 +196,7 @@ const be = (e) => {
     group: {
       type: Number,
       default: void 0,
-      validator: (e) => z(e)
+      validator: (e) => V(e)
     },
     /**
      * The icon that overlays the avatar
@@ -780,7 +240,7 @@ const be = (e) => {
     iconName: {
       type: String,
       default: void 0,
-      validator: (e) => _e.includes(e)
+      validator: (e) => Ee.includes(e)
     },
     /**
      * Icon size to be displayed on the avatar
@@ -789,7 +249,7 @@ const be = (e) => {
     iconSize: {
       type: String,
       default: "",
-      validator: (e) => !e || Object.keys(ae).includes(e)
+      validator: (e) => !e || Object.keys(ie).includes(e)
     },
     /**
      * Full name used to extract initials and set alt attribute.
@@ -820,8 +280,8 @@ const be = (e) => {
     return {
       AVATAR_SIZE_MODIFIERS: L,
       AVATAR_KIND_MODIFIERS: pe,
-      AVATAR_PRESENCE_SIZE_MODIFIERS: fe,
-      AVATAR_ICON_SIZES: me,
+      AVATAR_PRESENCE_SIZE_MODIFIERS: me,
+      AVATAR_ICON_SIZES: ye,
       imageLoadedSuccessfully: null,
       formattedInitials: "",
       initializing: !1
@@ -850,7 +310,7 @@ const be = (e) => {
       ];
     },
     showGroup() {
-      return z(this.group);
+      return V(this.group);
     },
     formattedGroup() {
       return this.group > 99 ? "99+" : this.group;
@@ -887,11 +347,11 @@ const be = (e) => {
       e && (e.addEventListener("load", () => this._loadedImageEventHandler(e), { once: !0 }), e.addEventListener("error", () => this._erroredImageEventHandler(e), { once: !0 }));
     },
     formatInitials(e) {
-      const t = be(e);
+      const t = ge(e);
       this.validatedSize === "xs" ? this.formattedInitials = "" : this.validatedSize === "sm" ? this.formattedInitials = t[0] : this.formattedInitials = t;
     },
     getColor() {
-      return this.color ?? U(ye, this.seed);
+      return this.color ?? G(ve, this.seed);
     },
     _loadedImageEventHandler(e) {
       this.imageLoadedSuccessfully = !0, e.classList.remove("d-d-none");
@@ -907,25 +367,25 @@ const be = (e) => {
       this.clickable && this.$emit("click", e);
     }
   }
-}, Ee = ["src", "alt"], Se = {
+}, Se = ["src", "alt"], Ce = {
   key: 1,
   class: "d-avatar__overlay-text"
-}, we = {
+}, Oe = {
   key: 1,
   class: "d-avatar__count",
   "data-qa": "dt-avatar-count"
 };
-function Ce(e, t, s, i, a, o) {
-  const f = m("dt-icon"), g = m("dt-presence");
-  return n(), h(k(s.clickable ? "button" : "div"), {
+function Ie(e, t, s, o, a, n) {
+  const p = m("dt-icon"), v = m("dt-presence");
+  return i(), h(b(s.clickable ? "button" : "div"), {
     id: s.id,
-    class: u(o.avatarClasses),
+    class: u(n.avatarClasses),
     "data-qa": "dt-avatar",
-    "aria-label": o.buttonAriaLabel,
-    onClick: o.handleClick
+    "aria-label": n.buttonAriaLabel,
+    onClick: n.handleClick
   }, {
-    default: p(() => [
-      _("div", {
+    default: f(() => [
+      E("div", {
         ref: "canvas",
         class: u([
           s.canvasClass,
@@ -933,36 +393,36 @@ function Ce(e, t, s, i, a, o) {
           { "d-avatar--image-loaded": a.imageLoadedSuccessfully }
         ])
       }, [
-        o.showImage ? (n(), l("img", {
+        n.showImage ? (i(), r("img", {
           key: 0,
           ref: "avatarImage",
           class: "d-avatar__image",
           "data-qa": "dt-avatar-image",
           src: s.imageSrc,
           alt: s.imageAlt || s.fullName
-        }, null, 8, Ee)) : s.iconName ? (n(), h(f, {
+        }, null, 8, Se)) : s.iconName ? (i(), h(p, {
           key: 1,
           name: s.iconName,
           size: s.iconSize || a.AVATAR_ICON_SIZES[s.size],
           class: u([s.iconClass, a.AVATAR_KIND_MODIFIERS.icon]),
           "data-qa": "dt-avatar-icon"
-        }, null, 8, ["name", "size", "class"])) : (n(), l("span", {
+        }, null, 8, ["name", "size", "class"])) : (i(), r("span", {
           key: 2,
           class: u([a.AVATAR_KIND_MODIFIERS.initials])
-        }, O(a.formattedInitials), 3))
+        }, T(a.formattedInitials), 3))
       ], 2),
-      s.overlayIcon || s.overlayText ? (n(), l("div", {
+      s.overlayIcon || s.overlayText ? (i(), r("div", {
         key: 0,
-        class: u(o.overlayClasses)
+        class: u(n.overlayClasses)
       }, [
-        s.overlayIcon ? (n(), h(f, {
+        s.overlayIcon ? (i(), h(p, {
           key: 0,
           class: "d-avatar__overlay-icon",
           name: s.overlayIcon
-        }, null, 8, ["name"])) : s.overlayText ? (n(), l("p", Se, O(s.overlayText), 1)) : d("", !0)
+        }, null, 8, ["name"])) : s.overlayText ? (i(), r("p", Ce, T(s.overlayText), 1)) : d("", !0)
       ], 2)) : d("", !0),
-      o.showGroup ? (n(), l("span", we, O(o.formattedGroup), 1)) : d("", !0),
-      s.presence && !o.showGroup ? (n(), h(g, T({
+      n.showGroup ? (i(), r("span", Oe, T(n.formattedGroup), 1)) : d("", !0),
+      s.presence && !n.showGroup ? (i(), h(v, w({
         key: 2,
         presence: s.presence,
         class: [
@@ -974,7 +434,7 @@ function Ce(e, t, s, i, a, o) {
     _: 1
   }, 8, ["id", "class", "aria-label", "onClick"]);
 }
-const mt = /* @__PURE__ */ y(ke, [["render", Ce]]), Oe = {
+const yt = /* @__PURE__ */ y(be, [["render", Ie]]), Te = {
   name: "DtLink",
   props: {
     /**
@@ -985,18 +445,18 @@ const mt = /* @__PURE__ */ y(ke, [["render", Ce]]), Oe = {
       type: String,
       default: "",
       validator(e) {
-        return ne.includes(e);
+        return oe.includes(e);
       }
     }
   },
   data() {
     return {
-      LINK_KIND_MODIFIERS: ie
+      LINK_KIND_MODIFIERS: le
     };
   }
-}, Ie = ["href"];
-function Te(e, t, s, i, a, o) {
-  return n(), l("a", {
+}, Ae = ["href"];
+function we(e, t, s, o, a, n) {
+  return i(), r("a", {
     class: u([
       "d-link",
       a.LINK_KIND_MODIFIERS[s.kind]
@@ -1005,9 +465,9 @@ function Te(e, t, s, i, a, o) {
     href: "href" in e.$attrs ? e.$attrs.href : "javascript:void(0)"
   }, [
     c(e.$slots, "default")
-  ], 10, Ie);
+  ], 10, Ae);
 }
-const yt = /* @__PURE__ */ y(Oe, [["render", Te]]), Ae = {
+const vt = /* @__PURE__ */ y(Te, [["render", we]]), Pe = {
   props: {
     /**
      * If true, a hidden close button is included for screen readers
@@ -1046,11 +506,11 @@ const yt = /* @__PURE__ */ y(Oe, [["render", Te]]), Ae = {
            a visually hidden close button and you must set the visuallyHiddenCloseLabel prop.`);
     }
   }
-}, Pe = {
+}, ke = {
   name: "SrOnlyCloseButton",
   components: {
-    DtIcon: P,
-    DtButton: K
+    DtIcon: k,
+    DtButton: z
   },
   props: {
     /**
@@ -1069,23 +529,23 @@ const yt = /* @__PURE__ */ y(Oe, [["render", Te]]), Ae = {
     }
   }
 };
-function Le(e, t, s, i, a, o) {
-  const f = m("dt-icon"), g = m("dt-button");
-  return n(), h(g, {
+function Le(e, t, s, o, a, n) {
+  const p = m("dt-icon"), v = m("dt-button");
+  return i(), h(v, {
     id: "sr-only-close-button",
     "data-qa": "dt-sr-only-close-button",
     class: "d-vi-visible-sr",
     "aria-label": s.visuallyHiddenCloseLabel,
-    onClick: o.close,
-    onKeydown: b(I(o.close, ["prevent", "stop"]), ["space"])
+    onClick: n.close,
+    onKeydown: g(A(n.close, ["prevent", "stop"]), ["space"])
   }, {
-    default: p(() => [
-      A(f, { name: "close" })
+    default: f(() => [
+      P(p, { name: "close" })
     ]),
     _: 1
   }, 8, ["aria-label", "onClick", "onKeydown"]);
 }
-const De = /* @__PURE__ */ y(Pe, [["render", Le]]), W = ':not(:disabled):not([aria-disabled="true"]):not([role="presentation"])', Ne = `${W}:not([tabindex="-1"])`, Re = "button,[href],input,select,textarea,details,[tabindex]", xe = {
+const De = /* @__PURE__ */ y(ke, [["render", Le]]), $ = ':not(:disabled):not([aria-disabled="true"]):not([role="presentation"])', Ne = `${$}:not([tabindex="-1"])`, Re = "button,[href],input,select,textarea,details,[tabindex]", Fe = {
   methods: {
     /**
      * get the first focusable element in your component, includes tabindex="-1".
@@ -1129,9 +589,9 @@ const De = /* @__PURE__ */ y(Pe, [["render", Le]]), W = ':not(:disabled):not([ar
      * @param {bool} includeNegativeTabIndex - will include tabindex="-1" in the list of focusable elements.
      */
     _getFocusableElements(e = this.$el, t = !1) {
-      return e ? [...e.querySelectorAll(Re)].filter((i) => {
-        const a = window.getComputedStyle(i);
-        return a.getPropertyValue("display") !== "none" && a.getPropertyValue("visibility") !== "hidden" && i.matches(t ? W : Ne);
+      return e ? [...e.querySelectorAll(Re)].filter((o) => {
+        const a = window.getComputedStyle(o);
+        return a.getPropertyValue("display") !== "none" && a.getPropertyValue("visibility") !== "hidden" && o.matches(t ? $ : Ne);
       }) : [];
     },
     /**
@@ -1143,23 +603,23 @@ const De = /* @__PURE__ */ y(Pe, [["render", Le]]), W = ':not(:disabled):not([ar
     focusTrappedTabPress(e, t) {
       if (!(e.key === "Tab"))
         return;
-      const i = this._getFocusableElements(t);
-      if (!i.length) {
+      const o = this._getFocusableElements(t);
+      if (!o.length) {
         e.preventDefault();
         return;
       }
-      const a = this._getFirstFocusElement(i), o = i[i.length - 1];
-      e.shiftKey ? document.activeElement === a && (o.focus(), e.preventDefault()) : document.activeElement === o && (a.focus(), e.preventDefault());
+      const a = this._getFirstFocusElement(o), n = o[o.length - 1];
+      e.shiftKey ? document.activeElement === a && (n.focus(), e.preventDefault()) : document.activeElement === n && (a.focus(), e.preventDefault());
     }
   }
 }, D = {
   DEFAULT: "default",
   CUSTOM: "custom"
-}, C = {
+}, I = {
   ARROW_KEYS: "arrow-keys",
   TAB: "tab",
   NONE: "none"
-}, Fe = {
+}, He = {
   name: "DtItemLayout",
   props: {
     /**
@@ -1170,66 +630,66 @@ const De = /* @__PURE__ */ y(Pe, [["render", Le]]), W = ':not(:disabled):not([ar
       default: "div"
     }
   }
-}, ze = {
+}, Ve = {
   key: 0,
   "data-qa": "dt-item-layout-left-wrapper",
   class: "dt-item-layout--left"
-}, Ve = {
+}, Be = {
   "data-qa": "dt-item-layout-content-wrapper",
   class: "dt-item-layout--content"
-}, He = {
+}, qe = {
   key: 0,
   "data-qa": "dt-item-layout-title-wrapper",
   class: "dt-item-layout--title"
-}, Be = {
+}, xe = {
   key: 2,
   "data-qa": "dt-item-layout-bottom-wrapper",
   class: "dt-item-layout--bottom"
-}, qe = {
+}, Me = {
   key: 1,
   "data-qa": "dt-item-layout-right-wrapper",
   class: "dt-item-layout--right"
-}, Me = {
+}, je = {
   key: 2,
   "data-qa": "dt-item-layout-selected-wrapper",
   class: "dt-item-layout--selected"
 };
-function je(e, t, s, i, a, o) {
-  return n(), h(k(s.as), { class: "dt-item-layout" }, {
-    default: p(() => [
-      e.$slots.left ? (n(), l("section", ze, [
+function Ke(e, t, s, o, a, n) {
+  return i(), h(b(s.as), { class: "dt-item-layout" }, {
+    default: f(() => [
+      e.$slots.left ? (i(), r("section", Ve, [
         c(e.$slots, "left", {}, void 0, !0)
       ])) : d("", !0),
-      _("section", Ve, [
-        e.$slots.default ? (n(), l("div", He, [
+      E("section", Be, [
+        e.$slots.default ? (i(), r("div", qe, [
           c(e.$slots, "default", {}, void 0, !0)
         ])) : d("", !0),
-        e.$slots.subtitle ? (n(), l("div", {
+        e.$slots.subtitle ? (i(), r("div", {
           key: 1,
           "data-qa": "dt-item-layout-subtitle-wrapper",
           class: u(["dt-item-layout--subtitle", { "dt-item-layout--subtitle--with-title": e.$slots.default }])
         }, [
           c(e.$slots, "subtitle", {}, void 0, !0)
         ], 2)) : d("", !0),
-        e.$slots.bottom ? (n(), l("div", Be, [
+        e.$slots.bottom ? (i(), r("div", xe, [
           c(e.$slots, "bottom", {}, void 0, !0)
         ])) : d("", !0)
       ]),
-      e.$slots.right ? (n(), l("section", qe, [
+      e.$slots.right ? (i(), r("section", Me, [
         c(e.$slots, "right", {}, void 0, !0)
       ])) : d("", !0),
-      e.$slots.selected ? (n(), l("section", Me, [
+      e.$slots.selected ? (i(), r("section", je, [
         c(e.$slots, "selected", {}, void 0, !0)
       ])) : d("", !0)
     ]),
     _: 3
   });
 }
-const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"]]), Ke = {
+const B = /* @__PURE__ */ y(He, [["render", Ke], ["__scopeId", "data-v-411cb81e"]]), ze = {
   name: "DtListItem",
   components: {
-    DtItemLayout: V,
-    DtIcon: P
+    DtItemLayout: B,
+    DtIcon: k
   },
   /**
    * Value provided from keyboard_list_navigation.js using id prop.
@@ -1244,7 +704,7 @@ const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"
     id: {
       type: String,
       default() {
-        return Y.getUniqueString();
+        return U.getUniqueString();
       }
     },
     /**
@@ -1279,8 +739,8 @@ const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"
      */
     navigationType: {
       type: String,
-      default: C.NONE,
-      validator: (e) => Object.values(C).includes(e)
+      default: I.NONE,
+      validator: (e) => Object.values(I).includes(e)
     },
     /**
      * Applies selected styles to the list item
@@ -1329,7 +789,7 @@ const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"
     listItemType() {
       switch (this.type) {
         case D.DEFAULT:
-          return V;
+          return B;
         default:
           return null;
       }
@@ -1355,13 +815,13 @@ const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"
       return this.isHoverable ? this.highlightId && this.highlightId() ? this.id === this.highlightId() : this.mouseHighlighted : !1;
     },
     isFocusable() {
-      return this.navigationType === C.TAB;
+      return this.navigationType === I.TAB;
     },
     /**
      * Whether to apply hover styles.
      */
     isHoverable() {
-      return this.navigationType !== C.NONE;
+      return this.navigationType !== I.NONE;
     }
   },
   methods: {
@@ -1376,31 +836,31 @@ const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-411cb81e"
     }
   }
 };
-function We(e, t, s, i, a, o) {
-  const f = m("dt-icon");
-  return n(), h(k(s.elementType), T({
+function $e(e, t, s, o, a, n) {
+  const p = m("dt-icon");
+  return i(), h(b(s.elementType), w({
     id: s.id,
     class: ["dt-list-item", {
-      "dt-list-item--focusable": o.isFocusable,
-      "dt-list-item--highlighted": o.isHighlighted,
-      "dt-list-item--static": !o.isHoverable
+      "dt-list-item--focusable": n.isFocusable,
+      "dt-list-item--highlighted": n.isHighlighted,
+      "dt-list-item--static": !n.isHoverable
     }],
-    tabindex: o.isFocusable ? 0 : -1,
+    tabindex: n.isFocusable ? 0 : -1,
     role: s.role,
-    "aria-selected": o.isHighlighted
-  }, j(o.listItemListeners)), {
-    default: p(() => [
-      o.listItemType ? (n(), h(k(o.listItemType), { key: 0 }, te({ _: 2 }, [
-        se(e.$slots, (g, E) => ({
-          name: E,
-          fn: p(() => [
-            c(e.$slots, E)
+    "aria-selected": n.isHighlighted
+  }, K(n.listItemListeners)), {
+    default: f(() => [
+      n.listItemType ? (i(), h(b(n.listItemType), { key: 0 }, te({ _: 2 }, [
+        se(e.$slots, (v, S) => ({
+          name: S,
+          fn: f(() => [
+            c(e.$slots, S)
           ])
         })),
         s.selected ? {
           name: "selected",
-          fn: p(() => [
-            A(f, {
+          fn: f(() => [
+            P(p, {
               name: "check",
               size: "400",
               class: "dt-list-item--selected-icon"
@@ -1413,31 +873,31 @@ function We(e, t, s, i, a, o) {
     _: 3
   }, 16, ["id", "class", "tabindex", "role", "aria-selected"]);
 }
-const gt = /* @__PURE__ */ y(Ke, [["render", We]]), v = {
+const _t = /* @__PURE__ */ y(ze, [["render", $e]]), _ = {
   default: "column",
   column: "column",
   row: "row",
   "row-reverse": "row-reverse",
   "column-reverse": "column-reverse"
-}, G = ["sm", "md", "lg", "xl"], R = ["0", "100", "200", "300", "400", "500", "600"], H = {
+}, W = ["sm", "md", "lg", "xl"], R = ["0", "100", "200", "300", "400", "500", "600"], q = {
   none: void 0,
   small: "d-p4",
   medium: "d-p8",
   large: "d-p16"
-}, Ge = {
+}, We = {
   none: void 0,
   small: "d-pl4",
   medium: "d-pl8",
   large: "d-pl16"
-}, Ue = ["dialog", "menu", "listbox", "tree", "grid"], Ye = ["", "anchor"], $e = ["none", "dialog", "first"], Ze = ["parent", "body"], Xe = [
-  ...$
-], vt = [
+}, Ge = ["dialog", "menu", "listbox", "tree", "grid"], Ue = ["", "anchor"], Ye = ["none", "dialog", "first"], Ze = ["parent", "body"], Xe = [
+  ...Y
+], gt = [
   ...Z
 ], Je = {
   name: "PopoverHeaderFooter",
   components: {
-    DtButton: K,
-    DtIcon: P
+    DtButton: z,
+    DtIcon: k
   },
   props: {
     // eslint-disable-next-line vue/require-default-prop
@@ -1483,7 +943,7 @@ const gt = /* @__PURE__ */ y(Ke, [["render", We]]), v = {
   ],
   data() {
     return {
-      hasSlotContent: M
+      hasSlotContent: j
     };
   },
   methods: {
@@ -1494,16 +954,16 @@ const gt = /* @__PURE__ */ y(Ke, [["render", We]]), v = {
     }
   }
 };
-function Qe(e, t, s, i, a, o) {
-  const f = m("dt-icon"), g = m("dt-button");
-  return n(), l("div", {
+function Qe(e, t, s, o, a, n) {
+  const p = m("dt-icon"), v = m("dt-button");
+  return i(), r("div", {
     "data-qa": "dt-popover-header-footer",
     class: u({
       "d-popover__header": s.type === "header",
       "d-popover__footer": s.type === "footer"
     })
   }, [
-    a.hasSlotContent(e.$slots.content) ? (n(), l("div", {
+    a.hasSlotContent(e.$slots.content) ? (i(), r("div", {
       key: 0,
       "data-qa": "dt-popover-header-footer-content",
       class: u([{
@@ -1513,7 +973,7 @@ function Qe(e, t, s, i, a, o) {
     }, [
       c(e.$slots, "content")
     ], 2)) : d("", !0),
-    s.showCloseButton ? (n(), h(g, T({
+    s.showCloseButton ? (i(), h(v, w({
       key: 1,
       ref: "popover__close-button",
       "data-qa": "dt-popover-close",
@@ -1525,10 +985,10 @@ function Qe(e, t, s, i, a, o) {
       kind: "muted",
       circle: ""
     }, s.closeButtonProps, {
-      onClick: t[0] || (t[0] = (E) => e.$emit("close"))
+      onClick: t[0] || (t[0] = (S) => e.$emit("close"))
     }), {
-      icon: p(() => [
-        A(f, {
+      icon: f(() => [
+        P(p, {
           name: "close",
           size: "300"
         })
@@ -1547,7 +1007,7 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     DtLazyShow: X,
     PopoverHeaderFooter: et
   },
-  mixins: [xe, Ae],
+  mixins: [Fe, Pe],
   props: {
     /**
      * Controls whether the popover is shown. Leaving this null will have the popover trigger on click by default.
@@ -1590,7 +1050,7 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     role: {
       type: String,
       default: "dialog",
-      validator: (e) => Ue.includes(e)
+      validator: (e) => Ge.includes(e)
     },
     /**
      * ID of the element that serves as the label for the popover content.
@@ -1626,7 +1086,7 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     padding: {
       type: String,
       default: "large",
-      validator: (e) => Object.keys(H).some((t) => t === e)
+      validator: (e) => Object.keys(q).some((t) => t === e)
     },
     /**
      * Additional class name for the content wrapper element.
@@ -1643,7 +1103,7 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     contentWidth: {
       type: String,
       default: "",
-      validator: (e) => Ye.includes(e)
+      validator: (e) => Ue.includes(e)
     },
     /**
      * Whether to apply transition on initial render in the content lazy show component.
@@ -1835,7 +1295,7 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     initialFocusElement: {
       type: [String, HTMLElement],
       default: "first",
-      validator: (e) => $e.includes(e) || e instanceof HTMLElement || e.startsWith("#")
+      validator: (e) => Ye.includes(e) || e instanceof HTMLElement || e.startsWith("#")
     },
     /**
      * If the popover should open pressing up or down arrow key on the anchor element.
@@ -1863,6 +1323,17 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     hovercard: {
       type: Boolean,
       default: !1
+    },
+    /**
+     * The timer is used only when the hovercard prop is true.
+     * It defines the delays when opening several hovercards.
+     * It must have the keys: enter, leave and current.
+     * If null, the default delay of 300ms will be used.
+     */
+    timer: {
+      type: [Object, null],
+      default: null,
+      validator: (e) => e === null || e.enter && e.leave && Object.keys(e).includes("current")
     }
   },
   emits: [
@@ -1888,15 +1359,15 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
   ],
   data() {
     return {
-      POPOVER_PADDING_CLASSES: H,
-      POPOVER_HEADER_FOOTER_PADDING_CLASSES: Ge,
+      POPOVER_PADDING_CLASSES: q,
+      POPOVER_HEADER_FOOTER_PADDING_CLASSES: We,
       intersectionObserver: null,
       isOutsideViewport: !1,
       isOpen: !1,
       toAppear: !1,
       anchorEl: null,
       popoverContentEl: null,
-      hasSlotContent: M,
+      hasSlotContent: j,
       inTimer: null,
       outTimer: null
     };
@@ -1920,6 +1391,10 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     },
     labelledBy() {
       return this.ariaLabelledby || !this.ariaLabel && N("DtPopover__anchor");
+    },
+    currentHovercard() {
+      var e;
+      return (e = this.timer) == null ? void 0 : e.current;
     }
   },
   watch: {
@@ -1979,6 +1454,9 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     },
     isOpen(e, t) {
       e ? (this.initTippyInstance(), this.tip.show()) : !e && t !== e && (this.removeEventListeners(), this.tip.hide());
+    },
+    currentHovercard() {
+      this.hovercard && this.timer && (this.currentHovercard === this.id ? this.isOpen = !0 : this.isOpen = !1);
     }
   },
   mounted() {
@@ -1994,8 +1472,8 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
    ******************/
   methods: {
     hasIntersectedViewport(e) {
-      var i;
-      const t = (i = e == null ? void 0 : e[0]) == null ? void 0 : i.target;
+      var o;
+      const t = (o = e == null ? void 0 : e[0]) == null ? void 0 : o.target;
       if (!t)
         return;
       const s = J(t);
@@ -2018,9 +1496,9 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
       (e = this.anchorEl) != null && e.closest(".d-zi-drawer") ? 650 : 300;
     },
     defaultToggleOpen(e) {
-      var t, s, i;
+      var t, s, o;
       if (!this.hovercard && !this.openOnContext && (this.open === null || this.open === void 0)) {
-        if (!((t = this.anchorEl) != null && t.contains(e.target)) && !((s = this.anchorEl) != null && s.isEqualNode(e.target)) || (i = this.anchorEl) != null && i.disabled)
+        if (!((t = this.anchorEl) != null && t.contains(e.target)) && !((s = this.anchorEl) != null && s.isEqualNode(e.target)) || (o = this.anchorEl) != null && o.disabled)
           return;
         this.toggleOpen();
       }
@@ -2092,9 +1570,9 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
       this.initialFocusElement === "dialog" && this.$refs.content.$el.focus(), this.initialFocusElement.startsWith("#") && this.focusInitialElementById(), this.initialFocusElement === "first" && this.focusFirstElementIfNeeded(this.$refs.popover__content), this.initialFocusElement instanceof HTMLElement && this.initialFocusElement.focus();
     },
     focusInitialElementById() {
-      var t, s, i;
+      var t, s, o;
       const e = (s = (t = this.$refs.content) == null ? void 0 : t.$el) == null ? void 0 : s.querySelector(this.initialFocusElement);
-      e ? e.focus() : console.warn('Could not find the element specified in dt-popover prop "initialFocusElement". Defaulting to focusing the dialog.'), e ? e.focus() : (i = this.$refs.content) == null || i.$el.focus();
+      e ? e.focus() : console.warn('Could not find the element specified in dt-popover prop "initialFocusElement". Defaulting to focusing the dialog.'), e ? e.focus() : (o = this.$refs.content) == null || o.$el.focus();
     },
     onResize() {
       this.closePopover();
@@ -2112,8 +1590,8 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
       await this.$nextTick(), this.popoverContentEl.style.width = `${(e = this.anchorEl) == null ? void 0 : e.clientWidth}px`;
     },
     focusFirstElementIfNeeded(e) {
-      var s, i;
-      this._getFocusableElements(e, !0).length !== 0 ? this.focusFirstElement(e) : this.showCloseButton ? (s = this.$refs.popover__header) == null || s.focusCloseButton() : (i = this.$refs.content) == null || i.$el.focus();
+      var s, o;
+      this._getFocusableElements(e, !0).length !== 0 ? this.focusFirstElement(e) : this.showCloseButton ? (s = this.$refs.popover__header) == null || s.focusCloseButton() : (o = this.$refs.content) == null || o.$el.focus();
     },
     initTippyInstance() {
       var e, t;
@@ -2140,66 +1618,66 @@ const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
     setInTimer() {
       this.inTimer = setTimeout(() => {
         this.isOpen = !0;
-      }, x);
+      }, F);
     },
     setOutTimer() {
       this.outTimer = setTimeout(() => {
         this.isOpen = !1;
-      }, x);
+      }, F);
     },
-    onEnterAnchor(e) {
-      this.hovercard && (clearTimeout(this.outTimer), this.setInTimer(e));
+    onEnterAnchor() {
+      this.hovercard && (this.timer ? this.timer.enter(this.id) : (clearTimeout(this.outTimer), this.setInTimer()));
     },
-    onLeaveAnchor(e) {
-      this.hovercard && (clearTimeout(this.inTimer), this.setOutTimer(e));
+    onLeaveAnchor() {
+      this.hovercard && (this.timer ? this.timer.leave() : (clearTimeout(this.inTimer), this.setOutTimer()));
     },
     onEnterContent() {
-      this.hovercard && clearTimeout(this.outTimer);
+      this.hovercard && (this.timer ? this.timer.enter(this.id) : clearTimeout(this.outTimer));
     },
-    onLeaveContent(e) {
-      this.hovercard && this.setOutTimer(e);
+    onLeaveContent() {
+      this.hovercard && (this.timer ? this.timer.leave() : this.setOutTimer());
     }
     //  ============================================================================
     //  $ HOVERCARD
     //  ----------------------------------------------------------------------------
   }
-}, st = ["aria-hidden"], ot = ["id", "tabindex"];
-function at(e, t, s, i, a, o) {
-  const f = m("popover-header-footer"), g = m("sr-only-close-button"), E = m("dt-lazy-show");
-  return n(), l("div", null, [
-    s.modal && a.isOpen ? (n(), h(oe, {
+}, st = ["aria-hidden"], nt = ["id", "data-qa", "tabindex"], at = ["data-qa"];
+function it(e, t, s, o, a, n) {
+  const p = m("popover-header-footer"), v = m("sr-only-close-button"), S = m("dt-lazy-show");
+  return i(), r("div", null, [
+    s.modal && a.isOpen ? (i(), h(ne, {
       key: 0,
       to: "body"
     }, [
-      _("div", {
+      E("div", {
         class: "d-modal--transparent",
         "aria-hidden": s.modal && a.isOpen ? "false" : "true",
-        onClick: t[0] || (t[0] = I(() => {
+        onClick: t[0] || (t[0] = A(() => {
         }, ["prevent", "stop"]))
       }, null, 8, st)
     ])) : d("", !0),
-    (n(), h(k(s.elementType), {
+    (i(), h(b(s.elementType), {
       ref: "popover",
       class: u(["d-popover", { "d-popover__anchor--opened": a.isOpen }]),
       "data-qa": "dt-popover-container"
     }, {
-      default: p(() => [
-        _("div", {
-          id: !s.ariaLabelledby && o.labelledBy,
+      default: f(() => [
+        E("div", {
+          id: !s.ariaLabelledby && n.labelledBy,
           ref: "anchor",
-          "data-qa": "dt-popover-anchor",
+          "data-qa": e.$attrs["data-qa"] ? `${e.$attrs["data-qa"]}-anchor` : "dt-popover-anchor",
           tabindex: s.openOnContext ? 0 : void 0,
-          onClickCapture: t[1] || (t[1] = (...r) => o.defaultToggleOpen && o.defaultToggleOpen(...r)),
-          onContextmenu: t[2] || (t[2] = (...r) => o.onContext && o.onContext(...r)),
+          onClickCapture: t[1] || (t[1] = (...l) => n.defaultToggleOpen && n.defaultToggleOpen(...l)),
+          onContextmenu: t[2] || (t[2] = (...l) => n.onContext && n.onContext(...l)),
           onKeydown: [
-            t[3] || (t[3] = b(I((...r) => o.onArrowKeyPress && o.onArrowKeyPress(...r), ["prevent"]), ["up"])),
-            t[4] || (t[4] = b(I((...r) => o.onArrowKeyPress && o.onArrowKeyPress(...r), ["prevent"]), ["down"])),
-            t[6] || (t[6] = b((r) => e.$emit("keydown", r), ["enter"])),
-            t[7] || (t[7] = b((r) => e.$emit("keydown", r), ["space"]))
+            t[3] || (t[3] = g(A((...l) => n.onArrowKeyPress && n.onArrowKeyPress(...l), ["prevent"]), ["up"])),
+            t[4] || (t[4] = g(A((...l) => n.onArrowKeyPress && n.onArrowKeyPress(...l), ["prevent"]), ["down"])),
+            t[6] || (t[6] = g((l) => e.$emit("keydown", l), ["enter"])),
+            t[7] || (t[7] = g((l) => e.$emit("keydown", l), ["space"]))
           ],
-          onKeydownCapture: t[5] || (t[5] = b((...r) => o.closePopover && o.closePopover(...r), ["escape"])),
-          onMouseenter: t[8] || (t[8] = (...r) => o.onEnterAnchor && o.onEnterAnchor(...r)),
-          onMouseleave: t[9] || (t[9] = (...r) => o.onLeaveAnchor && o.onLeaveAnchor(...r))
+          onKeydownCapture: t[5] || (t[5] = g((...l) => n.closePopover && n.closePopover(...l), ["escape"])),
+          onMouseenter: t[8] || (t[8] = (...l) => n.onEnterAnchor && n.onEnterAnchor(...l)),
+          onMouseleave: t[9] || (t[9] = (...l) => n.onLeaveAnchor && n.onLeaveAnchor(...l))
         }, [
           c(e.$slots, "anchor", {
             attrs: {
@@ -2208,14 +1686,14 @@ function at(e, t, s, i, a, o) {
               "aria-haspopup": s.role
             }
           })
-        ], 40, ot),
-        A(E, T({
+        ], 40, nt),
+        P(S, w({
           id: s.id,
           ref: "content",
           role: s.role,
-          "data-qa": "dt-popover",
+          "data-qa": e.$attrs["data-qa"] ? `${e.$attrs["data-qa"]}__dialog` : "dt-popover",
           "aria-hidden": `${!a.isOpen}`,
-          "aria-labelledby": o.labelledBy,
+          "aria-labelledby": n.labelledBy,
           "aria-label": s.ariaLabel,
           "aria-modal": `${!s.modal}`,
           transition: s.transition,
@@ -2223,17 +1701,17 @@ function at(e, t, s, i, a, o) {
           appear: a.toAppear,
           class: ["d-popover__dialog", { "d-popover__dialog--modal": s.modal }, s.dialogClass],
           style: {
-            "max-height": o.calculatedMaxHeight,
+            "max-height": n.calculatedMaxHeight,
             "max-width": s.maxWidth
           },
           css: e.$attrs.css,
           tabindex: s.contentTabindex
-        }, j(o.popoverListeners), {
-          onMouseenter: o.onEnterContent,
-          onMouseleave: o.onLeaveContent
+        }, K(n.popoverListeners), {
+          onMouseenter: n.onEnterContent,
+          onMouseleave: n.onLeaveContent
         }), {
-          default: p(() => [
-            a.hasSlotContent(e.$slots.headerContent) || s.showCloseButton ? (n(), h(f, {
+          default: f(() => [
+            a.hasSlotContent(e.$slots.headerContent) || s.showCloseButton ? (i(), h(p, {
               key: 0,
               ref: "popover__header",
               class: u(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
@@ -2241,89 +1719,89 @@ function at(e, t, s, i, a, o) {
               type: "header",
               "show-close-button": s.showCloseButton,
               "close-button-props": s.closeButtonProps,
-              onClose: o.closePopover
+              onClose: n.closePopover
             }, {
-              content: p(() => [
-                c(e.$slots, "headerContent", { close: o.closePopover })
+              content: f(() => [
+                c(e.$slots, "headerContent", { close: n.closePopover })
               ]),
               _: 3
             }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : d("", !0),
-            _("div", {
+            E("div", {
               ref: "popover__content",
-              "data-qa": "dt-popover-content",
+              "data-qa": e.$attrs["data-qa"] ? `${e.$attrs["data-qa"]}-content` : "dt-popover-content",
               class: u([
                 "d-popover__content",
                 a.POPOVER_PADDING_CLASSES[s.padding],
                 s.contentClass
               ])
             }, [
-              c(e.$slots, "content", { close: o.closePopover })
-            ], 2),
-            a.hasSlotContent(e.$slots.footerContent) ? (n(), h(f, {
+              c(e.$slots, "content", { close: n.closePopover })
+            ], 10, at),
+            a.hasSlotContent(e.$slots.footerContent) ? (i(), h(p, {
               key: 1,
               ref: "popover__footer",
               type: "footer",
               class: u(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
               "content-class": s.footerClass
             }, {
-              content: p(() => [
-                c(e.$slots, "footerContent", { close: o.closePopover })
+              content: f(() => [
+                c(e.$slots, "footerContent", { close: n.closePopover })
               ]),
               _: 3
             }, 8, ["class", "content-class"])) : d("", !0),
-            e.showVisuallyHiddenClose ? (n(), h(g, {
+            e.showVisuallyHiddenClose ? (i(), h(v, {
               key: 2,
               "visually-hidden-close-label": e.visuallyHiddenCloseLabel,
-              onClose: o.closePopover
+              onClose: n.closePopover
             }, null, 8, ["visually-hidden-close-label", "onClose"])) : d("", !0)
           ]),
           _: 3
-        }, 16, ["id", "role", "aria-hidden", "aria-labelledby", "aria-label", "aria-modal", "transition", "show", "appear", "class", "style", "css", "tabindex", "onMouseenter", "onMouseleave"])
+        }, 16, ["id", "role", "data-qa", "aria-hidden", "aria-labelledby", "aria-label", "aria-modal", "transition", "show", "appear", "class", "style", "css", "tabindex", "onMouseenter", "onMouseleave"])
       ]),
       _: 3
     }, 8, ["class"]))
   ]);
 }
-const bt = /* @__PURE__ */ y(tt, [["render", at]]);
-function B(e) {
-  return e === v.default;
+const Et = /* @__PURE__ */ y(tt, [["render", it]]);
+function x(e) {
+  return e === _.default;
 }
-function q(e) {
-  if (w(e) === "string")
-    return B(e) ? null : v[e];
-  if (w(e) === "object") {
+function M(e) {
+  if (O(e) === "string")
+    return x(e) ? null : _[e];
+  if (O(e) === "object") {
     const { default: t } = e;
-    return B(t) ? null : v[t];
+    return x(t) ? null : _[t];
   } else
     return null;
 }
-function w(e) {
+function O(e) {
   return typeof e;
 }
-function nt(e) {
-  return q(e) ? `d-stack--${v[q(e)]}` : null;
+function ot(e) {
+  return M(e) ? `d-stack--${_[M(e)]}` : null;
 }
-function it(e) {
-  return w(e) === "object" ? [
-    ...G.map((t) => e[t] ? `d-stack--${t}--${e[t]}` : null)
+function lt(e) {
+  return O(e) === "object" ? [
+    ...W.map((t) => e[t] ? `d-stack--${t}--${e[t]}` : null)
   ] : null;
 }
 function rt(e) {
   return R.includes(e) ? `d-stack--gap-${e}` : null;
 }
-function lt(e) {
-  if (w(e) === "string")
-    return Object.keys(v).includes(e);
-  if (w(e) === "object") {
+function dt(e) {
+  if (O(e) === "string")
+    return Object.keys(_).includes(e);
+  if (O(e) === "object") {
     const { default: t } = e;
-    return Object.keys(v).includes(t);
+    return Object.keys(_).includes(t);
   } else
     return null;
 }
-function dt(e) {
+function ct(e) {
   return R.includes(e);
 }
-const ct = {
+const ut = {
   name: "DtStack",
   props: {
     /**
@@ -2337,7 +1815,7 @@ const ct = {
     direction: {
       type: [String, Object],
       default: "column",
-      validator: (e) => lt(e)
+      validator: (e) => dt(e)
     },
     /**
      * Set this prop to render stack as a specific HTML element.
@@ -2353,14 +1831,14 @@ const ct = {
     gap: {
       type: String,
       default: "0",
-      validator: (e) => dt(e)
+      validator: (e) => ct(e)
     }
   },
   data() {
     return {
-      DT_STACK_DIRECTION: v,
+      DT_STACK_DIRECTION: _,
       DT_STACK_GAP: R,
-      DT_STACK_RESPONSIVE_BREAKPOINTS: G
+      DT_STACK_RESPONSIVE_BREAKPOINTS: W
     };
   },
   computed: {
@@ -2368,60 +1846,60 @@ const ct = {
       return rt(this.gap);
     },
     defaultDirection() {
-      return nt(this.direction);
+      return ot(this.direction);
     },
     stackResponsive() {
-      return it(this.direction);
+      return lt(this.direction);
     }
   }
 };
-function ut(e, t, s, i, a, o) {
-  return n(), h(k(s.as), {
+function ht(e, t, s, o, a, n) {
+  return i(), h(b(s.as), {
     class: u([
       "d-stack",
-      o.defaultDirection,
-      o.stackResponsive,
-      o.stackGap
+      n.defaultDirection,
+      n.stackResponsive,
+      n.stackGap
     ])
   }, {
-    default: p(() => [
+    default: f(() => [
       c(e.$slots, "default")
     ]),
     _: 3
   }, 8, ["class"]);
 }
-const _t = /* @__PURE__ */ y(ct, [["render", ut]]);
+const bt = /* @__PURE__ */ y(ut, [["render", ht]]);
 export {
   L as A,
-  gt as D,
-  C as L,
-  xe as M,
+  _t as D,
+  I as L,
+  Fe as M,
   Ze as P,
   De as S,
-  _t as a,
-  yt as b,
-  mt as c,
-  bt as d,
-  Ae as e,
+  bt as a,
+  vt as b,
+  yt as c,
+  Et as d,
+  Pe as e,
   R as f,
-  Ye as g,
-  V as h,
-  pe as i,
-  fe as j,
-  F as k,
-  me as l,
+  q as g,
+  Ue as h,
+  B as i,
+  pe as j,
+  me as k,
+  H as l,
   ye as m,
-  z as n,
-  D as o,
-  H as p,
-  Ge as q,
-  Ue as r,
-  $e as s,
+  ve as n,
+  V as o,
+  D as p,
+  We as q,
+  Ge as r,
+  Ye as s,
   Xe as t,
-  vt as u,
-  he as v,
-  S as w,
+  gt as u,
+  fe as v,
+  C as w,
   re as x,
-  v as y,
-  G as z
+  _ as y,
+  W as z
 };