@dialpad/dialtone-vue 3.223.0-next.2 → 3.223.0-next.4

package/dist/lib/popover/popover.js

@@ -370,7 +370,7 @@ var B = {
 			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();
+			this.contentWidth === "anchor" && (await this.setPopoverContentAnchorWidth(), this._isUnmounting) || (this.contentWidth === null && (this.popoverContentEl.style.width = "auto"), this.addEventListeners());
 		},
 		async onLeaveTransitionComplete() {
 			if (!this._isUnmounting) {

package/dist/lib/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","names":[],"sources":["../../../components/Popover/Popover.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/mouse-events-have-key-events -->\n<template>\n  <div>\n    <Teleport\n      v-if=\"modal && isOpen\"\n      to=\"body\"\n    >\n      <div\n        class=\"d-modal--transparent\"\n        aria-hidden=\"false\"\n        @click.prevent.stop\n      />\n    </Teleport>\n    <component\n      :is=\"elementType\"\n      ref=\"popover\"\n      :class=\"['d-popover', { 'd-popover__anchor--opened': isOpen }]\"\n      data-qa=\"dt-popover-container\"\n    >\n      <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n      <div\n        :id=\"!ariaLabelledby && labelledBy\"\n        ref=\"anchor\"\n        :class=\"anchorClass\"\n        :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}-anchor` : 'dt-popover-anchor'\"\n        :tabindex=\"openOnContext ? 0 : undefined\"\n        @click.capture=\"defaultToggleOpen\"\n        @contextmenu=\"onContext\"\n        @keydown.up.prevent=\"onArrowKeyPress\"\n        @keydown.down.prevent=\"onArrowKeyPress\"\n        @keydown.escape.capture=\"closePopover\"\n        @keydown.enter=\"$emit('keydown', $event)\"\n        @keydown.space=\"$emit('keydown', $event)\"\n        @mouseenter=\"onMouseEnter\"\n        @mouseleave=\"onMouseLeave\"\n      >\n        <!-- @slot Anchor element that activates the popover. Usually a button. -->\n        <slot\n          name=\"anchor\"\n          :attrs=\"{\n            'aria-expanded': isOpen.toString(),\n            'aria-controls': id,\n            'aria-haspopup': role,\n          }\"\n        />\n      </div>\n      <dt-lazy-show\n        :id=\"id\"\n        ref=\"content\"\n        v-dt-focustrap=\"{\n          active: (modal || focustrap) && isOpen,\n          initialFocus: false,\n          restoreFocus: !modal && focustrap,\n        }\"\n        :role=\"role\"\n        :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}__dialog` : 'dt-popover'\"\n        :aria-hidden=\"`${!isOpen}`\"\n        :aria-labelledby=\"labelledBy\"\n        :aria-label=\"ariaLabel\"\n        :aria-modal=\"`${!modal}`\"\n        :transition=\"transition\"\n        :show=\"isOpen\"\n        :appear=\"toAppear\"\n        :class=\"['d-popover__dialog', { 'd-popover__dialog--modal': modal }, dialogClass]\"\n        :style=\"{\n          'max-height': calculatedMaxHeight,\n          'max-width': maxWidth,\n        }\"\n        :css=\"$attrs.css\"\n        :tabindex=\"contentTabindex\"\n        v-bind=\"modeAttrs\"\n        v-on=\"popoverListeners\"\n        @mouseenter=\"onMouseEnterAnchor\"\n        @mouseleave=\"onMouseLeaveAnchor\"\n      >\n        <popover-header-footer\n          v-if=\"hasSlotContent($slots.headerContent) || showCloseButton\"\n          ref=\"popover__header\"\n          :class=\"[POPOVER_HEADER_FOOTER_PADDING_CLASSES[padding], headerWrapperClass]\"\n          :content-class=\"headerClass\"\n          type=\"header\"\n          :show-close-button=\"showCloseButton\"\n          @close=\"closePopover\"\n        >\n          <template #content>\n            <!-- @slot Slot for popover header content -->\n            <slot\n              name=\"headerContent\"\n              :close=\"closePopover\"\n            />\n          </template>\n        </popover-header-footer>\n        <div\n          ref=\"popover__content\"\n          :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}-content` : 'dt-popover-content'\"\n          :class=\"[\n            'd-popover__content',\n            POPOVER_PADDING_CLASSES[padding],\n            contentClass,\n          ]\"\n        >\n          <!-- @slot Slot for the content that is displayed in the popover when it is open. -->\n          <slot\n            name=\"content\"\n            :close=\"closePopover\"\n          />\n        </div>\n        <popover-header-footer\n          v-if=\"hasSlotContent($slots.footerContent)\"\n          ref=\"popover__footer\"\n          type=\"footer\"\n          :class=\"[POPOVER_HEADER_FOOTER_PADDING_CLASSES[padding], footerWrapperClass]\"\n          :content-class=\"footerClass\"\n        >\n          <template #content>\n            <!-- @slot Slot for the footer content. -->\n            <slot\n              name=\"footerContent\"\n              :close=\"closePopover\"\n            />\n          </template>\n        </popover-header-footer>\n        <sr-only-close-button\n          v-if=\"!showCloseButton\"\n          @close=\"closePopover\"\n        />\n      </dt-lazy-show>\n    </component>\n  </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport {\n  POPOVER_APPEND_TO_VALUES,\n  POPOVER_CONTENT_WIDTHS,\n  POPOVER_HEADER_FOOTER_PADDING_CLASSES,\n  POPOVER_INITIAL_FOCUS_STRINGS,\n  POPOVER_PADDING_CLASSES,\n  POPOVER_ROLES,\n  POPOVER_STICKY_VALUES,\n} from './PopoverConstants';\nimport { getUniqueString, hasSlotContent, isOutOfViewPort, warnIfUnmounted, disableRootScrolling, enableRootScrolling, returnFirstEl } from '@/common/utils';\nimport { HTML_ELEMENT_TYPE } from '@/common/constants';\nimport { DtLazyShow } from '@/components/LazyShow';\nimport ModalMixin from '@/common/mixins/modal';\nimport ModeMixin from '@/common/mixins/mode';\nimport { createTippyPopover, getPopperOptions } from './TippyUtils';\nimport PopoverHeaderFooter from './PopoverHeaderFooter.vue';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\n/**\n * A Popover displays a content overlay when its anchor element is activated.\n * @see https://dialtone.dialpad.com/components/popover.html\n */\nexport default {\n  name: 'DtPopover',\n\n  /********************\n   * CHILD COMPONENTS *\n   ********************/\n  components: {\n    SrOnlyCloseButton,\n    DtLazyShow,\n    PopoverHeaderFooter,\n  },\n\n  mixins: [ModalMixin, ModeMixin],\n\n  props: {\n    /**\n     * Controls whether the popover is shown. When null (default), the popover\n     * toggles on click. When set to true or false, the default trigger is\n     * disabled and the parent controls visibility via v-model:open.\n     * @values null, true, false\n     */\n    open: {\n      type: [Boolean, null],\n      default: null,\n    },\n\n    /**\n     * Opens the popover on right click (context menu). If you set this value to `true`,\n     * the default trigger behavior will be disabled.\n     * @values true, false\n     */\n    openOnContext: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Element type (tag name) of the root element of the component.\n     */\n    elementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * ARIA role for the content of the popover. Defaults to \"dialog\".\n     * <a class=\"d-link\" href=\"https://www.w3.org/TR/wai-aria/#aria-haspopup\" target=\"_blank\">aria-haspopup</a>\n     */\n    role: {\n      type: String,\n      default: 'dialog',\n      validator: (role) => {\n        return POPOVER_ROLES.includes(role);\n      },\n    },\n\n    /**\n     * ID of the element that serves as the label for the popover content.\n     * Defaults to the \"anchor\" element; this exists to provide a different\n     * ID of the label element if, for example, the anchor slot contains\n     * other items that do not serve as a label. You should provide this\n     * or ariaLabel, but not both.\n     */\n    ariaLabelledby: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Descriptive label for the popover content. You should provide this\n     * or ariaLabelledby, but not both.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Padding size class for the popover content.\n     * @values none, small, medium, large\n     */\n    padding: {\n      type: String,\n      default: 'large',\n      validator: (padding) => {\n        return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n      },\n    },\n\n    /**\n     * Additional class name for the content wrapper element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Width configuration for the popover content. When its value is 'anchor',\n     * the popover content will have the same width as the anchor.\n     * @values null, anchor\n     */\n    contentWidth: {\n      type: String,\n      default: '',\n      validator: contentWidth => POPOVER_CONTENT_WIDTHS.includes(contentWidth),\n    },\n\n    /**\n     * Whether to apply transition on initial render in the content lazy show component.\n     */\n    contentAppear: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Tabindex value for the content. Passing null, no tabindex attribute will be set.\n     */\n    contentTabindex: {\n      type: Number || null,\n      default: -1,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     * @deprecated Use externalAnchorElement instead for Shadow DOM compatibility.\n     */\n    externalAnchor: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * External anchor element reference. Use this instead of externalAnchor when\n     * the anchor may be inside a Shadow DOM, as querySelector cannot pierce shadow boundaries.\n     */\n    externalAnchorElement: {\n      type: HTML_ELEMENT_TYPE,\n      default: null,\n    },\n\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     *  Displaces the content box from its anchor element\n     *  by the specified number of pixels.\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, 4],\n    },\n\n    /**\n     * Closes the popover when clicking the anchor or outside the content box.\n     * @values true, false\n     */\n    closeOnClick: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Determines modal state. If enabled popover has a modal overlay\n     * preventing interaction with elements below it, but it is invisible.\n     * @values true, false\n     */\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * When true, traps Tab/Shift+Tab focus within the popover dialog.\n     * Use this to enable focus trapping independently of modal state —\n     * e.g. a non-modal popover whose content still requires keyboard containment.\n     * When `modal` is true, the trap is already active; this prop has no additional effect.\n     * @values true, false\n     */\n    focustrap: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\".\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => {\n        return ['auto'];\n      },\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     */\n    placement: {\n      type: String,\n      default: 'bottom-end',\n    },\n\n    /**\n     * If set to false the dialog will display over top of the anchor when there is insufficient space.\n     * If set to true it will never move from its position relative to the anchor and will clip instead.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * @values true, false\n     */\n    tether: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * If the popover sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return POPOVER_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    maxHeight: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines visibility for close button\n     * @values true, false\n     */\n    showCloseButton: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the anchor wrapper element.\n     */\n    anchorClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the header element (d-popover__header).\n     */\n    headerWrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the header content wrapper element.\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the footer element (d-popover__footer).\n     */\n    footerWrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the footer content wrapper element.\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the dialog element.\n     */\n    dialogClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * The element that is focused when the popover is opened. This can be an\n     * HTMLElement within the popover, a string starting with '#' which will\n     * find the element by ID. 'first' which will automatically focus\n     * the first element, or 'dialog' which will focus the dialog window itself.\n     * If the dialog is modal this prop cannot be 'none'.\n     * @values none, dialog, first\n     */\n    initialFocusElement: {\n      type: [String, HTML_ELEMENT_TYPE],\n      default: 'first',\n      validator: initialFocusElement => {\n        return POPOVER_INITIAL_FOCUS_STRINGS.includes(initialFocusElement) ||\n          (initialFocusElement instanceof HTMLElement) ||\n          initialFocusElement.startsWith('#');\n      },\n    },\n\n    /**\n     * If the popover should open pressing up or down arrow key on the anchor element.\n     * This can be set when not passing open prop.\n     * @values true, false\n     */\n    openWithArrowKeys: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest ancestor <dialog> element when inside one\n     * (keeping the popover in the browser's top layer), or to the nearest body otherwise.\n     * To always append to body regardless of dialog context, pass document.body as an HTMLElement.\n     * 'root' will try append to the iFrame's parent body if it is contained in an iFrame\n     * and has permissions to access it, else, it'd default to 'parent'.\n     * @values 'body', 'parent', 'root', HTMLElement\n     */\n    appendTo: {\n      type: [HTML_ELEMENT_TYPE, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n  },\n\n  emits: [\n    /**\n     * Native keydown event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Emitted when popover is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean | Array}\n     */\n    'opened',\n\n    /**\n     * Emitted when the mouse enters the popover\n     *\n     * @event mouseenter-popover\n     */\n    'mouseenter-popover',\n\n    /**\n     * Emitted when the mouse leaves the popover\n     *\n     * @event mouseleave-popover\n     */\n    'mouseleave-popover',\n\n    /**\n     * Emitted when the mouse enters the popover anchor\n     *\n     * @event mouseenter-popover-anchor\n     */\n    'mouseenter-popover-anchor',\n\n    /**\n     * Emitted when the mouse leaves the popover anchor\n     *\n     * @event mouseleave-popover-anchor\n     */\n    'mouseleave-popover-anchor',\n  ],\n\n  data () {\n    return {\n      POPOVER_PADDING_CLASSES,\n      POPOVER_HEADER_FOOTER_PADDING_CLASSES,\n      intersectionObserver: null,\n      mutationObserver: null,\n      isOutsideViewport: false,\n      isOpen: false,\n      toAppear: false,\n      anchorEl: null,\n      popoverContentEl: null,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    popoverListeners () {\n      return {\n        keydown: event => {\n          this.onKeydown(event);\n        },\n\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    calculatedMaxHeight () {\n      if (this.isOutsideViewport && this.modal) {\n        return `calc(100vh - var(--dt-spacing-50))`;\n      }\n      return this.maxHeight;\n    },\n\n    labelledBy () {\n      // aria-labelledby should be set only if aria-labelledby is passed as a prop, or if\n      // there is no aria-label and the labelledby should point to the anchor.\n      return this.ariaLabelledby || (!this.ariaLabel && getUniqueString('DtPopover__anchor'));\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      handler () {\n        this.validateProps();\n      },\n    },\n\n    modal (modal) {\n      this.tip?.setProps({\n        zIndex: modal ? 650 : this.calculateAnchorZindex(),\n      });\n    },\n\n    offset (offset) {\n      this.tip?.setProps({\n        offset,\n      });\n    },\n\n    sticky (sticky) {\n      this.tip?.setProps({\n        sticky,\n      });\n    },\n\n    fallbackPlacements () {\n      this.tip?.setProps({\n        popperOptions: this.popperOptions(),\n      });\n    },\n\n    tether () {\n      this.tip?.setProps({\n        popperOptions: this.popperOptions(),\n      });\n    },\n\n    externalAnchorElement () {\n      this.updateAnchorEl();\n    },\n\n    placement (placement) {\n      this.tip?.setProps({\n        placement,\n      });\n    },\n\n    open: {\n      handler: function (open) {\n        if (open !== null) {\n          this.isOpen = open;\n        }\n        if (open === true) {\n          this.toAppear = true;\n        }\n      },\n\n      immediate: true,\n    },\n\n    contentAppear: {\n      handler: function (contentAppear) {\n        if (contentAppear !== null) {\n          this.toAppear = contentAppear;\n        }\n      },\n    },\n\n    isOpen (isOpen, isPrev) {\n      if (isOpen) {\n        this.initTippyInstance();\n        this.tip?.show();\n      } else if (!isOpen && isPrev !== isOpen) {\n        this.removeEventListeners();\n        this.tip?.hide();\n      }\n    },\n  },\n\n  mounted () {\n    warnIfUnmounted(returnFirstEl(this.$el), this.$options.name);\n\n    this.popoverContentEl = returnFirstEl(this.$refs.content?.$el);\n    this.updateAnchorEl();\n\n    this.mutationObserver = new MutationObserver(this.updateAnchorEl);\n    this.mutationObserver.observe(this.$refs.anchor, {childList: true});\n\n    // rootMargin here must be greater than the margin of the height we are setting in calculatedMaxHeight which\n    // currently is var(--dt-spacing-50) (4px). If not the intersectionObserver will continually trigger in an infinite\n    // loop.\n    // threshold 1.0 makes this trigger every time the dialog \"touches\" the edge of the viewport.\n    this.intersectionObserver = new IntersectionObserver(this.hasIntersectedViewport);\n    this.intersectionObserver.observe(this.popoverContentEl);\n  },\n\n  beforeUnmount () {\n    this._isUnmounting = true;\n    // Cancel any in-progress CSS transitions so transitionend cannot fire\n    // after this component is torn down and call into dead lifecycle methods.\n    if (this.popoverContentEl) {\n      this.popoverContentEl.style.transition = 'none';\n    }\n    this.tip?.destroy();\n    this.intersectionObserver?.disconnect();\n    this.mutationObserver?.disconnect();\n    this.removeReferences();\n    this.removeEventListeners();\n  },\n\n  /******************\n   *     METHODS    *\n   ******************/\n  methods: {\n\n    getModeReferenceEl () {\n      return this.$refs.anchor;\n    },\n\n    hasIntersectedViewport (entries) {\n      const dialog = entries?.[0]?.target;\n      if (!dialog) return;\n      const isOut = isOutOfViewPort(dialog);\n      this.isOutsideViewport = isOut.bottom || isOut.top;\n    },\n\n    updateAnchorEl () {\n      const externalAnchorEl = this.externalAnchorElement ||\n        (this.externalAnchor\n          ? this.$refs.anchor.getRootNode().querySelector(`#${this.externalAnchor}`)\n          : null);\n      const anchorEl = externalAnchorEl ?? this.$refs.anchor.children[0];\n      if (anchorEl === this.anchorEl) {\n        return;\n      }\n      this.anchorEl = anchorEl;\n\n      this.tip?.destroy();\n      delete this.tip;\n\n      if (!this.anchorEl) {\n        console.warn('No anchor found for popover');\n        return;\n      }\n\n      if (this.isOpen) {\n        this.initTippyInstance();\n        this.tip?.show();\n      }\n    },\n\n    popperOptions () {\n      return getPopperOptions({\n        fallbackPlacements: this.fallbackPlacements,\n        tether: this.tether,\n        hasHideModifierEnabled: true,\n      });\n    },\n\n    validateProps () {\n      if (this.modal && this.initialFocusElement === 'none') {\n        console.error('If the popover is modal you must set the ' +\n        'initialFocusElement prop. Possible values: \"dialog\", \"first\", HTMLElement');\n      }\n    },\n\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at popover z-index\n      if (returnFirstEl(this.$el).getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"], .d-modal[open], .d-modal--transparent[open]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 650 when\n        // anchor of popover is within a drawer.\n        this.anchorEl?.closest('.d-zi-drawer')) {\n        return 650;\n      } else {\n        return 300;\n      }\n    },\n\n    defaultToggleOpen (e) {\n      if (this.openOnContext) { return; }\n\n      // Only use default toggle behaviour if the user has not set the open prop.\n      // Check that the anchor element specifically was clicked.\n      if (this.open === null || this.open === undefined) {\n        if ((!this.anchorEl?.contains(e.target) && !this.anchorEl?.isEqualNode(e.target)) || this.anchorEl?.disabled) {\n          return;\n        }\n\n        this.toggleOpen();\n      }\n    },\n\n    async onContext (event) {\n      if (!this.openOnContext) { return; }\n\n      event.preventDefault();\n\n      this.isOpen = true;\n      await this.$nextTick();\n      this.tip?.setProps({\n        placement: 'right-start',\n        getReferenceClientRect: () => ({\n          width: 0,\n          height: 0,\n          top: event.clientY,\n          bottom: event.clientY,\n          left: event.clientX,\n          right: event.clientX,\n        }),\n      });\n    },\n\n    toggleOpen () {\n      this.isOpen = !this.isOpen;\n    },\n\n    onArrowKeyPress (e) {\n      if (this.open !== null) { return; }\n      if (this.openWithArrowKeys && this.anchorEl?.contains(e.target)) {\n        if (!this.isOpen) {\n          this.isOpen = true;\n        }\n      }\n\n      this.$emit('keydown', e);\n    },\n\n    addEventListeners () {\n      window.addEventListener('dt-popover-close', this.closePopover);\n      // align popover content width when contentWidth is 'anchor'\n      if (this.contentWidth === 'anchor') {\n        window.addEventListener('resize', this.onResize);\n      }\n    },\n\n    removeEventListeners () {\n      window.removeEventListener('dt-popover-close', this.closePopover);\n      if (this.contentWidth === 'anchor') {\n        window.removeEventListener('resize', this.onResize);\n      }\n    },\n\n    closePopover () {\n      this.isOpen = false;\n    },\n\n    /*\n    * Prevents scrolling outside of the currently opened modal popover by:\n    *   - when anchor is not within another popover: setting the body to overflow: hidden\n    *   - when anchor is within another popover: set the popover dialog container to it's non-modal z-index\n    *     since it is no longer the active modal. This puts it underneath the overlay and prevents scrolling.\n    **/\n    preventScrolling () {\n      if (this.modal) {\n        const element = this.anchorEl?.closest('body, .tippy-box');\n        if (!element) return;\n        if (element.tagName?.toLowerCase() === 'body') {\n          disableRootScrolling(this.anchorEl.getRootNode().host);\n          this.tip?.setProps({ offset: this.offset });\n        } else {\n          element.classList.add('d-zi-popover');\n        }\n      }\n    },\n\n    /*\n    * Resets the prevent scrolling properties set in preventScrolling() back to normal.\n    **/\n    enableScrolling () {\n      const element = this.anchorEl?.closest('body, .tippy-box');\n      if (!element) return;\n      if (element.tagName?.toLowerCase() === 'body') {\n        enableRootScrolling(this.anchorEl.getRootNode().host);\n        this.tip?.setProps({ offset: this.offset });\n      } else {\n        element.classList.remove('d-zi-popover');\n      }\n    },\n\n    removeReferences () {\n      this.anchorEl = null;\n      this.popoverContentEl = null;\n      this.tip = null;\n    },\n\n    async onShow () {\n      if (this.contentWidth === 'anchor') {\n        await this.setPopoverContentAnchorWidth();\n      }\n\n      if (this.contentWidth === null) {\n        this.popoverContentEl.style.width = 'auto';\n      }\n\n      this.addEventListeners();\n    },\n\n    async onLeaveTransitionComplete () {\n      if (this._isUnmounting) return;\n      if (this.modal) {\n        await this.focusFirstElement(this.$refs.anchor);\n        if (this._isUnmounting) return;\n        // await next tick in case the user wants to change focus themselves.\n        await this.$nextTick();\n        if (this._isUnmounting) return;\n        this.enableScrolling();\n      }\n      if (this._isUnmounting) return;\n      this.tip?.unmount();\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    async onEnterTransitionComplete () {\n      if (this._isUnmounting) return;\n      this.focusInitialElement();\n      // await next tick in case the user wants to change focus themselves.\n      await this.$nextTick();\n      if (this._isUnmounting) return;\n      this.preventScrolling();\n      this.$emit('opened', true, this.$refs.popover__content);\n      if (this.open !== null) {\n        this.$emit('update:open', true);\n      }\n    },\n\n    focusInitialElement () {\n      if (this.initialFocusElement === 'dialog') {\n        returnFirstEl(this.$refs.content?.$el)?.focus();\n      }\n      // find by ID\n      if (this.initialFocusElement.startsWith('#')) {\n        this.focusInitialElementById();\n      }\n      if (this.initialFocusElement === 'first') {\n        this.focusFirstElementIfNeeded(this.$refs.popover__content);\n      }\n      if (this.initialFocusElement instanceof HTMLElement) {\n        this.initialFocusElement.focus();\n      }\n    },\n\n    focusInitialElementById () {\n      const result = returnFirstEl(this.$refs.content?.$el)?.querySelector(this.initialFocusElement);\n      if (result) {\n        result.focus();\n      } else {\n        console.warn('Could not find the element specified in dt-popover prop \"initialFocusElement\". ' +\n          'Defaulting to focusing the dialog.');\n        returnFirstEl(this.$refs.content?.$el)?.focus();\n      }\n    },\n\n    onResize () {\n      this.closePopover();\n    },\n\n    onClickOutside () {\n      if (!this.closeOnClick) return;\n      // If a popover is opened inside of this one, do not hide on click out\n      const innerModals = this.popoverContentEl?.querySelector('.d-popover__anchor--opened');\n      if (!innerModals) {\n        this.closePopover();\n      }\n    },\n\n    onKeydown (e) {\n      // Tab focus trapping (when modal or focustrap) is handled by the v-dt-focustrap directive on the content.\n      if (e.key === 'Escape') {\n        this.closePopover();\n      }\n\n      this.$emit('keydown', e);\n    },\n\n    async setPopoverContentAnchorWidth () {\n      await this.$nextTick();\n      this.popoverContentEl.style.width = `${this.anchorEl?.clientWidth}px`;\n    },\n\n    focusFirstElementIfNeeded (domEl) {\n      const focusableElements = this._getFocusableElements(domEl, true);\n      if (focusableElements.length !== 0) {\n        this.focusFirstElement(domEl);\n      } else if (this.showCloseButton) {\n        this.$refs.popover__header?.focusCloseButton();\n      } else {\n        // if there are no focusable elements at all focus the dialog itself\n        returnFirstEl(this.$refs.content?.$el).focus();\n      }\n    },\n\n    /**\n     * Return's the anchor ClientRect object relative to the window.\n     * Refer to: https://atomiks.github.io/tippyjs/v6/all-props/#getreferenceclientrect for more information\n     * @param error\n     */\n    getReferenceClientRect (error) {\n      const anchorReferenceRect = this.anchorEl?.getBoundingClientRect();\n\n      if (this.appendTo !== 'root' || error) return anchorReferenceRect;\n\n      const anchorOwnerDocument = this.anchorEl?.ownerDocument;\n      const anchorParentWindow = anchorOwnerDocument?.defaultView || anchorOwnerDocument?.parentWindow;\n      const anchorIframe = anchorParentWindow?.frameElement;\n\n      if (!anchorIframe) return anchorReferenceRect;\n\n      const iframeReferenceRect = anchorIframe.getBoundingClientRect();\n\n      return {\n        width: anchorReferenceRect?.width,\n        height: anchorReferenceRect?.height,\n        top: iframeReferenceRect?.top + anchorReferenceRect?.top,\n        left: iframeReferenceRect?.left + anchorReferenceRect?.left,\n        right: iframeReferenceRect?.right + anchorReferenceRect?.right,\n        bottom: iframeReferenceRect?.bottom + anchorReferenceRect?.bottom,\n      };\n    },\n\n    initTippyInstance () {\n      let internalAppendTo = null;\n      let iFrameError = false;\n\n      switch (this.appendTo) {\n        case 'body':\n          // When inside a native <dialog> (e.g. DtModal in Dialtone Next), append to the\n          // dialog so the popover stays in the browser's top layer. Otherwise fall back to body.\n          internalAppendTo = this.anchorEl?.closest('dialog') ??\n            this.anchorEl?.getRootNode()?.querySelector('body');\n          break;\n\n        case 'root':\n          // Try to attach the popover to root document, fallback to parent is fail\n          try {\n            internalAppendTo = window.parent.document.body;\n          } catch (err) {\n            console.error('Could not attach the popover to iframe parent window: ', err);\n            internalAppendTo = 'parent';\n            iFrameError = true;\n          }\n          break;\n\n        default:\n          internalAppendTo = this.appendTo;\n          break;\n      }\n\n      this.tip?.destroy();\n\n      this.tip = createTippyPopover(this.anchorEl, {\n        popperOptions: this.popperOptions(),\n        contentElement: this.popoverContentEl,\n        placement: this.placement,\n        offset: this.offset,\n        sticky: this.sticky,\n        appendTo: internalAppendTo,\n        interactive: true,\n        trigger: 'manual',\n        getReferenceClientRect: () => this.getReferenceClientRect(iFrameError),\n        // We have to manage hideOnClick functionality manually to handle\n        // popover within popover situations.\n        hideOnClick: false,\n        zIndex: this.modal ? 650 : this.calculateAnchorZindex(),\n        onClickOutside: this.onClickOutside,\n        onShow: this.onShow,\n      });\n    },\n\n    onMouseEnter () {\n      this.$emit('mouseenter-popover');\n    },\n\n    onMouseLeave () {\n      this.$emit('mouseleave-popover');\n    },\n\n    onMouseEnterAnchor () {\n      this.$emit('mouseenter-popover-anchor');\n    },\n\n    onMouseLeaveAnchor () {\n      this.$emit('mouseleave-popover-anchor');\n    },\n  },\n};\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"popover.js","names":[],"sources":["../../../components/Popover/Popover.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/mouse-events-have-key-events -->\n<template>\n  <div>\n    <Teleport\n      v-if=\"modal && isOpen\"\n      to=\"body\"\n    >\n      <div\n        class=\"d-modal--transparent\"\n        aria-hidden=\"false\"\n        @click.prevent.stop\n      />\n    </Teleport>\n    <component\n      :is=\"elementType\"\n      ref=\"popover\"\n      :class=\"['d-popover', { 'd-popover__anchor--opened': isOpen }]\"\n      data-qa=\"dt-popover-container\"\n    >\n      <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n      <div\n        :id=\"!ariaLabelledby && labelledBy\"\n        ref=\"anchor\"\n        :class=\"anchorClass\"\n        :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}-anchor` : 'dt-popover-anchor'\"\n        :tabindex=\"openOnContext ? 0 : undefined\"\n        @click.capture=\"defaultToggleOpen\"\n        @contextmenu=\"onContext\"\n        @keydown.up.prevent=\"onArrowKeyPress\"\n        @keydown.down.prevent=\"onArrowKeyPress\"\n        @keydown.escape.capture=\"closePopover\"\n        @keydown.enter=\"$emit('keydown', $event)\"\n        @keydown.space=\"$emit('keydown', $event)\"\n        @mouseenter=\"onMouseEnter\"\n        @mouseleave=\"onMouseLeave\"\n      >\n        <!-- @slot Anchor element that activates the popover. Usually a button. -->\n        <slot\n          name=\"anchor\"\n          :attrs=\"{\n            'aria-expanded': isOpen.toString(),\n            'aria-controls': id,\n            'aria-haspopup': role,\n          }\"\n        />\n      </div>\n      <dt-lazy-show\n        :id=\"id\"\n        ref=\"content\"\n        v-dt-focustrap=\"{\n          active: (modal || focustrap) && isOpen,\n          initialFocus: false,\n          restoreFocus: !modal && focustrap,\n        }\"\n        :role=\"role\"\n        :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}__dialog` : 'dt-popover'\"\n        :aria-hidden=\"`${!isOpen}`\"\n        :aria-labelledby=\"labelledBy\"\n        :aria-label=\"ariaLabel\"\n        :aria-modal=\"`${!modal}`\"\n        :transition=\"transition\"\n        :show=\"isOpen\"\n        :appear=\"toAppear\"\n        :class=\"['d-popover__dialog', { 'd-popover__dialog--modal': modal }, dialogClass]\"\n        :style=\"{\n          'max-height': calculatedMaxHeight,\n          'max-width': maxWidth,\n        }\"\n        :css=\"$attrs.css\"\n        :tabindex=\"contentTabindex\"\n        v-bind=\"modeAttrs\"\n        v-on=\"popoverListeners\"\n        @mouseenter=\"onMouseEnterAnchor\"\n        @mouseleave=\"onMouseLeaveAnchor\"\n      >\n        <popover-header-footer\n          v-if=\"hasSlotContent($slots.headerContent) || showCloseButton\"\n          ref=\"popover__header\"\n          :class=\"[POPOVER_HEADER_FOOTER_PADDING_CLASSES[padding], headerWrapperClass]\"\n          :content-class=\"headerClass\"\n          type=\"header\"\n          :show-close-button=\"showCloseButton\"\n          @close=\"closePopover\"\n        >\n          <template #content>\n            <!-- @slot Slot for popover header content -->\n            <slot\n              name=\"headerContent\"\n              :close=\"closePopover\"\n            />\n          </template>\n        </popover-header-footer>\n        <div\n          ref=\"popover__content\"\n          :data-qa=\"$attrs['data-qa'] ? `${$attrs['data-qa']}-content` : 'dt-popover-content'\"\n          :class=\"[\n            'd-popover__content',\n            POPOVER_PADDING_CLASSES[padding],\n            contentClass,\n          ]\"\n        >\n          <!-- @slot Slot for the content that is displayed in the popover when it is open. -->\n          <slot\n            name=\"content\"\n            :close=\"closePopover\"\n          />\n        </div>\n        <popover-header-footer\n          v-if=\"hasSlotContent($slots.footerContent)\"\n          ref=\"popover__footer\"\n          type=\"footer\"\n          :class=\"[POPOVER_HEADER_FOOTER_PADDING_CLASSES[padding], footerWrapperClass]\"\n          :content-class=\"footerClass\"\n        >\n          <template #content>\n            <!-- @slot Slot for the footer content. -->\n            <slot\n              name=\"footerContent\"\n              :close=\"closePopover\"\n            />\n          </template>\n        </popover-header-footer>\n        <sr-only-close-button\n          v-if=\"!showCloseButton\"\n          @close=\"closePopover\"\n        />\n      </dt-lazy-show>\n    </component>\n  </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport {\n  POPOVER_APPEND_TO_VALUES,\n  POPOVER_CONTENT_WIDTHS,\n  POPOVER_HEADER_FOOTER_PADDING_CLASSES,\n  POPOVER_INITIAL_FOCUS_STRINGS,\n  POPOVER_PADDING_CLASSES,\n  POPOVER_ROLES,\n  POPOVER_STICKY_VALUES,\n} from './PopoverConstants';\nimport { getUniqueString, hasSlotContent, isOutOfViewPort, warnIfUnmounted, disableRootScrolling, enableRootScrolling, returnFirstEl } from '@/common/utils';\nimport { HTML_ELEMENT_TYPE } from '@/common/constants';\nimport { DtLazyShow } from '@/components/LazyShow';\nimport ModalMixin from '@/common/mixins/modal';\nimport ModeMixin from '@/common/mixins/mode';\nimport { createTippyPopover, getPopperOptions } from './TippyUtils';\nimport PopoverHeaderFooter from './PopoverHeaderFooter.vue';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\n/**\n * A Popover displays a content overlay when its anchor element is activated.\n * @see https://dialtone.dialpad.com/components/popover.html\n */\nexport default {\n  name: 'DtPopover',\n\n  /********************\n   * CHILD COMPONENTS *\n   ********************/\n  components: {\n    SrOnlyCloseButton,\n    DtLazyShow,\n    PopoverHeaderFooter,\n  },\n\n  mixins: [ModalMixin, ModeMixin],\n\n  props: {\n    /**\n     * Controls whether the popover is shown. When null (default), the popover\n     * toggles on click. When set to true or false, the default trigger is\n     * disabled and the parent controls visibility via v-model:open.\n     * @values null, true, false\n     */\n    open: {\n      type: [Boolean, null],\n      default: null,\n    },\n\n    /**\n     * Opens the popover on right click (context menu). If you set this value to `true`,\n     * the default trigger behavior will be disabled.\n     * @values true, false\n     */\n    openOnContext: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Element type (tag name) of the root element of the component.\n     */\n    elementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * ARIA role for the content of the popover. Defaults to \"dialog\".\n     * <a class=\"d-link\" href=\"https://www.w3.org/TR/wai-aria/#aria-haspopup\" target=\"_blank\">aria-haspopup</a>\n     */\n    role: {\n      type: String,\n      default: 'dialog',\n      validator: (role) => {\n        return POPOVER_ROLES.includes(role);\n      },\n    },\n\n    /**\n     * ID of the element that serves as the label for the popover content.\n     * Defaults to the \"anchor\" element; this exists to provide a different\n     * ID of the label element if, for example, the anchor slot contains\n     * other items that do not serve as a label. You should provide this\n     * or ariaLabel, but not both.\n     */\n    ariaLabelledby: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Descriptive label for the popover content. You should provide this\n     * or ariaLabelledby, but not both.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Padding size class for the popover content.\n     * @values none, small, medium, large\n     */\n    padding: {\n      type: String,\n      default: 'large',\n      validator: (padding) => {\n        return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n      },\n    },\n\n    /**\n     * Additional class name for the content wrapper element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Width configuration for the popover content. When its value is 'anchor',\n     * the popover content will have the same width as the anchor.\n     * @values null, anchor\n     */\n    contentWidth: {\n      type: String,\n      default: '',\n      validator: contentWidth => POPOVER_CONTENT_WIDTHS.includes(contentWidth),\n    },\n\n    /**\n     * Whether to apply transition on initial render in the content lazy show component.\n     */\n    contentAppear: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Tabindex value for the content. Passing null, no tabindex attribute will be set.\n     */\n    contentTabindex: {\n      type: Number || null,\n      default: -1,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     * @deprecated Use externalAnchorElement instead for Shadow DOM compatibility.\n     */\n    externalAnchor: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * External anchor element reference. Use this instead of externalAnchor when\n     * the anchor may be inside a Shadow DOM, as querySelector cannot pierce shadow boundaries.\n     */\n    externalAnchorElement: {\n      type: HTML_ELEMENT_TYPE,\n      default: null,\n    },\n\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     *  Displaces the content box from its anchor element\n     *  by the specified number of pixels.\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, 4],\n    },\n\n    /**\n     * Closes the popover when clicking the anchor or outside the content box.\n     * @values true, false\n     */\n    closeOnClick: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Determines modal state. If enabled popover has a modal overlay\n     * preventing interaction with elements below it, but it is invisible.\n     * @values true, false\n     */\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * When true, traps Tab/Shift+Tab focus within the popover dialog.\n     * Use this to enable focus trapping independently of modal state —\n     * e.g. a non-modal popover whose content still requires keyboard containment.\n     * When `modal` is true, the trap is already active; this prop has no additional effect.\n     * @values true, false\n     */\n    focustrap: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\".\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => {\n        return ['auto'];\n      },\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     */\n    placement: {\n      type: String,\n      default: 'bottom-end',\n    },\n\n    /**\n     * If set to false the dialog will display over top of the anchor when there is insufficient space.\n     * If set to true it will never move from its position relative to the anchor and will clip instead.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * @values true, false\n     */\n    tether: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * If the popover sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return POPOVER_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    maxHeight: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines visibility for close button\n     * @values true, false\n     */\n    showCloseButton: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the anchor wrapper element.\n     */\n    anchorClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the header element (d-popover__header).\n     */\n    headerWrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the header content wrapper element.\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the footer element (d-popover__footer).\n     */\n    footerWrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the footer content wrapper element.\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the dialog element.\n     */\n    dialogClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * The element that is focused when the popover is opened. This can be an\n     * HTMLElement within the popover, a string starting with '#' which will\n     * find the element by ID. 'first' which will automatically focus\n     * the first element, or 'dialog' which will focus the dialog window itself.\n     * If the dialog is modal this prop cannot be 'none'.\n     * @values none, dialog, first\n     */\n    initialFocusElement: {\n      type: [String, HTML_ELEMENT_TYPE],\n      default: 'first',\n      validator: initialFocusElement => {\n        return POPOVER_INITIAL_FOCUS_STRINGS.includes(initialFocusElement) ||\n          (initialFocusElement instanceof HTMLElement) ||\n          initialFocusElement.startsWith('#');\n      },\n    },\n\n    /**\n     * If the popover should open pressing up or down arrow key on the anchor element.\n     * This can be set when not passing open prop.\n     * @values true, false\n     */\n    openWithArrowKeys: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest ancestor <dialog> element when inside one\n     * (keeping the popover in the browser's top layer), or to the nearest body otherwise.\n     * To always append to body regardless of dialog context, pass document.body as an HTMLElement.\n     * 'root' will try append to the iFrame's parent body if it is contained in an iFrame\n     * and has permissions to access it, else, it'd default to 'parent'.\n     * @values 'body', 'parent', 'root', HTMLElement\n     */\n    appendTo: {\n      type: [HTML_ELEMENT_TYPE, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n  },\n\n  emits: [\n    /**\n     * Native keydown event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Emitted when popover is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean | Array}\n     */\n    'opened',\n\n    /**\n     * Emitted when the mouse enters the popover\n     *\n     * @event mouseenter-popover\n     */\n    'mouseenter-popover',\n\n    /**\n     * Emitted when the mouse leaves the popover\n     *\n     * @event mouseleave-popover\n     */\n    'mouseleave-popover',\n\n    /**\n     * Emitted when the mouse enters the popover anchor\n     *\n     * @event mouseenter-popover-anchor\n     */\n    'mouseenter-popover-anchor',\n\n    /**\n     * Emitted when the mouse leaves the popover anchor\n     *\n     * @event mouseleave-popover-anchor\n     */\n    'mouseleave-popover-anchor',\n  ],\n\n  data () {\n    return {\n      POPOVER_PADDING_CLASSES,\n      POPOVER_HEADER_FOOTER_PADDING_CLASSES,\n      intersectionObserver: null,\n      mutationObserver: null,\n      isOutsideViewport: false,\n      isOpen: false,\n      toAppear: false,\n      anchorEl: null,\n      popoverContentEl: null,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    popoverListeners () {\n      return {\n        keydown: event => {\n          this.onKeydown(event);\n        },\n\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    calculatedMaxHeight () {\n      if (this.isOutsideViewport && this.modal) {\n        return `calc(100vh - var(--dt-spacing-50))`;\n      }\n      return this.maxHeight;\n    },\n\n    labelledBy () {\n      // aria-labelledby should be set only if aria-labelledby is passed as a prop, or if\n      // there is no aria-label and the labelledby should point to the anchor.\n      return this.ariaLabelledby || (!this.ariaLabel && getUniqueString('DtPopover__anchor'));\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      handler () {\n        this.validateProps();\n      },\n    },\n\n    modal (modal) {\n      this.tip?.setProps({\n        zIndex: modal ? 650 : this.calculateAnchorZindex(),\n      });\n    },\n\n    offset (offset) {\n      this.tip?.setProps({\n        offset,\n      });\n    },\n\n    sticky (sticky) {\n      this.tip?.setProps({\n        sticky,\n      });\n    },\n\n    fallbackPlacements () {\n      this.tip?.setProps({\n        popperOptions: this.popperOptions(),\n      });\n    },\n\n    tether () {\n      this.tip?.setProps({\n        popperOptions: this.popperOptions(),\n      });\n    },\n\n    externalAnchorElement () {\n      this.updateAnchorEl();\n    },\n\n    placement (placement) {\n      this.tip?.setProps({\n        placement,\n      });\n    },\n\n    open: {\n      handler: function (open) {\n        if (open !== null) {\n          this.isOpen = open;\n        }\n        if (open === true) {\n          this.toAppear = true;\n        }\n      },\n\n      immediate: true,\n    },\n\n    contentAppear: {\n      handler: function (contentAppear) {\n        if (contentAppear !== null) {\n          this.toAppear = contentAppear;\n        }\n      },\n    },\n\n    isOpen (isOpen, isPrev) {\n      if (isOpen) {\n        this.initTippyInstance();\n        this.tip?.show();\n      } else if (!isOpen && isPrev !== isOpen) {\n        this.removeEventListeners();\n        this.tip?.hide();\n      }\n    },\n  },\n\n  mounted () {\n    warnIfUnmounted(returnFirstEl(this.$el), this.$options.name);\n\n    this.popoverContentEl = returnFirstEl(this.$refs.content?.$el);\n    this.updateAnchorEl();\n\n    this.mutationObserver = new MutationObserver(this.updateAnchorEl);\n    this.mutationObserver.observe(this.$refs.anchor, {childList: true});\n\n    // rootMargin here must be greater than the margin of the height we are setting in calculatedMaxHeight which\n    // currently is var(--dt-spacing-50) (4px). If not the intersectionObserver will continually trigger in an infinite\n    // loop.\n    // threshold 1.0 makes this trigger every time the dialog \"touches\" the edge of the viewport.\n    this.intersectionObserver = new IntersectionObserver(this.hasIntersectedViewport);\n    this.intersectionObserver.observe(this.popoverContentEl);\n  },\n\n  beforeUnmount () {\n    this._isUnmounting = true;\n    // Cancel any in-progress CSS transitions so transitionend cannot fire\n    // after this component is torn down and call into dead lifecycle methods.\n    if (this.popoverContentEl) {\n      this.popoverContentEl.style.transition = 'none';\n    }\n    this.tip?.destroy();\n    this.intersectionObserver?.disconnect();\n    this.mutationObserver?.disconnect();\n    this.removeReferences();\n    this.removeEventListeners();\n  },\n\n  /******************\n   *     METHODS    *\n   ******************/\n  methods: {\n\n    getModeReferenceEl () {\n      return this.$refs.anchor;\n    },\n\n    hasIntersectedViewport (entries) {\n      const dialog = entries?.[0]?.target;\n      if (!dialog) return;\n      const isOut = isOutOfViewPort(dialog);\n      this.isOutsideViewport = isOut.bottom || isOut.top;\n    },\n\n    updateAnchorEl () {\n      const externalAnchorEl = this.externalAnchorElement ||\n        (this.externalAnchor\n          ? this.$refs.anchor.getRootNode().querySelector(`#${this.externalAnchor}`)\n          : null);\n      const anchorEl = externalAnchorEl ?? this.$refs.anchor.children[0];\n      if (anchorEl === this.anchorEl) {\n        return;\n      }\n      this.anchorEl = anchorEl;\n\n      this.tip?.destroy();\n      delete this.tip;\n\n      if (!this.anchorEl) {\n        console.warn('No anchor found for popover');\n        return;\n      }\n\n      if (this.isOpen) {\n        this.initTippyInstance();\n        this.tip?.show();\n      }\n    },\n\n    popperOptions () {\n      return getPopperOptions({\n        fallbackPlacements: this.fallbackPlacements,\n        tether: this.tether,\n        hasHideModifierEnabled: true,\n      });\n    },\n\n    validateProps () {\n      if (this.modal && this.initialFocusElement === 'none') {\n        console.error('If the popover is modal you must set the ' +\n        'initialFocusElement prop. Possible values: \"dialog\", \"first\", HTMLElement');\n      }\n    },\n\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at popover z-index\n      if (returnFirstEl(this.$el).getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"], .d-modal[open], .d-modal--transparent[open]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 650 when\n        // anchor of popover is within a drawer.\n        this.anchorEl?.closest('.d-zi-drawer')) {\n        return 650;\n      } else {\n        return 300;\n      }\n    },\n\n    defaultToggleOpen (e) {\n      if (this.openOnContext) { return; }\n\n      // Only use default toggle behaviour if the user has not set the open prop.\n      // Check that the anchor element specifically was clicked.\n      if (this.open === null || this.open === undefined) {\n        if ((!this.anchorEl?.contains(e.target) && !this.anchorEl?.isEqualNode(e.target)) || this.anchorEl?.disabled) {\n          return;\n        }\n\n        this.toggleOpen();\n      }\n    },\n\n    async onContext (event) {\n      if (!this.openOnContext) { return; }\n\n      event.preventDefault();\n\n      this.isOpen = true;\n      await this.$nextTick();\n      this.tip?.setProps({\n        placement: 'right-start',\n        getReferenceClientRect: () => ({\n          width: 0,\n          height: 0,\n          top: event.clientY,\n          bottom: event.clientY,\n          left: event.clientX,\n          right: event.clientX,\n        }),\n      });\n    },\n\n    toggleOpen () {\n      this.isOpen = !this.isOpen;\n    },\n\n    onArrowKeyPress (e) {\n      if (this.open !== null) { return; }\n      if (this.openWithArrowKeys && this.anchorEl?.contains(e.target)) {\n        if (!this.isOpen) {\n          this.isOpen = true;\n        }\n      }\n\n      this.$emit('keydown', e);\n    },\n\n    addEventListeners () {\n      window.addEventListener('dt-popover-close', this.closePopover);\n      // align popover content width when contentWidth is 'anchor'\n      if (this.contentWidth === 'anchor') {\n        window.addEventListener('resize', this.onResize);\n      }\n    },\n\n    removeEventListeners () {\n      window.removeEventListener('dt-popover-close', this.closePopover);\n      if (this.contentWidth === 'anchor') {\n        window.removeEventListener('resize', this.onResize);\n      }\n    },\n\n    closePopover () {\n      this.isOpen = false;\n    },\n\n    /*\n    * Prevents scrolling outside of the currently opened modal popover by:\n    *   - when anchor is not within another popover: setting the body to overflow: hidden\n    *   - when anchor is within another popover: set the popover dialog container to it's non-modal z-index\n    *     since it is no longer the active modal. This puts it underneath the overlay and prevents scrolling.\n    **/\n    preventScrolling () {\n      if (this.modal) {\n        const element = this.anchorEl?.closest('body, .tippy-box');\n        if (!element) return;\n        if (element.tagName?.toLowerCase() === 'body') {\n          disableRootScrolling(this.anchorEl.getRootNode().host);\n          this.tip?.setProps({ offset: this.offset });\n        } else {\n          element.classList.add('d-zi-popover');\n        }\n      }\n    },\n\n    /*\n    * Resets the prevent scrolling properties set in preventScrolling() back to normal.\n    **/\n    enableScrolling () {\n      const element = this.anchorEl?.closest('body, .tippy-box');\n      if (!element) return;\n      if (element.tagName?.toLowerCase() === 'body') {\n        enableRootScrolling(this.anchorEl.getRootNode().host);\n        this.tip?.setProps({ offset: this.offset });\n      } else {\n        element.classList.remove('d-zi-popover');\n      }\n    },\n\n    removeReferences () {\n      this.anchorEl = null;\n      this.popoverContentEl = null;\n      this.tip = null;\n    },\n\n    async onShow () {\n      if (this.contentWidth === 'anchor') {\n        await this.setPopoverContentAnchorWidth();\n        if (this._isUnmounting) return;\n      }\n\n      if (this.contentWidth === null) {\n        this.popoverContentEl.style.width = 'auto';\n      }\n\n      this.addEventListeners();\n    },\n\n    async onLeaveTransitionComplete () {\n      if (this._isUnmounting) return;\n      if (this.modal) {\n        await this.focusFirstElement(this.$refs.anchor);\n        if (this._isUnmounting) return;\n        // await next tick in case the user wants to change focus themselves.\n        await this.$nextTick();\n        if (this._isUnmounting) return;\n        this.enableScrolling();\n      }\n      if (this._isUnmounting) return;\n      this.tip?.unmount();\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    async onEnterTransitionComplete () {\n      if (this._isUnmounting) return;\n      this.focusInitialElement();\n      // await next tick in case the user wants to change focus themselves.\n      await this.$nextTick();\n      if (this._isUnmounting) return;\n      this.preventScrolling();\n      this.$emit('opened', true, this.$refs.popover__content);\n      if (this.open !== null) {\n        this.$emit('update:open', true);\n      }\n    },\n\n    focusInitialElement () {\n      if (this.initialFocusElement === 'dialog') {\n        returnFirstEl(this.$refs.content?.$el)?.focus();\n      }\n      // find by ID\n      if (this.initialFocusElement.startsWith('#')) {\n        this.focusInitialElementById();\n      }\n      if (this.initialFocusElement === 'first') {\n        this.focusFirstElementIfNeeded(this.$refs.popover__content);\n      }\n      if (this.initialFocusElement instanceof HTMLElement) {\n        this.initialFocusElement.focus();\n      }\n    },\n\n    focusInitialElementById () {\n      const result = returnFirstEl(this.$refs.content?.$el)?.querySelector(this.initialFocusElement);\n      if (result) {\n        result.focus();\n      } else {\n        console.warn('Could not find the element specified in dt-popover prop \"initialFocusElement\". ' +\n          'Defaulting to focusing the dialog.');\n        returnFirstEl(this.$refs.content?.$el)?.focus();\n      }\n    },\n\n    onResize () {\n      this.closePopover();\n    },\n\n    onClickOutside () {\n      if (!this.closeOnClick) return;\n      // If a popover is opened inside of this one, do not hide on click out\n      const innerModals = this.popoverContentEl?.querySelector('.d-popover__anchor--opened');\n      if (!innerModals) {\n        this.closePopover();\n      }\n    },\n\n    onKeydown (e) {\n      // Tab focus trapping (when modal or focustrap) is handled by the v-dt-focustrap directive on the content.\n      if (e.key === 'Escape') {\n        this.closePopover();\n      }\n\n      this.$emit('keydown', e);\n    },\n\n    async setPopoverContentAnchorWidth () {\n      await this.$nextTick();\n      this.popoverContentEl.style.width = `${this.anchorEl?.clientWidth}px`;\n    },\n\n    focusFirstElementIfNeeded (domEl) {\n      const focusableElements = this._getFocusableElements(domEl, true);\n      if (focusableElements.length !== 0) {\n        this.focusFirstElement(domEl);\n      } else if (this.showCloseButton) {\n        this.$refs.popover__header?.focusCloseButton();\n      } else {\n        // if there are no focusable elements at all focus the dialog itself\n        returnFirstEl(this.$refs.content?.$el).focus();\n      }\n    },\n\n    /**\n     * Return's the anchor ClientRect object relative to the window.\n     * Refer to: https://atomiks.github.io/tippyjs/v6/all-props/#getreferenceclientrect for more information\n     * @param error\n     */\n    getReferenceClientRect (error) {\n      const anchorReferenceRect = this.anchorEl?.getBoundingClientRect();\n\n      if (this.appendTo !== 'root' || error) return anchorReferenceRect;\n\n      const anchorOwnerDocument = this.anchorEl?.ownerDocument;\n      const anchorParentWindow = anchorOwnerDocument?.defaultView || anchorOwnerDocument?.parentWindow;\n      const anchorIframe = anchorParentWindow?.frameElement;\n\n      if (!anchorIframe) return anchorReferenceRect;\n\n      const iframeReferenceRect = anchorIframe.getBoundingClientRect();\n\n      return {\n        width: anchorReferenceRect?.width,\n        height: anchorReferenceRect?.height,\n        top: iframeReferenceRect?.top + anchorReferenceRect?.top,\n        left: iframeReferenceRect?.left + anchorReferenceRect?.left,\n        right: iframeReferenceRect?.right + anchorReferenceRect?.right,\n        bottom: iframeReferenceRect?.bottom + anchorReferenceRect?.bottom,\n      };\n    },\n\n    initTippyInstance () {\n      let internalAppendTo = null;\n      let iFrameError = false;\n\n      switch (this.appendTo) {\n        case 'body':\n          // When inside a native <dialog> (e.g. DtModal in Dialtone Next), append to the\n          // dialog so the popover stays in the browser's top layer. Otherwise fall back to body.\n          internalAppendTo = this.anchorEl?.closest('dialog') ??\n            this.anchorEl?.getRootNode()?.querySelector('body');\n          break;\n\n        case 'root':\n          // Try to attach the popover to root document, fallback to parent is fail\n          try {\n            internalAppendTo = window.parent.document.body;\n          } catch (err) {\n            console.error('Could not attach the popover to iframe parent window: ', err);\n            internalAppendTo = 'parent';\n            iFrameError = true;\n          }\n          break;\n\n        default:\n          internalAppendTo = this.appendTo;\n          break;\n      }\n\n      this.tip?.destroy();\n\n      this.tip = createTippyPopover(this.anchorEl, {\n        popperOptions: this.popperOptions(),\n        contentElement: this.popoverContentEl,\n        placement: this.placement,\n        offset: this.offset,\n        sticky: this.sticky,\n        appendTo: internalAppendTo,\n        interactive: true,\n        trigger: 'manual',\n        getReferenceClientRect: () => this.getReferenceClientRect(iFrameError),\n        // We have to manage hideOnClick functionality manually to handle\n        // popover within popover situations.\n        hideOnClick: false,\n        zIndex: this.modal ? 650 : this.calculateAnchorZindex(),\n        onClickOutside: this.onClickOutside,\n        onShow: this.onShow,\n      });\n    },\n\n    onMouseEnter () {\n      this.$emit('mouseenter-popover');\n    },\n\n    onMouseLeave () {\n      this.$emit('mouseleave-popover');\n    },\n\n    onMouseEnterAnchor () {\n      this.$emit('mouseenter-popover-anchor');\n    },\n\n    onMouseLeaveAnchor () {\n      this.$emit('mouseleave-popover-anchor');\n    },\n  },\n};\n</script>\n"],"mappings":"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"}

package/dist/lib/progress-circle/progress-circle.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),t=require(`./progress-circle-constants.cjs`);let n=require(`vue`);var r={name:`DtProgressCircle`,props:{ariaLabel:{type:String,required:!0},progress:{type:Number,default:0,validator:e=>e>=0&&e<=100},size:{type:String,default:`500`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_SIZES).includes(e)},kind:{type:String,default:`default`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_KINDS).includes(e)}},data(){return{strokeWidth:3.25,uid:Math.random().toString(36).substring(2,9)}},computed:{isAi(){return this.kind===`ai`},aiGradientId(){return`progress-circle-ai-gradient-${this.uid}`},fillStrokeStyle(){return this.isAi?{stroke:`url(#${this.aiGradientId})`}:{}},sizeClass(){return t.PROGRESS_CIRCLE_SIZES[this.size]},kindClass(){return t.PROGRESS_CIRCLE_KINDS[this.kind]},circleRadius(){return 12-this.strokeWidth/2},circleCircumference(){return 2*Math.PI*this.circleRadius},circlePath(){let e=this.circleRadius,t=12-e;return`M 12 ${t} A ${e} ${e} 0 0 1 12 ${12+e} A ${e} ${e} 0 0 1 12 ${t} Z`},cssVars(){let e=this.circleCircumference,t=e*(this.progress>0&&this.progress<5?5:this.progress)/100,n=this.strokeWidth,r=n/2,i=this.progress>0&&this.progress<100,a=i?n:0;return{"--stroke-dasharray":!i&&this.progress>=100?`none`:e,"--fill-dashoffset":e-Math.max(0,t-a),"--fill-rotate":`${i?r/e*360:0}deg`,"--track-dasharray":!i&&this.progress<=0?`none`:`${Math.max(0,e-t-a)} ${e}`,"--track-dashoffset":-(t+(i?r:0))}}}},i=[`aria-label`,`aria-valuenow`],a={key:0},o=[`id`],s=[`d`,`stroke-width`],c=[`d`,`stroke-width`];function l(e,t,r,l,u,d){return(0,n.openBlock)(),(0,n.createElementBlock)(`div`,{class:(0,n.normalizeClass)([`d-progress-circle`,[d.sizeClass,d.kindClass]]),role:`progressbar`,"aria-label":r.ariaLabel,tabindex:`-1`,"aria-valuenow":r.progress,"aria-valuemin":`0`,"aria-valuemax":`100`,"data-qa":`dt-progress-circle`},[((0,n.openBlock)(),(0,n.createElementBlock)(`svg`,{class:`d-progress-circle__bar`,style:(0,n.normalizeStyle)(d.cssVars),viewBox:`0 0 24 24`},[d.isAi?((0,n.openBlock)(),(0,n.createElementBlock)(`defs`,a,[(0,n.createElementVNode)(`linearGradient`,{id:d.aiGradientId,x1:`0%`,y1:`0%`,x2:`100%`,y2:`100%`},[...t[0]||(t[0]=[(0,n.createElementVNode)(`stop`,{offset:`0%`,"stop-color":`var(--dt-color-brand-gold)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`33%`,"stop-color":`var(--dt-color-brand-red)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`66%`,"stop-color":`var(--dt-color-brand-magenta)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`100%`,"stop-color":`var(--dt-color-brand-purple)`},null,-1)])],8,o)])):(0,n.createCommentVNode)(``,!0),r.progress<=95?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:1,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--track`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`},null,8,s)):(0,n.createCommentVNode)(``,!0),r.progress>0?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:2,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--fill`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`,style:(0,n.normalizeStyle)(d.fillStrokeStyle)},null,12,c)):(0,n.createCommentVNode)(``,!0)],4))],10,i)}var u=e.t(r,[[`render`,l]]);exports.default=u;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/validators/index.cjs`),t=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),n=require(`./progress-circle-constants.cjs`);let r=require(`vue`);var i={name:`DtProgressCircle`,props:{ariaLabel:{type:String,required:!0},progress:{type:Number,default:0,validator:e=>e>=0&&e<=100},size:{type:[String,Number],default:500,validator:e.ordinalSizeValidator(n.PROGRESS_CIRCLE_SIZES)},kind:{type:String,default:`default`,validator:e=>Object.keys(n.PROGRESS_CIRCLE_KINDS).includes(e)}},data(){return{strokeWidth:3.25,uid:Math.random().toString(36).substring(2,9)}},computed:{isAi(){return this.kind===`ai`},aiGradientId(){return`progress-circle-ai-gradient-${this.uid}`},fillStrokeStyle(){return this.isAi?{stroke:`url(#${this.aiGradientId})`}:{}},sizeClass(){return n.PROGRESS_CIRCLE_SIZES[this.size]},kindClass(){return n.PROGRESS_CIRCLE_KINDS[this.kind]},circleRadius(){return 12-this.strokeWidth/2},circleCircumference(){return 2*Math.PI*this.circleRadius},circlePath(){let e=this.circleRadius,t=12-e;return`M 12 ${t} A ${e} ${e} 0 0 1 12 ${12+e} A ${e} ${e} 0 0 1 12 ${t} Z`},cssVars(){let e=this.circleCircumference,t=e*(this.progress>0&&this.progress<5?5:this.progress)/100,n=this.strokeWidth,r=n/2,i=this.progress>0&&this.progress<100,a=i?n:0;return{"--stroke-dasharray":!i&&this.progress>=100?`none`:e,"--fill-dashoffset":e-Math.max(0,t-a),"--fill-rotate":`${i?r/e*360:0}deg`,"--track-dasharray":!i&&this.progress<=0?`none`:`${Math.max(0,e-t-a)} ${e}`,"--track-dashoffset":-(t+(i?r:0))}}}},a=[`aria-label`,`aria-valuenow`],o={key:0},s=[`id`],c=[`d`,`stroke-width`],l=[`d`,`stroke-width`];function u(e,t,n,i,u,d){return(0,r.openBlock)(),(0,r.createElementBlock)(`div`,{class:(0,r.normalizeClass)([`d-progress-circle`,[d.sizeClass,d.kindClass]]),role:`progressbar`,"aria-label":n.ariaLabel,tabindex:`-1`,"aria-valuenow":n.progress,"aria-valuemin":`0`,"aria-valuemax":`100`,"data-qa":`dt-progress-circle`},[((0,r.openBlock)(),(0,r.createElementBlock)(`svg`,{class:`d-progress-circle__bar`,style:(0,r.normalizeStyle)(d.cssVars),viewBox:`0 0 24 24`},[d.isAi?((0,r.openBlock)(),(0,r.createElementBlock)(`defs`,o,[(0,r.createElementVNode)(`linearGradient`,{id:d.aiGradientId,x1:`0%`,y1:`0%`,x2:`100%`,y2:`100%`},[...t[0]||(t[0]=[(0,r.createElementVNode)(`stop`,{offset:`0%`,"stop-color":`var(--dt-color-brand-gold)`},null,-1),(0,r.createElementVNode)(`stop`,{offset:`33%`,"stop-color":`var(--dt-color-brand-red)`},null,-1),(0,r.createElementVNode)(`stop`,{offset:`66%`,"stop-color":`var(--dt-color-brand-magenta)`},null,-1),(0,r.createElementVNode)(`stop`,{offset:`100%`,"stop-color":`var(--dt-color-brand-purple)`},null,-1)])],8,s)])):(0,r.createCommentVNode)(``,!0),n.progress<=95?((0,r.openBlock)(),(0,r.createElementBlock)(`path`,{key:1,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--track`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`},null,8,c)):(0,r.createCommentVNode)(``,!0),n.progress>0?((0,r.openBlock)(),(0,r.createElementBlock)(`path`,{key:2,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--fill`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`,style:(0,r.normalizeStyle)(d.fillStrokeStyle)},null,12,l)):(0,r.createCommentVNode)(``,!0)],4))],10,a)}var d=t.t(i,[[`render`,u]]);exports.default=d;
 //# sourceMappingURL=progress-circle.cjs.map

package/dist/lib/progress-circle/progress-circle.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"progress-circle.cjs","names":[],"sources":["../../../components/ProgressCircle/ProgressCircle.vue"],"sourcesContent":["<script>\n/**\n * Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n */\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './ProgressCircleConstants';\n\nexport default {\n  name: 'DtProgressCircle',\n  props: {\n    /** Accessible label read by screen readers. */\n    ariaLabel: { type: String, required: true },\n    /** Current progress value (0–100). */\n    progress: {\n      type: Number,\n      default: 0,\n      validator: (v) => v >= 0 && v <= 100,\n    },\n\n    /**\n     * The size of the progress indicator, aligning to Dialtone icon sizes.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    size: {\n      type: String,\n      default: '500',\n      validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n    },\n\n    /**\n     * The color variant of the progress indicator.\n     * @values default, brand, critical, positive, warning, info, ai\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n    },\n  },\n\n  data () {\n    return {\n      strokeWidth: 3.25,\n      uid: Math.random().toString(36).substring(2, 9),\n    };\n  },\n\n  computed: {\n    // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n    // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n    isAi () {\n      return this.kind === 'ai';\n    },\n\n    // Unique per-instance to avoid collisions when multiple progress circles coexist.\n    aiGradientId () {\n      return `progress-circle-ai-gradient-${this.uid}`;\n    },\n\n    fillStrokeStyle () {\n      return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n    },\n\n    sizeClass () {\n      return PROGRESS_CIRCLE_SIZES[this.size];\n    },\n\n    kindClass () {\n      return PROGRESS_CIRCLE_KINDS[this.kind];\n    },\n\n    circleRadius () {\n      return 12 - (this.strokeWidth / 2);\n    },\n\n    circleCircumference () {\n      return 2 * Math.PI * this.circleRadius;\n    },\n\n    // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n    circlePath () {\n      const r = this.circleRadius;\n      const top = 12 - r;\n      const bottom = 12 + r;\n      return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n    },\n\n    // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n    cssVars () {\n      const C = this.circleCircumference;\n      const MIN_VISUAL_PROGRESS = 5;\n      const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n        ? MIN_VISUAL_PROGRESS\n        : this.progress;\n      const fillLength = C * visualProgress / 100;\n      const sw = this.strokeWidth;\n      const capArc = sw / 2;\n\n      // When both arcs are visible, round linecaps extend capArc past each endpoint.\n      // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n      // exactly at each junction without overlapping. Rotate the fill forward by\n      // capArc so its start cap lands at 12 o'clock.\n      const both = this.progress > 0 && this.progress < 100;\n      const adj = both ? sw : 0;\n\n      return {\n        // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n        '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n        '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n        '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n        '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n        '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n      };\n    },\n  },\n\n};\n</script>\n\n<template>\n  <div\n    class=\"d-progress-circle\"\n    :class=\"[sizeClass, kindClass]\"\n    role=\"progressbar\"\n    :aria-label=\"ariaLabel\"\n    tabindex=\"-1\"\n    :aria-valuenow=\"progress\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    data-qa=\"dt-progress-circle\"\n  >\n    <svg\n      class=\"d-progress-circle__bar\"\n      :style=\"cssVars\"\n      viewBox=\"0 0 24 24\"\n    >\n      <defs v-if=\"isAi\">\n        <linearGradient\n          :id=\"aiGradientId\"\n          x1=\"0%\"\n          y1=\"0%\"\n          x2=\"100%\"\n          y2=\"100%\"\n        >\n          <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n          <stop\n            offset=\"0%\"\n            stop-color=\"var(--dt-color-brand-gold)\"\n          />\n          <stop\n            offset=\"33%\"\n            stop-color=\"var(--dt-color-brand-red)\"\n          />\n          <stop\n            offset=\"66%\"\n            stop-color=\"var(--dt-color-brand-magenta)\"\n          />\n          <stop\n            offset=\"100%\"\n            stop-color=\"var(--dt-color-brand-purple)\"\n          />\n        </linearGradient>\n      </defs>\n      <path\n        v-if=\"progress <= 95\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n      />\n      <path\n        v-if=\"progress > 0\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n        :style=\"fillStrokeStyle\"\n      />\n    </svg>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"progress-circle.cjs","names":[],"sources":["../../../components/ProgressCircle/ProgressCircle.vue"],"sourcesContent":["<script>\n/**\n * Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n */\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './ProgressCircleConstants';\nimport { ordinalSizeValidator } from '@/common/validators';\n\nexport default {\n  name: 'DtProgressCircle',\n  props: {\n    /** Accessible label read by screen readers. */\n    ariaLabel: { type: String, required: true },\n    /** Current progress value (0–100). */\n    progress: {\n      type: Number,\n      default: 0,\n      validator: (v) => v >= 0 && v <= 100,\n    },\n\n    /**\n     * The size of the progress indicator, aligning to Dialtone icon sizes.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    size: {\n      type: [String, Number],\n      default: 500,\n      validator: ordinalSizeValidator(PROGRESS_CIRCLE_SIZES),\n    },\n\n    /**\n     * The color variant of the progress indicator.\n     * @values default, brand, critical, positive, warning, info, ai\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n    },\n  },\n\n  data () {\n    return {\n      strokeWidth: 3.25,\n      uid: Math.random().toString(36).substring(2, 9),\n    };\n  },\n\n  computed: {\n    // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n    // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n    isAi () {\n      return this.kind === 'ai';\n    },\n\n    // Unique per-instance to avoid collisions when multiple progress circles coexist.\n    aiGradientId () {\n      return `progress-circle-ai-gradient-${this.uid}`;\n    },\n\n    fillStrokeStyle () {\n      return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n    },\n\n    sizeClass () {\n      return PROGRESS_CIRCLE_SIZES[this.size];\n    },\n\n    kindClass () {\n      return PROGRESS_CIRCLE_KINDS[this.kind];\n    },\n\n    circleRadius () {\n      return 12 - (this.strokeWidth / 2);\n    },\n\n    circleCircumference () {\n      return 2 * Math.PI * this.circleRadius;\n    },\n\n    // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n    circlePath () {\n      const r = this.circleRadius;\n      const top = 12 - r;\n      const bottom = 12 + r;\n      return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n    },\n\n    // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n    cssVars () {\n      const C = this.circleCircumference;\n      const MIN_VISUAL_PROGRESS = 5;\n      const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n        ? MIN_VISUAL_PROGRESS\n        : this.progress;\n      const fillLength = C * visualProgress / 100;\n      const sw = this.strokeWidth;\n      const capArc = sw / 2;\n\n      // When both arcs are visible, round linecaps extend capArc past each endpoint.\n      // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n      // exactly at each junction without overlapping. Rotate the fill forward by\n      // capArc so its start cap lands at 12 o'clock.\n      const both = this.progress > 0 && this.progress < 100;\n      const adj = both ? sw : 0;\n\n      return {\n        // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n        '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n        '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n        '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n        '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n        '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n      };\n    },\n  },\n\n};\n</script>\n\n<template>\n  <div\n    class=\"d-progress-circle\"\n    :class=\"[sizeClass, kindClass]\"\n    role=\"progressbar\"\n    :aria-label=\"ariaLabel\"\n    tabindex=\"-1\"\n    :aria-valuenow=\"progress\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    data-qa=\"dt-progress-circle\"\n  >\n    <svg\n      class=\"d-progress-circle__bar\"\n      :style=\"cssVars\"\n      viewBox=\"0 0 24 24\"\n    >\n      <defs v-if=\"isAi\">\n        <linearGradient\n          :id=\"aiGradientId\"\n          x1=\"0%\"\n          y1=\"0%\"\n          x2=\"100%\"\n          y2=\"100%\"\n        >\n          <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n          <stop\n            offset=\"0%\"\n            stop-color=\"var(--dt-color-brand-gold)\"\n          />\n          <stop\n            offset=\"33%\"\n            stop-color=\"var(--dt-color-brand-red)\"\n          />\n          <stop\n            offset=\"66%\"\n            stop-color=\"var(--dt-color-brand-magenta)\"\n          />\n          <stop\n            offset=\"100%\"\n            stop-color=\"var(--dt-color-brand-purple)\"\n          />\n        </linearGradient>\n      </defs>\n      <path\n        v-if=\"progress <= 95\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n      />\n      <path\n        v-if=\"progress > 0\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n        :style=\"fillStrokeStyle\"\n      />\n    </svg>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/lib/progress-circle/progress-circle.js

@@ -1,8 +1,9 @@
-import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-import { PROGRESS_CIRCLE_KINDS as t, PROGRESS_CIRCLE_SIZES as n } from "./progress-circle-constants.js";
-import { createCommentVNode as r, createElementBlock as i, createElementVNode as a, normalizeClass as o, normalizeStyle as s, openBlock as c } from "vue";
+import { ordinalSizeValidator as e } from "../../common/validators/index.js";
+import { t } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
+import { PROGRESS_CIRCLE_KINDS as n, PROGRESS_CIRCLE_SIZES as r } from "./progress-circle-constants.js";
+import { createCommentVNode as i, createElementBlock as a, createElementVNode as o, normalizeClass as s, normalizeStyle as c, openBlock as l } from "vue";
 //#region components/ProgressCircle/ProgressCircle.vue
-var l = {
+var u = {
 	name: "DtProgressCircle",
 	props: {
 		ariaLabel: {
@@ -15,14 +16,14 @@ var l = {
 			validator: (e) => e >= 0 && e <= 100
 		},
 		size: {
-			type: String,
-			default: "500",
-			validator: (e) => Object.keys(n).includes(e)
+			type: [String, Number],
+			default: 500,
+			validator: e(r)
 		},
 		kind: {
 			type: String,
 			default: "default",
-			validator: (e) => Object.keys(t).includes(e)
+			validator: (e) => Object.keys(n).includes(e)
 		}
 	},
 	data() {
@@ -42,10 +43,10 @@ var l = {
 			return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};
 		},
 		sizeClass() {
-			return n[this.size];
+			return r[this.size];
 		},
 		kindClass() {
-			return t[this.kind];
+			return n[this.kind];
 		},
 		circleRadius() {
 			return 12 - this.strokeWidth / 2;
@@ -68,10 +69,10 @@ var l = {
 			};
 		}
 	}
-}, u = ["aria-label", "aria-valuenow"], d = { key: 0 }, f = ["id"], p = ["d", "stroke-width"], m = ["d", "stroke-width"];
-function h(e, t, n, l, h, g) {
-	return c(), i("div", {
-		class: o(["d-progress-circle", [g.sizeClass, g.kindClass]]),
+}, d = ["aria-label", "aria-valuenow"], f = { key: 0 }, p = ["id"], m = ["d", "stroke-width"], h = ["d", "stroke-width"];
+function g(e, t, n, r, u, g) {
+	return l(), a("div", {
+		class: s(["d-progress-circle", [g.sizeClass, g.kindClass]]),
 		role: "progressbar",
 		"aria-label": n.ariaLabel,
 		tabindex: "-1",
@@ -79,56 +80,56 @@ function h(e, t, n, l, h, g) {
 		"aria-valuemin": "0",
 		"aria-valuemax": "100",
 		"data-qa": "dt-progress-circle"
-	}, [(c(), i("svg", {
+	}, [(l(), a("svg", {
 		class: "d-progress-circle__bar",
-		style: s(g.cssVars),
+		style: c(g.cssVars),
 		viewBox: "0 0 24 24"
 	}, [
-		g.isAi ? (c(), i("defs", d, [a("linearGradient", {
+		g.isAi ? (l(), a("defs", f, [o("linearGradient", {
 			id: g.aiGradientId,
 			x1: "0%",
 			y1: "0%",
 			x2: "100%",
 			y2: "100%"
 		}, [...t[0] || (t[0] = [
-			a("stop", {
+			o("stop", {
 				offset: "0%",
 				"stop-color": "var(--dt-color-brand-gold)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "33%",
 				"stop-color": "var(--dt-color-brand-red)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "66%",
 				"stop-color": "var(--dt-color-brand-magenta)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "100%",
 				"stop-color": "var(--dt-color-brand-purple)"
 			}, null, -1)
-		])], 8, f)])) : r("", !0),
-		n.progress <= 95 ? (c(), i("path", {
+		])], 8, p)])) : i("", !0),
+		n.progress <= 95 ? (l(), a("path", {
 			key: 1,
 			d: g.circlePath,
 			class: "d-progress-circle__shape d-progress-circle__shape--track",
 			fill: "none",
-			"stroke-width": h.strokeWidth,
+			"stroke-width": u.strokeWidth,
 			"stroke-linecap": "round"
-		}, null, 8, p)) : r("", !0),
-		n.progress > 0 ? (c(), i("path", {
+		}, null, 8, m)) : i("", !0),
+		n.progress > 0 ? (l(), a("path", {
 			key: 2,
 			d: g.circlePath,
 			class: "d-progress-circle__shape d-progress-circle__shape--fill",
 			fill: "none",
-			"stroke-width": h.strokeWidth,
+			"stroke-width": u.strokeWidth,
 			"stroke-linecap": "round",
-			style: s(g.fillStrokeStyle)
-		}, null, 12, m)) : r("", !0)
-	], 4))], 10, u);
+			style: c(g.fillStrokeStyle)
+		}, null, 12, h)) : i("", !0)
+	], 4))], 10, d);
 }
-var g = /* @__PURE__ */ e(l, [["render", h]]);
+var _ = /* @__PURE__ */ t(u, [["render", g]]);
 //#endregion
-export { g as default };
+export { _ as default };
 
 //# sourceMappingURL=progress-circle.js.map

package/dist/lib/progress-circle/progress-circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-circle.js","names":[],"sources":["../../../components/ProgressCircle/ProgressCircle.vue"],"sourcesContent":["<script>\n/**\n * Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n */\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './ProgressCircleConstants';\n\nexport default {\n  name: 'DtProgressCircle',\n  props: {\n    /** Accessible label read by screen readers. */\n    ariaLabel: { type: String, required: true },\n    /** Current progress value (0–100). */\n    progress: {\n      type: Number,\n      default: 0,\n      validator: (v) => v >= 0 && v <= 100,\n    },\n\n    /**\n     * The size of the progress indicator, aligning to Dialtone icon sizes.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    size: {\n      type: String,\n      default: '500',\n      validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n    },\n\n    /**\n     * The color variant of the progress indicator.\n     * @values default, brand, critical, positive, warning, info, ai\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n    },\n  },\n\n  data () {\n    return {\n      strokeWidth: 3.25,\n      uid: Math.random().toString(36).substring(2, 9),\n    };\n  },\n\n  computed: {\n    // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n    // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n    isAi () {\n      return this.kind === 'ai';\n    },\n\n    // Unique per-instance to avoid collisions when multiple progress circles coexist.\n    aiGradientId () {\n      return `progress-circle-ai-gradient-${this.uid}`;\n    },\n\n    fillStrokeStyle () {\n      return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n    },\n\n    sizeClass () {\n      return PROGRESS_CIRCLE_SIZES[this.size];\n    },\n\n    kindClass () {\n      return PROGRESS_CIRCLE_KINDS[this.kind];\n    },\n\n    circleRadius () {\n      return 12 - (this.strokeWidth / 2);\n    },\n\n    circleCircumference () {\n      return 2 * Math.PI * this.circleRadius;\n    },\n\n    // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n    circlePath () {\n      const r = this.circleRadius;\n      const top = 12 - r;\n      const bottom = 12 + r;\n      return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n    },\n\n    // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n    cssVars () {\n      const C = this.circleCircumference;\n      const MIN_VISUAL_PROGRESS = 5;\n      const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n        ? MIN_VISUAL_PROGRESS\n        : this.progress;\n      const fillLength = C * visualProgress / 100;\n      const sw = this.strokeWidth;\n      const capArc = sw / 2;\n\n      // When both arcs are visible, round linecaps extend capArc past each endpoint.\n      // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n      // exactly at each junction without overlapping. Rotate the fill forward by\n      // capArc so its start cap lands at 12 o'clock.\n      const both = this.progress > 0 && this.progress < 100;\n      const adj = both ? sw : 0;\n\n      return {\n        // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n        '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n        '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n        '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n        '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n        '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n      };\n    },\n  },\n\n};\n</script>\n\n<template>\n  <div\n    class=\"d-progress-circle\"\n    :class=\"[sizeClass, kindClass]\"\n    role=\"progressbar\"\n    :aria-label=\"ariaLabel\"\n    tabindex=\"-1\"\n    :aria-valuenow=\"progress\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    data-qa=\"dt-progress-circle\"\n  >\n    <svg\n      class=\"d-progress-circle__bar\"\n      :style=\"cssVars\"\n      viewBox=\"0 0 24 24\"\n    >\n      <defs v-if=\"isAi\">\n        <linearGradient\n          :id=\"aiGradientId\"\n          x1=\"0%\"\n          y1=\"0%\"\n          x2=\"100%\"\n          y2=\"100%\"\n        >\n          <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n          <stop\n            offset=\"0%\"\n            stop-color=\"var(--dt-color-brand-gold)\"\n          />\n          <stop\n            offset=\"33%\"\n            stop-color=\"var(--dt-color-brand-red)\"\n          />\n          <stop\n            offset=\"66%\"\n            stop-color=\"var(--dt-color-brand-magenta)\"\n          />\n          <stop\n            offset=\"100%\"\n            stop-color=\"var(--dt-color-brand-purple)\"\n          />\n        </linearGradient>\n      </defs>\n      <path\n        v-if=\"progress <= 95\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n      />\n      <path\n        v-if=\"progress > 0\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n        :style=\"fillStrokeStyle\"\n      />\n    </svg>\n  </div>\n</template>\n"],"mappings":";;;;AAOA,IAAK,IAAU;CACb,MAAM;CACN,OAAO;EAEL,WAAW;GAAE,MAAM;GAAQ,UAAU;GAAM;EAE3C,UAAU;GACR,MAAM;GACN,SAAS;GACT,YAAY,MAAM,KAAK,KAAK,KAAK;GAClC;EAMD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAM,OAAO,KAAK,EAAsB,CAAC,SAAS,EAAE;GACjE;EAMD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAM,OAAO,KAAK,EAAsB,CAAC,SAAS,EAAE;GACjE;EACF;CAED,OAAQ;AACN,SAAO;GACL,aAAa;GACb,KAAK,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,UAAU,GAAG,EAAE;GAChD;;CAGH,UAAU;EAGR,OAAQ;AACN,UAAO,KAAK,SAAS;;EAIvB,eAAgB;AACd,UAAO,+BAA+B,KAAK;;EAG7C,kBAAmB;AACjB,UAAO,KAAK,OAAO,EAAE,QAAQ,QAAQ,KAAK,aAAa,IAAG,GAAI,EAAE;;EAGlE,YAAa;AACX,UAAO,EAAsB,KAAK;;EAGpC,YAAa;AACX,UAAO,EAAsB,KAAK;;EAGpC,eAAgB;AACd,UAAO,KAAM,KAAK,cAAc;;EAGlC,sBAAuB;AACrB,UAAO,IAAI,KAAK,KAAK,KAAK;;EAI5B,aAAc;GACZ,IAAM,IAAI,KAAK,cACT,IAAM,KAAK;AAEjB,UAAO,QAAQ,EAAG,KAAM,EAAC,GAAI,EAAC,YADf,KAAK,EAC6B,KAAM,EAAC,GAAI,EAAC,YAAa,EAAG;;EAI/E,UAAW;GACT,IAAM,IAAI,KAAK,qBAKT,IAAa,KAHK,KAAK,WAAW,KAAK,KAAK,WAAW,IACzD,IACA,KAAK,YAC+B,KAClC,IAAK,KAAK,aACV,IAAS,IAAK,GAMd,IAAO,KAAK,WAAW,KAAK,KAAK,WAAW,KAC5C,IAAM,IAAO,IAAK;AAExB,UAAO;IAEL,sBAAuB,CAAC,KAAQ,KAAK,YAAY,MAAO,SAAS;IACjE,qBAAqB,IAAI,KAAK,IAAI,GAAG,IAAa,EAAI;IACtD,iBAAiB,GAAG,IAAQ,IAAS,IAAI,MAAO,EAAE;IAClD,qBAAsB,CAAC,KAAQ,KAAK,YAAY,IAAK,SAAS,GAAG,KAAK,IAAI,GAAG,IAAI,IAAa,EAAI,CAAA,GAAI;IACtG,sBAAsB,EAAE,KAAc,IAAO,IAAS;IACvD;;EAEJ;CAEF;;aAIC,EA6DM,OAAA;EA5DJ,OAAK,EAAA,CAAC,qBAAmB,CAChB,EAAA,WAAW,EAAA,UAAS,CAAA,CAAA;EAC7B,MAAK;EACJ,cAAY,EAAA;EACb,UAAS;EACR,iBAAe,EAAA;EAChB,iBAAc;EACd,iBAAc;EACd,WAAQ;WAER,EAiDM,OAAA;EAhDJ,OAAM;EACL,OAAK,EAAE,EAAA,QAAO;EACf,SAAQ;;EAEI,EAAA,QAAA,GAAA,EAAZ,EA0BO,QAAA,GAAA,CAzBL,EAwBiB,kBAAA;GAvBd,IAAI,EAAA;GACL,IAAG;GACH,IAAG;GACH,IAAG;GACH,IAAG;;GAGH,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;;EAKT,EAAA,YAAQ,MAAA,GAAA,EADhB,EAOE,QAAA;;GALC,GAAG,EAAA;GACJ,OAAM;GACN,MAAK;GACJ,gBAAc,EAAA;GACf,kBAAe;;EAGT,EAAA,WAAQ,KAAA,GAAA,EADhB,EAQE,QAAA;;GANC,GAAG,EAAA;GACJ,OAAM;GACN,MAAK;GACJ,gBAAc,EAAA;GACf,kBAAe;GACd,OAAK,EAAE,EAAA,gBAAe"}
+{"version":3,"file":"progress-circle.js","names":[],"sources":["../../../components/ProgressCircle/ProgressCircle.vue"],"sourcesContent":["<script>\n/**\n * Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n */\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './ProgressCircleConstants';\nimport { ordinalSizeValidator } from '@/common/validators';\n\nexport default {\n  name: 'DtProgressCircle',\n  props: {\n    /** Accessible label read by screen readers. */\n    ariaLabel: { type: String, required: true },\n    /** Current progress value (0–100). */\n    progress: {\n      type: Number,\n      default: 0,\n      validator: (v) => v >= 0 && v <= 100,\n    },\n\n    /**\n     * The size of the progress indicator, aligning to Dialtone icon sizes.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    size: {\n      type: [String, Number],\n      default: 500,\n      validator: ordinalSizeValidator(PROGRESS_CIRCLE_SIZES),\n    },\n\n    /**\n     * The color variant of the progress indicator.\n     * @values default, brand, critical, positive, warning, info, ai\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n    },\n  },\n\n  data () {\n    return {\n      strokeWidth: 3.25,\n      uid: Math.random().toString(36).substring(2, 9),\n    };\n  },\n\n  computed: {\n    // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n    // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n    isAi () {\n      return this.kind === 'ai';\n    },\n\n    // Unique per-instance to avoid collisions when multiple progress circles coexist.\n    aiGradientId () {\n      return `progress-circle-ai-gradient-${this.uid}`;\n    },\n\n    fillStrokeStyle () {\n      return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n    },\n\n    sizeClass () {\n      return PROGRESS_CIRCLE_SIZES[this.size];\n    },\n\n    kindClass () {\n      return PROGRESS_CIRCLE_KINDS[this.kind];\n    },\n\n    circleRadius () {\n      return 12 - (this.strokeWidth / 2);\n    },\n\n    circleCircumference () {\n      return 2 * Math.PI * this.circleRadius;\n    },\n\n    // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n    circlePath () {\n      const r = this.circleRadius;\n      const top = 12 - r;\n      const bottom = 12 + r;\n      return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n    },\n\n    // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n    cssVars () {\n      const C = this.circleCircumference;\n      const MIN_VISUAL_PROGRESS = 5;\n      const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n        ? MIN_VISUAL_PROGRESS\n        : this.progress;\n      const fillLength = C * visualProgress / 100;\n      const sw = this.strokeWidth;\n      const capArc = sw / 2;\n\n      // When both arcs are visible, round linecaps extend capArc past each endpoint.\n      // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n      // exactly at each junction without overlapping. Rotate the fill forward by\n      // capArc so its start cap lands at 12 o'clock.\n      const both = this.progress > 0 && this.progress < 100;\n      const adj = both ? sw : 0;\n\n      return {\n        // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n        '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n        '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n        '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n        '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n        '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n      };\n    },\n  },\n\n};\n</script>\n\n<template>\n  <div\n    class=\"d-progress-circle\"\n    :class=\"[sizeClass, kindClass]\"\n    role=\"progressbar\"\n    :aria-label=\"ariaLabel\"\n    tabindex=\"-1\"\n    :aria-valuenow=\"progress\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    data-qa=\"dt-progress-circle\"\n  >\n    <svg\n      class=\"d-progress-circle__bar\"\n      :style=\"cssVars\"\n      viewBox=\"0 0 24 24\"\n    >\n      <defs v-if=\"isAi\">\n        <linearGradient\n          :id=\"aiGradientId\"\n          x1=\"0%\"\n          y1=\"0%\"\n          x2=\"100%\"\n          y2=\"100%\"\n        >\n          <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n          <stop\n            offset=\"0%\"\n            stop-color=\"var(--dt-color-brand-gold)\"\n          />\n          <stop\n            offset=\"33%\"\n            stop-color=\"var(--dt-color-brand-red)\"\n          />\n          <stop\n            offset=\"66%\"\n            stop-color=\"var(--dt-color-brand-magenta)\"\n          />\n          <stop\n            offset=\"100%\"\n            stop-color=\"var(--dt-color-brand-purple)\"\n          />\n        </linearGradient>\n      </defs>\n      <path\n        v-if=\"progress <= 95\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n      />\n      <path\n        v-if=\"progress > 0\"\n        :d=\"circlePath\"\n        class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n        fill=\"none\"\n        :stroke-width=\"strokeWidth\"\n        stroke-linecap=\"round\"\n        :style=\"fillStrokeStyle\"\n      />\n    </svg>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/lib/prose/prose.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`./prose-constants.cjs`);let t=require(`vue`);var n=Object.assign({name:`DtProse`},{__name:`Prose`,props:{size:{type:[String,Number],default:300,validator:t=>Object.keys(e.PROSE_SIZE_MODIFIERS).includes(String(t))},density:{type:[String,Number],default:200,validator:t=>Object.keys(e.PROSE_DENSITY_MODIFIERS).includes(String(t))}},setup(n){let r=n,i=(0,t.computed)(()=>[`d-prose`,e.PROSE_SIZE_MODIFIERS[String(r.size)],e.PROSE_DENSITY_MODIFIERS[String(r.density)]].filter(Boolean)),a=(0,t.ref)(null);function o(e){return e.includes(`-`)}function s(t,n){return e.PROSE_DISALLOWED_ELEMENTS.includes(n)?!(n===`input`&&t.getAttribute(`type`)===`checkbox`&&t.parentElement?.tagName.toLowerCase()===`li`):!1}function c(t,n){let r=e.PROSE_ALLOWED_ATTRIBUTES._global||[],i=e.PROSE_ALLOWED_ATTRIBUTES[n]||[],a=[...r,...i],o=[];for(let n of t.attributes){if(e._PROSE_URL_ATTRIBUTES.includes(n.name)&&!e._isSafeProseUrl(n.value)){o.push(n.name);continue}a.includes(n.name)||e._PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(e=>n.name.startsWith(e))||o.push(n.name)}for(let e of o)t.removeAttribute(e)}function l(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();c(t,n),t=e.nextNode()}}function u(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();o(n)?console.error(`DtProse: Custom element <${n}> is not allowed inside prose content. Only plain HTML elements are permitted.`):s(t,n)&&console.error(`DtProse: <${n}> is not allowed inside prose content. Form elements and interactive controls should not be used in prose blocks.`),t=e.nextNode()}}return(0,t.onMounted)(l),(0,t.onUpdated)(l),process.env.NODE_ENV!==`production`&&((0,t.onMounted)(u),(0,t.onUpdated)(u)),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`proseRef`,ref:a,class:(0,t.normalizeClass)(i.value),"data-qa":`dt-prose`},[(0,t.renderSlot)(e.$slots,`default`)],2))}});exports.default=n;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/validators/index.cjs`),t=require(`./prose-constants.cjs`);let n=require(`vue`);var r=Object.assign({name:`DtProse`},{__name:`Prose`,props:{size:{type:[String,Number],default:300,validator:e.ordinalSizeValidator(t.PROSE_SIZE_MODIFIERS)},density:{type:[String,Number],default:200,validator:e=>Object.keys(t.PROSE_DENSITY_MODIFIERS).includes(String(e))}},setup(e){let r=e,i=(0,n.computed)(()=>[`d-prose`,t.PROSE_SIZE_MODIFIERS[String(r.size)],t.PROSE_DENSITY_MODIFIERS[String(r.density)]].filter(Boolean)),a=(0,n.ref)(null);function o(e){return e.includes(`-`)}function s(e,n){return t.PROSE_DISALLOWED_ELEMENTS.includes(n)?!(n===`input`&&e.getAttribute(`type`)===`checkbox`&&e.parentElement?.tagName.toLowerCase()===`li`):!1}function c(e,n){let r=t.PROSE_ALLOWED_ATTRIBUTES._global||[],i=t.PROSE_ALLOWED_ATTRIBUTES[n]||[],a=[...r,...i],o=[];for(let n of e.attributes){if(t._PROSE_URL_ATTRIBUTES.includes(n.name)&&!t._isSafeProseUrl(n.value)){o.push(n.name);continue}a.includes(n.name)||t._PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(e=>n.name.startsWith(e))||o.push(n.name)}for(let t of o)e.removeAttribute(t)}function l(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();c(t,n),t=e.nextNode()}}function u(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();o(n)?console.error(`DtProse: Custom element <${n}> is not allowed inside prose content. Only plain HTML elements are permitted.`):s(t,n)&&console.error(`DtProse: <${n}> is not allowed inside prose content. Form elements and interactive controls should not be used in prose blocks.`),t=e.nextNode()}}return(0,n.onMounted)(l),(0,n.onUpdated)(l),process.env.NODE_ENV!==`production`&&((0,n.onMounted)(u),(0,n.onUpdated)(u)),(e,t)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`proseRef`,ref:a,class:(0,n.normalizeClass)(i.value),"data-qa":`dt-prose`},[(0,n.renderSlot)(e.$slots,`default`)],2))}});exports.default=r;
 //# sourceMappingURL=prose.cjs.map

package/dist/lib/prose/prose.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"prose.cjs","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: (s) => Object.keys(PROSE_SIZE_MODIFIERS).includes(String(s)),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":"ueA0BA,IAAM,EAAQ,EAsBR,GAAA,EAAA,EAAA,cAA8B,CAClC,UACA,EAAA,qBAAqB,OAAO,EAAM,KAAK,EACvC,EAAA,wBAAwB,OAAO,EAAM,QAAQ,EAC9C,CAAC,OAAO,QAAQ,CAAC,CAEZ,GAAA,EAAA,EAAA,KAAe,KAAK,CAE1B,SAAS,EAAiB,EAAS,CACjC,OAAO,EAAQ,SAAS,IAAI,CAG9B,SAAS,EAAqB,EAAM,EAAS,CAI3C,OAHK,EAAA,0BAA0B,SAAS,EAAQ,CAGzC,EACL,IAAY,SACZ,EAAK,aAAa,OAAO,GAAK,YAC9B,EAAK,eAAe,QAAQ,aAAa,GAAK,MANS,GAU3D,SAAS,EAA2B,EAAM,EAAS,CACjD,IAAM,EAAgB,EAAA,yBAAyB,SAAW,EAAE,CACtD,EAAgB,EAAA,yBAAyB,IAAY,EAAE,CACvD,EAAU,CAAC,GAAG,EAAe,GAAG,EAAc,CAE9C,EAAgB,EAAE,CACxB,IAAK,IAAM,KAAQ,EAAK,WAAY,CAClC,GAAI,EAAA,sBAAsB,SAAS,EAAK,KAAK,EAAI,CAAC,EAAA,gBAAgB,EAAK,MAAM,CAAE,CAC7E,EAAc,KAAK,EAAK,KAAK,CAC7B,SAEE,EAAQ,SAAS,EAAK,KAAK,EAC3B,EAAA,kCAAkC,KAAK,GAAU,EAAK,KAAK,WAAW,EAAO,CAAC,EAClF,EAAc,KAAK,EAAK,KAAK,CAE/B,IAAK,IAAM,KAAY,EACrB,EAAK,gBAAgB,EAAS,CAIlC,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAC1C,EAA0B,EAAM,EAAQ,CAExC,EAAO,EAAO,UAAU,EAI5B,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAEtC,EAAgB,EAAQ,CAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,CACQ,EAAoB,EAAM,EAAQ,EAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,CAGH,EAAO,EAAO,UAAU,SAI5B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,CAE1B,QAAA,IAAA,WAA6B,gBAC3B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,qDApIpB,MAAA,SANA,WAAJ,IAAI,EACH,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAY,CACpB,UAAQ,8BAGA,EAAA,OAAA,UAAA,CAAA,CAAA,EAAA"}
+{"version":3,"file":"prose.cjs","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport { ordinalSizeValidator } from '@/common/validators';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: ordinalSizeValidator(PROSE_SIZE_MODIFIERS),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":"0gBA2BA,IAAM,EAAQ,EAsBR,GAAA,EAAA,EAAA,cAA8B,CAClC,UACA,EAAA,qBAAqB,OAAO,EAAM,KAAK,EACvC,EAAA,wBAAwB,OAAO,EAAM,QAAQ,EAC9C,CAAC,OAAO,QAAQ,CAAC,CAEZ,GAAA,EAAA,EAAA,KAAe,KAAK,CAE1B,SAAS,EAAiB,EAAS,CACjC,OAAO,EAAQ,SAAS,IAAI,CAG9B,SAAS,EAAqB,EAAM,EAAS,CAI3C,OAHK,EAAA,0BAA0B,SAAS,EAAQ,CAGzC,EACL,IAAY,SACZ,EAAK,aAAa,OAAO,GAAK,YAC9B,EAAK,eAAe,QAAQ,aAAa,GAAK,MANS,GAU3D,SAAS,EAA2B,EAAM,EAAS,CACjD,IAAM,EAAgB,EAAA,yBAAyB,SAAW,EAAE,CACtD,EAAgB,EAAA,yBAAyB,IAAY,EAAE,CACvD,EAAU,CAAC,GAAG,EAAe,GAAG,EAAc,CAE9C,EAAgB,EAAE,CACxB,IAAK,IAAM,KAAQ,EAAK,WAAY,CAClC,GAAI,EAAA,sBAAsB,SAAS,EAAK,KAAK,EAAI,CAAC,EAAA,gBAAgB,EAAK,MAAM,CAAE,CAC7E,EAAc,KAAK,EAAK,KAAK,CAC7B,SAEE,EAAQ,SAAS,EAAK,KAAK,EAC3B,EAAA,kCAAkC,KAAK,GAAU,EAAK,KAAK,WAAW,EAAO,CAAC,EAClF,EAAc,KAAK,EAAK,KAAK,CAE/B,IAAK,IAAM,KAAY,EACrB,EAAK,gBAAgB,EAAS,CAIlC,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAC1C,EAA0B,EAAM,EAAQ,CAExC,EAAO,EAAO,UAAU,EAI5B,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAEtC,EAAgB,EAAQ,CAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,CACQ,EAAoB,EAAM,EAAQ,EAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,CAGH,EAAO,EAAO,UAAU,SAI5B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,CAE1B,QAAA,IAAA,WAA6B,gBAC3B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,qDArIpB,MAAA,SANA,WAAJ,IAAI,EACH,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAY,CACpB,UAAQ,8BAGA,EAAA,OAAA,UAAA,CAAA,CAAA,EAAA"}