@dialpad/dialtone-vue 3.145.1 → 3.146.0

package/dist/lib/popover.js

@@ -1,18 +1,18 @@
-import { POPOVER_ROLES, POPOVER_PADDING_CLASSES, POPOVER_CONTENT_WIDTHS, POPOVER_STICKY_VALUES, POPOVER_INITIAL_FOCUS_STRINGS, POPOVER_APPEND_TO_VALUES, POPOVER_HEADER_FOOTER_PADDING_CLASSES, getPopperOptions, createTippyPopover, TOOLTIP_DELAY_MS } from "../chunks/popover_constants-WsOUIY-m.js";
-import { POPOVER_DIRECTIONS } from "../chunks/popover_constants-WsOUIY-m.js";
+import { POPOVER_ROLES, POPOVER_PADDING_CLASSES, POPOVER_CONTENT_WIDTHS, POPOVER_STICKY_VALUES, POPOVER_INITIAL_FOCUS_STRINGS, POPOVER_APPEND_TO_VALUES, POPOVER_HEADER_FOOTER_PADDING_CLASSES, getPopperOptions, createTippyPopover, TOOLTIP_DELAY_MS } from "../chunks/popover_constants-6YkPPbnk.js";
+import { POPOVER_DIRECTIONS } from "../chunks/popover_constants-6YkPPbnk.js";
 import { hasSlotContent, getUniqueString, isOutOfViewPort } from "../common/utils.js";
-import { Modal } from "../chunks/modal-XOr4kiNZ.js";
+import { Modal } from "../chunks/modal-8X6poIZW.js";
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createBlock, mergeProps, withCtx, createVNode, Teleport, createElementVNode, withModifiers, resolveDynamicComponent, withKeys, toHandlers } from "vue";
 import { _export_sfc } from "../chunks/_plugin-vue_export-helper-caHeSgYY.js";
 import { DtButton } from "./button.js";
 import { DtIcon } from "./icon.js";
-import { SrOnlyCloseButton, SrOnlyCloseButtonMixin } from "../chunks/sr_only_close_button-3EdsV-dH.js";
+import { SrOnlyCloseButton, SrOnlyCloseButtonMixin } from "../chunks/sr_only_close_button-Ji3Zlts6.js";
 import { DtLazyShow } from "./lazy-show.js";
 import "tippy.js";
 import "../common/constants.js";
 import "../chunks/link_constants-AfTWrr-n.js";
 import "@dialpad/dialtone-icons/vue3";
-import "../chunks/icon_constants-Dy4MEUJL.js";
+import "../chunks/icon_constants-gIQj4mf7.js";
 import "@dialpad/dialtone-icons/icons.json";
 const _sfc_main$1 = {
   name: "PopoverHeaderFooter",
@@ -84,40 +84,33 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
       "d-popover__header": $props.type === "header",
       "d-popover__footer": $props.type === "footer"
     })
-  }, [
-    $data.hasSlotContent(_ctx.$slots.content) ? (openBlock(), createElementBlock("div", {
-      key: 0,
-      "data-qa": "dt-popover-header-footer-content",
-      class: normalizeClass([{
-        "d-popover__header__content": $props.type === "header",
-        "d-popover__footer__content": $props.type === "footer"
-      }, $props.contentClass])
-    }, [
-      renderSlot(_ctx.$slots, "content")
-    ], 2)) : createCommentVNode("", true),
-    $props.showCloseButton ? (openBlock(), createBlock(_component_dt_button, mergeProps({
-      key: 1,
-      ref: "popover__close-button",
-      "data-qa": "dt-popover-close",
-      class: {
-        "d-popover__header__close-button": $props.type === "header",
-        "d-popover__footer__close-button": $props.type === "footer"
-      },
-      importance: "outlined",
-      kind: "muted",
-      circle: ""
-    }, $props.closeButtonProps, {
-      onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
-    }), {
-      icon: withCtx(() => [
-        createVNode(_component_dt_icon, {
-          name: "close",
-          size: "300"
-        })
-      ]),
-      _: 1
-    }, 16, ["class"])) : createCommentVNode("", true)
-  ], 2);
+  }, [$data.hasSlotContent(_ctx.$slots.content) ? (openBlock(), createElementBlock("div", {
+    key: 0,
+    "data-qa": "dt-popover-header-footer-content",
+    class: normalizeClass([{
+      "d-popover__header__content": $props.type === "header",
+      "d-popover__footer__content": $props.type === "footer"
+    }, $props.contentClass])
+  }, [renderSlot(_ctx.$slots, "content")], 2)) : createCommentVNode("", true), $props.showCloseButton ? (openBlock(), createBlock(_component_dt_button, mergeProps({
+    key: 1,
+    ref: "popover__close-button",
+    "data-qa": "dt-popover-close",
+    class: {
+      "d-popover__header__close-button": $props.type === "header",
+      "d-popover__footer__close-button": $props.type === "footer"
+    },
+    importance: "outlined",
+    kind: "muted",
+    circle: ""
+  }, $props.closeButtonProps, {
+    onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
+  }), {
+    icon: withCtx(() => [createVNode(_component_dt_icon, {
+      name: "close",
+      size: "300"
+    })]),
+    _: 1
+  }, 16, ["class"])) : createCommentVNode("", true)], 2);
 }
 const PopoverHeaderFooter = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 const _sfc_main = {
@@ -751,7 +744,9 @@ const _sfc_main = {
           return;
         if (((_b = element.tagName) == null ? void 0 : _b.toLowerCase()) === "body") {
           element.classList.add("d-of-hidden");
-          this.tip.setProps({ offset: this.offset });
+          this.tip.setProps({
+            offset: this.offset
+          });
         } else {
           element.classList.add("d-zi-popover");
         }
@@ -767,7 +762,9 @@ const _sfc_main = {
         return;
       if (((_b = element.tagName) == null ? void 0 : _b.toLowerCase()) === "body") {
         element.classList.remove("d-of-hidden");
-        this.tip.setProps({ offset: this.offset });
+        this.tip.setProps({
+          offset: this.offset
+        });
       } else {
         element.classList.remove("d-zi-popover");
       }
@@ -997,123 +994,103 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_popover_header_footer = resolveComponent("popover-header-footer");
   const _component_sr_only_close_button = resolveComponent("sr-only-close-button");
   const _component_dt_lazy_show = resolveComponent("dt-lazy-show");
-  return openBlock(), createElementBlock("div", null, [
-    $props.modal && $data.isOpen ? (openBlock(), createBlock(Teleport, {
-      key: 0,
-      to: "body"
-    }, [
-      createElementVNode("div", {
-        class: "d-modal--transparent",
-        "aria-hidden": $props.modal && $data.isOpen ? "false" : "true",
-        onClick: _cache[0] || (_cache[0] = withModifiers(() => {
-        }, ["prevent", "stop"]))
-      }, null, 8, _hoisted_1)
-    ])) : createCommentVNode("", true),
-    (openBlock(), createBlock(resolveDynamicComponent($props.elementType), {
-      ref: "popover",
-      class: normalizeClass(["d-popover", { "d-popover__anchor--opened": $data.isOpen }]),
-      "data-qa": "dt-popover-container"
-    }, {
-      default: withCtx(() => [
-        createElementVNode("div", {
-          id: !$props.ariaLabelledby && $options.labelledBy,
-          ref: "anchor",
-          "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-anchor` : "dt-popover-anchor",
-          tabindex: $props.openOnContext ? 0 : void 0,
-          onClickCapture: _cache[1] || (_cache[1] = (...args) => $options.defaultToggleOpen && $options.defaultToggleOpen(...args)),
-          onContextmenu: _cache[2] || (_cache[2] = (...args) => $options.onContext && $options.onContext(...args)),
-          onKeydown: [
-            _cache[3] || (_cache[3] = withKeys(withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["up"])),
-            _cache[4] || (_cache[4] = withKeys(withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["down"])),
-            _cache[6] || (_cache[6] = withKeys(($event) => _ctx.$emit("keydown", $event), ["enter"])),
-            _cache[7] || (_cache[7] = withKeys(($event) => _ctx.$emit("keydown", $event), ["space"]))
-          ],
-          onKeydownCapture: _cache[5] || (_cache[5] = withKeys((...args) => $options.closePopover && $options.closePopover(...args), ["escape"])),
-          onMouseenter: _cache[8] || (_cache[8] = (...args) => $options.onEnterAnchor && $options.onEnterAnchor(...args)),
-          onMouseleave: _cache[9] || (_cache[9] = (...args) => $options.onLeaveAnchor && $options.onLeaveAnchor(...args))
-        }, [
-          renderSlot(_ctx.$slots, "anchor", {
-            attrs: {
-              "aria-expanded": $data.isOpen.toString(),
-              "aria-controls": $props.id,
-              "aria-haspopup": $props.role
-            }
-          })
-        ], 40, _hoisted_2),
-        createVNode(_component_dt_lazy_show, mergeProps({
-          id: $props.id,
-          ref: "content",
-          role: $props.role,
-          "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}__dialog` : "dt-popover",
-          "aria-hidden": `${!$data.isOpen}`,
-          "aria-labelledby": $options.labelledBy,
-          "aria-label": $props.ariaLabel,
-          "aria-modal": `${!$props.modal}`,
-          transition: $props.transition,
-          show: $data.isOpen,
-          appear: $data.toAppear,
-          class: ["d-popover__dialog", { "d-popover__dialog--modal": $props.modal }, $props.dialogClass],
-          style: {
-            "max-height": $options.calculatedMaxHeight,
-            "max-width": $props.maxWidth
-          },
-          css: _ctx.$attrs.css,
-          tabindex: $props.contentTabindex
-        }, toHandlers($options.popoverListeners), {
-          onMouseenter: $options.onEnterContent,
-          onMouseleave: $options.onLeaveContent
-        }), {
-          default: withCtx(() => [
-            $data.hasSlotContent(_ctx.$slots.headerContent) || $props.showCloseButton ? (openBlock(), createBlock(_component_popover_header_footer, {
-              key: 0,
-              ref: "popover__header",
-              class: normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
-              "content-class": $props.headerClass,
-              type: "header",
-              "show-close-button": $props.showCloseButton,
-              "close-button-props": $props.closeButtonProps,
-              onClose: $options.closePopover
-            }, {
-              content: withCtx(() => [
-                renderSlot(_ctx.$slots, "headerContent", { close: $options.closePopover })
-              ]),
-              _: 3
-            }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : createCommentVNode("", true),
-            createElementVNode("div", {
-              ref: "popover__content",
-              "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-content` : "dt-popover-content",
-              class: normalizeClass([
-                "d-popover__content",
-                $data.POPOVER_PADDING_CLASSES[$props.padding],
-                $props.contentClass
-              ])
-            }, [
-              renderSlot(_ctx.$slots, "content", { close: $options.closePopover })
-            ], 10, _hoisted_3),
-            $data.hasSlotContent(_ctx.$slots.footerContent) ? (openBlock(), createBlock(_component_popover_header_footer, {
-              key: 1,
-              ref: "popover__footer",
-              type: "footer",
-              class: normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
-              "content-class": $props.footerClass
-            }, {
-              content: withCtx(() => [
-                renderSlot(_ctx.$slots, "footerContent", { close: $options.closePopover })
-              ]),
-              _: 3
-            }, 8, ["class", "content-class"])) : createCommentVNode("", true),
-            _ctx.showVisuallyHiddenClose ? (openBlock(), createBlock(_component_sr_only_close_button, {
-              key: 2,
-              "visually-hidden-close-label": _ctx.visuallyHiddenCloseLabel,
-              onClose: $options.closePopover
-            }, null, 8, ["visually-hidden-close-label", "onClose"])) : createCommentVNode("", true)
-          ]),
-          _: 3
-        }, 16, ["id", "role", "data-qa", "aria-hidden", "aria-labelledby", "aria-label", "aria-modal", "transition", "show", "appear", "class", "style", "css", "tabindex", "onMouseenter", "onMouseleave"])
-      ]),
+  return openBlock(), createElementBlock("div", null, [$props.modal && $data.isOpen ? (openBlock(), createBlock(Teleport, {
+    key: 0,
+    to: "body"
+  }, [createElementVNode("div", {
+    class: "d-modal--transparent",
+    "aria-hidden": $props.modal && $data.isOpen ? "false" : "true",
+    onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+    }, ["prevent", "stop"]))
+  }, null, 8, _hoisted_1)])) : createCommentVNode("", true), (openBlock(), createBlock(resolveDynamicComponent($props.elementType), {
+    ref: "popover",
+    class: normalizeClass(["d-popover", {
+      "d-popover__anchor--opened": $data.isOpen
+    }]),
+    "data-qa": "dt-popover-container"
+  }, {
+    default: withCtx(() => [createElementVNode("div", {
+      id: !$props.ariaLabelledby && $options.labelledBy,
+      ref: "anchor",
+      "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-anchor` : "dt-popover-anchor",
+      tabindex: $props.openOnContext ? 0 : void 0,
+      onClickCapture: _cache[1] || (_cache[1] = (...args) => $options.defaultToggleOpen && $options.defaultToggleOpen(...args)),
+      onContextmenu: _cache[2] || (_cache[2] = (...args) => $options.onContext && $options.onContext(...args)),
+      onKeydown: [_cache[3] || (_cache[3] = withKeys(withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["up"])), _cache[4] || (_cache[4] = withKeys(withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["down"])), _cache[6] || (_cache[6] = withKeys(($event) => _ctx.$emit("keydown", $event), ["enter"])), _cache[7] || (_cache[7] = withKeys(($event) => _ctx.$emit("keydown", $event), ["space"]))],
+      onKeydownCapture: _cache[5] || (_cache[5] = withKeys((...args) => $options.closePopover && $options.closePopover(...args), ["escape"])),
+      onMouseenter: _cache[8] || (_cache[8] = (...args) => $options.onEnterAnchor && $options.onEnterAnchor(...args)),
+      onMouseleave: _cache[9] || (_cache[9] = (...args) => $options.onLeaveAnchor && $options.onLeaveAnchor(...args))
+    }, [renderSlot(_ctx.$slots, "anchor", {
+      attrs: {
+        "aria-expanded": $data.isOpen.toString(),
+        "aria-controls": $props.id,
+        "aria-haspopup": $props.role
+      }
+    })], 40, _hoisted_2), createVNode(_component_dt_lazy_show, mergeProps({
+      id: $props.id,
+      ref: "content",
+      role: $props.role,
+      "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}__dialog` : "dt-popover",
+      "aria-hidden": `${!$data.isOpen}`,
+      "aria-labelledby": $options.labelledBy,
+      "aria-label": $props.ariaLabel,
+      "aria-modal": `${!$props.modal}`,
+      transition: $props.transition,
+      show: $data.isOpen,
+      appear: $data.toAppear,
+      class: ["d-popover__dialog", {
+        "d-popover__dialog--modal": $props.modal
+      }, $props.dialogClass],
+      style: {
+        "max-height": $options.calculatedMaxHeight,
+        "max-width": $props.maxWidth
+      },
+      css: _ctx.$attrs.css,
+      tabindex: $props.contentTabindex
+    }, toHandlers($options.popoverListeners), {
+      onMouseenter: $options.onEnterContent,
+      onMouseleave: $options.onLeaveContent
+    }), {
+      default: withCtx(() => [$data.hasSlotContent(_ctx.$slots.headerContent) || $props.showCloseButton ? (openBlock(), createBlock(_component_popover_header_footer, {
+        key: 0,
+        ref: "popover__header",
+        class: normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
+        "content-class": $props.headerClass,
+        type: "header",
+        "show-close-button": $props.showCloseButton,
+        "close-button-props": $props.closeButtonProps,
+        onClose: $options.closePopover
+      }, {
+        content: withCtx(() => [renderSlot(_ctx.$slots, "headerContent", {
+          close: $options.closePopover
+        })]),
+        _: 3
+      }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : createCommentVNode("", true), createElementVNode("div", {
+        ref: "popover__content",
+        "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-content` : "dt-popover-content",
+        class: normalizeClass(["d-popover__content", $data.POPOVER_PADDING_CLASSES[$props.padding], $props.contentClass])
+      }, [renderSlot(_ctx.$slots, "content", {
+        close: $options.closePopover
+      })], 10, _hoisted_3), $data.hasSlotContent(_ctx.$slots.footerContent) ? (openBlock(), createBlock(_component_popover_header_footer, {
+        key: 1,
+        ref: "popover__footer",
+        type: "footer",
+        class: normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
+        "content-class": $props.footerClass
+      }, {
+        content: withCtx(() => [renderSlot(_ctx.$slots, "footerContent", {
+          close: $options.closePopover
+        })]),
+        _: 3
+      }, 8, ["class", "content-class"])) : createCommentVNode("", true), _ctx.showVisuallyHiddenClose ? (openBlock(), createBlock(_component_sr_only_close_button, {
+        key: 2,
+        "visually-hidden-close-label": _ctx.visuallyHiddenCloseLabel,
+        onClose: $options.closePopover
+      }, null, 8, ["visually-hidden-close-label", "onClose"])) : createCommentVNode("", true)]),
       _: 3
-    }, 8, ["class"]))
-  ]);
+    }, 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 DtPopover = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {