@dialpad/dialtone 9.146.0 → 9.147.0

package/dist/vue3/lib/motion-text/motion-text.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion-text.cjs","sources":["../../../recipes/motion/motion_text/motion_text.vue"],"sourcesContent":["<template>\n  <span\n    ref=\"contentRef\"\n    :class=\"motionTextClasses\"\n    :style=\"componentStyles\"\n    :data-text-content=\"isStaticAnimationMode ? text : undefined\"\n    :aria-live=\"isAnimating ? 'polite' : 'off'\"\n    :aria-label=\"screenReaderText || undefined\"\n  >\n    <!-- Screen reader content -->\n    <span\n      v-if=\"screenReaderText\"\n      class=\"dt-recipe-motion-text__sr-only\"\n    >\n      {{ screenReaderText }}\n    </span>\n\n    <!-- Gradient-sweep and shimmer modes: Simple static text with gradient animation -->\n    <template v-if=\"isStaticAnimationMode\">\n      {{ text }}\n      <slot v-if=\"!text\" />\n    </template>\n\n    <!-- Character-by-character animated content for other modes -->\n    <span\n      v-else\n      :key=\"animationKey\"\n      class=\"dt-recipe-motion-text__content\"\n      :aria-hidden=\"isAnimating\"\n    >\n      <template\n        v-for=\"(word, wordIdx) in words\"\n        :key=\"`${animationKey}-${wordIdx}`\"\n      >\n        <Transition\n          :name=\"`dt-recipe-motion-text-word-${animationMode}`\"\n        >\n          <span\n            v-if=\"wordIdx < visibleWordCount\"\n            class=\"dt-recipe-motion-text__word\"\n            :data-text-content=\"word.text\"\n            :style=\"{ '--word-index': wordIdx }\"\n          >\n            <template\n              v-for=\"(char, charIdx) in word.chars\"\n              :key=\"`${animationKey}-${wordIdx}-${charIdx}`\"\n            >\n              <Transition\n                :name=\"`dt-recipe-motion-text-char-${animationMode}`\"\n              >\n                <span\n                  v-if=\"charIdx < visibleCharsPerWord[wordIdx]\"\n                  class=\"dt-recipe-motion-text__char\"\n                  :style=\"{\n                    '--char-index': charIdx,\n                    '--char-delay': `${charIdx * timing.characterDelay}ms`,\n                  }\"\n                >{{ char }}</span>\n              </Transition>\n            </template>\n          </span>\n        </Transition>\n      </template>\n    </span>\n\n    <!-- Fallback slot content -->\n    <span\n      v-if=\"!words.length && !text && !isStaticAnimationMode\"\n      class=\"dt-recipe-motion-text__fallback\"\n    >\n      <slot />\n    </span>\n  </span>\n</template>\n\n<script>\nimport { MOTION_TEXT_ANIMATION_MODES, MOTION_TEXT_SPEEDS, MOTION_TEXT_TIMING_PRESETS } from './motion_text_constants';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeMotionText',\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * The text content to animate.\n     * @type {string}\n     */\n    text: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * The animation mode to use for the text reveal.\n     * @values gradient-in, fade-in, slide-in, gradient-sweep, shimmer, none\n     */\n    animationMode: {\n      type: String,\n      default: 'gradient-in',\n      validator: (value) => MOTION_TEXT_ANIMATION_MODES.includes(value),\n    },\n\n    /**\n     * Animation speed using t-shirt sizing.\n     * @values sm, md, lg\n     */\n    speed: {\n      type: String,\n      default: 'md',\n      validator: (value) => MOTION_TEXT_SPEEDS.includes(value),\n    },\n\n    /**\n     * Whether to start animation automatically when component is mounted.\n     * @values true, false\n     */\n    autoStart: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Whether to loop the animation continuously.\n     * @values true, false\n     */\n    loop: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether to respect the user's prefers-reduced-motion system setting.\n     * @values true, false\n     */\n    respectsReducedMotion: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Alternative text for screen readers. If provided, this will be announced\n     * instead of the animated text.\n     * @type {string}\n     */\n    screenReaderText: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when the animation starts.\n     * @event start\n     */\n    'start',\n\n    /**\n     * Emitted when the animation completes.\n     * @event complete\n     */\n    'complete',\n\n    /**\n     * Emitted during animation progress.\n     * @event progress\n     * @type {{ wordsComplete: number, totalWords: number, progress: number }}\n     */\n    'progress',\n\n    /**\n     * Emitted when the animation is paused.\n     * @event pause\n     */\n    'pause',\n\n    /**\n     * Emitted when the animation resumes.\n     * @event resume\n     */\n    'resume',\n  ],\n\n  data () {\n    return {\n      words: [],\n      visibleWordCount: 0,\n      visibleCharsPerWord: [],\n      isAnimating: false,\n      isPaused: false,\n      isLooped: false,\n      animationTimeouts: [],\n      prefersReducedMotion: false,\n      animationKey: 0,\n    };\n  },\n\n  computed: {\n    /**\n     * Get timing preset based on speed prop\n     */\n    timing () {\n      return MOTION_TEXT_TIMING_PRESETS[this.speed];\n    },\n\n    /**\n     * Computed styles with timing CSS variables\n     */\n    componentStyles () {\n      return {\n        '--dt-recipe-motion-text-duration': `${this.timing.duration}ms`,\n        '--dt-recipe-motion-text-char-duration': `${this.timing.duration}ms`,\n        '--dt-recipe-motion-text-word-duration': `${this.timing.duration * 2}ms`,\n      };\n    },\n\n    /**\n     * Check if current animation mode is static (gradient-sweep or shimmer)\n     */\n    isStaticAnimationMode () {\n      return this.animationMode === 'gradient-sweep' || this.animationMode === 'shimmer';\n    },\n\n    /**\n     * Computed classes for the motion text element\n     */\n    motionTextClasses () {\n      return [\n        'dt-recipe-motion-text',\n        `dt-recipe-motion-text--${this.animationMode}`,\n        {\n          'dt-recipe-motion-text--animating': this.isAnimating,\n          'dt-recipe-motion-text--paused': this.isPaused,\n          'dt-recipe-motion-text--looped': this.isLooped,\n        },\n        this.$attrs.class,\n      ];\n    },\n  },\n\n  watch: {\n    text () {\n      this.reset();\n      this.initializeContent();\n    },\n\n    loop: {\n      handler (newVal) {\n        this.isLooped = newVal;\n      },\n\n      immediate: true,\n    },\n  },\n\n  mounted () {\n    this.checkReducedMotion();\n    this.initializeContent();\n  },\n\n  beforeUnmount () {\n    this.clearTimeouts();\n  },\n\n  methods: {\n    /**\n     * Self-contained text processing from DOM nodes\n     */\n    processTextToChars (node) {\n      const words = [];\n\n      const processNode = (node, index = 0) => {\n        if (node.nodeType === Node.TEXT_NODE) {\n          const matches = node.textContent?.match(/\\S+\\s*/g) || [];\n          words.push(...matches.map((text, i) => ({\n            text,\n            chars: text.split(''),\n            index: index + i,\n          })));\n          return index + matches.length;\n        } else if (node.nodeType === Node.ELEMENT_NODE) {\n          let currentIdx = index;\n          Array.from(node.childNodes).forEach(child => {\n            currentIdx = processNode(child, currentIdx);\n          });\n          return currentIdx;\n        }\n        return index;\n      };\n\n      processNode(node);\n      return words;\n    },\n\n    /**\n     * Process direct text prop into word/character data\n     */\n    processDirectText (text) {\n      if (!text) return [];\n\n      const matches = text.match(/\\S+\\s*/g) || [];\n      return matches.map((wordText, i) => ({\n        text: wordText,\n        chars: wordText.split(''),\n        index: i,\n      }));\n    },\n\n    /**\n     * Check for reduced motion preference\n     */\n    checkReducedMotion () {\n      if (typeof window !== 'undefined' && window.matchMedia) {\n        this.prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n      }\n    },\n\n    /**\n     * Clear all animation timeouts\n     */\n    clearTimeouts () {\n      this.animationTimeouts.forEach(timeout => clearTimeout(timeout));\n      this.animationTimeouts = [];\n    },\n\n    /**\n     * Start the animation\n     * @public\n     */\n    start () {\n      if (this.isAnimating) return;\n\n      this.isAnimating = true;\n      this.isPaused = false;\n      this.$emit('start');\n\n      // Skip animation if reduced motion is preferred and enabled\n      if (this.respectsReducedMotion && this.prefersReducedMotion) {\n        this.showAllContent();\n        return;\n      }\n\n      if (this.animationMode === 'none') {\n        this.showAllContent();\n        return;\n      }\n\n      // For gradient-sweep and shimmer modes, just mark as animating (CSS handles the animation)\n      if (this.isStaticAnimationMode) {\n        return;\n      }\n\n      // Start the word-by-word animation for \"-in\" modes\n      this.showNextWord();\n    },\n\n    /**\n     * Pause the animation\n     * @public\n     */\n    pause () {\n      if (!this.isAnimating || this.isPaused) return;\n\n      this.isPaused = true;\n      this.clearTimeouts();\n      this.$emit('pause');\n    },\n\n    /**\n     * Resume the animation\n     * @public\n     */\n    resume () {\n      if (!this.isPaused) return;\n\n      this.isPaused = false;\n      this.$emit('resume');\n      this.showNextWord();\n    },\n\n    /**\n     * Reset the animation to initial state\n     * @public\n     */\n    reset () {\n      this.clearTimeouts();\n      this.isAnimating = false;\n      this.isPaused = false;\n      this.visibleWordCount = 0;\n      this.visibleCharsPerWord = Array(this.words.length).fill(0);\n      this.animationKey++;\n    },\n\n    /**\n     * Skip to the end of the animation\n     * @public\n     */\n    skipToEnd () {\n      this.showAllContent();\n    },\n\n    /**\n     * Show all content immediately\n     */\n    showAllContent () {\n      this.visibleWordCount = this.words.length;\n      this.visibleCharsPerWord = this.words.map(word => word.chars.length);\n      setTimeout(() => {\n        this.isAnimating = false;\n        this.$emit('complete');\n      }, 0);\n    },\n\n    /**\n     * Show next word in sequence\n     */\n    showNextWord () {\n      if (this.isPaused || this.visibleWordCount >= this.words.length) {\n        if (this.visibleWordCount >= this.words.length) {\n          this.completeAnimation();\n        }\n        return;\n      }\n\n      const timeout = setTimeout(() => {\n        this.visibleWordCount++;\n        this.$emit('progress', {\n          wordsComplete: this.visibleWordCount,\n          totalWords: this.words.length,\n          progress: this.visibleWordCount / this.words.length,\n        });\n\n        this.animateCharsForWord(this.visibleWordCount - 1);\n      }, this.timing.wordDelay);\n\n      this.animationTimeouts.push(timeout);\n    },\n\n    /**\n     * Animate characters for a specific word\n     */\n    animateCharsForWord (wordIdx) {\n      if (this.isPaused || wordIdx >= this.words.length) return;\n\n      this.visibleCharsPerWord[wordIdx] = 0;\n      const chars = this.words[wordIdx].chars.length;\n\n      const revealChar = () => {\n        if (this.isPaused || this.visibleCharsPerWord[wordIdx] >= chars) {\n          if (this.visibleCharsPerWord[wordIdx] >= chars) {\n            this.showNextWord();\n          }\n          return;\n        }\n\n        this.visibleCharsPerWord[wordIdx]++;\n        const timeout = setTimeout(revealChar, this.timing.characterDelay);\n        this.animationTimeouts.push(timeout);\n      };\n\n      revealChar();\n    },\n\n    /**\n     * Complete the animation\n     */\n    completeAnimation () {\n      this.isAnimating = false;\n      this.clearTimeouts();\n\n      this.$emit('complete');\n\n      if (this.loop) {\n        const timeout = setTimeout(() => {\n          this.reset();\n          this.$nextTick(() => {\n            this.start();\n          });\n        }, 500);\n\n        this.animationTimeouts.push(timeout);\n      }\n    },\n\n    /**\n     * Initialize content based on text prop or slot content\n     */\n    initializeContent () {\n      // For gradient-sweep and shimmer modes, skip word/character processing\n      if (this.isStaticAnimationMode) {\n        if (this.autoStart) {\n          this.$nextTick(() => this.start());\n        }\n        return;\n      }\n\n      if (this.text) {\n        this.words = this.processDirectText(this.text);\n      } else if (this.$refs.contentRef) {\n        this.words = this.processTextToChars(this.$refs.contentRef);\n      }\n\n      this.visibleCharsPerWord = Array(this.words.length).fill(0);\n      this.visibleWordCount = 0;\n\n      if (this.autoStart && this.words.length > 0) {\n        this.$nextTick(() => this.start());\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","value","MOTION_TEXT_ANIMATION_MODES","MOTION_TEXT_SPEEDS","MOTION_TEXT_TIMING_PRESETS","newVal","node","words","processNode","index","matches","_a","text","i","currentIdx","child","wordText","timeout","word","wordIdx","chars","revealChar","_hoisted_1","_hoisted_3","_hoisted_4","_createElementBlock","_normalizeClass","$options","_normalizeStyle","$props","$data","_hoisted_2","_toDisplayString","_createCommentVNode","_openBlock","_Fragment","_createTextVNode","_renderSlot","_ctx","_renderList","_createBlock","_Transition","_withCtx","char","charIdx","_hoisted_5"],"mappings":"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"}

package/dist/vue3/lib/motion-text/motion-text.js

@@ -0,0 +1,389 @@
+import { MOTION_TEXT_SPEEDS as y, MOTION_TEXT_ANIMATION_MODES as M, MOTION_TEXT_TIMING_PRESETS as w } from "./motion-text-constants.js";
+import { createElementBlock as h, openBlock as s, normalizeStyle as u, normalizeClass as A, createCommentVNode as l, toDisplayString as f, Fragment as p, createTextVNode as W, renderSlot as T, renderList as g, createBlock as C, Transition as _, withCtx as x } from "vue";
+import { _ as v } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const S = {
+  compatConfig: { MODE: 3 },
+  name: "DtRecipeMotionText",
+  inheritAttrs: !1,
+  props: {
+    /**
+     * The text content to animate.
+     * @type {string}
+     */
+    text: {
+      type: String,
+      default: ""
+    },
+    /**
+     * The animation mode to use for the text reveal.
+     * @values gradient-in, fade-in, slide-in, gradient-sweep, shimmer, none
+     */
+    animationMode: {
+      type: String,
+      default: "gradient-in",
+      validator: (t) => M.includes(t)
+    },
+    /**
+     * Animation speed using t-shirt sizing.
+     * @values sm, md, lg
+     */
+    speed: {
+      type: String,
+      default: "md",
+      validator: (t) => y.includes(t)
+    },
+    /**
+     * Whether to start animation automatically when component is mounted.
+     * @values true, false
+     */
+    autoStart: {
+      type: Boolean,
+      default: !0
+    },
+    /**
+     * Whether to loop the animation continuously.
+     * @values true, false
+     */
+    loop: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Whether to respect the user's prefers-reduced-motion system setting.
+     * @values true, false
+     */
+    respectsReducedMotion: {
+      type: Boolean,
+      default: !0
+    },
+    /**
+     * Alternative text for screen readers. If provided, this will be announced
+     * instead of the animated text.
+     * @type {string}
+     */
+    screenReaderText: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: [
+    /**
+     * Emitted when the animation starts.
+     * @event start
+     */
+    "start",
+    /**
+     * Emitted when the animation completes.
+     * @event complete
+     */
+    "complete",
+    /**
+     * Emitted during animation progress.
+     * @event progress
+     * @type {{ wordsComplete: number, totalWords: number, progress: number }}
+     */
+    "progress",
+    /**
+     * Emitted when the animation is paused.
+     * @event pause
+     */
+    "pause",
+    /**
+     * Emitted when the animation resumes.
+     * @event resume
+     */
+    "resume"
+  ],
+  data() {
+    return {
+      words: [],
+      visibleWordCount: 0,
+      visibleCharsPerWord: [],
+      isAnimating: !1,
+      isPaused: !1,
+      isLooped: !1,
+      animationTimeouts: [],
+      prefersReducedMotion: !1,
+      animationKey: 0
+    };
+  },
+  computed: {
+    /**
+     * Get timing preset based on speed prop
+     */
+    timing() {
+      return w[this.speed];
+    },
+    /**
+     * Computed styles with timing CSS variables
+     */
+    componentStyles() {
+      return {
+        "--dt-recipe-motion-text-duration": `${this.timing.duration}ms`,
+        "--dt-recipe-motion-text-char-duration": `${this.timing.duration}ms`,
+        "--dt-recipe-motion-text-word-duration": `${this.timing.duration * 2}ms`
+      };
+    },
+    /**
+     * Check if current animation mode is static (gradient-sweep or shimmer)
+     */
+    isStaticAnimationMode() {
+      return this.animationMode === "gradient-sweep" || this.animationMode === "shimmer";
+    },
+    /**
+     * Computed classes for the motion text element
+     */
+    motionTextClasses() {
+      return [
+        "dt-recipe-motion-text",
+        `dt-recipe-motion-text--${this.animationMode}`,
+        {
+          "dt-recipe-motion-text--animating": this.isAnimating,
+          "dt-recipe-motion-text--paused": this.isPaused,
+          "dt-recipe-motion-text--looped": this.isLooped
+        },
+        this.$attrs.class
+      ];
+    }
+  },
+  watch: {
+    text() {
+      this.reset(), this.initializeContent();
+    },
+    loop: {
+      handler(t) {
+        this.isLooped = t;
+      },
+      immediate: !0
+    }
+  },
+  mounted() {
+    this.checkReducedMotion(), this.initializeContent();
+  },
+  beforeUnmount() {
+    this.clearTimeouts();
+  },
+  methods: {
+    /**
+     * Self-contained text processing from DOM nodes
+     */
+    processTextToChars(t) {
+      const d = [], e = (n, i = 0) => {
+        var r;
+        if (n.nodeType === Node.TEXT_NODE) {
+          const a = ((r = n.textContent) == null ? void 0 : r.match(/\S+\s*/g)) || [];
+          return d.push(...a.map((o, c) => ({
+            text: o,
+            chars: o.split(""),
+            index: i + c
+          }))), i + a.length;
+        } else if (n.nodeType === Node.ELEMENT_NODE) {
+          let a = i;
+          return Array.from(n.childNodes).forEach((o) => {
+            a = e(o, a);
+          }), a;
+        }
+        return i;
+      };
+      return e(t), d;
+    },
+    /**
+     * Process direct text prop into word/character data
+     */
+    processDirectText(t) {
+      return t ? (t.match(/\S+\s*/g) || []).map((e, n) => ({
+        text: e,
+        chars: e.split(""),
+        index: n
+      })) : [];
+    },
+    /**
+     * Check for reduced motion preference
+     */
+    checkReducedMotion() {
+      typeof window < "u" && window.matchMedia && (this.prefersReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+    },
+    /**
+     * Clear all animation timeouts
+     */
+    clearTimeouts() {
+      this.animationTimeouts.forEach((t) => clearTimeout(t)), this.animationTimeouts = [];
+    },
+    /**
+     * Start the animation
+     * @public
+     */
+    start() {
+      if (!this.isAnimating) {
+        if (this.isAnimating = !0, this.isPaused = !1, this.$emit("start"), this.respectsReducedMotion && this.prefersReducedMotion) {
+          this.showAllContent();
+          return;
+        }
+        if (this.animationMode === "none") {
+          this.showAllContent();
+          return;
+        }
+        this.isStaticAnimationMode || this.showNextWord();
+      }
+    },
+    /**
+     * Pause the animation
+     * @public
+     */
+    pause() {
+      !this.isAnimating || this.isPaused || (this.isPaused = !0, this.clearTimeouts(), this.$emit("pause"));
+    },
+    /**
+     * Resume the animation
+     * @public
+     */
+    resume() {
+      this.isPaused && (this.isPaused = !1, this.$emit("resume"), this.showNextWord());
+    },
+    /**
+     * Reset the animation to initial state
+     * @public
+     */
+    reset() {
+      this.clearTimeouts(), this.isAnimating = !1, this.isPaused = !1, this.visibleWordCount = 0, this.visibleCharsPerWord = Array(this.words.length).fill(0), this.animationKey++;
+    },
+    /**
+     * Skip to the end of the animation
+     * @public
+     */
+    skipToEnd() {
+      this.showAllContent();
+    },
+    /**
+     * Show all content immediately
+     */
+    showAllContent() {
+      this.visibleWordCount = this.words.length, this.visibleCharsPerWord = this.words.map((t) => t.chars.length), setTimeout(() => {
+        this.isAnimating = !1, this.$emit("complete");
+      }, 0);
+    },
+    /**
+     * Show next word in sequence
+     */
+    showNextWord() {
+      if (this.isPaused || this.visibleWordCount >= this.words.length) {
+        this.visibleWordCount >= this.words.length && this.completeAnimation();
+        return;
+      }
+      const t = setTimeout(() => {
+        this.visibleWordCount++, this.$emit("progress", {
+          wordsComplete: this.visibleWordCount,
+          totalWords: this.words.length,
+          progress: this.visibleWordCount / this.words.length
+        }), this.animateCharsForWord(this.visibleWordCount - 1);
+      }, this.timing.wordDelay);
+      this.animationTimeouts.push(t);
+    },
+    /**
+     * Animate characters for a specific word
+     */
+    animateCharsForWord(t) {
+      if (this.isPaused || t >= this.words.length) return;
+      this.visibleCharsPerWord[t] = 0;
+      const d = this.words[t].chars.length, e = () => {
+        if (this.isPaused || this.visibleCharsPerWord[t] >= d) {
+          this.visibleCharsPerWord[t] >= d && this.showNextWord();
+          return;
+        }
+        this.visibleCharsPerWord[t]++;
+        const n = setTimeout(e, this.timing.characterDelay);
+        this.animationTimeouts.push(n);
+      };
+      e();
+    },
+    /**
+     * Complete the animation
+     */
+    completeAnimation() {
+      if (this.isAnimating = !1, this.clearTimeouts(), this.$emit("complete"), this.loop) {
+        const t = setTimeout(() => {
+          this.reset(), this.$nextTick(() => {
+            this.start();
+          });
+        }, 500);
+        this.animationTimeouts.push(t);
+      }
+    },
+    /**
+     * Initialize content based on text prop or slot content
+     */
+    initializeContent() {
+      if (this.isStaticAnimationMode) {
+        this.autoStart && this.$nextTick(() => this.start());
+        return;
+      }
+      this.text ? this.words = this.processDirectText(this.text) : this.$refs.contentRef && (this.words = this.processTextToChars(this.$refs.contentRef)), this.visibleCharsPerWord = Array(this.words.length).fill(0), this.visibleWordCount = 0, this.autoStart && this.words.length > 0 && this.$nextTick(() => this.start());
+    }
+  }
+}, b = ["data-text-content", "aria-live", "aria-label"], P = {
+  key: 0,
+  class: "dt-recipe-motion-text__sr-only"
+}, k = ["aria-hidden"], E = ["data-text-content"], N = {
+  key: 3,
+  class: "dt-recipe-motion-text__fallback"
+};
+function R(t, d, e, n, i, r) {
+  return s(), h("span", {
+    ref: "contentRef",
+    class: A(r.motionTextClasses),
+    style: u(r.componentStyles),
+    "data-text-content": r.isStaticAnimationMode ? e.text : void 0,
+    "aria-live": i.isAnimating ? "polite" : "off",
+    "aria-label": e.screenReaderText || void 0
+  }, [
+    e.screenReaderText ? (s(), h("span", P, f(e.screenReaderText), 1)) : l("", !0),
+    r.isStaticAnimationMode ? (s(), h(p, { key: 1 }, [
+      W(f(e.text) + " ", 1),
+      e.text ? l("", !0) : T(t.$slots, "default", { key: 0 })
+    ], 64)) : (s(), h("span", {
+      key: i.animationKey,
+      class: "dt-recipe-motion-text__content",
+      "aria-hidden": i.isAnimating
+    }, [
+      (s(!0), h(p, null, g(i.words, (a, o) => (s(), C(_, {
+        key: `${i.animationKey}-${o}`,
+        name: `dt-recipe-motion-text-word-${e.animationMode}`
+      }, {
+        default: x(() => [
+          o < i.visibleWordCount ? (s(), h("span", {
+            key: 0,
+            class: "dt-recipe-motion-text__word",
+            "data-text-content": a.text,
+            style: u({ "--word-index": o })
+          }, [
+            (s(!0), h(p, null, g(a.chars, (c, m) => (s(), C(_, {
+              key: `${i.animationKey}-${o}-${m}`,
+              name: `dt-recipe-motion-text-char-${e.animationMode}`
+            }, {
+              default: x(() => [
+                m < i.visibleCharsPerWord[o] ? (s(), h("span", {
+                  key: 0,
+                  class: "dt-recipe-motion-text__char",
+                  style: u({
+                    "--char-index": m,
+                    "--char-delay": `${m * r.timing.characterDelay}ms`
+                  })
+                }, f(c), 5)) : l("", !0)
+              ]),
+              _: 2
+            }, 1032, ["name"]))), 128))
+          ], 12, E)) : l("", !0)
+        ]),
+        _: 2
+      }, 1032, ["name"]))), 128))
+    ], 8, k)),
+    !i.words.length && !e.text && !r.isStaticAnimationMode ? (s(), h("span", N, [
+      T(t.$slots, "default")
+    ])) : l("", !0)
+  ], 14, b);
+}
+const $ = /* @__PURE__ */ v(S, [["render", R]]);
+export {
+  $ as default
+};
+//# sourceMappingURL=motion-text.js.map

package/dist/vue3/lib/motion-text/motion-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion-text.js","sources":["../../../recipes/motion/motion_text/motion_text.vue"],"sourcesContent":["<template>\n  <span\n    ref=\"contentRef\"\n    :class=\"motionTextClasses\"\n    :style=\"componentStyles\"\n    :data-text-content=\"isStaticAnimationMode ? text : undefined\"\n    :aria-live=\"isAnimating ? 'polite' : 'off'\"\n    :aria-label=\"screenReaderText || undefined\"\n  >\n    <!-- Screen reader content -->\n    <span\n      v-if=\"screenReaderText\"\n      class=\"dt-recipe-motion-text__sr-only\"\n    >\n      {{ screenReaderText }}\n    </span>\n\n    <!-- Gradient-sweep and shimmer modes: Simple static text with gradient animation -->\n    <template v-if=\"isStaticAnimationMode\">\n      {{ text }}\n      <slot v-if=\"!text\" />\n    </template>\n\n    <!-- Character-by-character animated content for other modes -->\n    <span\n      v-else\n      :key=\"animationKey\"\n      class=\"dt-recipe-motion-text__content\"\n      :aria-hidden=\"isAnimating\"\n    >\n      <template\n        v-for=\"(word, wordIdx) in words\"\n        :key=\"`${animationKey}-${wordIdx}`\"\n      >\n        <Transition\n          :name=\"`dt-recipe-motion-text-word-${animationMode}`\"\n        >\n          <span\n            v-if=\"wordIdx < visibleWordCount\"\n            class=\"dt-recipe-motion-text__word\"\n            :data-text-content=\"word.text\"\n            :style=\"{ '--word-index': wordIdx }\"\n          >\n            <template\n              v-for=\"(char, charIdx) in word.chars\"\n              :key=\"`${animationKey}-${wordIdx}-${charIdx}`\"\n            >\n              <Transition\n                :name=\"`dt-recipe-motion-text-char-${animationMode}`\"\n              >\n                <span\n                  v-if=\"charIdx < visibleCharsPerWord[wordIdx]\"\n                  class=\"dt-recipe-motion-text__char\"\n                  :style=\"{\n                    '--char-index': charIdx,\n                    '--char-delay': `${charIdx * timing.characterDelay}ms`,\n                  }\"\n                >{{ char }}</span>\n              </Transition>\n            </template>\n          </span>\n        </Transition>\n      </template>\n    </span>\n\n    <!-- Fallback slot content -->\n    <span\n      v-if=\"!words.length && !text && !isStaticAnimationMode\"\n      class=\"dt-recipe-motion-text__fallback\"\n    >\n      <slot />\n    </span>\n  </span>\n</template>\n\n<script>\nimport { MOTION_TEXT_ANIMATION_MODES, MOTION_TEXT_SPEEDS, MOTION_TEXT_TIMING_PRESETS } from './motion_text_constants';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeMotionText',\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * The text content to animate.\n     * @type {string}\n     */\n    text: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * The animation mode to use for the text reveal.\n     * @values gradient-in, fade-in, slide-in, gradient-sweep, shimmer, none\n     */\n    animationMode: {\n      type: String,\n      default: 'gradient-in',\n      validator: (value) => MOTION_TEXT_ANIMATION_MODES.includes(value),\n    },\n\n    /**\n     * Animation speed using t-shirt sizing.\n     * @values sm, md, lg\n     */\n    speed: {\n      type: String,\n      default: 'md',\n      validator: (value) => MOTION_TEXT_SPEEDS.includes(value),\n    },\n\n    /**\n     * Whether to start animation automatically when component is mounted.\n     * @values true, false\n     */\n    autoStart: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Whether to loop the animation continuously.\n     * @values true, false\n     */\n    loop: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether to respect the user's prefers-reduced-motion system setting.\n     * @values true, false\n     */\n    respectsReducedMotion: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Alternative text for screen readers. If provided, this will be announced\n     * instead of the animated text.\n     * @type {string}\n     */\n    screenReaderText: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when the animation starts.\n     * @event start\n     */\n    'start',\n\n    /**\n     * Emitted when the animation completes.\n     * @event complete\n     */\n    'complete',\n\n    /**\n     * Emitted during animation progress.\n     * @event progress\n     * @type {{ wordsComplete: number, totalWords: number, progress: number }}\n     */\n    'progress',\n\n    /**\n     * Emitted when the animation is paused.\n     * @event pause\n     */\n    'pause',\n\n    /**\n     * Emitted when the animation resumes.\n     * @event resume\n     */\n    'resume',\n  ],\n\n  data () {\n    return {\n      words: [],\n      visibleWordCount: 0,\n      visibleCharsPerWord: [],\n      isAnimating: false,\n      isPaused: false,\n      isLooped: false,\n      animationTimeouts: [],\n      prefersReducedMotion: false,\n      animationKey: 0,\n    };\n  },\n\n  computed: {\n    /**\n     * Get timing preset based on speed prop\n     */\n    timing () {\n      return MOTION_TEXT_TIMING_PRESETS[this.speed];\n    },\n\n    /**\n     * Computed styles with timing CSS variables\n     */\n    componentStyles () {\n      return {\n        '--dt-recipe-motion-text-duration': `${this.timing.duration}ms`,\n        '--dt-recipe-motion-text-char-duration': `${this.timing.duration}ms`,\n        '--dt-recipe-motion-text-word-duration': `${this.timing.duration * 2}ms`,\n      };\n    },\n\n    /**\n     * Check if current animation mode is static (gradient-sweep or shimmer)\n     */\n    isStaticAnimationMode () {\n      return this.animationMode === 'gradient-sweep' || this.animationMode === 'shimmer';\n    },\n\n    /**\n     * Computed classes for the motion text element\n     */\n    motionTextClasses () {\n      return [\n        'dt-recipe-motion-text',\n        `dt-recipe-motion-text--${this.animationMode}`,\n        {\n          'dt-recipe-motion-text--animating': this.isAnimating,\n          'dt-recipe-motion-text--paused': this.isPaused,\n          'dt-recipe-motion-text--looped': this.isLooped,\n        },\n        this.$attrs.class,\n      ];\n    },\n  },\n\n  watch: {\n    text () {\n      this.reset();\n      this.initializeContent();\n    },\n\n    loop: {\n      handler (newVal) {\n        this.isLooped = newVal;\n      },\n\n      immediate: true,\n    },\n  },\n\n  mounted () {\n    this.checkReducedMotion();\n    this.initializeContent();\n  },\n\n  beforeUnmount () {\n    this.clearTimeouts();\n  },\n\n  methods: {\n    /**\n     * Self-contained text processing from DOM nodes\n     */\n    processTextToChars (node) {\n      const words = [];\n\n      const processNode = (node, index = 0) => {\n        if (node.nodeType === Node.TEXT_NODE) {\n          const matches = node.textContent?.match(/\\S+\\s*/g) || [];\n          words.push(...matches.map((text, i) => ({\n            text,\n            chars: text.split(''),\n            index: index + i,\n          })));\n          return index + matches.length;\n        } else if (node.nodeType === Node.ELEMENT_NODE) {\n          let currentIdx = index;\n          Array.from(node.childNodes).forEach(child => {\n            currentIdx = processNode(child, currentIdx);\n          });\n          return currentIdx;\n        }\n        return index;\n      };\n\n      processNode(node);\n      return words;\n    },\n\n    /**\n     * Process direct text prop into word/character data\n     */\n    processDirectText (text) {\n      if (!text) return [];\n\n      const matches = text.match(/\\S+\\s*/g) || [];\n      return matches.map((wordText, i) => ({\n        text: wordText,\n        chars: wordText.split(''),\n        index: i,\n      }));\n    },\n\n    /**\n     * Check for reduced motion preference\n     */\n    checkReducedMotion () {\n      if (typeof window !== 'undefined' && window.matchMedia) {\n        this.prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n      }\n    },\n\n    /**\n     * Clear all animation timeouts\n     */\n    clearTimeouts () {\n      this.animationTimeouts.forEach(timeout => clearTimeout(timeout));\n      this.animationTimeouts = [];\n    },\n\n    /**\n     * Start the animation\n     * @public\n     */\n    start () {\n      if (this.isAnimating) return;\n\n      this.isAnimating = true;\n      this.isPaused = false;\n      this.$emit('start');\n\n      // Skip animation if reduced motion is preferred and enabled\n      if (this.respectsReducedMotion && this.prefersReducedMotion) {\n        this.showAllContent();\n        return;\n      }\n\n      if (this.animationMode === 'none') {\n        this.showAllContent();\n        return;\n      }\n\n      // For gradient-sweep and shimmer modes, just mark as animating (CSS handles the animation)\n      if (this.isStaticAnimationMode) {\n        return;\n      }\n\n      // Start the word-by-word animation for \"-in\" modes\n      this.showNextWord();\n    },\n\n    /**\n     * Pause the animation\n     * @public\n     */\n    pause () {\n      if (!this.isAnimating || this.isPaused) return;\n\n      this.isPaused = true;\n      this.clearTimeouts();\n      this.$emit('pause');\n    },\n\n    /**\n     * Resume the animation\n     * @public\n     */\n    resume () {\n      if (!this.isPaused) return;\n\n      this.isPaused = false;\n      this.$emit('resume');\n      this.showNextWord();\n    },\n\n    /**\n     * Reset the animation to initial state\n     * @public\n     */\n    reset () {\n      this.clearTimeouts();\n      this.isAnimating = false;\n      this.isPaused = false;\n      this.visibleWordCount = 0;\n      this.visibleCharsPerWord = Array(this.words.length).fill(0);\n      this.animationKey++;\n    },\n\n    /**\n     * Skip to the end of the animation\n     * @public\n     */\n    skipToEnd () {\n      this.showAllContent();\n    },\n\n    /**\n     * Show all content immediately\n     */\n    showAllContent () {\n      this.visibleWordCount = this.words.length;\n      this.visibleCharsPerWord = this.words.map(word => word.chars.length);\n      setTimeout(() => {\n        this.isAnimating = false;\n        this.$emit('complete');\n      }, 0);\n    },\n\n    /**\n     * Show next word in sequence\n     */\n    showNextWord () {\n      if (this.isPaused || this.visibleWordCount >= this.words.length) {\n        if (this.visibleWordCount >= this.words.length) {\n          this.completeAnimation();\n        }\n        return;\n      }\n\n      const timeout = setTimeout(() => {\n        this.visibleWordCount++;\n        this.$emit('progress', {\n          wordsComplete: this.visibleWordCount,\n          totalWords: this.words.length,\n          progress: this.visibleWordCount / this.words.length,\n        });\n\n        this.animateCharsForWord(this.visibleWordCount - 1);\n      }, this.timing.wordDelay);\n\n      this.animationTimeouts.push(timeout);\n    },\n\n    /**\n     * Animate characters for a specific word\n     */\n    animateCharsForWord (wordIdx) {\n      if (this.isPaused || wordIdx >= this.words.length) return;\n\n      this.visibleCharsPerWord[wordIdx] = 0;\n      const chars = this.words[wordIdx].chars.length;\n\n      const revealChar = () => {\n        if (this.isPaused || this.visibleCharsPerWord[wordIdx] >= chars) {\n          if (this.visibleCharsPerWord[wordIdx] >= chars) {\n            this.showNextWord();\n          }\n          return;\n        }\n\n        this.visibleCharsPerWord[wordIdx]++;\n        const timeout = setTimeout(revealChar, this.timing.characterDelay);\n        this.animationTimeouts.push(timeout);\n      };\n\n      revealChar();\n    },\n\n    /**\n     * Complete the animation\n     */\n    completeAnimation () {\n      this.isAnimating = false;\n      this.clearTimeouts();\n\n      this.$emit('complete');\n\n      if (this.loop) {\n        const timeout = setTimeout(() => {\n          this.reset();\n          this.$nextTick(() => {\n            this.start();\n          });\n        }, 500);\n\n        this.animationTimeouts.push(timeout);\n      }\n    },\n\n    /**\n     * Initialize content based on text prop or slot content\n     */\n    initializeContent () {\n      // For gradient-sweep and shimmer modes, skip word/character processing\n      if (this.isStaticAnimationMode) {\n        if (this.autoStart) {\n          this.$nextTick(() => this.start());\n        }\n        return;\n      }\n\n      if (this.text) {\n        this.words = this.processDirectText(this.text);\n      } else if (this.$refs.contentRef) {\n        this.words = this.processTextToChars(this.$refs.contentRef);\n      }\n\n      this.visibleCharsPerWord = Array(this.words.length).fill(0);\n      this.visibleWordCount = 0;\n\n      if (this.autoStart && this.words.length > 0) {\n        this.$nextTick(() => this.start());\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","value","MOTION_TEXT_ANIMATION_MODES","MOTION_TEXT_SPEEDS","MOTION_TEXT_TIMING_PRESETS","newVal","node","words","processNode","index","matches","_a","text","i","currentIdx","child","wordText","timeout","word","wordIdx","chars","revealChar","_hoisted_1","_hoisted_3","_hoisted_4","_createElementBlock","_normalizeClass","$options","_normalizeStyle","$props","$data","_hoisted_2","_toDisplayString","_createCommentVNode","_openBlock","_Fragment","_createTextVNode","_renderSlot","_ctx","_renderList","_createBlock","_Transition","_withCtx","char","charIdx","_hoisted_5"],"mappings":"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"}

package/dist/vue3/lib/popover/popover.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./popover-constants.cjs"),a=require("../../common/utils/index.cjs"),f=require("../../common/mixins/modal.cjs"),u=require("./tippy-utils.cjs"),m=require("./popover-header-footer.cjs"),v=require("../../shared/sr_only_close_button.cjs"),n=require("vue"),y=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),E=require("../lazy-show/lazy-show.cjs"),g={compatConfig:{MODE:3},name:"DtPopover",components:{SrOnlyCloseButton:v.default,DtLazyShow:E.default,PopoverHeaderFooter:m.default},mixins:[f.default],props:{open:{type:Boolean,default:null},openOnContext:{type:Boolean,default:!1},elementType:{type:String,default:"div"},transition:{type:String,default:"fade"},role:{type:String,default:"dialog",validator:e=>d.POPOVER_ROLES.includes(e)},ariaLabelledby:{type:String,default:null},ariaLabel:{type:String,default:null},padding:{type:String,default:"large",validator:e=>Object.keys(d.POPOVER_PADDING_CLASSES).some(t=>t===e)},contentClass:{type:[String,Array,Object],default:""},contentWidth:{type:String,default:"",validator:e=>d.POPOVER_CONTENT_WIDTHS.includes(e)},contentAppear:{type:Boolean,default:null},contentTabindex:{type:Number||null,default:-1},externalAnchor:{type:String,default:""},id:{type:String,default(){return a.getUniqueString()}},offset:{type:Array,default:()=>[0,4]},hideOnClick:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"bottom-end"},tether:{type:Boolean,default:!0},sticky:{type:[Boolean,String],default:!1,validator:e=>d.POPOVER_STICKY_VALUES.includes(e)},maxHeight:{type:String,default:""},maxWidth:{type:String,default:""},showCloseButton:{type:Boolean,default:!1},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},initialFocusElement:{type:[String,HTMLElement],default:"first",validator:e=>d.POPOVER_INITIAL_FOCUS_STRINGS.includes(e)||e instanceof HTMLElement||e.startsWith("#")},openWithArrowKeys:{type:Boolean,default:!1},appendTo:{type:[HTMLElement,String],default:"body",validator:e=>d.POPOVER_APPEND_TO_VALUES.includes(e)||e instanceof HTMLElement}},emits:["keydown","update:open","opened","mouseenter-popover","mouseleave-popover","mouseenter-popover-anchor","mouseleave-popover-anchor"],data(){return{POPOVER_PADDING_CLASSES:d.POPOVER_PADDING_CLASSES,POPOVER_HEADER_FOOTER_PADDING_CLASSES:d.POPOVER_HEADER_FOOTER_PADDING_CLASSES,intersectionObserver:null,mutationObserver:null,isOutsideViewport:!1,isOpen:!1,toAppear:!1,anchorEl:null,popoverContentEl:null,hasSlotContent:a.hasSlotContent}},computed:{popoverListeners(){return{keydown:e=>{this.onKeydown(e)},"after-leave":()=>{this.onLeaveTransitionComplete()},"after-enter":()=>{this.onEnterTransitionComplete()}}},calculatedMaxHeight(){return this.isOutsideViewport&&this.modal?"calc(100vh - var(--dt-space-300))":this.maxHeight},labelledBy(){return this.ariaLabelledby||!this.ariaLabel&&a.getUniqueString("DtPopover__anchor")}},watch:{$props:{immediate:!0,deep:!0,handler(){this.validateProps()}},modal(e){var t;(t=this.tip)==null||t.setProps({zIndex:e?650:this.calculateAnchorZindex()})},offset(e){var t;(t=this.tip)==null||t.setProps({offset:e})},sticky(e){var t;(t=this.tip)==null||t.setProps({sticky:e})},fallbackPlacements(){var e;(e=this.tip)==null||e.setProps({popperOptions:this.popperOptions()})},tether(){var e;(e=this.tip)==null||e.setProps({popperOptions:this.popperOptions()})},placement(e){var t;(t=this.tip)==null||t.setProps({placement:e})},open:{handler:function(e){e!==null&&(this.isOpen=e),e===!0&&(this.toAppear=!0)},immediate:!0},contentAppear:{handler:function(e){e!==null&&(this.toAppear=e)}},isOpen(e,t){var o,i;e?(this.initTippyInstance(),(o=this.tip)==null||o.show()):!e&&t!==e&&(this.removeEventListeners(),(i=this.tip)==null||i.hide())}},mounted(){var e;a.warnIfUnmounted(a.returnFirstEl(this.$el),this.$options.name),this.popoverContentEl=a.returnFirstEl((e=this.$refs.content)==null?void 0:e.$el),this.updateAnchorEl(),this.mutationObserver=new MutationObserver(this.updateAnchorEl),this.mutationObserver.observe(this.$refs.anchor,{childList:!0}),this.intersectionObserver=new IntersectionObserver(this.hasIntersectedViewport),this.intersectionObserver.observe(this.popoverContentEl)},beforeUnmount(){var e,t,o;(e=this.tip)==null||e.destroy(),(t=this.intersectionObserver)==null||t.disconnect(),(o=this.mutationObserver)==null||o.disconnect(),this.removeReferences(),this.removeEventListeners()},methods:{hasIntersectedViewport(e){var i;const t=(i=e==null?void 0:e[0])==null?void 0:i.target;if(!t)return;const o=a.isOutOfViewPort(t);this.isOutsideViewport=o.bottom||o.top},updateAnchorEl(){var t,o;const e=this.externalAnchor?this.$refs.anchor.getRootNode().querySelector(`#${this.externalAnchor}`):null;if(this.anchorEl=e??this.$refs.anchor.children[0],(t=this.tip)==null||t.destroy(),delete this.tip,!this.anchorEl){console.warn("No anchor found for popover");return}this.isOpen&&(this.initTippyInstance(),(o=this.tip)==null||o.show())},popperOptions(){return u.getPopperOptions({fallbackPlacements:this.fallbackPlacements,tether:this.tether,hasHideModifierEnabled:!0})},validateProps(){this.modal&&this.initialFocusElement==="none"&&console.error('If the popover is modal you must set the initialFocusElement prop. Possible values: "dialog", "first", HTMLElement')},calculateAnchorZindex(){var e;return a.returnFirstEl(this.$el).getRootNode().querySelector('.d-modal[aria-hidden="false"], .d-modal--transparent[aria-hidden="false"]')||(e=this.anchorEl)!=null&&e.closest(".d-zi-drawer")?650:300},defaultToggleOpen(e){var t,o,i;if(!this.openOnContext&&(this.open===null||this.open===void 0)){if(!((t=this.anchorEl)!=null&&t.contains(e.target))&&!((o=this.anchorEl)!=null&&o.isEqualNode(e.target))||(i=this.anchorEl)!=null&&i.disabled)return;this.toggleOpen()}},async onContext(e){var t;this.openOnContext&&(e.preventDefault(),this.isOpen=!0,await this.$nextTick(),(t=this.tip)==null||t.setProps({placement:"right-start",getReferenceClientRect:()=>({width:0,height:0,top:e.clientY,bottom:e.clientY,left:e.clientX,right:e.clientX})}))},toggleOpen(){this.isOpen=!this.isOpen},onArrowKeyPress(e){var t;this.open===null&&(this.openWithArrowKeys&&((t=this.anchorEl)!=null&&t.contains(e.target))&&(this.isOpen||(this.isOpen=!0)),this.$emit("keydown",e))},addEventListeners(){window.addEventListener("dt-popover-close",this.closePopover),this.contentWidth==="anchor"&&window.addEventListener("resize",this.onResize)},removeEventListeners(){window.removeEventListener("dt-popover-close",this.closePopover),this.contentWidth==="anchor"&&window.removeEventListener("resize",this.onResize)},closePopover(){this.isOpen=!1},preventScrolling(){var e,t,o;if(this.modal){const i=(e=this.anchorEl)==null?void 0:e.closest("body, .tippy-box");if(!i)return;((t=i.tagName)==null?void 0:t.toLowerCase())==="body"?(a.disableRootScrolling(this.anchorEl.getRootNode().host),(o=this.tip)==null||o.setProps({offset:this.offset})):i.classList.add("d-zi-popover")}},enableScrolling(){var t,o,i;const e=(t=this.anchorEl)==null?void 0:t.closest("body, .tippy-box");e&&(((o=e.tagName)==null?void 0:o.toLowerCase())==="body"?(a.enableRootScrolling(this.anchorEl.getRootNode().host),(i=this.tip)==null||i.setProps({offset:this.offset})):e.classList.remove("d-zi-popover"))},removeReferences(){this.anchorEl=null,this.popoverContentEl=null,this.tip=null},async onShow(){this.contentWidth==="anchor"&&await this.setPopoverContentAnchorWidth(),this.contentWidth===null&&(this.popoverContentEl.style.width="auto"),this.addEventListeners()},async onLeaveTransitionComplete(){var e;this.modal&&(await this.focusFirstElement(this.$refs.anchor),await this.$nextTick(),this.enableScrolling()),(e=this.tip)==null||e.unmount(),this.$emit("opened",!1),this.open!==null&&this.$emit("update:open",!1)},async onEnterTransitionComplete(){this.focusInitialElement(),await this.$nextTick(),this.preventScrolling(),this.$emit("opened",!0,this.$refs.popover__content),this.open!==null&&this.$emit("update:open",!0)},focusInitialElement(){var e,t;this.initialFocusElement==="dialog"&&((t=a.returnFirstEl((e=this.$refs.content)==null?void 0:e.$el))==null||t.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,o,i;const e=(o=a.returnFirstEl((t=this.$refs.content)==null?void 0:t.$el))==null?void 0:o.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():a.returnFirstEl((i=this.$refs.content)==null?void 0:i.$el).focus()},onResize(){this.closePopover()},onClickOutside(){var t;if(!this.hideOnClick)return;((t=this.popoverContentEl)==null?void 0:t.querySelector(".d-popover__anchor--opened"))||this.closePopover()},onKeydown(e){e.key==="Tab"&&this.modal&&this.focusTrappedTabPress(e,this.popoverContentEl),e.key==="Escape"&&this.closePopover(),this.$emit("keydown",e)},async setPopoverContentAnchorWidth(){var e;await this.$nextTick(),this.popoverContentEl.style.width=`${(e=this.anchorEl)==null?void 0:e.clientWidth}px`},focusFirstElementIfNeeded(e){var o,i;this._getFocusableElements(e,!0).length!==0?this.focusFirstElement(e):this.showCloseButton?(o=this.$refs.popover__header)==null||o.focusCloseButton():a.returnFirstEl((i=this.$refs.content)==null?void 0:i.$el).focus()},getReferenceClientRect(e){var h,p;const t=(h=this.anchorEl)==null?void 0:h.getBoundingClientRect();if(this.appendTo!=="root"||e)return t;const o=(p=this.anchorEl)==null?void 0:p.ownerDocument,i=(o==null?void 0:o.defaultView)||(o==null?void 0:o.parentWindow),r=i==null?void 0:i.frameElement;if(!r)return t;const s=r.getBoundingClientRect();return{width:t==null?void 0:t.width,height:t==null?void 0:t.height,top:(s==null?void 0:s.top)+(t==null?void 0:t.top),left:(s==null?void 0:s.left)+(t==null?void 0:t.left),right:(s==null?void 0:s.right)+(t==null?void 0:t.right),bottom:(s==null?void 0:s.bottom)+(t==null?void 0:t.bottom)}},initTippyInstance(){var o,i,r;let e=null,t=!1;switch(this.appendTo){case"body":e=(i=(o=this.anchorEl)==null?void 0:o.getRootNode())==null?void 0:i.querySelector("body");break;case"root":try{e=window.parent.document.body}catch(s){console.error("Could not attach the popover to iframe parent window: ",s),e="parent",t=!0}break;default:e=this.appendTo;break}(r=this.tip)==null||r.destroy(),this.tip=u.createTippyPopover(this.anchorEl,{popperOptions:this.popperOptions(),contentElement:this.popoverContentEl,placement:this.placement,offset:this.offset,sticky:this.sticky,appendTo:e,interactive:!0,trigger:"manual",getReferenceClientRect:()=>this.getReferenceClientRect(t),hideOnClick:!1,zIndex:this.modal?650:this.calculateAnchorZindex(),onClickOutside:this.onClickOutside,onShow:this.onShow})},onMouseEnter(){this.$emit("mouseenter-popover")},onMouseLeave(){this.$emit("mouseleave-popover")},onMouseEnterAnchor(){this.$emit("mouseenter-popover-anchor")},onMouseLeaveAnchor(){this.$emit("mouseleave-popover-anchor")}}},C=["id","data-qa","tabindex"],O=["data-qa"];function b(e,t,o,i,r,s){const h=n.resolveComponent("popover-header-footer"),p=n.resolveComponent("sr-only-close-button"),c=n.resolveComponent("dt-lazy-show");return n.openBlock(),n.createElementBlock("div",null,[o.modal&&r.isOpen?(n.openBlock(),n.createBlock(n.Teleport,{key:0,to:"body"},[n.createElementVNode("div",{class:"d-modal--transparent","aria-hidden":"false",onClick:t[0]||(t[0]=n.withModifiers(()=>{},["prevent","stop"]))})])):n.createCommentVNode("",!0),(n.openBlock(),n.createBlock(n.resolveDynamicComponent(o.elementType),{ref:"popover",class:n.normalizeClass(["d-popover",{"d-popover__anchor--opened":r.isOpen}]),"data-qa":"dt-popover-container"},{default:n.withCtx(()=>[n.createElementVNode("div",{id:!o.ariaLabelledby&&s.labelledBy,ref:"anchor","data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}-anchor`:"dt-popover-anchor",tabindex:o.openOnContext?0:void 0,onClickCapture:t[1]||(t[1]=(...l)=>s.defaultToggleOpen&&s.defaultToggleOpen(...l)),onContextmenu:t[2]||(t[2]=(...l)=>s.onContext&&s.onContext(...l)),onKeydown:[t[3]||(t[3]=n.withKeys(n.withModifiers((...l)=>s.onArrowKeyPress&&s.onArrowKeyPress(...l),["prevent"]),["up"])),t[4]||(t[4]=n.withKeys(n.withModifiers((...l)=>s.onArrowKeyPress&&s.onArrowKeyPress(...l),["prevent"]),["down"])),t[6]||(t[6]=n.withKeys(l=>e.$emit("keydown",l),["enter"])),t[7]||(t[7]=n.withKeys(l=>e.$emit("keydown",l),["space"]))],onKeydownCapture:t[5]||(t[5]=n.withKeys((...l)=>s.closePopover&&s.closePopover(...l),["escape"])),onMouseenter:t[8]||(t[8]=(...l)=>s.onMouseEnter&&s.onMouseEnter(...l)),onMouseleave:t[9]||(t[9]=(...l)=>s.onMouseLeave&&s.onMouseLeave(...l))},[n.renderSlot(e.$slots,"anchor",{attrs:{"aria-expanded":r.isOpen.toString(),"aria-controls":o.id,"aria-haspopup":o.role}})],40,C),n.createVNode(c,n.mergeProps({id:o.id,ref:"content",role:o.role,"data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}__dialog`:"dt-popover","aria-hidden":`${!r.isOpen}`,"aria-labelledby":s.labelledBy,"aria-label":o.ariaLabel,"aria-modal":`${!o.modal}`,transition:o.transition,show:r.isOpen,appear:r.toAppear,class:["d-popover__dialog",{"d-popover__dialog--modal":o.modal},o.dialogClass],style:{"max-height":s.calculatedMaxHeight,"max-width":o.maxWidth},css:e.$attrs.css,tabindex:o.contentTabindex},n.toHandlers(s.popoverListeners),{onMouseenter:s.onMouseEnterAnchor,onMouseleave:s.onMouseLeaveAnchor}),{default:n.withCtx(()=>[r.hasSlotContent(e.$slots.headerContent)||o.showCloseButton?(n.openBlock(),n.createBlock(h,{key:0,ref:"popover__header",class:n.normalizeClass(r.POPOVER_HEADER_FOOTER_PADDING_CLASSES[o.padding]),"content-class":o.headerClass,type:"header","show-close-button":o.showCloseButton,onClose:s.closePopover},{content:n.withCtx(()=>[n.renderSlot(e.$slots,"headerContent",{close:s.closePopover})]),_:3},8,["class","content-class","show-close-button","onClose"])):n.createCommentVNode("",!0),n.createElementVNode("div",{ref:"popover__content","data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}-content`:"dt-popover-content",class:n.normalizeClass(["d-popover__content",r.POPOVER_PADDING_CLASSES[o.padding],o.contentClass])},[n.renderSlot(e.$slots,"content",{close:s.closePopover})],10,O),r.hasSlotContent(e.$slots.footerContent)?(n.openBlock(),n.createBlock(h,{key:1,ref:"popover__footer",type:"footer",class:n.normalizeClass(r.POPOVER_HEADER_FOOTER_PADDING_CLASSES[o.padding]),"content-class":o.footerClass},{content:n.withCtx(()=>[n.renderSlot(e.$slots,"footerContent",{close:s.closePopover})]),_:3},8,["class","content-class"])):n.createCommentVNode("",!0),o.showCloseButton?n.createCommentVNode("",!0):(n.openBlock(),n.createBlock(p,{key:2,onClose:s.closePopover},null,8,["onClose"]))]),_: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"]))])}const w=y._(g,[["render",b]]);exports.default=w;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./popover-constants.cjs"),a=require("../../common/utils/index.cjs"),f=require("../../common/mixins/modal.cjs"),u=require("./tippy-utils.cjs"),m=require("./popover-header-footer.cjs"),v=require("../../shared/sr_only_close_button.cjs"),n=require("vue"),E=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),y=require("../lazy-show/lazy-show.cjs"),g={compatConfig:{MODE:3},name:"DtPopover",components:{SrOnlyCloseButton:v.default,DtLazyShow:y.default,PopoverHeaderFooter:m.default},mixins:[f.default],props:{open:{type:Boolean,default:null},openOnContext:{type:Boolean,default:!1},elementType:{type:String,default:"div"},transition:{type:String,default:"fade"},role:{type:String,default:"dialog",validator:e=>d.POPOVER_ROLES.includes(e)},ariaLabelledby:{type:String,default:null},ariaLabel:{type:String,default:null},padding:{type:String,default:"large",validator:e=>Object.keys(d.POPOVER_PADDING_CLASSES).some(t=>t===e)},contentClass:{type:[String,Array,Object],default:""},contentWidth:{type:String,default:"",validator:e=>d.POPOVER_CONTENT_WIDTHS.includes(e)},contentAppear:{type:Boolean,default:null},contentTabindex:{type:Number||null,default:-1},externalAnchor:{type:String,default:""},id:{type:String,default(){return a.getUniqueString()}},offset:{type:Array,default:()=>[0,4]},hideOnClick:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"bottom-end"},tether:{type:Boolean,default:!0},sticky:{type:[Boolean,String],default:!1,validator:e=>d.POPOVER_STICKY_VALUES.includes(e)},maxHeight:{type:String,default:""},maxWidth:{type:String,default:""},showCloseButton:{type:Boolean,default:!1},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},initialFocusElement:{type:[String,HTMLElement],default:"first",validator:e=>d.POPOVER_INITIAL_FOCUS_STRINGS.includes(e)||e instanceof HTMLElement||e.startsWith("#")},openWithArrowKeys:{type:Boolean,default:!1},appendTo:{type:[HTMLElement,String],default:"body",validator:e=>d.POPOVER_APPEND_TO_VALUES.includes(e)||e instanceof HTMLElement}},emits:["keydown","update:open","opened","mouseenter-popover","mouseleave-popover","mouseenter-popover-anchor","mouseleave-popover-anchor"],data(){return{POPOVER_PADDING_CLASSES:d.POPOVER_PADDING_CLASSES,POPOVER_HEADER_FOOTER_PADDING_CLASSES:d.POPOVER_HEADER_FOOTER_PADDING_CLASSES,intersectionObserver:null,mutationObserver:null,isOutsideViewport:!1,isOpen:!1,toAppear:!1,anchorEl:null,popoverContentEl:null,hasSlotContent:a.hasSlotContent}},computed:{popoverListeners(){return{keydown:e=>{this.onKeydown(e)},"after-leave":()=>{this.onLeaveTransitionComplete()},"after-enter":()=>{this.onEnterTransitionComplete()}}},calculatedMaxHeight(){return this.isOutsideViewport&&this.modal?"calc(100vh - var(--dt-space-300))":this.maxHeight},labelledBy(){return this.ariaLabelledby||!this.ariaLabel&&a.getUniqueString("DtPopover__anchor")}},watch:{$props:{immediate:!0,deep:!0,handler(){this.validateProps()}},modal(e){var t;(t=this.tip)==null||t.setProps({zIndex:e?650:this.calculateAnchorZindex()})},offset(e){var t;(t=this.tip)==null||t.setProps({offset:e})},sticky(e){var t;(t=this.tip)==null||t.setProps({sticky:e})},fallbackPlacements(){var e;(e=this.tip)==null||e.setProps({popperOptions:this.popperOptions()})},tether(){var e;(e=this.tip)==null||e.setProps({popperOptions:this.popperOptions()})},placement(e){var t;(t=this.tip)==null||t.setProps({placement:e})},open:{handler:function(e){e!==null&&(this.isOpen=e),e===!0&&(this.toAppear=!0)},immediate:!0},contentAppear:{handler:function(e){e!==null&&(this.toAppear=e)}},isOpen(e,t){var o,i;e?(this.initTippyInstance(),(o=this.tip)==null||o.show()):!e&&t!==e&&(this.removeEventListeners(),(i=this.tip)==null||i.hide())}},mounted(){var e;a.warnIfUnmounted(a.returnFirstEl(this.$el),this.$options.name),this.popoverContentEl=a.returnFirstEl((e=this.$refs.content)==null?void 0:e.$el),this.updateAnchorEl(),this.mutationObserver=new MutationObserver(this.updateAnchorEl),this.mutationObserver.observe(this.$refs.anchor,{childList:!0}),this.intersectionObserver=new IntersectionObserver(this.hasIntersectedViewport),this.intersectionObserver.observe(this.popoverContentEl)},beforeUnmount(){var e,t,o;(e=this.tip)==null||e.destroy(),(t=this.intersectionObserver)==null||t.disconnect(),(o=this.mutationObserver)==null||o.disconnect(),this.removeReferences(),this.removeEventListeners()},methods:{hasIntersectedViewport(e){var i;const t=(i=e==null?void 0:e[0])==null?void 0:i.target;if(!t)return;const o=a.isOutOfViewPort(t);this.isOutsideViewport=o.bottom||o.top},updateAnchorEl(){var o,i;const t=(this.externalAnchor?this.$refs.anchor.getRootNode().querySelector(`#${this.externalAnchor}`):null)??this.$refs.anchor.children[0];if(t!==this.anchorEl){if(this.anchorEl=t,(o=this.tip)==null||o.destroy(),delete this.tip,!this.anchorEl){console.warn("No anchor found for popover");return}this.isOpen&&(this.initTippyInstance(),(i=this.tip)==null||i.show())}},popperOptions(){return u.getPopperOptions({fallbackPlacements:this.fallbackPlacements,tether:this.tether,hasHideModifierEnabled:!0})},validateProps(){this.modal&&this.initialFocusElement==="none"&&console.error('If the popover is modal you must set the initialFocusElement prop. Possible values: "dialog", "first", HTMLElement')},calculateAnchorZindex(){var e;return a.returnFirstEl(this.$el).getRootNode().querySelector('.d-modal[aria-hidden="false"], .d-modal--transparent[aria-hidden="false"]')||(e=this.anchorEl)!=null&&e.closest(".d-zi-drawer")?650:300},defaultToggleOpen(e){var t,o,i;if(!this.openOnContext&&(this.open===null||this.open===void 0)){if(!((t=this.anchorEl)!=null&&t.contains(e.target))&&!((o=this.anchorEl)!=null&&o.isEqualNode(e.target))||(i=this.anchorEl)!=null&&i.disabled)return;this.toggleOpen()}},async onContext(e){var t;this.openOnContext&&(e.preventDefault(),this.isOpen=!0,await this.$nextTick(),(t=this.tip)==null||t.setProps({placement:"right-start",getReferenceClientRect:()=>({width:0,height:0,top:e.clientY,bottom:e.clientY,left:e.clientX,right:e.clientX})}))},toggleOpen(){this.isOpen=!this.isOpen},onArrowKeyPress(e){var t;this.open===null&&(this.openWithArrowKeys&&((t=this.anchorEl)!=null&&t.contains(e.target))&&(this.isOpen||(this.isOpen=!0)),this.$emit("keydown",e))},addEventListeners(){window.addEventListener("dt-popover-close",this.closePopover),this.contentWidth==="anchor"&&window.addEventListener("resize",this.onResize)},removeEventListeners(){window.removeEventListener("dt-popover-close",this.closePopover),this.contentWidth==="anchor"&&window.removeEventListener("resize",this.onResize)},closePopover(){this.isOpen=!1},preventScrolling(){var e,t,o;if(this.modal){const i=(e=this.anchorEl)==null?void 0:e.closest("body, .tippy-box");if(!i)return;((t=i.tagName)==null?void 0:t.toLowerCase())==="body"?(a.disableRootScrolling(this.anchorEl.getRootNode().host),(o=this.tip)==null||o.setProps({offset:this.offset})):i.classList.add("d-zi-popover")}},enableScrolling(){var t,o,i;const e=(t=this.anchorEl)==null?void 0:t.closest("body, .tippy-box");e&&(((o=e.tagName)==null?void 0:o.toLowerCase())==="body"?(a.enableRootScrolling(this.anchorEl.getRootNode().host),(i=this.tip)==null||i.setProps({offset:this.offset})):e.classList.remove("d-zi-popover"))},removeReferences(){this.anchorEl=null,this.popoverContentEl=null,this.tip=null},async onShow(){this.contentWidth==="anchor"&&await this.setPopoverContentAnchorWidth(),this.contentWidth===null&&(this.popoverContentEl.style.width="auto"),this.addEventListeners()},async onLeaveTransitionComplete(){var e;this.modal&&(await this.focusFirstElement(this.$refs.anchor),await this.$nextTick(),this.enableScrolling()),(e=this.tip)==null||e.unmount(),this.$emit("opened",!1),this.open!==null&&this.$emit("update:open",!1)},async onEnterTransitionComplete(){this.focusInitialElement(),await this.$nextTick(),this.preventScrolling(),this.$emit("opened",!0,this.$refs.popover__content),this.open!==null&&this.$emit("update:open",!0)},focusInitialElement(){var e,t;this.initialFocusElement==="dialog"&&((t=a.returnFirstEl((e=this.$refs.content)==null?void 0:e.$el))==null||t.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,o,i;const e=(o=a.returnFirstEl((t=this.$refs.content)==null?void 0:t.$el))==null?void 0:o.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():a.returnFirstEl((i=this.$refs.content)==null?void 0:i.$el).focus()},onResize(){this.closePopover()},onClickOutside(){var t;if(!this.hideOnClick)return;((t=this.popoverContentEl)==null?void 0:t.querySelector(".d-popover__anchor--opened"))||this.closePopover()},onKeydown(e){e.key==="Tab"&&this.modal&&this.focusTrappedTabPress(e,this.popoverContentEl),e.key==="Escape"&&this.closePopover(),this.$emit("keydown",e)},async setPopoverContentAnchorWidth(){var e;await this.$nextTick(),this.popoverContentEl.style.width=`${(e=this.anchorEl)==null?void 0:e.clientWidth}px`},focusFirstElementIfNeeded(e){var o,i;this._getFocusableElements(e,!0).length!==0?this.focusFirstElement(e):this.showCloseButton?(o=this.$refs.popover__header)==null||o.focusCloseButton():a.returnFirstEl((i=this.$refs.content)==null?void 0:i.$el).focus()},getReferenceClientRect(e){var h,p;const t=(h=this.anchorEl)==null?void 0:h.getBoundingClientRect();if(this.appendTo!=="root"||e)return t;const o=(p=this.anchorEl)==null?void 0:p.ownerDocument,i=(o==null?void 0:o.defaultView)||(o==null?void 0:o.parentWindow),r=i==null?void 0:i.frameElement;if(!r)return t;const s=r.getBoundingClientRect();return{width:t==null?void 0:t.width,height:t==null?void 0:t.height,top:(s==null?void 0:s.top)+(t==null?void 0:t.top),left:(s==null?void 0:s.left)+(t==null?void 0:t.left),right:(s==null?void 0:s.right)+(t==null?void 0:t.right),bottom:(s==null?void 0:s.bottom)+(t==null?void 0:t.bottom)}},initTippyInstance(){var o,i,r;let e=null,t=!1;switch(this.appendTo){case"body":e=(i=(o=this.anchorEl)==null?void 0:o.getRootNode())==null?void 0:i.querySelector("body");break;case"root":try{e=window.parent.document.body}catch(s){console.error("Could not attach the popover to iframe parent window: ",s),e="parent",t=!0}break;default:e=this.appendTo;break}(r=this.tip)==null||r.destroy(),this.tip=u.createTippyPopover(this.anchorEl,{popperOptions:this.popperOptions(),contentElement:this.popoverContentEl,placement:this.placement,offset:this.offset,sticky:this.sticky,appendTo:e,interactive:!0,trigger:"manual",getReferenceClientRect:()=>this.getReferenceClientRect(t),hideOnClick:!1,zIndex:this.modal?650:this.calculateAnchorZindex(),onClickOutside:this.onClickOutside,onShow:this.onShow})},onMouseEnter(){this.$emit("mouseenter-popover")},onMouseLeave(){this.$emit("mouseleave-popover")},onMouseEnterAnchor(){this.$emit("mouseenter-popover-anchor")},onMouseLeaveAnchor(){this.$emit("mouseleave-popover-anchor")}}},C=["id","data-qa","tabindex"],O=["data-qa"];function b(e,t,o,i,r,s){const h=n.resolveComponent("popover-header-footer"),p=n.resolveComponent("sr-only-close-button"),c=n.resolveComponent("dt-lazy-show");return n.openBlock(),n.createElementBlock("div",null,[o.modal&&r.isOpen?(n.openBlock(),n.createBlock(n.Teleport,{key:0,to:"body"},[n.createElementVNode("div",{class:"d-modal--transparent","aria-hidden":"false",onClick:t[0]||(t[0]=n.withModifiers(()=>{},["prevent","stop"]))})])):n.createCommentVNode("",!0),(n.openBlock(),n.createBlock(n.resolveDynamicComponent(o.elementType),{ref:"popover",class:n.normalizeClass(["d-popover",{"d-popover__anchor--opened":r.isOpen}]),"data-qa":"dt-popover-container"},{default:n.withCtx(()=>[n.createElementVNode("div",{id:!o.ariaLabelledby&&s.labelledBy,ref:"anchor","data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}-anchor`:"dt-popover-anchor",tabindex:o.openOnContext?0:void 0,onClickCapture:t[1]||(t[1]=(...l)=>s.defaultToggleOpen&&s.defaultToggleOpen(...l)),onContextmenu:t[2]||(t[2]=(...l)=>s.onContext&&s.onContext(...l)),onKeydown:[t[3]||(t[3]=n.withKeys(n.withModifiers((...l)=>s.onArrowKeyPress&&s.onArrowKeyPress(...l),["prevent"]),["up"])),t[4]||(t[4]=n.withKeys(n.withModifiers((...l)=>s.onArrowKeyPress&&s.onArrowKeyPress(...l),["prevent"]),["down"])),t[6]||(t[6]=n.withKeys(l=>e.$emit("keydown",l),["enter"])),t[7]||(t[7]=n.withKeys(l=>e.$emit("keydown",l),["space"]))],onKeydownCapture:t[5]||(t[5]=n.withKeys((...l)=>s.closePopover&&s.closePopover(...l),["escape"])),onMouseenter:t[8]||(t[8]=(...l)=>s.onMouseEnter&&s.onMouseEnter(...l)),onMouseleave:t[9]||(t[9]=(...l)=>s.onMouseLeave&&s.onMouseLeave(...l))},[n.renderSlot(e.$slots,"anchor",{attrs:{"aria-expanded":r.isOpen.toString(),"aria-controls":o.id,"aria-haspopup":o.role}})],40,C),n.createVNode(c,n.mergeProps({id:o.id,ref:"content",role:o.role,"data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}__dialog`:"dt-popover","aria-hidden":`${!r.isOpen}`,"aria-labelledby":s.labelledBy,"aria-label":o.ariaLabel,"aria-modal":`${!o.modal}`,transition:o.transition,show:r.isOpen,appear:r.toAppear,class:["d-popover__dialog",{"d-popover__dialog--modal":o.modal},o.dialogClass],style:{"max-height":s.calculatedMaxHeight,"max-width":o.maxWidth},css:e.$attrs.css,tabindex:o.contentTabindex},n.toHandlers(s.popoverListeners),{onMouseenter:s.onMouseEnterAnchor,onMouseleave:s.onMouseLeaveAnchor}),{default:n.withCtx(()=>[r.hasSlotContent(e.$slots.headerContent)||o.showCloseButton?(n.openBlock(),n.createBlock(h,{key:0,ref:"popover__header",class:n.normalizeClass(r.POPOVER_HEADER_FOOTER_PADDING_CLASSES[o.padding]),"content-class":o.headerClass,type:"header","show-close-button":o.showCloseButton,onClose:s.closePopover},{content:n.withCtx(()=>[n.renderSlot(e.$slots,"headerContent",{close:s.closePopover})]),_:3},8,["class","content-class","show-close-button","onClose"])):n.createCommentVNode("",!0),n.createElementVNode("div",{ref:"popover__content","data-qa":e.$attrs["data-qa"]?`${e.$attrs["data-qa"]}-content`:"dt-popover-content",class:n.normalizeClass(["d-popover__content",r.POPOVER_PADDING_CLASSES[o.padding],o.contentClass])},[n.renderSlot(e.$slots,"content",{close:s.closePopover})],10,O),r.hasSlotContent(e.$slots.footerContent)?(n.openBlock(),n.createBlock(h,{key:1,ref:"popover__footer",type:"footer",class:n.normalizeClass(r.POPOVER_HEADER_FOOTER_PADDING_CLASSES[o.padding]),"content-class":o.footerClass},{content:n.withCtx(()=>[n.renderSlot(e.$slots,"footerContent",{close:s.closePopover})]),_:3},8,["class","content-class"])):n.createCommentVNode("",!0),o.showCloseButton?n.createCommentVNode("",!0):(n.openBlock(),n.createBlock(p,{key:2,onClose:s.closePopover},null,8,["onClose"]))]),_: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"]))])}const w=E._(g,[["render",b]]);exports.default=w;
 //# sourceMappingURL=popover.cjs.map