@dialpad/dialtone-vue 3.98.0 → 3.99.1

package/dist/{stack-FkIoaXcJ.js → stack--ux25GPn.js}

@@ -1,12 +1,12 @@
-import { _ as y, g as N, a as G, u as $, b as U, B as Y, h as q, c as Z, i as X, d as J, e as Q } from "./tooltip-H27s49LR.js";
-import { openBlock as n, createElementBlock as l, toDisplayString as O, createCommentVNode as r, createElementVNode as _, normalizeClass as c, resolveComponent as m, createBlock as u, resolveDynamicComponent as k, withCtx as p, mergeProps as A, renderSlot as d, withKeys as b, withModifiers as I, createVNode as T, toHandlers as j, createSlots as ee, renderList as te, Teleport as se } from "vue";
-import { w as P, I as oe, L as ae, A as ne, B as M } from "./emoji-64scMQZS.js";
+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 E, 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-ZUS2Xysh.js";
 const S = {
   BUSY: "busy",
   AWAY: "away",
   OFFLINE: "offline",
   ACTIVE: "active"
-}, ie = [
+}, re = [
   S.BUSY,
   S.AWAY,
   S.OFFLINE,
@@ -22,7 +22,7 @@ const S = {
     presence: {
       type: String,
       default: S.ACTIVE,
-      validator: (e) => ie.includes(e)
+      validator: (e) => re.includes(e)
     },
     /**
      * Since Presence is a visual element, we need SRs to read out any state changes
@@ -34,55 +34,55 @@ const S = {
       default: null
     }
   }
-}, re = ["aria-live"], de = {
+}, de = ["aria-live"], ce = {
   key: 0,
   "data-qa": "dt-presence-sr-text",
   class: "sr-only"
 };
-function ce(e, t, s, i, a, o) {
+function ue(e, t, s, i, a, o) {
   return n(), l("div", {
     class: "d-presence",
     "data-qa": "dt-presence",
     role: "status",
     "aria-live": e.$attrs.ariaLive || "off"
   }, [
-    s.srText ? (n(), l("span", de, O(s.srText), 1)) : r("", !0),
+    s.srText ? (n(), l("span", ce, O(s.srText), 1)) : d("", !0),
     _("div", {
-      class: c(["d-presence__inner", {
+      class: u(["d-presence__inner", {
         "d-presence__inner--active": s.presence === "active",
         "d-presence__inner--away": s.presence === "away",
         "d-presence__inner--busy": s.presence === "busy",
         "d-presence__inner--offline": s.presence === "offline"
       }])
     }, null, 2)
-  ], 8, re);
+  ], 8, de);
 }
-const ue = /* @__PURE__ */ y(le, [["render", ce]]), L = {
+const he = /* @__PURE__ */ y(le, [["render", ue]]), L = {
   xs: "d-avatar--xs",
   sm: "d-avatar--sm",
   md: "d-avatar--md",
   lg: "d-avatar--lg",
   xl: "d-avatar--xl"
-}, he = {
+}, pe = {
   default: "",
   icon: "d-avatar__icon",
   initials: "d-avatar__initials"
-}, pe = {
+}, fe = {
   md: "d-avatar__presence--md",
   lg: "d-avatar__presence--lg"
-}, x = {
+}, F = {
   NONE: "",
   BUSY: "busy",
   AWAY: "away",
   OFFLINE: "offline",
   ACTIVE: "active"
-}, fe = {
+}, me = {
   xs: "100",
   sm: "200",
   md: "300",
   lg: "500",
   xl: "600"
-}, me = [
+}, ye = [
   "100",
   "200",
   "300",
@@ -101,10 +101,11 @@ const ue = /* @__PURE__ */ y(le, [["render", ce]]), L = {
   "1600",
   "1700",
   "1800"
-], F = (e) => e > 1, ye = [
+], z = (e) => e > 1, ge = [
   "accessibility",
   "activity",
   "add-task",
+  "agent-assist",
   "ai-notes",
   "airplay",
   "airtable",
@@ -635,17 +636,17 @@ const ue = /* @__PURE__ */ y(le, [["render", ce]]), L = {
   "zoom-logo",
   "zoom-out"
 ];
-function ge() {
-  return [void 0, ...ye];
+function ve() {
+  return [void 0, ...ge];
 }
-const ve = (e) => {
+const be = (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("");
-}, be = ge(), _e = {
+}, _e = ve(), Ee = {
   name: "DtAvatar",
-  components: { DtPresence: ue, DtIcon: P },
+  components: { DtPresence: he, DtIcon: P },
   inheritAttrs: !1,
   props: {
     /**
@@ -711,8 +712,8 @@ const ve = (e) => {
      */
     presence: {
       type: String,
-      default: x.NONE,
-      validator: (e) => Object.values(x).includes(e)
+      default: F.NONE,
+      validator: (e) => Object.values(F).includes(e)
     },
     /**
      * A set of props to be passed into the presence component.
@@ -729,7 +730,7 @@ const ve = (e) => {
     group: {
       type: Number,
       default: void 0,
-      validator: (e) => F(e)
+      validator: (e) => z(e)
     },
     /**
      * The icon that overlays the avatar
@@ -773,7 +774,7 @@ const ve = (e) => {
     iconName: {
       type: String,
       default: void 0,
-      validator: (e) => be.includes(e)
+      validator: (e) => _e.includes(e)
     },
     /**
      * Icon size to be displayed on the avatar
@@ -782,7 +783,7 @@ const ve = (e) => {
     iconSize: {
       type: String,
       default: "",
-      validator: (e) => !e || Object.keys(oe).includes(e)
+      validator: (e) => !e || Object.keys(ae).includes(e)
     },
     /**
      * Full name used to extract initials and set alt attribute.
@@ -812,9 +813,9 @@ const ve = (e) => {
   data() {
     return {
       AVATAR_SIZE_MODIFIERS: L,
-      AVATAR_KIND_MODIFIERS: he,
-      AVATAR_PRESENCE_SIZE_MODIFIERS: pe,
-      AVATAR_ICON_SIZES: fe,
+      AVATAR_KIND_MODIFIERS: pe,
+      AVATAR_PRESENCE_SIZE_MODIFIERS: fe,
+      AVATAR_ICON_SIZES: me,
       imageLoadedSuccessfully: null,
       formattedInitials: "",
       initializing: !1
@@ -843,7 +844,7 @@ const ve = (e) => {
       ];
     },
     showGroup() {
-      return F(this.group);
+      return z(this.group);
     },
     formattedGroup() {
       return this.group > 99 ? "99+" : this.group;
@@ -880,11 +881,11 @@ const ve = (e) => {
       e && (e.addEventListener("load", () => this._loadedImageEventHandler(e), { once: !0 }), e.addEventListener("error", () => this._erroredImageEventHandler(e), { once: !0 }));
     },
     formatInitials(e) {
-      const t = ve(e);
+      const t = be(e);
       this.validatedSize === "xs" ? this.formattedInitials = "" : this.validatedSize === "sm" ? this.formattedInitials = t[0] : this.formattedInitials = t;
     },
     getColor() {
-      return this.color ?? G(me, this.seed);
+      return this.color ?? U(ye, this.seed);
     },
     _loadedImageEventHandler(e) {
       this.imageLoadedSuccessfully = !0, e.classList.remove("d-d-none");
@@ -900,19 +901,19 @@ const ve = (e) => {
       this.clickable && this.$emit("click", e);
     }
   }
-}, ke = ["src", "alt"], Ee = {
+}, ke = ["src", "alt"], Se = {
   key: 1,
   class: "d-avatar__overlay-text"
-}, Se = {
+}, we = {
   key: 1,
   class: "d-avatar__count",
   "data-qa": "dt-avatar-count"
 };
-function we(e, t, s, i, a, o) {
+function Ce(e, t, s, i, a, o) {
   const f = m("dt-icon"), g = m("dt-presence");
-  return n(), u(k(s.clickable ? "button" : "div"), {
+  return n(), h(E(s.clickable ? "button" : "div"), {
     id: s.id,
-    class: c(o.avatarClasses),
+    class: u(o.avatarClasses),
     "data-qa": "dt-avatar",
     "aria-label": o.buttonAriaLabel,
     onClick: o.handleClick
@@ -920,7 +921,7 @@ function we(e, t, s, i, a, o) {
     default: p(() => [
       _("div", {
         ref: "canvas",
-        class: c([
+        class: u([
           s.canvasClass,
           "d-avatar__canvas",
           { "d-avatar--image-loaded": a.imageLoadedSuccessfully }
@@ -933,41 +934,41 @@ function we(e, t, s, i, a, o) {
           "data-qa": "dt-avatar-image",
           src: s.imageSrc,
           alt: s.imageAlt || s.fullName
-        }, null, 8, ke)) : s.iconName ? (n(), u(f, {
+        }, null, 8, ke)) : s.iconName ? (n(), h(f, {
           key: 1,
           name: s.iconName,
           size: s.iconSize || a.AVATAR_ICON_SIZES[s.size],
-          class: c([s.iconClass, a.AVATAR_KIND_MODIFIERS.icon]),
+          class: u([s.iconClass, a.AVATAR_KIND_MODIFIERS.icon]),
           "data-qa": "dt-avatar-icon"
         }, null, 8, ["name", "size", "class"])) : (n(), l("span", {
           key: 2,
-          class: c([a.AVATAR_KIND_MODIFIERS.initials])
+          class: u([a.AVATAR_KIND_MODIFIERS.initials])
         }, O(a.formattedInitials), 3))
       ], 2),
       s.overlayIcon || s.overlayText ? (n(), l("div", {
         key: 0,
-        class: c(o.overlayClasses)
+        class: u(o.overlayClasses)
       }, [
-        s.overlayIcon ? (n(), u(f, {
+        s.overlayIcon ? (n(), h(f, {
           key: 0,
           class: "d-avatar__overlay-icon",
           name: s.overlayIcon
-        }, null, 8, ["name"])) : s.overlayText ? (n(), l("p", Ee, O(s.overlayText), 1)) : r("", !0)
-      ], 2)) : r("", !0),
-      o.showGroup ? (n(), l("span", Se, O(o.formattedGroup), 1)) : r("", !0),
-      s.presence && !o.showGroup ? (n(), u(g, A({
+        }, null, 8, ["name"])) : s.overlayText ? (n(), l("p", Se, O(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({
         key: 2,
         presence: s.presence,
         class: [
           "d-avatar__presence",
           a.AVATAR_PRESENCE_SIZE_MODIFIERS[s.size]
         ]
-      }, s.presenceProps, { "data-qa": "dt-presence" }), null, 16, ["presence", "class"])) : r("", !0)
+      }, s.presenceProps, { "data-qa": "dt-presence" }), null, 16, ["presence", "class"])) : d("", !0)
     ]),
     _: 1
   }, 8, ["id", "class", "aria-label", "onClick"]);
 }
-const ft = /* @__PURE__ */ y(_e, [["render", we]]), Ce = {
+const mt = /* @__PURE__ */ y(Ee, [["render", Ce]]), Oe = {
   name: "DtLink",
   props: {
     /**
@@ -978,29 +979,29 @@ const ft = /* @__PURE__ */ y(_e, [["render", we]]), Ce = {
       type: String,
       default: "",
       validator(e) {
-        return ae.includes(e);
+        return ne.includes(e);
       }
     }
   },
   data() {
     return {
-      LINK_KIND_MODIFIERS: ne
+      LINK_KIND_MODIFIERS: ie
     };
   }
-}, Oe = ["href"];
-function Ie(e, t, s, i, a, o) {
+}, Ie = ["href"];
+function Te(e, t, s, i, a, o) {
   return n(), l("a", {
-    class: c([
+    class: u([
       "d-link",
       a.LINK_KIND_MODIFIERS[s.kind]
     ]),
     "data-qa": "dt-link",
     href: "href" in e.$attrs ? e.$attrs.href : "javascript:void(0)"
   }, [
-    d(e.$slots, "default")
-  ], 10, Oe);
+    c(e.$slots, "default")
+  ], 10, Ie);
 }
-const mt = /* @__PURE__ */ y(Ce, [["render", Ie]]), Ae = {
+const yt = /* @__PURE__ */ y(Oe, [["render", Te]]), Ae = {
   props: {
     /**
      * If true, a hidden close button is included for screen readers
@@ -1039,11 +1040,11 @@ const mt = /* @__PURE__ */ y(Ce, [["render", Ie]]), Ae = {
            a visually hidden close button and you must set the visuallyHiddenCloseLabel prop.`);
     }
   }
-}, Te = {
+}, Pe = {
   name: "SrOnlyCloseButton",
   components: {
     DtIcon: P,
-    DtButton: M
+    DtButton: K
   },
   props: {
     /**
@@ -1062,9 +1063,9 @@ const mt = /* @__PURE__ */ y(Ce, [["render", Ie]]), Ae = {
     }
   }
 };
-function Pe(e, t, s, i, a, o) {
+function Le(e, t, s, i, a, o) {
   const f = m("dt-icon"), g = m("dt-button");
-  return n(), u(g, {
+  return n(), h(g, {
     id: "sr-only-close-button",
     "data-qa": "dt-sr-only-close-button",
     class: "d-vi-visible-sr",
@@ -1073,12 +1074,12 @@ function Pe(e, t, s, i, a, o) {
     onKeydown: b(I(o.close, ["prevent", "stop"]), ["space"])
   }, {
     default: p(() => [
-      T(f, { name: "close" })
+      A(f, { name: "close" })
     ]),
     _: 1
   }, 8, ["aria-label", "onClick", "onKeydown"]);
 }
-const Le = /* @__PURE__ */ y(Te, [["render", Pe]]), K = ':not(:disabled):not([aria-disabled="true"]):not([role="presentation"])', De = `${K}:not([tabindex="-1"])`, Ne = "button,[href],input,select,textarea,details,[tabindex]", Re = {
+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 = {
   methods: {
     /**
      * get the first focusable element in your component, includes tabindex="-1".
@@ -1122,9 +1123,9 @@ const Le = /* @__PURE__ */ y(Te, [["render", Pe]]), K = ':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(Ne)].filter((i) => {
+      return e ? [...e.querySelectorAll(Re)].filter((i) => {
         const a = window.getComputedStyle(i);
-        return a.getPropertyValue("display") !== "none" && a.getPropertyValue("visibility") !== "hidden" && i.matches(t ? K : De);
+        return a.getPropertyValue("display") !== "none" && a.getPropertyValue("visibility") !== "hidden" && i.matches(t ? W : Ne);
       }) : [];
     },
     /**
@@ -1152,7 +1153,7 @@ const Le = /* @__PURE__ */ y(Te, [["render", Pe]]), K = ':not(:disabled):not([ar
   ARROW_KEYS: "arrow-keys",
   TAB: "tab",
   NONE: "none"
-}, xe = {
+}, Fe = {
   name: "DtItemLayout",
   props: {
     /**
@@ -1163,65 +1164,65 @@ const Le = /* @__PURE__ */ y(Te, [["render", Pe]]), K = ':not(:disabled):not([ar
       default: "div"
     }
   }
-}, Fe = {
+}, ze = {
   key: 0,
   "data-qa": "dt-item-layout-left-wrapper",
   class: "dt-item-layout--left"
-}, ze = {
+}, Ve = {
   "data-qa": "dt-item-layout-content-wrapper",
   class: "dt-item-layout--content"
-}, Ve = {
+}, He = {
   key: 0,
   "data-qa": "dt-item-layout-title-wrapper",
   class: "dt-item-layout--title"
-}, He = {
+}, Be = {
   key: 2,
   "data-qa": "dt-item-layout-bottom-wrapper",
   class: "dt-item-layout--bottom"
-}, Be = {
+}, qe = {
   key: 1,
   "data-qa": "dt-item-layout-right-wrapper",
   class: "dt-item-layout--right"
-}, qe = {
+}, Me = {
   key: 2,
   "data-qa": "dt-item-layout-selected-wrapper",
   class: "dt-item-layout--selected"
 };
 function je(e, t, s, i, a, o) {
-  return n(), u(k(s.as), { class: "dt-item-layout" }, {
+  return n(), h(E(s.as), { class: "dt-item-layout" }, {
     default: p(() => [
-      e.$slots.left ? (n(), l("section", Fe, [
-        d(e.$slots, "left", {}, void 0, !0)
-      ])) : r("", !0),
-      _("section", ze, [
-        e.$slots.default ? (n(), l("div", Ve, [
-          d(e.$slots, "default", {}, void 0, !0)
-        ])) : r("", !0),
+      e.$slots.left ? (n(), l("section", ze, [
+        c(e.$slots, "left", {}, void 0, !0)
+      ])) : d("", !0),
+      _("section", Ve, [
+        e.$slots.default ? (n(), l("div", He, [
+          c(e.$slots, "default", {}, void 0, !0)
+        ])) : d("", !0),
         e.$slots.subtitle ? (n(), l("div", {
           key: 1,
           "data-qa": "dt-item-layout-subtitle-wrapper",
-          class: c(["dt-item-layout--subtitle", { "dt-item-layout--subtitle--with-title": e.$slots.default }])
+          class: u(["dt-item-layout--subtitle", { "dt-item-layout--subtitle--with-title": e.$slots.default }])
         }, [
-          d(e.$slots, "subtitle", {}, void 0, !0)
-        ], 2)) : r("", !0),
-        e.$slots.bottom ? (n(), l("div", He, [
-          d(e.$slots, "bottom", {}, void 0, !0)
-        ])) : r("", !0)
+          c(e.$slots, "subtitle", {}, void 0, !0)
+        ], 2)) : d("", !0),
+        e.$slots.bottom ? (n(), l("div", Be, [
+          c(e.$slots, "bottom", {}, void 0, !0)
+        ])) : d("", !0)
       ]),
-      e.$slots.right ? (n(), l("section", Be, [
-        d(e.$slots, "right", {}, void 0, !0)
-      ])) : r("", !0),
-      e.$slots.selected ? (n(), l("section", qe, [
-        d(e.$slots, "selected", {}, void 0, !0)
-      ])) : r("", !0)
+      e.$slots.right ? (n(), l("section", qe, [
+        c(e.$slots, "right", {}, void 0, !0)
+      ])) : d("", !0),
+      e.$slots.selected ? (n(), l("section", Me, [
+        c(e.$slots, "selected", {}, void 0, !0)
+      ])) : d("", !0)
     ]),
     _: 3
   });
 }
-const z = /* @__PURE__ */ y(xe, [["render", je], ["__scopeId", "data-v-c04dbbaa"]]), Me = {
+const V = /* @__PURE__ */ y(Fe, [["render", je], ["__scopeId", "data-v-c04dbbaa"]]), Ke = {
   name: "DtListItem",
   components: {
-    DtItemLayout: z,
+    DtItemLayout: V,
     DtIcon: P
   },
   /**
@@ -1237,7 +1238,7 @@ const z = /* @__PURE__ */ y(xe, [["render", je], ["__scopeId", "data-v-c04dbbaa"
     id: {
       type: String,
       default() {
-        return $.getUniqueString();
+        return Y.getUniqueString();
       }
     },
     /**
@@ -1322,7 +1323,7 @@ const z = /* @__PURE__ */ y(xe, [["render", je], ["__scopeId", "data-v-c04dbbaa"
     listItemType() {
       switch (this.type) {
         case D.DEFAULT:
-          return z;
+          return V;
         default:
           return null;
       }
@@ -1369,9 +1370,9 @@ const z = /* @__PURE__ */ y(xe, [["render", je], ["__scopeId", "data-v-c04dbbaa"
     }
   }
 };
-function Ke(e, t, s, i, a, o) {
+function We(e, t, s, i, a, o) {
   const f = m("dt-icon");
-  return n(), u(k(s.elementType), A({
+  return n(), h(E(s.elementType), T({
     id: s.id,
     class: ["dt-list-item", {
       "dt-list-item--focusable": o.isFocusable,
@@ -1383,17 +1384,17 @@ function Ke(e, t, s, i, a, o) {
     "aria-selected": o.isHighlighted
   }, j(o.listItemListeners)), {
     default: p(() => [
-      o.listItemType ? (n(), u(k(o.listItemType), { key: 0 }, ee({ _: 2 }, [
-        te(e.$slots, (g, E) => ({
-          name: E,
+      o.listItemType ? (n(), h(E(o.listItemType), { key: 0 }, te({ _: 2 }, [
+        se(e.$slots, (g, k) => ({
+          name: k,
           fn: p(() => [
-            d(e.$slots, E)
+            c(e.$slots, k)
           ])
         })),
         s.selected ? {
           name: "selected",
           fn: p(() => [
-            T(f, {
+            A(f, {
               name: "check",
               size: "400",
               class: "dt-list-item--selected-icon"
@@ -1401,35 +1402,35 @@ function Ke(e, t, s, i, a, o) {
           ]),
           key: "0"
         } : void 0
-      ]), 1024)) : d(e.$slots, "default", { key: 1 })
+      ]), 1024)) : c(e.$slots, "default", { key: 1 })
     ]),
     _: 3
   }, 16, ["id", "class", "tabindex", "role", "aria-selected"]);
 }
-const yt = /* @__PURE__ */ y(Me, [["render", Ke]]), v = {
+const gt = /* @__PURE__ */ y(Ke, [["render", We]]), v = {
   default: "column",
   column: "column",
   row: "row",
   "row-reverse": "row-reverse",
   "column-reverse": "column-reverse"
-}, W = ["sm", "md", "lg", "xl"], R = ["0", "100", "200", "300", "400", "500", "600"], V = {
+}, G = ["sm", "md", "lg", "xl"], R = ["0", "100", "200", "300", "400", "500", "600"], H = {
   none: void 0,
   small: "d-p4",
   medium: "d-p8",
   large: "d-p16"
-}, We = {
+}, Ge = {
   none: void 0,
   small: "d-pl4",
   medium: "d-pl8",
   large: "d-pl16"
-}, Ge = ["dialog", "menu", "listbox", "tree", "grid"], $e = ["", "anchor"], Ue = ["none", "dialog", "first"], Ye = ["parent", "body"], Ze = [
-  ...U
-], gt = [
-  ...Y
-], Xe = {
+}, Ue = ["dialog", "menu", "listbox", "tree", "grid"], Ye = ["", "anchor"], $e = ["none", "dialog", "first"], Ze = ["parent", "body"], Xe = [
+  ...$
+], vt = [
+  ...Z
+], Je = {
   name: "PopoverHeaderFooter",
   components: {
-    DtButton: M,
+    DtButton: K,
     DtIcon: P
   },
   props: {
@@ -1476,7 +1477,7 @@ const yt = /* @__PURE__ */ y(Me, [["render", Ke]]), v = {
   ],
   data() {
     return {
-      hasSlotContent: q
+      hasSlotContent: M
     };
   },
   methods: {
@@ -1487,11 +1488,11 @@ const yt = /* @__PURE__ */ y(Me, [["render", Ke]]), v = {
     }
   }
 };
-function Je(e, t, s, i, a, o) {
+function Qe(e, t, s, i, a, o) {
   const f = m("dt-icon"), g = m("dt-button");
   return n(), l("div", {
     "data-qa": "dt-popover-header-footer",
-    class: c({
+    class: u({
       "d-popover__header": s.type === "header",
       "d-popover__footer": s.type === "footer"
     })
@@ -1499,14 +1500,14 @@ function Je(e, t, s, i, a, o) {
     a.hasSlotContent(e.$slots.content) ? (n(), l("div", {
       key: 0,
       "data-qa": "dt-popover-header-footer-content",
-      class: c([{
+      class: u([{
         "d-popover__header__content": s.type === "header",
         "d-popover__footer__content": s.type === "footer"
       }, s.contentClass])
     }, [
-      d(e.$slots, "content")
-    ], 2)) : r("", !0),
-    s.showCloseButton ? (n(), u(g, A({
+      c(e.$slots, "content")
+    ], 2)) : d("", !0),
+    s.showCloseButton ? (n(), h(g, T({
       key: 1,
       ref: "popover__close-button",
       "data-qa": "dt-popover-close",
@@ -1518,29 +1519,29 @@ function Je(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] = (k) => e.$emit("close"))
     }), {
       icon: p(() => [
-        T(f, {
+        A(f, {
           name: "close",
           size: "300"
         })
       ]),
       _: 1
-    }, 16, ["class"])) : r("", !0)
+    }, 16, ["class"])) : d("", !0)
   ], 2);
 }
-const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
+const et = /* @__PURE__ */ y(Je, [["render", Qe]]), tt = {
   name: "DtPopover",
   /********************
    * CHILD COMPONENTS *
    ********************/
   components: {
-    SrOnlyCloseButton: Le,
-    DtLazyShow: Z,
-    PopoverHeaderFooter: Qe
+    SrOnlyCloseButton: De,
+    DtLazyShow: X,
+    PopoverHeaderFooter: et
   },
-  mixins: [Re, Ae],
+  mixins: [xe, Ae],
   props: {
     /**
      * Controls whether the popover is shown. Leaving this null will have the popover trigger on click by default.
@@ -1583,7 +1584,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     role: {
       type: String,
       default: "dialog",
-      validator: (e) => Ge.includes(e)
+      validator: (e) => Ue.includes(e)
     },
     /**
      * ID of the element that serves as the label for the popover content.
@@ -1619,7 +1620,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     padding: {
       type: String,
       default: "large",
-      validator: (e) => Object.keys(V).some((t) => t === e)
+      validator: (e) => Object.keys(H).some((t) => t === e)
     },
     /**
      * Additional class name for the content wrapper element.
@@ -1636,7 +1637,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     contentWidth: {
       type: String,
       default: "",
-      validator: (e) => $e.includes(e)
+      validator: (e) => Ye.includes(e)
     },
     /**
      * Whether to apply transition on initial render in the content lazy show component.
@@ -1770,7 +1771,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     sticky: {
       type: [Boolean, String],
       default: !1,
-      validator: (e) => Ze.includes(e)
+      validator: (e) => Xe.includes(e)
     },
     /**
      * Determines maximum height for the popover before overflow.
@@ -1828,7 +1829,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     initialFocusElement: {
       type: [String, HTMLElement],
       default: "first",
-      validator: (e) => Ue.includes(e) || e instanceof HTMLElement || e.startsWith("#")
+      validator: (e) => $e.includes(e) || e instanceof HTMLElement || e.startsWith("#")
     },
     /**
      * If the popover should open pressing up or down arrow key on the anchor element.
@@ -1847,7 +1848,15 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     appendTo: {
       type: [HTMLElement, String],
       default: "body",
-      validator: (e) => Ye.includes(e) || e instanceof HTMLElement
+      validator: (e) => Ze.includes(e) || e instanceof HTMLElement
+    },
+    /**
+     * Set this prop to true and popover component will support hovercard behaviour
+     * It will open on mouseenter and close on mouseleave with timer delay of 300ms
+     */
+    hovercard: {
+      type: Boolean,
+      default: !1
     }
   },
   emits: [
@@ -1873,15 +1882,17 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
   ],
   data() {
     return {
-      POPOVER_PADDING_CLASSES: V,
-      POPOVER_HEADER_FOOTER_PADDING_CLASSES: We,
+      POPOVER_PADDING_CLASSES: H,
+      POPOVER_HEADER_FOOTER_PADDING_CLASSES: Ge,
       intersectionObserver: null,
       isOutsideViewport: !1,
       isOpen: !1,
       toAppear: !1,
       anchorEl: null,
       popoverContentEl: null,
-      hasSlotContent: q
+      hasSlotContent: M,
+      inTimer: null,
+      outTimer: null
     };
   },
   computed: {
@@ -1981,11 +1992,11 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
       const t = (i = e == null ? void 0 : e[0]) == null ? void 0 : i.target;
       if (!t)
         return;
-      const s = X(t);
+      const s = J(t);
       this.isOutsideViewport = s.bottom || s.top;
     },
     popperOptions() {
-      return J({
+      return Q({
         fallbackPlacements: this.fallbackPlacements,
         tether: this.tether,
         hasHideModifierEnabled: !0
@@ -2002,7 +2013,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     },
     defaultToggleOpen(e) {
       var t, s, i;
-      if (!this.openOnContext && (this.open === null || this.open === void 0)) {
+      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)
           return;
         this.toggleOpen();
@@ -2100,7 +2111,7 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
     },
     initTippyInstance() {
       var e, t;
-      this.tip = Q(this.anchorEl, {
+      this.tip = ee(this.anchorEl, {
         popperOptions: this.popperOptions(),
         contentElement: this.popoverContentEl,
         placement: this.placement,
@@ -2116,13 +2127,41 @@ const Qe = /* @__PURE__ */ y(Xe, [["render", Je]]), et = {
         onClickOutside: this.onClickOutside,
         onShow: this.onShow
       });
+    },
+    //  ============================================================================
+    //  $ HOVERCARD
+    //  ----------------------------------------------------------------------------
+    setInTimer() {
+      this.inTimer = setTimeout(() => {
+        this.isOpen = !0;
+      }, x);
+    },
+    setOutTimer() {
+      this.outTimer = setTimeout(() => {
+        this.isOpen = !1;
+      }, x);
+    },
+    onEnterAnchor(e) {
+      this.hovercard && (clearTimeout(this.outTimer), this.setInTimer(e));
+    },
+    onLeaveAnchor(e) {
+      this.hovercard && (clearTimeout(this.inTimer), this.setOutTimer(e));
+    },
+    onEnterContent() {
+      this.hovercard && clearTimeout(this.outTimer);
+    },
+    onLeaveContent(e) {
+      this.hovercard && this.setOutTimer(e);
     }
+    //  ============================================================================
+    //  $ HOVERCARD
+    //  ----------------------------------------------------------------------------
   }
-}, tt = ["aria-hidden"], st = ["id", "tabindex"];
-function ot(e, t, s, i, a, o) {
-  const f = m("popover-header-footer"), g = m("sr-only-close-button"), E = m("dt-lazy-show");
+}, 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"), k = m("dt-lazy-show");
   return n(), l("div", null, [
-    s.modal && a.isOpen ? (n(), u(se, {
+    s.modal && a.isOpen ? (n(), h(oe, {
       key: 0,
       to: "body"
     }, [
@@ -2131,11 +2170,11 @@ function ot(e, t, s, i, a, o) {
         "aria-hidden": s.modal && a.isOpen ? "false" : "true",
         onClick: t[0] || (t[0] = I(() => {
         }, ["prevent", "stop"]))
-      }, null, 8, tt)
-    ])) : r("", !0),
-    (n(), u(k(s.elementType), {
+      }, null, 8, st)
+    ])) : d("", !0),
+    (n(), h(E(s.elementType), {
       ref: "popover",
-      class: c(["d-popover", { "d-popover__anchor--opened": a.isOpen }]),
+      class: u(["d-popover", { "d-popover__anchor--opened": a.isOpen }]),
       "data-qa": "dt-popover-container"
     }, {
       default: p(() => [
@@ -2144,25 +2183,27 @@ function ot(e, t, s, i, a, o) {
           ref: "anchor",
           "data-qa": "dt-popover-anchor",
           tabindex: s.openOnContext ? 0 : void 0,
-          onClickCapture: t[1] || (t[1] = (...h) => o.defaultToggleOpen && o.defaultToggleOpen(...h)),
-          onContextmenu: t[2] || (t[2] = (...h) => o.onContext && o.onContext(...h)),
+          onClickCapture: t[1] || (t[1] = (...r) => o.defaultToggleOpen && o.defaultToggleOpen(...r)),
+          onContextmenu: t[2] || (t[2] = (...r) => o.onContext && o.onContext(...r)),
           onKeydown: [
-            t[3] || (t[3] = b(I((...h) => o.onArrowKeyPress && o.onArrowKeyPress(...h), ["prevent"]), ["up"])),
-            t[4] || (t[4] = b(I((...h) => o.onArrowKeyPress && o.onArrowKeyPress(...h), ["prevent"]), ["down"])),
-            t[6] || (t[6] = b((h) => e.$emit("keydown", h), ["enter"])),
-            t[7] || (t[7] = b((h) => e.$emit("keydown", h), ["space"]))
+            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"]))
           ],
-          onKeydownCapture: t[5] || (t[5] = b((...h) => o.closePopover && o.closePopover(...h), ["escape"]))
+          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))
         }, [
-          d(e.$slots, "anchor", {
+          c(e.$slots, "anchor", {
             attrs: {
               "aria-expanded": a.isOpen.toString(),
               "aria-controls": s.id,
               "aria-haspopup": s.role
             }
           })
-        ], 40, st),
-        T(E, A({
+        ], 40, ot),
+        A(k, T({
           id: s.id,
           ref: "content",
           role: s.role,
@@ -2181,12 +2222,15 @@ function ot(e, t, s, i, a, o) {
           },
           css: e.$attrs.css,
           tabindex: s.contentTabindex
-        }, j(o.popoverListeners)), {
+        }, j(o.popoverListeners), {
+          onMouseenter: o.onEnterContent,
+          onMouseleave: o.onLeaveContent
+        }), {
           default: p(() => [
-            a.hasSlotContent(e.$slots.headerContent) || s.showCloseButton ? (n(), u(f, {
+            a.hasSlotContent(e.$slots.headerContent) || s.showCloseButton ? (n(), h(f, {
               key: 0,
               ref: "popover__header",
-              class: c(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
+              class: u(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
               "content-class": s.headerClass,
               type: "header",
               "show-close-button": s.showCloseButton,
@@ -2194,71 +2238,71 @@ function ot(e, t, s, i, a, o) {
               onClose: o.closePopover
             }, {
               content: p(() => [
-                d(e.$slots, "headerContent", { close: o.closePopover })
+                c(e.$slots, "headerContent", { close: o.closePopover })
               ]),
               _: 3
-            }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : r("", !0),
+            }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : d("", !0),
             _("div", {
               ref: "popover__content",
               "data-qa": "dt-popover-content",
-              class: c([
+              class: u([
                 "d-popover__content",
                 a.POPOVER_PADDING_CLASSES[s.padding],
                 s.contentClass
               ])
             }, [
-              d(e.$slots, "content", { close: o.closePopover })
+              c(e.$slots, "content", { close: o.closePopover })
             ], 2),
-            a.hasSlotContent(e.$slots.footerContent) ? (n(), u(f, {
+            a.hasSlotContent(e.$slots.footerContent) ? (n(), h(f, {
               key: 1,
               ref: "popover__footer",
               type: "footer",
-              class: c(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
+              class: u(a.POPOVER_HEADER_FOOTER_PADDING_CLASSES[s.padding]),
               "content-class": s.footerClass
             }, {
               content: p(() => [
-                d(e.$slots, "footerContent", { close: o.closePopover })
+                c(e.$slots, "footerContent", { close: o.closePopover })
               ]),
               _: 3
-            }, 8, ["class", "content-class"])) : r("", !0),
-            e.showVisuallyHiddenClose ? (n(), u(g, {
+            }, 8, ["class", "content-class"])) : d("", !0),
+            e.showVisuallyHiddenClose ? (n(), h(g, {
               key: 2,
               "visually-hidden-close-label": e.visuallyHiddenCloseLabel,
               onClose: o.closePopover
-            }, null, 8, ["visually-hidden-close-label", "onClose"])) : r("", !0)
+            }, 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"])
+        }, 16, ["id", "role", "aria-hidden", "aria-labelledby", "aria-label", "aria-modal", "transition", "show", "appear", "class", "style", "css", "tabindex", "onMouseenter", "onMouseleave"])
       ]),
       _: 3
     }, 8, ["class"]))
   ]);
 }
-const vt = /* @__PURE__ */ y(et, [["render", ot]]);
-function H(e) {
+const bt = /* @__PURE__ */ y(tt, [["render", at]]);
+function B(e) {
   return e === v.default;
 }
-function B(e) {
+function q(e) {
   if (w(e) === "string")
-    return H(e) ? null : v[e];
+    return B(e) ? null : v[e];
   if (w(e) === "object") {
     const { default: t } = e;
-    return H(t) ? null : v[t];
+    return B(t) ? null : v[t];
   } else
     return null;
 }
 function w(e) {
   return typeof e;
 }
-function at(e) {
-  return B(e) ? `d-stack--${v[B(e)]}` : null;
-}
 function nt(e) {
+  return q(e) ? `d-stack--${v[q(e)]}` : null;
+}
+function it(e) {
   return w(e) === "object" ? [
-    ...W.map((t) => e[t] ? `d-stack--${t}--${e[t]}` : null)
+    ...G.map((t) => e[t] ? `d-stack--${t}--${e[t]}` : null)
   ] : null;
 }
-function it(e) {
+function rt(e) {
   return R.includes(e) ? `d-stack--gap-${e}` : null;
 }
 function lt(e) {
@@ -2270,10 +2314,10 @@ function lt(e) {
   } else
     return null;
 }
-function rt(e) {
+function dt(e) {
   return R.includes(e);
 }
-const dt = {
+const ct = {
   name: "DtStack",
   props: {
     /**
@@ -2303,31 +2347,31 @@ const dt = {
     gap: {
       type: String,
       default: "0",
-      validator: (e) => rt(e)
+      validator: (e) => dt(e)
     }
   },
   data() {
     return {
       DT_STACK_DIRECTION: v,
       DT_STACK_GAP: R,
-      DT_STACK_RESPONSIVE_BREAKPOINTS: W
+      DT_STACK_RESPONSIVE_BREAKPOINTS: G
     };
   },
   computed: {
     stackGap() {
-      return it(this.gap);
+      return rt(this.gap);
     },
     defaultDirection() {
-      return at(this.direction);
+      return nt(this.direction);
     },
     stackResponsive() {
-      return nt(this.direction);
+      return it(this.direction);
     }
   }
 };
-function ct(e, t, s, i, a, o) {
-  return n(), u(k(s.as), {
-    class: c([
+function ut(e, t, s, i, a, o) {
+  return n(), h(E(s.as), {
+    class: u([
       "d-stack",
       o.defaultDirection,
       o.stackResponsive,
@@ -2335,43 +2379,43 @@ function ct(e, t, s, i, a, o) {
     ])
   }, {
     default: p(() => [
-      d(e.$slots, "default")
+      c(e.$slots, "default")
     ]),
     _: 3
   }, 8, ["class"]);
 }
-const bt = /* @__PURE__ */ y(dt, [["render", ct]]);
+const _t = /* @__PURE__ */ y(ct, [["render", ut]]);
 export {
   L as A,
-  yt as D,
+  gt as D,
   C as L,
-  Re as M,
-  Ye as P,
-  Le as S,
-  bt as a,
-  mt as b,
-  ft as c,
-  vt as d,
+  xe as M,
+  Ze as P,
+  De as S,
+  _t as a,
+  yt as b,
+  mt as c,
+  bt as d,
   Ae as e,
   R as f,
-  $e as g,
-  z as h,
-  he as i,
-  pe as j,
-  x as k,
-  fe as l,
-  me as m,
-  F as n,
+  Ye as g,
+  V as h,
+  pe as i,
+  fe as j,
+  F as k,
+  me as l,
+  ye as m,
+  z as n,
   D as o,
-  V as p,
-  We as q,
-  Ge as r,
-  Ue as s,
-  Ze as t,
-  gt as u,
-  ue as v,
+  H as p,
+  Ge as q,
+  Ue as r,
+  $e as s,
+  Xe as t,
+  vt as u,
+  he as v,
   S as w,
-  ie as x,
+  re as x,
   v as y,
-  W as z
+  G as z
 };