@dialpad/dialtone 9.83.0 → 9.83.1

package/dist/vue3/common/mixins/keyboard_list_navigation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"keyboard_list_navigation.js","sources":["../../../common/mixins/keyboard_list_navigation.js"],"sourcesContent":["import Dom from './dom';\n\nconst ERROR_INVALID_LIST_ELEMENT = (\n  'listElementKey is required or the referenced ' +\n  'element doesn\\'t exist. Received listElement: '\n);\n\n/**\n * Usage: `mixins: [keyboardNavigationMixin(options)]`\n *\n * This mixin provides some common data and methods to navigate a list of items\n * (such as a dropdown or select menu) by keyboard.\n *\n * To be effective, you must bind the onUpKey and onDownKey events, usually to\n * the root element of the component.\n *\n * @param listItemRole\n * @param indexKey\n * @param idKey\n * @param listElementKey\n * @param activeItemKey\n * @param openMethod\n * @param afterHighlightMethod\n * @param beginningOfListMethod\n * @param endOfListMethod\n * @param scrollToOnHighlight\n * @param focusOnKeyboardNavigation\n * @displayName Keyboard Navigation Mixin\n */\nexport default ({\n  // Role of the list items in the component. This is used to identify the list items\n  // so you must update this if the role of your list items is anything other than 'option'\n  listItemRole = 'option',\n  // Key of the data prop that will be added to the component.\n  indexKey = 'highlightIndex',\n  idKey = 'highlightId',\n  // Key of the method that references the list element.\n  listElementKey = 'listRef',\n  // Optional, Key of the computed prop that references the currently active item element.\n  activeItemKey = '',\n  // Optional, name of the method that toggles the list visibility. Used for\n  // opening the list when up or down is pressed.\n  openMethod = null,\n  // Optional, method to call when the highlightIndex is changed.\n  afterHighlightMethod = null,\n  // Optional, method to call when the highlightIndex goes past the beginning of the list.\n  beginningOfListMethod = null,\n  // Optional, method to call when the highlightIndex goes past the end of the list.\n  endOfListMethod = null,\n  // Scroll the active element into view when highlighted by a keyboard event.\n  scrollToOnHighlight = true,\n  // Focus the active element on keyboard navigation.\n  focusOnKeyboardNavigation = false,\n} = {}) => ({\n  mixins: [Dom],\n\n  data () {\n    return {\n      [indexKey]: -1,\n      [idKey]: '',\n      scrollToOnHighlight,\n      focusOnKeyboardNavigation,\n    };\n  },\n\n  provide () {\n    return {\n      highlightId: () => this[idKey],\n    };\n  },\n\n  methods: {\n    // Returns the list element\n    // this[listElement]() can return a Vue component, in which case we need to target\n    // the $el property, or it can simply be an html element.\n    _getListElement () {\n      return this[listElementKey]()?.$el || this[listElementKey]();\n    },\n\n    // Gets the length of all the items in the list, uses the listItemRole param to determine\n    // whether an element is a list item.\n    _itemsLength () {\n      const listItems = this._getListItemNodes();\n\n      if (listItems === null) {\n        return 0;\n      }\n\n      return listItems.length;\n    },\n\n    // Gets all the list item nodes within the list element\n    _getListItemNodes () {\n      const listElement = this._getListElement();\n\n      if (!listElement) {\n        console.error(ERROR_INVALID_LIST_ELEMENT, listElement);\n        return null;\n      }\n\n      return Array.from(listElement.querySelectorAll(`[role=\"${listItemRole}\"], #sr-only-close-button`));\n    },\n\n    onUpKey () {\n      if (openMethod) {\n        this[openMethod](true);\n      }\n      if (this[indexKey] > 0) {\n        this.setHighlightIndex(this[indexKey] - 1);\n      } else if (beginningOfListMethod) {\n        this[beginningOfListMethod]();\n      }\n      this.scrollActiveItemIntoViewIfNeeded();\n      this.focusActiveItemIfNeeded();\n    },\n\n    onDownKey () {\n      if (openMethod) {\n        this[openMethod](true);\n      }\n      if (this[indexKey] < this._itemsLength() - 1) {\n        this.setHighlightIndex(this[indexKey] + 1);\n      } else if (endOfListMethod) {\n        this[endOfListMethod]();\n      }\n      this.scrollActiveItemIntoViewIfNeeded();\n      this.focusActiveItemIfNeeded();\n    },\n\n    onHomeKey () {\n      this.jumpToBeginning();\n      this.scrollActiveItemIntoViewIfNeeded();\n      this.focusActiveItemIfNeeded();\n    },\n\n    onEndKey () {\n      this.jumpToEnd();\n      this.scrollActiveItemIntoViewIfNeeded();\n      this.focusActiveItemIfNeeded();\n    },\n\n    onNavigationKey (key) {\n      const listItems = this._getListItemNodes();\n\n      const matchingItems = listItems.filter(item => {\n        const content = item.textContent.trim().toLowerCase();\n        return content.startsWith(key.toLowerCase());\n      });\n\n      if (matchingItems.length <= 0) {\n        return;\n      }\n\n      const highlightedMatchingItemIndex = matchingItems.findIndex(item => {\n        return this[indexKey] === listItems.indexOf(item);\n      });\n\n      const nextHighlightedItemIndex = listItems.indexOf(\n        highlightedMatchingItemIndex < matchingItems.length - 1\n          ? matchingItems[highlightedMatchingItemIndex + 1]\n          : matchingItems[0],\n      );\n\n      this.setHighlightIndex(nextHighlightedItemIndex);\n      this.scrollActiveItemIntoViewIfNeeded();\n      this.focusActiveItemIfNeeded();\n    },\n\n    isValidLetter (key) {\n      if (key.length > 1) {\n        return false;\n      }\n\n      return (key >= 'a' && key <= 'z') || (key >= 'A' && key <= 'Z');\n    },\n\n    jumpToBeginning () {\n      this.setHighlightIndex(0);\n    },\n\n    jumpToEnd () {\n      this.setHighlightIndex(this._itemsLength() - 1);\n    },\n\n    setHighlightIndex (num) {\n      this[indexKey] = num;\n      this[idKey] = this._getItemId(num);\n\n      if (this._itemsLength() && afterHighlightMethod) {\n        this[afterHighlightMethod](num);\n      }\n    },\n\n    setHighlightId (id) {\n      this[idKey] = id;\n      this[indexKey] = this._getItemIndex(id);\n\n      if (this._itemsLength() && afterHighlightMethod) {\n        this[afterHighlightMethod](this._getItemIndex(id));\n      }\n    },\n\n    _getItemIndex (id) {\n      const listElement = this._getListElement();\n      if (!listElement) {\n        return;\n      }\n\n      const listItems = Array.from(listElement.querySelectorAll(`[role=\"${listItemRole}\"], #sr-only-close-button`));\n      return listItems.indexOf(listElement.querySelector(`#${id}`));\n    },\n\n    _getItemId (index) {\n      const listElement = this._getListElement();\n      if (!listElement) {\n        return;\n      }\n\n      return listElement.querySelectorAll(`[role=\"${listItemRole}\"], #sr-only-close-button`)[index]?.id;\n    },\n\n    scrollActiveItemIntoViewIfNeeded () {\n      if (!this.scrollToOnHighlight) {\n        return;\n      }\n      const activeItemEl = this[activeItemKey];\n      if (activeItemEl) {\n        // When listElementKey is not passed,\n        // scrollElementIntoViewIfNeeded will default to the immediate wrapper of the item.\n        const listElement = this._getListElement();\n        this.scrollElementIntoViewIfNeeded(activeItemEl, null, null, listElement);\n      }\n    },\n\n    focusActiveItemIfNeeded () {\n      if (!this.focusOnKeyboardNavigation) {\n        return;\n      }\n      const activeItemEl = this[activeItemKey];\n      if (activeItemEl) {\n        activeItemEl.focus();\n      }\n    },\n  },\n});\n"],"names":[],"mappings":"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"}

package/dist/vue3/common/mixins/modal.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.cjs","sources":["../../../common/mixins/modal.js"],"sourcesContent":["const focusableAttrs = ':not(:disabled):not([aria-disabled=\"true\"]):not([role=\"presentation\"])';\nconst tabbableAttrs = `${focusableAttrs}:not([tabindex=\"-1\"])`;\nconst focusableElementsList = `button,[href],input,select,textarea,details,[tabindex]`;\n\n/**\n * This mixin provides the methods to automatically trap tab focus within\n * the component this mixin is on, meaning it is not possible to tab out\n * of the component without dismissing it.\n *\n * Useful for accessibility reasons on things like important actionable alerts.\n *\n * Use focusFirstElement to focus on the first tabbable element within your component, and call\n * focusTrappedTabPress every time tab is pressed to trap tab within this\n * component.\n *\n * Note that focusFirstElement WILL focus elements with tabindex=\"-1\",\n * however focusTrappedTabPress will not.\n * @displayName Modal Mixin\n */\nexport default {\n  methods: {\n    /**\n     * get the first focusable element in your component, includes tabindex=\"-1\".\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    async getFirstFocusableElement (el) {\n      await this.$nextTick();\n      const focusableElements = this._getFocusableElements(el, true);\n      return this._getFirstFocusElement(focusableElements);\n    },\n\n    /**\n     * set focus to the first focusable element in your component, includes tabindex=\"-1\".\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    async focusFirstElement (el = this.$el) {\n      const elToFocus = await this.getFirstFocusableElement(el);\n      elToFocus?.focus({ preventScroll: true });\n    },\n\n    async focusElementById (elementId) {\n      await this.$nextTick();\n      const result = this.$el?.querySelector(elementId);\n      if (result) {\n        result.focus();\n        return;\n      }\n\n      // eslint-disable-next-line no-console\n      console.warn('Could not find the element specified in dt-modal prop \"initialFocusElement\". ' +\n        'Defaulting to focusing the first element.');\n      await this.focusFirstElement();\n    },\n\n    /**\n     * internal use only.\n     *\n     * @param focusableElements - list of focusable elements\n     * @returns {*} - first DOM element that is focusable.\n     * @private\n     */\n    _getFirstFocusElement (focusableElements) {\n      if (!focusableElements.length) {\n        return;\n      }\n      let firstFocusEl = focusableElements[0];\n      // If first element is a checkbox, put focus on the selected checkbox or the first checkbox if none are selected.\n      if (firstFocusEl.matches('[type=\"radio\"]:not(:checked)')) {\n        firstFocusEl = focusableElements.find(el => el.checked && el.name === firstFocusEl.name) || firstFocusEl;\n      }\n      return firstFocusEl;\n    },\n\n    /**\n     * internal use only.\n     *\n     * gets all the focusable elements within the component\n     * and sets the first and last of those elements.\n     *\n     * @param {object} el - the root dom element to find focusable elements in.\n     * @param {bool} includeNegativeTabIndex - will include tabindex=\"-1\" in the list of focusable elements.\n     */\n    _getFocusableElements (el = this.$el, includeNegativeTabIndex = false) {\n      if (!el) return [];\n      const focusableContent = [...el.querySelectorAll(focusableElementsList)];\n      return focusableContent.filter((fc) => {\n        const style = window.getComputedStyle(fc);\n        return style.getPropertyValue('display') !== 'none' &&\n          style.getPropertyValue('visibility') !== 'hidden' &&\n          fc.matches(includeNegativeTabIndex ? focusableAttrs : tabbableAttrs);\n      });\n    },\n\n    /**\n     * tabs to the next element contained within your component, does not include tabindex=\"-1\".\n     * @param {object} e - keypress event\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    focusTrappedTabPress (e, el) {\n      const isTabPressed = e.key === 'Tab';\n\n      if (!isTabPressed) {\n        return;\n      }\n\n      const focusableElements = this._getFocusableElements(el);\n      if (!focusableElements.length) {\n        e.preventDefault();\n        return;\n      }\n\n      const firstFocusableElement = this._getFirstFocusElement(focusableElements);\n      const lastFocusableElement = focusableElements[focusableElements.length - 1];\n\n      if (e.shiftKey) {\n        if (document.activeElement === firstFocusableElement) {\n          lastFocusableElement.focus();\n          e.preventDefault();\n        }\n      } else {\n        if (document.activeElement === lastFocusableElement) {\n          firstFocusableElement.focus();\n          e.preventDefault();\n        }\n      }\n    },\n  },\n};\n"],"names":[],"mappings":";;AAAA,MAAM,iBAAiB;AACvB,MAAM,gBAAgB,GAAG,cAAc;AACvC,MAAM,wBAAwB;AAiB9B,MAAe,QAAA;AAAA,EACb,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMP,MAAM,yBAA0B,IAAI;AAClC,YAAM,KAAK;AACX,YAAM,oBAAoB,KAAK,sBAAsB,IAAI,IAAI;AAC7D,aAAO,KAAK,sBAAsB,iBAAiB;AAAA,IACpD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,MAAM,kBAAmB,KAAK,KAAK,KAAK;AACtC,YAAM,YAAY,MAAM,KAAK,yBAAyB,EAAE;AACxD,6CAAW,MAAM,EAAE,eAAe,KAAM;AAAA,IACzC;AAAA,IAED,MAAM,iBAAkB,WAAW;;AACjC,YAAM,KAAK;AACX,YAAM,UAAS,UAAK,QAAL,mBAAU,cAAc;AACvC,UAAI,QAAQ;AACV,eAAO,MAAK;AACZ;AAAA,MACD;AAGD,cAAQ,KAAK,wHACgC;AAC7C,YAAM,KAAK;IACZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,sBAAuB,mBAAmB;AACxC,UAAI,CAAC,kBAAkB,QAAQ;AAC7B;AAAA,MACD;AACD,UAAI,eAAe,kBAAkB,CAAC;AAEtC,UAAI,aAAa,QAAQ,8BAA8B,GAAG;AACxD,uBAAe,kBAAkB,KAAK,QAAM,GAAG,WAAW,GAAG,SAAS,aAAa,IAAI,KAAK;AAAA,MAC7F;AACD,aAAO;AAAA,IACR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWD,sBAAuB,KAAK,KAAK,KAAK,0BAA0B,OAAO;AACrE,UAAI,CAAC,GAAI,QAAO;AAChB,YAAM,mBAAmB,CAAC,GAAG,GAAG,iBAAiB,qBAAqB,CAAC;AACvE,aAAO,iBAAiB,OAAO,CAAC,OAAO;AACrC,cAAM,QAAQ,OAAO,iBAAiB,EAAE;AACxC,eAAO,MAAM,iBAAiB,SAAS,MAAM,UAC3C,MAAM,iBAAiB,YAAY,MAAM,YACzC,GAAG,QAAQ,0BAA0B,iBAAiB,aAAa;AAAA,MAC7E,CAAO;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,qBAAsB,GAAG,IAAI;AAC3B,YAAM,eAAe,EAAE,QAAQ;AAE/B,UAAI,CAAC,cAAc;AACjB;AAAA,MACD;AAED,YAAM,oBAAoB,KAAK,sBAAsB,EAAE;AACvD,UAAI,CAAC,kBAAkB,QAAQ;AAC7B,UAAE,eAAc;AAChB;AAAA,MACD;AAED,YAAM,wBAAwB,KAAK,sBAAsB,iBAAiB;AAC1E,YAAM,uBAAuB,kBAAkB,kBAAkB,SAAS,CAAC;AAE3E,UAAI,EAAE,UAAU;AACd,YAAI,SAAS,kBAAkB,uBAAuB;AACpD,+BAAqB,MAAK;AAC1B,YAAE,eAAc;AAAA,QACjB;AAAA,MACT,OAAa;AACL,YAAI,SAAS,kBAAkB,sBAAsB;AACnD,gCAAsB,MAAK;AAC3B,YAAE,eAAc;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACH;;"}

package/dist/vue3/common/mixins/modal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.js","sources":["../../../common/mixins/modal.js"],"sourcesContent":["const focusableAttrs = ':not(:disabled):not([aria-disabled=\"true\"]):not([role=\"presentation\"])';\nconst tabbableAttrs = `${focusableAttrs}:not([tabindex=\"-1\"])`;\nconst focusableElementsList = `button,[href],input,select,textarea,details,[tabindex]`;\n\n/**\n * This mixin provides the methods to automatically trap tab focus within\n * the component this mixin is on, meaning it is not possible to tab out\n * of the component without dismissing it.\n *\n * Useful for accessibility reasons on things like important actionable alerts.\n *\n * Use focusFirstElement to focus on the first tabbable element within your component, and call\n * focusTrappedTabPress every time tab is pressed to trap tab within this\n * component.\n *\n * Note that focusFirstElement WILL focus elements with tabindex=\"-1\",\n * however focusTrappedTabPress will not.\n * @displayName Modal Mixin\n */\nexport default {\n  methods: {\n    /**\n     * get the first focusable element in your component, includes tabindex=\"-1\".\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    async getFirstFocusableElement (el) {\n      await this.$nextTick();\n      const focusableElements = this._getFocusableElements(el, true);\n      return this._getFirstFocusElement(focusableElements);\n    },\n\n    /**\n     * set focus to the first focusable element in your component, includes tabindex=\"-1\".\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    async focusFirstElement (el = this.$el) {\n      const elToFocus = await this.getFirstFocusableElement(el);\n      elToFocus?.focus({ preventScroll: true });\n    },\n\n    async focusElementById (elementId) {\n      await this.$nextTick();\n      const result = this.$el?.querySelector(elementId);\n      if (result) {\n        result.focus();\n        return;\n      }\n\n      // eslint-disable-next-line no-console\n      console.warn('Could not find the element specified in dt-modal prop \"initialFocusElement\". ' +\n        'Defaulting to focusing the first element.');\n      await this.focusFirstElement();\n    },\n\n    /**\n     * internal use only.\n     *\n     * @param focusableElements - list of focusable elements\n     * @returns {*} - first DOM element that is focusable.\n     * @private\n     */\n    _getFirstFocusElement (focusableElements) {\n      if (!focusableElements.length) {\n        return;\n      }\n      let firstFocusEl = focusableElements[0];\n      // If first element is a checkbox, put focus on the selected checkbox or the first checkbox if none are selected.\n      if (firstFocusEl.matches('[type=\"radio\"]:not(:checked)')) {\n        firstFocusEl = focusableElements.find(el => el.checked && el.name === firstFocusEl.name) || firstFocusEl;\n      }\n      return firstFocusEl;\n    },\n\n    /**\n     * internal use only.\n     *\n     * gets all the focusable elements within the component\n     * and sets the first and last of those elements.\n     *\n     * @param {object} el - the root dom element to find focusable elements in.\n     * @param {bool} includeNegativeTabIndex - will include tabindex=\"-1\" in the list of focusable elements.\n     */\n    _getFocusableElements (el = this.$el, includeNegativeTabIndex = false) {\n      if (!el) return [];\n      const focusableContent = [...el.querySelectorAll(focusableElementsList)];\n      return focusableContent.filter((fc) => {\n        const style = window.getComputedStyle(fc);\n        return style.getPropertyValue('display') !== 'none' &&\n          style.getPropertyValue('visibility') !== 'hidden' &&\n          fc.matches(includeNegativeTabIndex ? focusableAttrs : tabbableAttrs);\n      });\n    },\n\n    /**\n     * tabs to the next element contained within your component, does not include tabindex=\"-1\".\n     * @param {object} e - keypress event\n     * @param {object} el - optional - ref of dom element to trap focus on.\n     *  will default to the root node of the vue component\n     */\n    focusTrappedTabPress (e, el) {\n      const isTabPressed = e.key === 'Tab';\n\n      if (!isTabPressed) {\n        return;\n      }\n\n      const focusableElements = this._getFocusableElements(el);\n      if (!focusableElements.length) {\n        e.preventDefault();\n        return;\n      }\n\n      const firstFocusableElement = this._getFirstFocusElement(focusableElements);\n      const lastFocusableElement = focusableElements[focusableElements.length - 1];\n\n      if (e.shiftKey) {\n        if (document.activeElement === firstFocusableElement) {\n          lastFocusableElement.focus();\n          e.preventDefault();\n        }\n      } else {\n        if (document.activeElement === lastFocusableElement) {\n          firstFocusableElement.focus();\n          e.preventDefault();\n        }\n      }\n    },\n  },\n};\n"],"names":[],"mappings":"AAAA,MAAM,iBAAiB;AACvB,MAAM,gBAAgB,GAAG,cAAc;AACvC,MAAM,wBAAwB;AAiB9B,MAAe,QAAA;AAAA,EACb,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMP,MAAM,yBAA0B,IAAI;AAClC,YAAM,KAAK;AACX,YAAM,oBAAoB,KAAK,sBAAsB,IAAI,IAAI;AAC7D,aAAO,KAAK,sBAAsB,iBAAiB;AAAA,IACpD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,MAAM,kBAAmB,KAAK,KAAK,KAAK;AACtC,YAAM,YAAY,MAAM,KAAK,yBAAyB,EAAE;AACxD,6CAAW,MAAM,EAAE,eAAe,KAAM;AAAA,IACzC;AAAA,IAED,MAAM,iBAAkB,WAAW;AA1CvC;AA2CM,YAAM,KAAK;AACX,YAAM,UAAS,UAAK,QAAL,mBAAU,cAAc;AACvC,UAAI,QAAQ;AACV,eAAO,MAAK;AACZ;AAAA,MACD;AAGD,cAAQ,KAAK,wHACgC;AAC7C,YAAM,KAAK;IACZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,sBAAuB,mBAAmB;AACxC,UAAI,CAAC,kBAAkB,QAAQ;AAC7B;AAAA,MACD;AACD,UAAI,eAAe,kBAAkB,CAAC;AAEtC,UAAI,aAAa,QAAQ,8BAA8B,GAAG;AACxD,uBAAe,kBAAkB,KAAK,QAAM,GAAG,WAAW,GAAG,SAAS,aAAa,IAAI,KAAK;AAAA,MAC7F;AACD,aAAO;AAAA,IACR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWD,sBAAuB,KAAK,KAAK,KAAK,0BAA0B,OAAO;AACrE,UAAI,CAAC,GAAI,QAAO;AAChB,YAAM,mBAAmB,CAAC,GAAG,GAAG,iBAAiB,qBAAqB,CAAC;AACvE,aAAO,iBAAiB,OAAO,CAAC,OAAO;AACrC,cAAM,QAAQ,OAAO,iBAAiB,EAAE;AACxC,eAAO,MAAM,iBAAiB,SAAS,MAAM,UAC3C,MAAM,iBAAiB,YAAY,MAAM,YACzC,GAAG,QAAQ,0BAA0B,iBAAiB,aAAa;AAAA,MAC7E,CAAO;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,qBAAsB,GAAG,IAAI;AAC3B,YAAM,eAAe,EAAE,QAAQ;AAE/B,UAAI,CAAC,cAAc;AACjB;AAAA,MACD;AAED,YAAM,oBAAoB,KAAK,sBAAsB,EAAE;AACvD,UAAI,CAAC,kBAAkB,QAAQ;AAC7B,UAAE,eAAc;AAChB;AAAA,MACD;AAED,YAAM,wBAAwB,KAAK,sBAAsB,iBAAiB;AAC1E,YAAM,uBAAuB,kBAAkB,kBAAkB,SAAS,CAAC;AAE3E,UAAI,EAAE,UAAU;AACd,YAAI,SAAS,kBAAkB,uBAAuB;AACpD,+BAAqB,MAAK;AAC1B,YAAE,eAAc;AAAA,QACjB;AAAA,MACT,OAAa;AACL,YAAI,SAAS,kBAAkB,sBAAsB;AACnD,gCAAsB,MAAK;AAC3B,YAAE,eAAc;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACH;"}

package/dist/vue3/common/mixins/skeleton.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"skeleton.cjs","sources":["../../../common/mixins/skeleton.js"],"sourcesContent":["import { SKELETON_RIPPLE_DURATION } from '@/components/skeleton/skeleton_constants';\n\n/**\n * @displayName Skeleton Animation Mixin\n */\nexport default {\n  computed: {\n    skeletonOffset () {\n      const skeletonText = this.$refs.skeleton;\n      if (!skeletonText) { return this.offset; }\n      const { top, height } = skeletonText.getBoundingClientRect();\n      return top + (height / 2);\n    },\n\n    skeletonStyle () {\n      const style = {};\n\n      if (this.skeletonOffset === -1 || (!this.animate && this.animationDuration === -1)) {\n        return style;\n      }\n      const animationDelay = this.skeletonOffset * SKELETON_RIPPLE_DURATION / 1000;\n      const animationDuration = this.animationDuration === -1 ? 1000 : this.animationDuration;\n      style.animationDelay = `${animationDelay}ms`;\n      style.animationDuration = `${animationDuration}ms`;\n      return style;\n    },\n  },\n};\n"],"names":["SKELETON_RIPPLE_DURATION"],"mappings":";;;AAKA,MAAe,oBAAA;AAAA,EACb,UAAU;AAAA,IACR,iBAAkB;AAChB,YAAM,eAAe,KAAK,MAAM;AAChC,UAAI,CAAC,cAAc;AAAE,eAAO,KAAK;AAAA,MAAS;AAC1C,YAAM,EAAE,KAAK,OAAQ,IAAG,aAAa,sBAAqB;AAC1D,aAAO,MAAO,SAAS;AAAA,IACxB;AAAA,IAED,gBAAiB;AACf,YAAM,QAAQ,CAAA;AAEd,UAAI,KAAK,mBAAmB,MAAO,CAAC,KAAK,WAAW,KAAK,sBAAsB,IAAK;AAClF,eAAO;AAAA,MACR;AACD,YAAM,iBAAiB,KAAK,iBAAiBA,mBAAAA,2BAA2B;AACxE,YAAM,oBAAoB,KAAK,sBAAsB,KAAK,MAAO,KAAK;AACtE,YAAM,iBAAiB,GAAG,cAAc;AACxC,YAAM,oBAAoB,GAAG,iBAAiB;AAC9C,aAAO;AAAA,IACR;AAAA,EACF;AACH;;"}

package/dist/vue3/common/mixins/skeleton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"skeleton.js","sources":["../../../common/mixins/skeleton.js"],"sourcesContent":["import { SKELETON_RIPPLE_DURATION } from '@/components/skeleton/skeleton_constants';\n\n/**\n * @displayName Skeleton Animation Mixin\n */\nexport default {\n  computed: {\n    skeletonOffset () {\n      const skeletonText = this.$refs.skeleton;\n      if (!skeletonText) { return this.offset; }\n      const { top, height } = skeletonText.getBoundingClientRect();\n      return top + (height / 2);\n    },\n\n    skeletonStyle () {\n      const style = {};\n\n      if (this.skeletonOffset === -1 || (!this.animate && this.animationDuration === -1)) {\n        return style;\n      }\n      const animationDelay = this.skeletonOffset * SKELETON_RIPPLE_DURATION / 1000;\n      const animationDuration = this.animationDuration === -1 ? 1000 : this.animationDuration;\n      style.animationDelay = `${animationDelay}ms`;\n      style.animationDuration = `${animationDuration}ms`;\n      return style;\n    },\n  },\n};\n"],"names":[],"mappings":";AAKA,MAAe,oBAAA;AAAA,EACb,UAAU;AAAA,IACR,iBAAkB;AAChB,YAAM,eAAe,KAAK,MAAM;AAChC,UAAI,CAAC,cAAc;AAAE,eAAO,KAAK;AAAA,MAAS;AAC1C,YAAM,EAAE,KAAK,OAAQ,IAAG,aAAa,sBAAqB;AAC1D,aAAO,MAAO,SAAS;AAAA,IACxB;AAAA,IAED,gBAAiB;AACf,YAAM,QAAQ,CAAA;AAEd,UAAI,KAAK,mBAAmB,MAAO,CAAC,KAAK,WAAW,KAAK,sBAAsB,IAAK;AAClF,eAAO;AAAA,MACR;AACD,YAAM,iBAAiB,KAAK,iBAAiB,2BAA2B;AACxE,YAAM,oBAAoB,KAAK,sBAAsB,KAAK,MAAO,KAAK;AACtE,YAAM,iBAAiB,GAAG,cAAc;AACxC,YAAM,oBAAoB,GAAG,iBAAiB;AAC9C,aAAO;AAAA,IACR;AAAA,EACF;AACH;"}

package/dist/vue3/common/mixins/sr_only_close_button.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"sr_only_close_button.cjs","sources":["../../../common/mixins/sr_only_close_button.js"],"sourcesContent":["/**\n * @displayName Sr-Only close button mixin\n */\nexport default {\n  props: {\n    /**\n     * If true, a hidden close button is included for screen readers\n     * @values true, false\n     */\n    visuallyHiddenClose: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Label for the visually hidden close button\n     * Required if visuallyHiddenClose is set to `true`\n     */\n    visuallyHiddenCloseLabel: {\n      type: String,\n      default: null,\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      handler () {\n        this.validateVisuallyHiddenCloseProps();\n      },\n    },\n  },\n\n  computed: {\n    showVisuallyHiddenClose () {\n      return this.visuallyHiddenClose && this.visuallyHiddenCloseLabel != null;\n    },\n  },\n\n  methods: {\n    validateVisuallyHiddenCloseProps () {\n      if (this.visuallyHiddenClose && !this.visuallyHiddenCloseLabel) {\n        console.error(`If visuallyHiddenClose prop is true, the component includes\n           a visually hidden close button and you must set the visuallyHiddenCloseLabel prop.`);\n      }\n    },\n  },\n};\n"],"names":[],"mappings":";;AAGA,MAAe,yBAAA;AAAA,EACb,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,qBAAqB;AAAA,MACnB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,0BAA0B;AAAA,MACxB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,WAAW;AAAA,MACX,MAAM;AAAA,MACN,UAAW;AACT,aAAK,iCAAgC;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,0BAA2B;AACzB,aAAO,KAAK,uBAAuB,KAAK,4BAA4B;AAAA,IACrE;AAAA,EACF;AAAA,EAED,SAAS;AAAA,IACP,mCAAoC;AAClC,UAAI,KAAK,uBAAuB,CAAC,KAAK,0BAA0B;AAC9D,gBAAQ,MAAM;AAAA,8FACwE;AAAA,MACvF;AAAA,IACF;AAAA,EACF;AACH;;"}

package/dist/vue3/common/mixins/sr_only_close_button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sr_only_close_button.js","sources":["../../../common/mixins/sr_only_close_button.js"],"sourcesContent":["/**\n * @displayName Sr-Only close button mixin\n */\nexport default {\n  props: {\n    /**\n     * If true, a hidden close button is included for screen readers\n     * @values true, false\n     */\n    visuallyHiddenClose: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Label for the visually hidden close button\n     * Required if visuallyHiddenClose is set to `true`\n     */\n    visuallyHiddenCloseLabel: {\n      type: String,\n      default: null,\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      handler () {\n        this.validateVisuallyHiddenCloseProps();\n      },\n    },\n  },\n\n  computed: {\n    showVisuallyHiddenClose () {\n      return this.visuallyHiddenClose && this.visuallyHiddenCloseLabel != null;\n    },\n  },\n\n  methods: {\n    validateVisuallyHiddenCloseProps () {\n      if (this.visuallyHiddenClose && !this.visuallyHiddenCloseLabel) {\n        console.error(`If visuallyHiddenClose prop is true, the component includes\n           a visually hidden close button and you must set the visuallyHiddenCloseLabel prop.`);\n      }\n    },\n  },\n};\n"],"names":[],"mappings":"AAGA,MAAe,yBAAA;AAAA,EACb,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,qBAAqB;AAAA,MACnB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,0BAA0B;AAAA,MACxB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,WAAW;AAAA,MACX,MAAM;AAAA,MACN,UAAW;AACT,aAAK,iCAAgC;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,0BAA2B;AACzB,aAAO,KAAK,uBAAuB,KAAK,4BAA4B;AAAA,IACrE;AAAA,EACF;AAAA,EAED,SAAS;AAAA,IACP,mCAAoC;AAClC,UAAI,KAAK,uBAAuB,CAAC,KAAK,0BAA0B;AAC9D,gBAAQ,MAAM;AAAA,8FACwE;AAAA,MACvF;AAAA,IACF;AAAA,EACF;AACH;"}

package/dist/vue3/common/sr_only_close_button.vue.cjs

@@ -1,49 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const vue3 = require("@dialpad/dialtone-icons/vue3");
-const vue = require("vue");
-const _pluginVue_exportHelper = require("../_virtual/_plugin-vue_export-helper.cjs");
-const button = require("../components/button/button.vue.cjs");
-const _sfc_main = {
-  name: "SrOnlyCloseButton",
-  components: {
-    DtIconClose: vue3.DtIconClose,
-    DtButton: button.default
-  },
-  props: {
-    /**
-     * Label for the visually hidden close button
-     * Required if visuallyHiddenClose is set to `true`
-     */
-    visuallyHiddenCloseLabel: {
-      type: String,
-      default: null
-    }
-  },
-  emits: ["close"],
-  methods: {
-    close() {
-      this.$emit("close");
-    }
-  }
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dt_icon_close = vue.resolveComponent("dt-icon-close");
-  const _component_dt_button = vue.resolveComponent("dt-button");
-  return vue.openBlock(), vue.createBlock(_component_dt_button, {
-    id: "sr-only-close-button",
-    "data-qa": "dt-sr-only-close-button",
-    class: "d-vi-visible-sr",
-    "aria-label": $props.visuallyHiddenCloseLabel,
-    onClick: $options.close,
-    onKeydown: vue.withKeys(vue.withModifiers($options.close, ["prevent", "stop"]), ["space"])
-  }, {
-    default: vue.withCtx(() => [
-      vue.createVNode(_component_dt_icon_close)
-    ]),
-    _: 1
-  }, 8, ["aria-label", "onClick", "onKeydown"]);
-}
-const SrOnlyCloseButton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
-exports.default = SrOnlyCloseButton;
-//# sourceMappingURL=sr_only_close_button.vue.cjs.map

package/dist/vue3/common/sr_only_close_button.vue.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"sr_only_close_button.vue.cjs","sources":["../../common/sr_only_close_button.vue"],"sourcesContent":["<template>\n  <dt-button\n    id=\"sr-only-close-button\"\n    data-qa=\"dt-sr-only-close-button\"\n    class=\"d-vi-visible-sr\"\n    :aria-label=\"visuallyHiddenCloseLabel\"\n    @click=\"close\"\n    @keydown.space.prevent.stop=\"close\"\n  >\n    <dt-icon-close />\n  </dt-button>\n</template>\n\n<script>\nimport { DtIconClose } from '@dialpad/dialtone-icons/vue3';\nimport { DtButton } from '@/components/button';\n\nexport default {\n  name: 'SrOnlyCloseButton',\n  components: {\n    DtIconClose,\n    DtButton,\n  },\n\n  props: {\n    /**\n     * Label for the visually hidden close button\n     * Required if visuallyHiddenClose is set to `true`\n     */\n    visuallyHiddenCloseLabel: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: ['close'],\n\n  methods: {\n    close () {\n      this.$emit('close');\n    },\n  },\n};\n</script>\n"],"names":["DtIconClose","DtButton","_createBlock","_withKeys","_withModifiers","_withCtx","_createVNode"],"mappings":";;;;;;AAiBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,iBACVA,KAAW;AAAA,IACX,UAAAC,OAAQ;AAAA,EACT;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,0BAA0B;AAAA,MACxB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO,CAAC,OAAO;AAAA,EAEf,SAAS;AAAA,IACP,QAAS;AACP,WAAK,MAAM,OAAO;AAAA,IACnB;AAAA,EACF;AACH;;;;0BAzCEC,IASY,YAAA,sBAAA;AAAA,IARV,IAAG;AAAA,IACH,WAAQ;AAAA,IACR,OAAM;AAAA,IACL,cAAY,OAAwB;AAAA,IACpC,SAAO,SAAK;AAAA,IACZ,WAPLC,IAAA,SAAAC,kBAOiC,SAAK,OAAA,CAAA,WAAA,MAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA;IAPtC,SAAAC,IAAA,QASI,MAAiB;AAAA,MAAjBC,IAAAA,YAAiB,wBAAA;AAAA;IATrB,GAAA;AAAA;;;;"}

package/dist/vue3/common/sr_only_close_button.vue.js

@@ -1,49 +0,0 @@
-import { DtIconClose } from "@dialpad/dialtone-icons/vue3";
-import { resolveComponent, openBlock, createBlock, withKeys, withModifiers, withCtx, createVNode } from "vue";
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-import DtButton from "../components/button/button.vue.js";
-const _sfc_main = {
-  name: "SrOnlyCloseButton",
-  components: {
-    DtIconClose,
-    DtButton
-  },
-  props: {
-    /**
-     * Label for the visually hidden close button
-     * Required if visuallyHiddenClose is set to `true`
-     */
-    visuallyHiddenCloseLabel: {
-      type: String,
-      default: null
-    }
-  },
-  emits: ["close"],
-  methods: {
-    close() {
-      this.$emit("close");
-    }
-  }
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dt_icon_close = resolveComponent("dt-icon-close");
-  const _component_dt_button = resolveComponent("dt-button");
-  return openBlock(), createBlock(_component_dt_button, {
-    id: "sr-only-close-button",
-    "data-qa": "dt-sr-only-close-button",
-    class: "d-vi-visible-sr",
-    "aria-label": $props.visuallyHiddenCloseLabel,
-    onClick: $options.close,
-    onKeydown: withKeys(withModifiers($options.close, ["prevent", "stop"]), ["space"])
-  }, {
-    default: withCtx(() => [
-      createVNode(_component_dt_icon_close)
-    ]),
-    _: 1
-  }, 8, ["aria-label", "onClick", "onKeydown"]);
-}
-const SrOnlyCloseButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export {
-  SrOnlyCloseButton as default
-};
-//# sourceMappingURL=sr_only_close_button.vue.js.map

package/dist/vue3/common/sr_only_close_button.vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sr_only_close_button.vue.js","sources":["../../common/sr_only_close_button.vue"],"sourcesContent":["<template>\n  <dt-button\n    id=\"sr-only-close-button\"\n    data-qa=\"dt-sr-only-close-button\"\n    class=\"d-vi-visible-sr\"\n    :aria-label=\"visuallyHiddenCloseLabel\"\n    @click=\"close\"\n    @keydown.space.prevent.stop=\"close\"\n  >\n    <dt-icon-close />\n  </dt-button>\n</template>\n\n<script>\nimport { DtIconClose } from '@dialpad/dialtone-icons/vue3';\nimport { DtButton } from '@/components/button';\n\nexport default {\n  name: 'SrOnlyCloseButton',\n  components: {\n    DtIconClose,\n    DtButton,\n  },\n\n  props: {\n    /**\n     * Label for the visually hidden close button\n     * Required if visuallyHiddenClose is set to `true`\n     */\n    visuallyHiddenCloseLabel: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: ['close'],\n\n  methods: {\n    close () {\n      this.$emit('close');\n    },\n  },\n};\n</script>\n"],"names":["_createBlock","_withKeys","_withModifiers","_withCtx","_createVNode"],"mappings":";;;;AAiBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,EACD;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,0BAA0B;AAAA,MACxB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO,CAAC,OAAO;AAAA,EAEf,SAAS;AAAA,IACP,QAAS;AACP,WAAK,MAAM,OAAO;AAAA,IACnB;AAAA,EACF;AACH;;;;sBAzCEA,YASY,sBAAA;AAAA,IARV,IAAG;AAAA,IACH,WAAQ;AAAA,IACR,OAAM;AAAA,IACL,cAAY,OAAwB;AAAA,IACpC,SAAO,SAAK;AAAA,IACZ,WAPLC,SAAAC,cAOiC,SAAK,OAAA,CAAA,WAAA,MAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA;IAPtC,SAAAC,QASI,MAAiB;AAAA,MAAjBC,YAAiB,wBAAA;AAAA;IATrB,GAAA;AAAA;;;"}

package/dist/vue3/components/avatar/avatar.vue.cjs

@@ -1,368 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const common_utils = require("../../common/utils.cjs");
-const avatar_constants = require("./avatar_constants.cjs");
-const icon_constants = require("../icon/icon_constants.cjs");
-const utils = require("./utils.cjs");
-const vue = require("vue");
-;/* empty css              */
-const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.cjs");
-const presence = require("../presence/presence.vue.cjs");
-const _sfc_main = {
-  name: "DtAvatar",
-  components: { DtPresence: presence.default },
-  inheritAttrs: false,
-  props: {
-    /**
-     * Id of the avatar content wrapper element
-     */
-    id: {
-      type: String,
-      default() {
-        return common_utils.getUniqueString();
-      }
-    },
-    /**
-     * Pass in a seed to get the random color generation based on that string. For example if you pass in a
-     * user ID as the string it will return the same randomly generated colors every time for that user.
-     */
-    seed: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Set the avatar background to a specific color. If undefined will randomize the color which can be deterministic
-     * if the seed prop is set.
-     */
-    color: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * The size of the avatar
-     * @values xs, sm, md, lg, xl
-     */
-    size: {
-      type: String,
-      default: "md",
-      validator: (size) => Object.keys(avatar_constants.AVATAR_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Used to customize the avatar container
-     */
-    avatarClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Set classes on the avatar canvas. Wrapper around the core avatar image.
-     */
-    canvasClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Pass through classes. Used to customize the avatar icon
-     */
-    iconClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Determines whether to show the presence indicator for
-     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',
-     * or 'active'. By default, it's null and nothing is shown.
-     * @values null, busy, away, offline, active
-     */
-    presence: {
-      type: String,
-      default: avatar_constants.AVATAR_PRESENCE_STATES.NONE,
-      validator: (state) => {
-        return Object.values(avatar_constants.AVATAR_PRESENCE_STATES).includes(state);
-      }
-    },
-    /**
-     * A set of props to be passed into the presence component.
-     */
-    presenceProps: {
-      type: Object,
-      default: () => ({})
-    },
-    /**
-     * Determines whether to show a group avatar.
-     * Limit to 2 digits max, more than 99 will be rendered as “99+”.
-     * if the number is 1 or less it would just show the regular avatar as if group had not been set.
-     */
-    group: {
-      type: Number,
-      default: void 0,
-      validator: (group) => avatar_constants.AVATAR_GROUP_VALIDATOR(group)
-    },
-    /**
-     * The text that overlays the avatar
-     */
-    overlayText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Used to customize the avatar overlay
-     */
-    overlayClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Source of the image
-     */
-    imageSrc: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Alt attribute of the image, required if imageSrc is provided.
-     * Can be set to '' (empty string) if the image is described
-     * in text nearby
-     */
-    imageAlt: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Icon size to be displayed on the avatar
-     * @values 100, 200, 300, 400, 500, 600, 700, 800
-     */
-    iconSize: {
-      type: String,
-      default: "",
-      validator: (size) => !size || Object.keys(icon_constants.ICON_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Full name used to extract initials.
-     */
-    fullName: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Makes the avatar focusable and clickable,
-     * emits a click event when clicked.
-     */
-    clickable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Descriptive label for the icon.
-     * To avoid a11y issues, set this prop if clickable and iconName are set.
-     */
-    iconAriaLabel: {
-      type: String,
-      default: void 0
-    }
-  },
-  emits: [
-    /**
-     * Avatar click event
-     *
-     * @event click
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "click"
-  ],
-  data() {
-    return {
-      AVATAR_SIZE_MODIFIERS: avatar_constants.AVATAR_SIZE_MODIFIERS,
-      AVATAR_KIND_MODIFIERS: avatar_constants.AVATAR_KIND_MODIFIERS,
-      AVATAR_PRESENCE_SIZE_MODIFIERS: avatar_constants.AVATAR_PRESENCE_SIZE_MODIFIERS,
-      AVATAR_ICON_SIZES: avatar_constants.AVATAR_ICON_SIZES,
-      imageLoadedSuccessfully: null,
-      formattedInitials: "",
-      initializing: false,
-      hasSlotContent: common_utils.hasSlotContent
-    };
-  },
-  computed: {
-    hasOverlayIcon() {
-      return common_utils.hasSlotContent(this.$slots.overlayIcon);
-    },
-    iconDataQa() {
-      return "dt-avatar-icon";
-    },
-    avatarClasses() {
-      return [
-        "d-avatar",
-        avatar_constants.AVATAR_SIZE_MODIFIERS[this.validatedSize],
-        this.avatarClass,
-        {
-          "d-avatar--group": this.showGroup,
-          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),
-          "d-avatar--clickable": this.clickable
-        }
-      ];
-    },
-    overlayClasses() {
-      return [
-        "d-avatar__overlay",
-        this.overlayClass,
-        { "d-avatar__overlay-icon": this.hasOverlayIcon }
-      ];
-    },
-    showGroup() {
-      return avatar_constants.AVATAR_GROUP_VALIDATOR(this.group);
-    },
-    formattedGroup() {
-      return this.group > 99 ? "99+" : this.group;
-    },
-    validatedSize() {
-      return this.group ? "xs" : this.size;
-    },
-    showImage() {
-      return this.imageLoadedSuccessfully !== false && this.imageSrc;
-    }
-  },
-  watch: {
-    fullName: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    size: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    group: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    imageSrc(newSrc) {
-      this.imageLoadedSuccessfully = null;
-      if (!newSrc) return;
-      this.validateProps();
-      this.setImageListeners();
-    }
-  },
-  mounted() {
-    this.validateProps();
-    this.setImageListeners();
-  },
-  methods: {
-    isIconType() {
-      return common_utils.hasSlotContent(this.$slots.icon);
-    },
-    async setImageListeners() {
-      await this.$nextTick();
-      const el = this.$refs.avatarImage;
-      if (!el) return;
-      el.addEventListener("load", () => this._loadedImageEventHandler(el), { once: true });
-      el.addEventListener("error", () => this._erroredImageEventHandler(el), { once: true });
-    },
-    formatInitials() {
-      const initials = utils.extractInitialsFromName(this.fullName);
-      if (this.validatedSize === "xs") {
-        this.formattedInitials = "";
-      } else if (this.validatedSize === "sm") {
-        this.formattedInitials = initials[0];
-      } else {
-        this.formattedInitials = initials;
-      }
-    },
-    getColor() {
-      return this.color ?? common_utils.getRandomElement(avatar_constants.AVATAR_RANDOM_COLORS, this.seed);
-    },
-    _loadedImageEventHandler(el) {
-      this.imageLoadedSuccessfully = true;
-      el.classList.remove("d-d-none");
-    },
-    _erroredImageEventHandler(el) {
-      this.imageLoadedSuccessfully = false;
-      el.classList.add("d-d-none");
-    },
-    validateProps() {
-      if (this.imageSrc && this.imageAlt === void 0) {
-        console.error('image-alt required if image-src is provided. Can be set to "" (empty string) if the image is described in text nearby');
-      }
-    },
-    handleClick(e) {
-      if (!this.clickable) return;
-      this.$emit("click", e);
-    }
-  }
-};
-const _hoisted_1 = ["src", "alt"];
-const _hoisted_2 = ["aria-label", "data-qa", "role"];
-const _hoisted_3 = {
-  key: 1,
-  class: "d-avatar__overlay-text"
-};
-const _hoisted_4 = {
-  key: 1,
-  class: "d-avatar__count",
-  "data-qa": "dt-avatar-count"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_dt_presence = vue.resolveComponent("dt-presence");
-  return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.clickable ? "button" : "div"), {
-    id: $props.id,
-    class: vue.normalizeClass($options.avatarClasses),
-    "data-qa": "dt-avatar",
-    onClick: $options.handleClick
-  }, {
-    default: vue.withCtx(() => [
-      vue.createElementVNode("div", {
-        ref: "canvas",
-        class: vue.normalizeClass([
-          $props.canvasClass,
-          "d-avatar__canvas",
-          { "d-avatar--image-loaded": $data.imageLoadedSuccessfully }
-        ])
-      }, [
-        $options.showImage ? (vue.openBlock(), vue.createElementBlock("img", {
-          key: 0,
-          ref: "avatarImage",
-          class: "d-avatar__image",
-          "data-qa": "dt-avatar-image",
-          src: $props.imageSrc,
-          alt: $props.imageAlt
-        }, null, 8, _hoisted_1)) : $options.isIconType() ? (vue.openBlock(), vue.createElementBlock("div", {
-          key: 1,
-          class: vue.normalizeClass([$props.iconClass, $data.AVATAR_KIND_MODIFIERS.icon]),
-          "aria-label": $props.clickable ? $props.iconAriaLabel : "",
-          "data-qa": $options.iconDataQa,
-          role: $props.clickable ? "button" : ""
-        }, [
-          vue.renderSlot(_ctx.$slots, "icon", {
-            iconSize: $props.iconSize || $data.AVATAR_ICON_SIZES[$props.size]
-          })
-        ], 10, _hoisted_2)) : (vue.openBlock(), vue.createElementBlock("span", {
-          key: 2,
-          class: vue.normalizeClass([$data.AVATAR_KIND_MODIFIERS.initials])
-        }, vue.toDisplayString($data.formattedInitials), 3))
-      ], 2),
-      $options.hasOverlayIcon || $props.overlayText ? (vue.openBlock(), vue.createElementBlock("div", {
-        key: 0,
-        class: vue.normalizeClass($options.overlayClasses)
-      }, [
-        $options.hasOverlayIcon ? vue.renderSlot(_ctx.$slots, "overlayIcon", { key: 0 }) : $props.overlayText ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_3, vue.toDisplayString($props.overlayText), 1)) : vue.createCommentVNode("", true)
-      ], 2)) : vue.createCommentVNode("", true),
-      $options.showGroup ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString($options.formattedGroup), 1)) : vue.createCommentVNode("", true),
-      $props.presence && !$options.showGroup ? (vue.openBlock(), vue.createBlock(_component_dt_presence, vue.mergeProps({
-        key: 2,
-        presence: $props.presence,
-        class: [
-          "d-avatar__presence",
-          $data.AVATAR_PRESENCE_SIZE_MODIFIERS[$props.size]
-        ]
-      }, $props.presenceProps, { "data-qa": "dt-presence" }), null, 16, ["presence", "class"])) : vue.createCommentVNode("", true)
-    ]),
-    _: 3
-  }, 8, ["id", "class", "onClick"]);
-}
-const DtAvatar = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
-exports.default = DtAvatar;
-//# sourceMappingURL=avatar.vue.cjs.map

package/dist/vue3/components/avatar/avatar.vue.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"avatar.vue.cjs","sources":["../../../components/avatar/avatar.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"clickable ? 'button' : 'div'\"\n    :id=\"id\"\n    :class=\"avatarClasses\"\n    data-qa=\"dt-avatar\"\n    @click=\"handleClick\"\n  >\n    <div\n      ref=\"canvas\"\n      :class=\"[\n        canvasClass,\n        'd-avatar__canvas',\n        { 'd-avatar--image-loaded': imageLoadedSuccessfully },\n      ]\"\n    >\n      <img\n        v-if=\"showImage\"\n        ref=\"avatarImage\"\n        class=\"d-avatar__image\"\n        data-qa=\"dt-avatar-image\"\n        :src=\"imageSrc\"\n        :alt=\"imageAlt\"\n      >\n      <div\n        v-else-if=\"isIconType()\"\n        :class=\"[iconClass, AVATAR_KIND_MODIFIERS.icon]\"\n        :aria-label=\"clickable ? iconAriaLabel : ''\"\n        :data-qa=\"iconDataQa\"\n        :role=\"clickable ? 'button' : ''\"\n      >\n        <!-- @slot Slot for avatar icon. It will display if no imageSrc is provided -->\n        <slot\n          name=\"icon\"\n          :icon-size=\"iconSize || AVATAR_ICON_SIZES[size]\"\n        />\n      </div>\n      <span\n        v-else\n        :class=\"[AVATAR_KIND_MODIFIERS.initials]\"\n      >\n        {{ formattedInitials }}\n      </span>\n    </div>\n    <div\n      v-if=\"hasOverlayIcon || overlayText\"\n      :class=\"overlayClasses\"\n    >\n      <!-- @slot Slot for overlay icon. -->\n      <slot\n        v-if=\"hasOverlayIcon\"\n        name=\"overlayIcon\"\n      />\n      <p\n        v-else-if=\"overlayText\"\n        class=\"d-avatar__overlay-text\"\n      >\n        {{ overlayText }}\n      </p>\n    </div>\n    <span\n      v-if=\"showGroup\"\n      class=\"d-avatar__count\"\n      data-qa=\"dt-avatar-count\"\n    >{{ formattedGroup }}</span>\n    <dt-presence\n      v-if=\"presence && !showGroup\"\n      :presence=\"presence\"\n      :class=\"[\n        'd-avatar__presence',\n        AVATAR_PRESENCE_SIZE_MODIFIERS[size],\n      ]\"\n      v-bind=\"presenceProps\"\n      data-qa=\"dt-presence\"\n    />\n  </component>\n</template>\n\n<script>\nimport { getUniqueString, getRandomElement, hasSlotContent } from '@/common/utils';\nimport { DtPresence } from '../presence';\nimport {\n  AVATAR_KIND_MODIFIERS,\n  AVATAR_SIZE_MODIFIERS,\n  AVATAR_PRESENCE_SIZE_MODIFIERS,\n  AVATAR_PRESENCE_STATES,\n  AVATAR_RANDOM_COLORS,\n  AVATAR_GROUP_VALIDATOR,\n  AVATAR_ICON_SIZES,\n} from './avatar_constants';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants.js';\nimport { extractInitialsFromName } from './utils';\n\n/**\n * An avatar is a visual representation of a user or object.\n * @see https://dialtone.dialpad.com/components/avatar.html\n */\nexport default {\n  name: 'DtAvatar',\n  components: { DtPresence },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id of the avatar content wrapper element\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * Pass in a seed to get the random color generation based on that string. For example if you pass in a\n     * user ID as the string it will return the same randomly generated colors every time for that user.\n     */\n    seed: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Set the avatar background to a specific color. If undefined will randomize the color which can be deterministic\n     * if the seed prop is set.\n     */\n    color: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * The size of the avatar\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (size) => Object.keys(AVATAR_SIZE_MODIFIERS).includes(size),\n    },\n\n    /**\n     * Used to customize the avatar container\n     */\n    avatarClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Set classes on the avatar canvas. Wrapper around the core avatar image.\n     */\n    canvasClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Pass through classes. Used to customize the avatar icon\n     */\n    iconClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Determines whether to show the presence indicator for\n     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n     * or 'active'. By default, it's null and nothing is shown.\n     * @values null, busy, away, offline, active\n     */\n    presence: {\n      type: String,\n      default: AVATAR_PRESENCE_STATES.NONE,\n      validator: (state) => {\n        return Object.values(AVATAR_PRESENCE_STATES).includes(state);\n      },\n    },\n\n    /**\n     * A set of props to be passed into the presence component.\n     */\n    presenceProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Determines whether to show a group avatar.\n     * Limit to 2 digits max, more than 99 will be rendered as “99+”.\n     * if the number is 1 or less it would just show the regular avatar as if group had not been set.\n     */\n    group: {\n      type: Number,\n      default: undefined,\n      validator: (group) => AVATAR_GROUP_VALIDATOR(group),\n    },\n\n    /**\n     * The text that overlays the avatar\n     */\n    overlayText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Used to customize the avatar overlay\n     */\n    overlayClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Source of the image\n     */\n    imageSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Alt attribute of the image, required if imageSrc is provided.\n     * Can be set to '' (empty string) if the image is described\n     * in text nearby\n     */\n    imageAlt: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Icon size to be displayed on the avatar\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    iconSize: {\n      type: String,\n      default: '',\n      validator: (size) => !size || Object.keys(ICON_SIZE_MODIFIERS).includes(size),\n    },\n\n    /**\n     * Full name used to extract initials.\n     */\n    fullName: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Makes the avatar focusable and clickable,\n     * emits a click event when clicked.\n     */\n    clickable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the icon.\n     * To avoid a11y issues, set this prop if clickable and iconName are set.\n     */\n    iconAriaLabel: {\n      type: String,\n      default: undefined,\n    },\n  },\n\n  emits: [\n    /**\n     * Avatar click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  data () {\n    return {\n      AVATAR_SIZE_MODIFIERS,\n      AVATAR_KIND_MODIFIERS,\n      AVATAR_PRESENCE_SIZE_MODIFIERS,\n      AVATAR_ICON_SIZES,\n      imageLoadedSuccessfully: null,\n      formattedInitials: '',\n      initializing: false,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    hasOverlayIcon () {\n      return hasSlotContent(this.$slots.overlayIcon);\n    },\n\n    iconDataQa () {\n      return 'dt-avatar-icon';\n    },\n\n    avatarClasses () {\n      return [\n        'd-avatar',\n        AVATAR_SIZE_MODIFIERS[this.validatedSize],\n        this.avatarClass,\n        {\n          'd-avatar--group': this.showGroup,\n          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),\n          'd-avatar--clickable': this.clickable,\n        },\n      ];\n    },\n\n    overlayClasses () {\n      return [\n        'd-avatar__overlay',\n        this.overlayClass,\n        { 'd-avatar__overlay-icon': this.hasOverlayIcon },\n      ];\n    },\n\n    showGroup () {\n      return AVATAR_GROUP_VALIDATOR(this.group);\n    },\n\n    formattedGroup () {\n      return this.group > 99 ? '99+' : this.group;\n    },\n\n    validatedSize () {\n      // TODO: Group only supports xs size for now. Remove this when we support other sizes.\n      return this.group ? 'xs' : this.size;\n    },\n\n    showImage () {\n      return this.imageLoadedSuccessfully !== false && this.imageSrc;\n    },\n  },\n\n  watch: {\n    fullName: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    size: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    group: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    imageSrc (newSrc) {\n      this.imageLoadedSuccessfully = null;\n      if (!newSrc) return;\n\n      this.validateProps();\n      this.setImageListeners();\n    },\n  },\n\n  mounted () {\n    this.validateProps();\n    this.setImageListeners();\n  },\n\n  methods: {\n    isIconType () {\n      return hasSlotContent(this.$slots.icon);\n    },\n\n    async setImageListeners () {\n      await this.$nextTick();\n      const el = this.$refs.avatarImage;\n      if (!el) return;\n\n      el.addEventListener('load', () => this._loadedImageEventHandler(el), { once: true });\n      el.addEventListener('error', () => this._erroredImageEventHandler(el), { once: true });\n    },\n\n    formatInitials () {\n      const initials = extractInitialsFromName(this.fullName);\n\n      if (this.validatedSize === 'xs') {\n        this.formattedInitials = '';\n      } else if (this.validatedSize === 'sm') {\n        this.formattedInitials = initials[0];\n      } else {\n        this.formattedInitials = initials;\n      }\n    },\n\n    getColor () {\n      return this.color ?? getRandomElement(AVATAR_RANDOM_COLORS, this.seed);\n    },\n\n    _loadedImageEventHandler (el) {\n      this.imageLoadedSuccessfully = true;\n      el.classList.remove('d-d-none');\n    },\n\n    _erroredImageEventHandler (el) {\n      this.imageLoadedSuccessfully = false;\n      el.classList.add('d-d-none');\n    },\n\n    validateProps () {\n      if (this.imageSrc && this.imageAlt === undefined) {\n        console.error('image-alt required if image-src is provided. Can be set to \"\" (empty string) if the image is described in text nearby');\n      }\n    },\n\n    handleClick (e) {\n      if (!this.clickable) return;\n      this.$emit('click', e);\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n//TODO: Move these classes to dialtone and document.\n.d-avatar--image-loaded {\n  background-color: transparent;\n  background-image: unset;\n}\n\n.d-avatar__count {\n  z-index: var(--zi-base);\n}\n\n.d-avatar__presence {\n  z-index: var(--zi-base);\n}\n\n.d-avatar__overlay {\n  background-color: var(--dt-color-surface-contrast-opaque);\n  opacity: var(--dt-opacity-900);\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--dt-size-radius-circle);\n  z-index: var(--zi-base);\n}\n\n.d-avatar__overlay-icon {\n  color: var(--dt-color-foreground-primary-inverted);\n  width: 100%;\n}\n\n.d-avatar__overlay-text {\n  color: var(--dt-color-foreground-primary-inverted);\n  font-weight: var(--dt-font-weight-bold);\n  font-size: var(--dt-font-size-200);\n  width: 100%;\n  text-align: center;\n}\n\n.d-avatar--clickable {\n  --avatar-color-border: transparent;\n\n  cursor: pointer;\n  padding: 0;\n  background-color: transparent;\n\n  border-radius: var(--dt-size-radius-circle);\n  border: var(--dt-size-border-100) solid var(--avatar-color-border);\n\n  &:focus-visible {\n    outline: none;\n    box-shadow: var(--dt-shadow-focus);\n  }\n\n  &:hover {\n    --avatar-color-border: var(--dt-color-border-default);\n  }\n\n  &:active {\n    --avatar-color-border: var(--dt-color-border-moderate);\n\n    transform: scale(0.98);\n  }\n}\n</style>\n"],"names":["DtPresence","getUniqueString","AVATAR_SIZE_MODIFIERS","AVATAR_PRESENCE_STATES","AVATAR_GROUP_VALIDATOR","ICON_SIZE_MODIFIERS","AVATAR_KIND_MODIFIERS","AVATAR_PRESENCE_SIZE_MODIFIERS","AVATAR_ICON_SIZES","hasSlotContent","extractInitialsFromName","getRandomElement","AVATAR_RANDOM_COLORS","_createBlock","_resolveDynamicComponent","_normalizeClass","_withCtx","_createElementVNode","_createElementBlock","_renderSlot","_toDisplayString","_createCommentVNode","_openBlock","_mergeProps"],"mappings":"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"}