@dialpad/dialtone 9.66.0 → 9.67.0

package/dist/vue3/lib/popover.cjs

@@ -1,19 +1,19 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const popover_constants = require("../chunks/popover_constants-h9MD6WUt.js");
+const popover_constants = require("../chunks/popover_constants-XnGWXaxX.js");
 const common_utils = require("../common/utils.cjs");
-const modal = require("../chunks/modal-OaWxzqNt.js");
+const modal = require("../chunks/modal-VgxXAQFP.js");
 const vue = require("vue");
 const _pluginVue_exportHelper = require("../chunks/_plugin-vue_export-helper-fhnQq0tA.js");
 const lib_button = require("./button.cjs");
 const lib_icon = require("./icon.cjs");
-const sr_only_close_button = require("../chunks/sr_only_close_button-gKr0Vlbz.js");
+const sr_only_close_button = require("../chunks/sr_only_close_button-xGrHFjwA.js");
 const lib_lazyShow = require("./lazy-show.cjs");
 require("tippy.js");
 require("../common/constants.cjs");
 require("../chunks/link_constants-x8NwdqmA.js");
 require("@dialpad/dialtone-icons/vue3");
-require("../chunks/icon_constants-bvhFNOPu.js");
+require("../chunks/icon_constants-QYpmdE0R.js");
 require("@dialpad/dialtone-icons/icons.json");
 const _sfc_main$1 = {
   name: "PopoverHeaderFooter",
@@ -85,33 +85,40 @@ 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) ? (vue.openBlock(), vue.createElementBlock("div", {
-    key: 0,
-    "data-qa": "dt-popover-header-footer-content",
-    class: vue.normalizeClass([{
-      "d-popover__header__content": $props.type === "header",
-      "d-popover__footer__content": $props.type === "footer"
-    }, $props.contentClass])
-  }, [vue.renderSlot(_ctx.$slots, "content")], 2)) : vue.createCommentVNode("", true), $props.showCloseButton ? (vue.openBlock(), vue.createBlock(_component_dt_button, vue.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: vue.withCtx(() => [vue.createVNode(_component_dt_icon, {
-      name: "close",
-      size: "300"
-    })]),
-    _: 1
-  }, 16, ["class"])) : vue.createCommentVNode("", true)], 2);
+  }, [
+    $data.hasSlotContent(_ctx.$slots.content) ? (vue.openBlock(), vue.createElementBlock("div", {
+      key: 0,
+      "data-qa": "dt-popover-header-footer-content",
+      class: vue.normalizeClass([{
+        "d-popover__header__content": $props.type === "header",
+        "d-popover__footer__content": $props.type === "footer"
+      }, $props.contentClass])
+    }, [
+      vue.renderSlot(_ctx.$slots, "content")
+    ], 2)) : vue.createCommentVNode("", true),
+    $props.showCloseButton ? (vue.openBlock(), vue.createBlock(_component_dt_button, vue.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: vue.withCtx(() => [
+        vue.createVNode(_component_dt_icon, {
+          name: "close",
+          size: "300"
+        })
+      ]),
+      _: 1
+    }, 16, ["class"])) : vue.createCommentVNode("", true)
+  ], 2);
 }
 const PopoverHeaderFooter = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 const _sfc_main = {
@@ -745,9 +752,7 @@ 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");
         }
@@ -763,9 +768,7 @@ 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");
       }
@@ -995,103 +998,123 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_popover_header_footer = vue.resolveComponent("popover-header-footer");
   const _component_sr_only_close_button = vue.resolveComponent("sr-only-close-button");
   const _component_dt_lazy_show = vue.resolveComponent("dt-lazy-show");
-  return vue.openBlock(), vue.createElementBlock("div", null, [$props.modal && $data.isOpen ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
-    key: 0,
-    to: "body"
-  }, [vue.createElementVNode("div", {
-    class: "d-modal--transparent",
-    "aria-hidden": $props.modal && $data.isOpen ? "false" : "true",
-    onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
-    }, ["prevent", "stop"]))
-  }, null, 8, _hoisted_1)])) : vue.createCommentVNode("", true), (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.elementType), {
-    ref: "popover",
-    class: vue.normalizeClass(["d-popover", {
-      "d-popover__anchor--opened": $data.isOpen
-    }]),
-    "data-qa": "dt-popover-container"
-  }, {
-    default: vue.withCtx(() => [vue.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] = vue.withKeys(vue.withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["up"])), _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["down"])), _cache[6] || (_cache[6] = vue.withKeys(($event) => _ctx.$emit("keydown", $event), ["enter"])), _cache[7] || (_cache[7] = vue.withKeys(($event) => _ctx.$emit("keydown", $event), ["space"]))],
-      onKeydownCapture: _cache[5] || (_cache[5] = vue.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))
-    }, [vue.renderSlot(_ctx.$slots, "anchor", {
-      attrs: {
-        "aria-expanded": $data.isOpen.toString(),
-        "aria-controls": $props.id,
-        "aria-haspopup": $props.role
-      }
-    })], 40, _hoisted_2), vue.createVNode(_component_dt_lazy_show, vue.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
-    }, vue.toHandlers($options.popoverListeners), {
-      onMouseenter: $options.onEnterContent,
-      onMouseleave: $options.onLeaveContent
-    }), {
-      default: vue.withCtx(() => [$data.hasSlotContent(_ctx.$slots.headerContent) || $props.showCloseButton ? (vue.openBlock(), vue.createBlock(_component_popover_header_footer, {
-        key: 0,
-        ref: "popover__header",
-        class: vue.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: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "headerContent", {
-          close: $options.closePopover
-        })]),
-        _: 3
-      }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : vue.createCommentVNode("", true), vue.createElementVNode("div", {
-        ref: "popover__content",
-        "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-content` : "dt-popover-content",
-        class: vue.normalizeClass(["d-popover__content", $data.POPOVER_PADDING_CLASSES[$props.padding], $props.contentClass])
-      }, [vue.renderSlot(_ctx.$slots, "content", {
-        close: $options.closePopover
-      })], 10, _hoisted_3), $data.hasSlotContent(_ctx.$slots.footerContent) ? (vue.openBlock(), vue.createBlock(_component_popover_header_footer, {
-        key: 1,
-        ref: "popover__footer",
-        type: "footer",
-        class: vue.normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
-        "content-class": $props.footerClass
-      }, {
-        content: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "footerContent", {
-          close: $options.closePopover
-        })]),
-        _: 3
-      }, 8, ["class", "content-class"])) : vue.createCommentVNode("", true), _ctx.showVisuallyHiddenClose ? (vue.openBlock(), vue.createBlock(_component_sr_only_close_button, {
-        key: 2,
-        "visually-hidden-close-label": _ctx.visuallyHiddenCloseLabel,
-        onClose: $options.closePopover
-      }, null, 8, ["visually-hidden-close-label", "onClose"])) : vue.createCommentVNode("", true)]),
+  return vue.openBlock(), vue.createElementBlock("div", null, [
+    $props.modal && $data.isOpen ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
+      key: 0,
+      to: "body"
+    }, [
+      vue.createElementVNode("div", {
+        class: "d-modal--transparent",
+        "aria-hidden": $props.modal && $data.isOpen ? "false" : "true",
+        onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
+        }, ["prevent", "stop"]))
+      }, null, 8, _hoisted_1)
+    ])) : vue.createCommentVNode("", true),
+    (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.elementType), {
+      ref: "popover",
+      class: vue.normalizeClass(["d-popover", { "d-popover__anchor--opened": $data.isOpen }]),
+      "data-qa": "dt-popover-container"
+    }, {
+      default: vue.withCtx(() => [
+        vue.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] = vue.withKeys(vue.withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["up"])),
+            _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers((...args) => $options.onArrowKeyPress && $options.onArrowKeyPress(...args), ["prevent"]), ["down"])),
+            _cache[6] || (_cache[6] = vue.withKeys(($event) => _ctx.$emit("keydown", $event), ["enter"])),
+            _cache[7] || (_cache[7] = vue.withKeys(($event) => _ctx.$emit("keydown", $event), ["space"]))
+          ],
+          onKeydownCapture: _cache[5] || (_cache[5] = vue.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))
+        }, [
+          vue.renderSlot(_ctx.$slots, "anchor", {
+            attrs: {
+              "aria-expanded": $data.isOpen.toString(),
+              "aria-controls": $props.id,
+              "aria-haspopup": $props.role
+            }
+          })
+        ], 40, _hoisted_2),
+        vue.createVNode(_component_dt_lazy_show, vue.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
+        }, vue.toHandlers($options.popoverListeners), {
+          onMouseenter: $options.onEnterContent,
+          onMouseleave: $options.onLeaveContent
+        }), {
+          default: vue.withCtx(() => [
+            $data.hasSlotContent(_ctx.$slots.headerContent) || $props.showCloseButton ? (vue.openBlock(), vue.createBlock(_component_popover_header_footer, {
+              key: 0,
+              ref: "popover__header",
+              class: vue.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: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "headerContent", { close: $options.closePopover })
+              ]),
+              _: 3
+            }, 8, ["class", "content-class", "show-close-button", "close-button-props", "onClose"])) : vue.createCommentVNode("", true),
+            vue.createElementVNode("div", {
+              ref: "popover__content",
+              "data-qa": _ctx.$attrs["data-qa"] ? `${_ctx.$attrs["data-qa"]}-content` : "dt-popover-content",
+              class: vue.normalizeClass([
+                "d-popover__content",
+                $data.POPOVER_PADDING_CLASSES[$props.padding],
+                $props.contentClass
+              ])
+            }, [
+              vue.renderSlot(_ctx.$slots, "content", { close: $options.closePopover })
+            ], 10, _hoisted_3),
+            $data.hasSlotContent(_ctx.$slots.footerContent) ? (vue.openBlock(), vue.createBlock(_component_popover_header_footer, {
+              key: 1,
+              ref: "popover__footer",
+              type: "footer",
+              class: vue.normalizeClass($data.POPOVER_HEADER_FOOTER_PADDING_CLASSES[$props.padding]),
+              "content-class": $props.footerClass
+            }, {
+              content: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "footerContent", { close: $options.closePopover })
+              ]),
+              _: 3
+            }, 8, ["class", "content-class"])) : vue.createCommentVNode("", true),
+            _ctx.showVisuallyHiddenClose ? (vue.openBlock(), vue.createBlock(_component_sr_only_close_button, {
+              key: 2,
+              "visually-hidden-close-label": _ctx.visuallyHiddenCloseLabel,
+              onClose: $options.closePopover
+            }, null, 8, ["visually-hidden-close-label", "onClose"])) : vue.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"])
+      ]),
       _: 3
-    }, 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"]))]);
+    }, 8, ["class"]))
+  ]);
 }
 const DtPopover = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
 exports.POPOVER_APPEND_TO_VALUES = popover_constants.POPOVER_APPEND_TO_VALUES;