@dialpad/dialtone 9.130.0 → 9.131.1

package/dist/vue2/lib/callbox/callbox-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"callbox-constants.cjs","sources":["../../../recipes/leftbar/callbox/callbox_constants.js"],"sourcesContent":["export const CALLBOX_BADGE_COLORS = {\n  warning: 'd-recipe-callbox-badge--warning',\n};\n\nexport const CALLBOX_BORDER_COLORS = {\n  default: 'd-recipe-callbox__border-default',\n  ai: 'd-recipe-callbox__border-ai',\n  critical: 'd-recipe-callbox__border-critical',\n};\n\nexport default {\n  CALLBOX_BADGE_COLORS,\n  CALLBOX_BORDER_COLORS,\n};\n"],"names":["CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","callbox_constants"],"mappings":"4GAAY,MAACA,EAAuB,CAClC,QAAS,iCACX,EAEaC,EAAwB,CACnC,QAAS,mCACT,GAAI,8BACJ,SAAU,mCACZ,EAEeC,EAAA,CACb,qBAAAF,EACA,sBAAAC,CACF"}
+{"version":3,"file":"callbox-constants.cjs","sources":["../../../recipes/leftbar/callbox/callbox_constants.js"],"sourcesContent":["export const CALLBOX_BADGE_COLORS = {\n  warning: 'd-recipe-callbox-badge--warning',\n};\n\nexport const CALLBOX_BORDER_COLORS = {\n  default: 'd-recipe-callbox__border-default',\n  ai: 'd-recipe-callbox__border-ai',\n  critical: 'd-recipe-callbox__border-critical',\n};\n\nexport default {\n  CALLBOX_BADGE_COLORS,\n  CALLBOX_BORDER_COLORS,\n};\n"],"names":["CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","callbox_constants"],"mappings":"4GAAY,MAACA,EAAuB,CAClC,QAAS,iCACX,EAEaC,EAAwB,CACnC,QAAS,mCACT,GAAI,8BACJ,SAAU,mCACZ,EAEAC,EAAe,CACb,qBAAAF,EACA,sBAAAC,CACF"}

package/dist/vue2/lib/callbox/callbox-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"callbox-constants.js","sources":["../../../recipes/leftbar/callbox/callbox_constants.js"],"sourcesContent":["export const CALLBOX_BADGE_COLORS = {\n  warning: 'd-recipe-callbox-badge--warning',\n};\n\nexport const CALLBOX_BORDER_COLORS = {\n  default: 'd-recipe-callbox__border-default',\n  ai: 'd-recipe-callbox__border-ai',\n  critical: 'd-recipe-callbox__border-critical',\n};\n\nexport default {\n  CALLBOX_BADGE_COLORS,\n  CALLBOX_BORDER_COLORS,\n};\n"],"names":["CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","callbox_constants"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,SAAS;AACX,GAEaC,IAAwB;AAAA,EACnC,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,UAAU;AACZ,GAEeC,IAAA;AAAA,EACb,sBAAAF;AAAA,EACA,uBAAAC;AACF;"}
+{"version":3,"file":"callbox-constants.js","sources":["../../../recipes/leftbar/callbox/callbox_constants.js"],"sourcesContent":["export const CALLBOX_BADGE_COLORS = {\n  warning: 'd-recipe-callbox-badge--warning',\n};\n\nexport const CALLBOX_BORDER_COLORS = {\n  default: 'd-recipe-callbox__border-default',\n  ai: 'd-recipe-callbox__border-ai',\n  critical: 'd-recipe-callbox__border-critical',\n};\n\nexport default {\n  CALLBOX_BADGE_COLORS,\n  CALLBOX_BORDER_COLORS,\n};\n"],"names":["CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","callbox_constants"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,SAAS;AACX,GAEaC,IAAwB;AAAA,EACnC,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,UAAU;AACZ,GAEAC,IAAe;AAAA,EACb,sBAAAF;AAAA,EACA,uBAAAC;AACF;"}

package/dist/vue2/lib/callbox/callbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"callbox.cjs","sources":["../../../recipes/leftbar/callbox/callbox.vue"],"sourcesContent":["<template>\n  <div\n    data-qa=\"dt-recipe-callbox\"\n    class=\"d-recipe-callbox\"\n  >\n    <div\n      v-if=\"$slots.video\"\n      data-qa=\"dt-recipe-callbox__video-wrapper\"\n      class=\"d-recipe-callbox__video\"\n    >\n      <!-- @slot Slot for video stream -->\n      <slot name=\"video\" />\n    </div>\n    <div\n      data-qa=\"dt-recipe-callbox__main-content\"\n      :class=\"['d-recipe-callbox__main-content', borderClass, { 'd-recipe-callbox--clickable': clickable }]\"\n    >\n      <div\n        class=\"d-recipe-callbox__main-content-top\"\n      >\n        <dt-avatar\n          v-if=\"shouldShowAvatar\"\n          avatar-class=\"d-recipe-callbox__avatar\"\n          :image-src=\"avatarSrc\"\n          image-alt=\"\"\n          :full-name=\"avatarFullName\"\n          :seed=\"avatarSeed\"\n          :clickable=\"clickable\"\n          size=\"sm\"\n          @click=\"handleClick\"\n        >\n          <template\n            v-if=\"isOnHold\"\n            #overlayIcon\n          >\n            <dt-icon-pause />\n          </template>\n        </dt-avatar>\n        <div class=\"d-recipe-callbox__content\">\n          <component\n            :is=\"clickable ? 'button' : 'span'\"\n            v-dt-tooltip=\"title\"\n            data-qa=\"dt-recipe-callbox__title\"\n            class=\"d-recipe-callbox__content-title\"\n            tabindex=\"0\"\n            @click=\"handleClick\"\n          >\n            {{ title }}\n          </component>\n          <div\n            v-if=\"$slots.badge || badgeText\"\n            data-qa=\"dt-recipe-callbox__badge-wrapper\"\n            class=\"d-recipe-callbox__content-badge\"\n          >\n            <!-- @slot Slot for call center badge -->\n            <slot name=\"badge\">\n              <dt-badge\n                :class=\"badgeClass\"\n                :text=\"badgeText\"\n              />\n            </slot>\n          </div>\n          <div\n            v-if=\"$slots.subtitle\"\n            data-qa=\"dt-recipe-callbox__subtitle-wrapper\"\n            class=\"d-recipe-callbox__content-subtitle\"\n          >\n            <!-- @slot Slot for subtitle -->\n            <slot name=\"subtitle\" />\n          </div>\n        </div>\n        <div\n          v-if=\"$slots.right\"\n          data-qa=\"dt-recipe-callbox__right-wrapper\"\n          class=\"d-recipe-callbox__right\"\n        >\n          <!-- @slot Slot for right icons -->\n          <slot name=\"right\" />\n        </div>\n      </div>\n      <div\n        v-if=\"$slots.bottom\"\n        data-qa=\"dt-recipe-callbox__bottom-wrapper\"\n        class=\"d-recipe-callbox__main-content-bottom\"\n      >\n        <slot name=\"bottom\" />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { CALLBOX_BADGE_COLORS, CALLBOX_BORDER_COLORS } from './callbox_constants';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport DtBadge from '@/components/badge/badge.vue';\nimport { DtIconPause } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeCallbox',\n\n  components: { DtBadge, DtAvatar, DtIconPause },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Text for the badge element\n     */\n    badgeText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Color for the badge element\n     * @values null, warning\n     */\n    badgeColor: {\n      type: String,\n      default: null,\n      validator: (color) => color === null || Object.keys(CALLBOX_BADGE_COLORS).includes(color),\n    },\n\n    /**\n     * Optional avatar image url.\n     * If not provided it will use the initial of the name.\n     */\n    avatarSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Avatar's full name, used to extract initials\n     * to display if `avatarSrc` is empty.\n     */\n    avatarFullName: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n     */\n    avatarSeed: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Callbox title\n     */\n    title: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(CALLBOX_BORDER_COLORS).includes(color),\n    },\n\n    /**\n     * Makes the callbox avatar and title clickable,\n     * emits a click event when clicked.\n     */\n    clickable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Controls the avatars overlay icon\n     */\n    isOnHold: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    /**\n     * Callbox click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  computed: {\n    shouldShowAvatar () {\n      return this.avatarFullName || this.avatarSrc;\n    },\n\n    badgeClass () {\n      return CALLBOX_BADGE_COLORS[this.badgeColor];\n    },\n\n    borderClass () {\n      return CALLBOX_BORDER_COLORS[this.borderColor];\n    },\n  },\n\n  methods: {\n    handleClick (e) {\n      if (!this.clickable) return;\n      this.$emit('click', e);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtBadge","DtAvatar","DtIconPause","color","CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","e"],"mappings":"2TAiGAA,EAAA,CACA,KAAA,kBAEA,WAAA,CAAAC,QAAAA,EAAAA,iBAAAC,EAAA,QAAA,YAAAC,aAAA,EAEA,aAAA,GAEA,MAAA,CAIA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAAA,IAAA,MAAA,OAAA,KAAAC,EAAA,oBAAA,EAAA,SAAAD,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,eAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,MAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,YAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAA,GAAA,OAAA,KAAAE,uBAAA,EAAA,SAAAF,CAAA,CACA,EAMA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,OACA,EAEA,SAAA,CACA,kBAAA,CACA,OAAA,KAAA,gBAAA,KAAA,SACA,EAEA,YAAA,CACA,OAAAC,EAAA,qBAAA,KAAA,UAAA,CACA,EAEA,aAAA,CACA,OAAAC,EAAA,sBAAA,KAAA,WAAA,CACA,CACA,EAEA,QAAA,CACA,YAAAC,EAAA,CACA,KAAA,WACA,KAAA,MAAA,QAAAA,CAAA,CACA,CACA,CACA"}
+{"version":3,"file":"callbox.cjs","sources":["../../../recipes/leftbar/callbox/callbox.vue"],"sourcesContent":["<template>\n  <div\n    data-qa=\"dt-recipe-callbox\"\n    class=\"d-recipe-callbox\"\n  >\n    <div\n      v-if=\"$slots.video\"\n      data-qa=\"dt-recipe-callbox__video-wrapper\"\n      class=\"d-recipe-callbox__video\"\n    >\n      <!-- @slot Slot for video stream -->\n      <slot name=\"video\" />\n    </div>\n    <div\n      data-qa=\"dt-recipe-callbox__main-content\"\n      :class=\"['d-recipe-callbox__main-content', borderClass, { 'd-recipe-callbox--clickable': clickable }]\"\n    >\n      <div\n        class=\"d-recipe-callbox__main-content-top\"\n      >\n        <dt-avatar\n          v-if=\"shouldShowAvatar\"\n          avatar-class=\"d-recipe-callbox__avatar\"\n          :image-src=\"avatarSrc\"\n          image-alt=\"\"\n          :full-name=\"avatarFullName\"\n          :seed=\"avatarSeed\"\n          :clickable=\"clickable\"\n          size=\"sm\"\n          @click=\"handleClick\"\n        >\n          <template\n            v-if=\"isOnHold\"\n            #overlayIcon\n          >\n            <dt-icon-pause />\n          </template>\n        </dt-avatar>\n        <div class=\"d-recipe-callbox__content\">\n          <component\n            :is=\"clickable ? 'button' : 'span'\"\n            v-dt-tooltip=\"title\"\n            data-qa=\"dt-recipe-callbox__title\"\n            class=\"d-recipe-callbox__content-title\"\n            tabindex=\"0\"\n            @click=\"handleClick\"\n          >\n            {{ title }}\n          </component>\n          <div\n            v-if=\"$slots.badge || badgeText\"\n            data-qa=\"dt-recipe-callbox__badge-wrapper\"\n            class=\"d-recipe-callbox__content-badge\"\n          >\n            <!-- @slot Slot for call center badge -->\n            <slot name=\"badge\">\n              <dt-badge\n                :class=\"badgeClass\"\n                :text=\"badgeText\"\n              />\n            </slot>\n          </div>\n          <div\n            v-if=\"$slots.subtitle\"\n            data-qa=\"dt-recipe-callbox__subtitle-wrapper\"\n            class=\"d-recipe-callbox__content-subtitle\"\n          >\n            <!-- @slot Slot for subtitle -->\n            <slot name=\"subtitle\" />\n          </div>\n        </div>\n        <div\n          v-if=\"$slots.right\"\n          data-qa=\"dt-recipe-callbox__right-wrapper\"\n          class=\"d-recipe-callbox__right\"\n        >\n          <!-- @slot Slot for right icons -->\n          <slot name=\"right\" />\n        </div>\n      </div>\n      <div\n        v-if=\"$slots.bottom\"\n        data-qa=\"dt-recipe-callbox__bottom-wrapper\"\n        class=\"d-recipe-callbox__main-content-bottom\"\n      >\n        <slot name=\"bottom\" />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { CALLBOX_BADGE_COLORS, CALLBOX_BORDER_COLORS } from './callbox_constants';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport DtBadge from '@/components/badge/badge.vue';\nimport { DtIconPause } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeCallbox',\n\n  components: { DtBadge, DtAvatar, DtIconPause },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Text for the badge element\n     */\n    badgeText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Color for the badge element\n     * @values null, warning\n     */\n    badgeColor: {\n      type: String,\n      default: null,\n      validator: (color) => color === null || Object.keys(CALLBOX_BADGE_COLORS).includes(color),\n    },\n\n    /**\n     * Optional avatar image url.\n     * If not provided it will use the initial of the name.\n     */\n    avatarSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Avatar's full name, used to extract initials\n     * to display if `avatarSrc` is empty.\n     */\n    avatarFullName: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n     */\n    avatarSeed: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Callbox title\n     */\n    title: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(CALLBOX_BORDER_COLORS).includes(color),\n    },\n\n    /**\n     * Makes the callbox avatar and title clickable,\n     * emits a click event when clicked.\n     */\n    clickable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Controls the avatars overlay icon\n     */\n    isOnHold: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    /**\n     * Callbox click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  computed: {\n    shouldShowAvatar () {\n      return this.avatarFullName || this.avatarSrc;\n    },\n\n    badgeClass () {\n      return CALLBOX_BADGE_COLORS[this.badgeColor];\n    },\n\n    borderClass () {\n      return CALLBOX_BORDER_COLORS[this.borderColor];\n    },\n  },\n\n  methods: {\n    handleClick (e) {\n      if (!this.clickable) return;\n      this.$emit('click', e);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtBadge","DtAvatar","DtIconPause","color","CALLBOX_BADGE_COLORS","CALLBOX_BORDER_COLORS","e"],"mappings":"2TAiGAA,EAAA,CACA,KAAA,kBAEA,WAAA,CAAA,QAAAC,EAAAA,iBAAAC,EAAAA,QAAA,YAAAC,aAAA,EAEA,aAAA,GAEA,MAAA,CAIA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAAA,IAAA,MAAA,OAAA,KAAAC,EAAAA,oBAAA,EAAA,SAAAD,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,eAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,MAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,YAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAA,GAAA,OAAA,KAAAE,uBAAA,EAAA,SAAAF,CAAA,CACA,EAMA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,OACA,EAEA,SAAA,CACA,kBAAA,CACA,OAAA,KAAA,gBAAA,KAAA,SACA,EAEA,YAAA,CACA,OAAAC,EAAAA,qBAAA,KAAA,UAAA,CACA,EAEA,aAAA,CACA,OAAAC,EAAAA,sBAAA,KAAA,WAAA,CACA,CACA,EAEA,QAAA,CACA,YAAAC,EAAA,CACA,KAAA,WACA,KAAA,MAAA,QAAAA,CAAA,CACA,CACA,CACA"}

package/dist/vue2/lib/callbox/callbox.js

@@ -1,4 +1,4 @@
-import { CALLBOX_BADGE_COLORS as l, CALLBOX_BORDER_COLORS as r } from "./callbox-constants.js";
+import { CALLBOX_BORDER_COLORS as l, CALLBOX_BADGE_COLORS as r } from "./callbox-constants.js";
 import i from "../avatar/avatar.js";
 import c from "../badge/badge.js";
 import { DtIconPause as o } from "@dialpad/dialtone-icons/vue2";
@@ -22,7 +22,7 @@ const d = {
     badgeColor: {
       type: String,
       default: null,
-      validator: (e) => e === null || Object.keys(l).includes(e)
+      validator: (e) => e === null || Object.keys(r).includes(e)
     },
     /**
      * Optional avatar image url.
@@ -61,7 +61,7 @@ const d = {
     borderColor: {
       type: String,
       default: "default",
-      validator: (e) => Object.keys(r).includes(e)
+      validator: (e) => Object.keys(l).includes(e)
     },
     /**
      * Makes the callbox avatar and title clickable,
@@ -93,10 +93,10 @@ const d = {
       return this.avatarFullName || this.avatarSrc;
     },
     badgeClass() {
-      return l[this.badgeColor];
+      return r[this.badgeColor];
     },
     borderClass() {
-      return r[this.borderColor];
+      return l[this.borderColor];
     }
   },
   methods: {

package/dist/vue2/lib/checkbox/checkbox-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-constants.cjs","sources":["../../../components/checkbox/checkbox_constants.js"],"sourcesContent":["export const CHECKBOX_INPUT_VALIDATION_CLASSES = {\n  error: 'd-checkbox--error',\n  warning: 'd-checkbox--warning',\n  success: 'd-checkbox--success',\n};\n\nexport default {\n  CHECKBOX_INPUT_VALIDATION_CLASSES,\n};\n"],"names":["CHECKBOX_INPUT_VALIDATION_CLASSES","checkbox_constants"],"mappings":"4GAAY,MAACA,EAAoC,CAC/C,MAAO,oBACP,QAAS,sBACT,QAAS,qBACX,EAEeC,EAAA,CACb,kCAAAD,CACF"}
+{"version":3,"file":"checkbox-constants.cjs","sources":["../../../components/checkbox/checkbox_constants.js"],"sourcesContent":["export const CHECKBOX_INPUT_VALIDATION_CLASSES = {\n  error: 'd-checkbox--error',\n  warning: 'd-checkbox--warning',\n  success: 'd-checkbox--success',\n};\n\nexport default {\n  CHECKBOX_INPUT_VALIDATION_CLASSES,\n};\n"],"names":["CHECKBOX_INPUT_VALIDATION_CLASSES","checkbox_constants"],"mappings":"4GAAY,MAACA,EAAoC,CAC/C,MAAO,oBACP,QAAS,sBACT,QAAS,qBACX,EAEAC,EAAe,CACb,kCAAAD,CACF"}

package/dist/vue2/lib/checkbox/checkbox-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-constants.js","sources":["../../../components/checkbox/checkbox_constants.js"],"sourcesContent":["export const CHECKBOX_INPUT_VALIDATION_CLASSES = {\n  error: 'd-checkbox--error',\n  warning: 'd-checkbox--warning',\n  success: 'd-checkbox--success',\n};\n\nexport default {\n  CHECKBOX_INPUT_VALIDATION_CLASSES,\n};\n"],"names":["CHECKBOX_INPUT_VALIDATION_CLASSES","checkbox_constants"],"mappings":"AAAY,MAACA,IAAoC;AAAA,EAC/C,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,GAEeC,IAAA;AAAA,EACb,mCAAAD;AACF;"}
+{"version":3,"file":"checkbox-constants.js","sources":["../../../components/checkbox/checkbox_constants.js"],"sourcesContent":["export const CHECKBOX_INPUT_VALIDATION_CLASSES = {\n  error: 'd-checkbox--error',\n  warning: 'd-checkbox--warning',\n  success: 'd-checkbox--success',\n};\n\nexport default {\n  CHECKBOX_INPUT_VALIDATION_CLASSES,\n};\n"],"names":["CHECKBOX_INPUT_VALIDATION_CLASSES","checkbox_constants"],"mappings":"AAAY,MAACA,IAAoC;AAAA,EAC/C,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,GAEAC,IAAe;AAAA,EACb,mCAAAD;AACF;"}

package/dist/vue2/lib/checkbox/checkbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.cjs","sources":["../../../components/checkbox/checkbox.vue"],"sourcesContent":["<template>\n  <div>\n    <label :class=\"['d-checkbox-group', { 'd-checkbox-group--disabled': internalDisabled }]\">\n      <div class=\"d-checkbox__input\">\n        <input\n          type=\"checkbox\"\n          :checked=\"internalChecked\"\n          :name=\"internalName\"\n          :value=\"value\"\n          :disabled=\"internalDisabled\"\n          :class=\"['d-checkbox', inputValidationClass, inputClass]\"\n          v-bind=\"$attrs\"\n          :indeterminate.prop=\"internalIndeterminate\"\n          v-on=\"inputListeners\"\n        >\n      </div>\n      <div\n        v-if=\"hasLabel\"\n        :class=\"[labelClass, 'd-checkbox__copy d-checkbox__label']\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"checkbox-label\"\n      >\n        <!-- @slot slot for Checkbox Label -->\n        <slot>{{ label }}</slot>\n      </div>\n    </label>\n    <div\n      v-if=\"$slots.description || description || hasMessages\"\n      class=\"d-checkbox__messages\"\n      data-qa=\"checkbox-description-messages\"\n    >\n      <div\n        v-if=\"$slots.description || description\"\n        :class=\"['d-description', descriptionClass]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"checkbox-description\"\n      >\n        <!-- @slot slot for Checkbox Description -->\n        <slot name=\"description\">\n          {{ description }}\n        </slot>\n      </div>\n      <dt-validation-messages\n        :validation-messages=\"formattedMessages\"\n        :show-messages=\"showMessages\"\n        :class=\"messagesClass\"\n        v-bind=\"messagesChildProps\"\n        data-qa=\"dt-checkbox-validation-messages\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\n// Imports\nimport {\n  InputMixin,\n  CheckableMixin,\n  GroupableMixin,\n  MessagesMixin,\n} from '@/common/mixins/input';\nimport { CHECKBOX_INPUT_VALIDATION_CLASSES } from './checkbox_constants';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * Checkboxes are control elements that allow the user to make a selection.They are typically used in a\n * Checkbox Group which allows the user to make one or more selections from a list of options.\n * @see https://dialtone.dialpad.com/components/checkbox.html\n */\nexport default {\n  name: 'DtCheckbox',\n\n  components: { DtValidationMessages },\n\n  mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n  inheritAttrs: false,\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Boolean}\n     */\n    'input',\n\n    /**\n     * Native input focusin event\n     *\n     * @event focusin\n     * @type {FocusEvent}\n     */\n    'focusin',\n\n    /**\n     * Native input focusout event\n     *\n     * @event focusout\n     * @type {FocusEvent}\n     */\n    'focusout',\n  ],\n\n  computed: {\n    inputValidationClass () {\n      return CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n    },\n\n    checkboxGroupValueChecked () {\n      return this.groupContext?.selectedValues?.includes(this.value) ?? false;\n    },\n\n    hasLabel () {\n      return !!(this.$slots.default || this.label);\n    },\n\n    hasMessages () {\n      return this.formattedMessages.length && this.showMessages;\n    },\n\n    inputListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through\n         * onto the input element which will result in the handler being called twice\n         * (once on the input element and once by the emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target),\n      };\n    },\n  },\n\n  watch: {\n    checkboxGroupValueChecked: {\n      immediate: true,\n      handler (newCheckboxGroupValueChecked) {\n        if (this.hasGroup) {\n          // update internal value when the checkbox group value changes\n          this.internalChecked = newCheckboxGroupValueChecked;\n        }\n      },\n    },\n  },\n\n  mounted () {\n    this.runValidations();\n  },\n\n  methods: {\n    emitValue (target) {\n      let { value, checked } = target;\n      // Expected: Indeterminate -> unchecked. We need to manually set DOM property `checked` to false\n      // and update this.internalIndeterminate.\n      if (this.internalIndeterminate) {\n        checked = false;\n        this.internalIndeterminate = false;\n        target.checked = false;\n      }\n      // update provided value if injected\n      this.setGroupValue(value, checked);\n\n      // emit the state of the checkbox\n      this.$emit('input', checked);\n    },\n\n    runValidations () {\n      this.validateInputLabels(this.hasLabel, this.$attrs['aria-label']);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","InputMixin","CheckableMixin","GroupableMixin","MessagesMixin","CHECKBOX_INPUT_VALIDATION_CLASSES","_b","_a","event","newCheckboxGroupValueChecked","target","value","checked"],"mappings":"uTAqEAA,EAAA,CACA,KAAA,aAEA,WAAA,CAAAC,qBAAAA,EAAAA,OAAA,EAEA,OAAA,CAAAC,EAAA,WAAAC,iBAAAC,EAAAA,eAAAC,EAAAA,aAAA,EAEA,aAAA,GAEA,MAAA,CAOA,QAQA,UAQA,UACA,EAEA,SAAA,CACA,sBAAA,CACA,OAAAC,EAAA,kCAAA,KAAA,uBAAA,CACA,EAEA,2BAAA,SACA,QAAAC,GAAAC,EAAA,KAAA,eAAA,YAAAA,EAAA,iBAAA,YAAAD,EAAA,SAAA,KAAA,SAAA,EACA,EAEA,UAAA,CACA,MAAA,CAAA,EAAA,KAAA,OAAA,SAAA,KAAA,MACA,EAEA,aAAA,CACA,OAAA,KAAA,kBAAA,QAAA,KAAA,YACA,EAEA,gBAAA,CACA,MAAA,CAKA,GAAA,KAAA,WAMA,MAAA,IAAA,CAAA,EACA,OAAAE,GAAA,KAAA,UAAAA,EAAA,MAAA,CACA,CACA,CACA,EAEA,MAAA,CACA,0BAAA,CACA,UAAA,GACA,QAAAC,EAAA,CACA,KAAA,WAEA,KAAA,gBAAAA,EAEA,CACA,CACA,EAEA,SAAA,CACA,KAAA,eAAA,CACA,EAEA,QAAA,CACA,UAAAC,EAAA,CACA,GAAA,CAAA,MAAAC,EAAA,QAAAC,CAAA,EAAAF,EAGA,KAAA,wBACAE,EAAA,GACA,KAAA,sBAAA,GACAF,EAAA,QAAA,IAGA,KAAA,cAAAC,EAAAC,CAAA,EAGA,KAAA,MAAA,QAAAA,CAAA,CACA,EAEA,gBAAA,CACA,KAAA,oBAAA,KAAA,SAAA,KAAA,OAAA,YAAA,CAAA,CACA,CACA,CACA"}
+{"version":3,"file":"checkbox.cjs","sources":["../../../components/checkbox/checkbox.vue"],"sourcesContent":["<template>\n  <div>\n    <label :class=\"['d-checkbox-group', { 'd-checkbox-group--disabled': internalDisabled }]\">\n      <div class=\"d-checkbox__input\">\n        <input\n          type=\"checkbox\"\n          :checked=\"internalChecked\"\n          :name=\"internalName\"\n          :value=\"value\"\n          :disabled=\"internalDisabled\"\n          :class=\"['d-checkbox', inputValidationClass, inputClass]\"\n          v-bind=\"$attrs\"\n          :indeterminate.prop=\"internalIndeterminate\"\n          v-on=\"inputListeners\"\n        >\n      </div>\n      <div\n        v-if=\"hasLabel\"\n        :class=\"[labelClass, 'd-checkbox__copy d-checkbox__label']\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"checkbox-label\"\n      >\n        <!-- @slot slot for Checkbox Label -->\n        <slot>{{ label }}</slot>\n      </div>\n    </label>\n    <div\n      v-if=\"$slots.description || description || hasMessages\"\n      class=\"d-checkbox__messages\"\n      data-qa=\"checkbox-description-messages\"\n    >\n      <div\n        v-if=\"$slots.description || description\"\n        :class=\"['d-description', descriptionClass]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"checkbox-description\"\n      >\n        <!-- @slot slot for Checkbox Description -->\n        <slot name=\"description\">\n          {{ description }}\n        </slot>\n      </div>\n      <dt-validation-messages\n        :validation-messages=\"formattedMessages\"\n        :show-messages=\"showMessages\"\n        :class=\"messagesClass\"\n        v-bind=\"messagesChildProps\"\n        data-qa=\"dt-checkbox-validation-messages\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\n// Imports\nimport {\n  InputMixin,\n  CheckableMixin,\n  GroupableMixin,\n  MessagesMixin,\n} from '@/common/mixins/input';\nimport { CHECKBOX_INPUT_VALIDATION_CLASSES } from './checkbox_constants';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * Checkboxes are control elements that allow the user to make a selection.They are typically used in a\n * Checkbox Group which allows the user to make one or more selections from a list of options.\n * @see https://dialtone.dialpad.com/components/checkbox.html\n */\nexport default {\n  name: 'DtCheckbox',\n\n  components: { DtValidationMessages },\n\n  mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n  inheritAttrs: false,\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Boolean}\n     */\n    'input',\n\n    /**\n     * Native input focusin event\n     *\n     * @event focusin\n     * @type {FocusEvent}\n     */\n    'focusin',\n\n    /**\n     * Native input focusout event\n     *\n     * @event focusout\n     * @type {FocusEvent}\n     */\n    'focusout',\n  ],\n\n  computed: {\n    inputValidationClass () {\n      return CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n    },\n\n    checkboxGroupValueChecked () {\n      return this.groupContext?.selectedValues?.includes(this.value) ?? false;\n    },\n\n    hasLabel () {\n      return !!(this.$slots.default || this.label);\n    },\n\n    hasMessages () {\n      return this.formattedMessages.length && this.showMessages;\n    },\n\n    inputListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through\n         * onto the input element which will result in the handler being called twice\n         * (once on the input element and once by the emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target),\n      };\n    },\n  },\n\n  watch: {\n    checkboxGroupValueChecked: {\n      immediate: true,\n      handler (newCheckboxGroupValueChecked) {\n        if (this.hasGroup) {\n          // update internal value when the checkbox group value changes\n          this.internalChecked = newCheckboxGroupValueChecked;\n        }\n      },\n    },\n  },\n\n  mounted () {\n    this.runValidations();\n  },\n\n  methods: {\n    emitValue (target) {\n      let { value, checked } = target;\n      // Expected: Indeterminate -> unchecked. We need to manually set DOM property `checked` to false\n      // and update this.internalIndeterminate.\n      if (this.internalIndeterminate) {\n        checked = false;\n        this.internalIndeterminate = false;\n        target.checked = false;\n      }\n      // update provided value if injected\n      this.setGroupValue(value, checked);\n\n      // emit the state of the checkbox\n      this.$emit('input', checked);\n    },\n\n    runValidations () {\n      this.validateInputLabels(this.hasLabel, this.$attrs['aria-label']);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","InputMixin","CheckableMixin","GroupableMixin","MessagesMixin","CHECKBOX_INPUT_VALIDATION_CLASSES","_b","_a","event","newCheckboxGroupValueChecked","target","value","checked"],"mappings":"uTAqEAA,EAAA,CACA,KAAA,aAEA,WAAA,CAAA,qBAAAC,EAAAA,OAAA,EAEA,OAAA,CAAAC,EAAAA,WAAAC,iBAAAC,EAAAA,eAAAC,EAAAA,aAAA,EAEA,aAAA,GAEA,MAAA,CAOA,QAQA,UAQA,UACA,EAEA,SAAA,CACA,sBAAA,CACA,OAAAC,EAAAA,kCAAA,KAAA,uBAAA,CACA,EAEA,2BAAA,SACA,QAAAC,GAAAC,EAAA,KAAA,eAAA,YAAAA,EAAA,iBAAA,YAAAD,EAAA,SAAA,KAAA,SAAA,EACA,EAEA,UAAA,CACA,MAAA,CAAA,EAAA,KAAA,OAAA,SAAA,KAAA,MACA,EAEA,aAAA,CACA,OAAA,KAAA,kBAAA,QAAA,KAAA,YACA,EAEA,gBAAA,CACA,MAAA,CAKA,GAAA,KAAA,WAMA,MAAA,IAAA,CAAA,EACA,OAAAE,GAAA,KAAA,UAAAA,EAAA,MAAA,CACA,CACA,CACA,EAEA,MAAA,CACA,0BAAA,CACA,UAAA,GACA,QAAAC,EAAA,CACA,KAAA,WAEA,KAAA,gBAAAA,EAEA,CACA,CACA,EAEA,SAAA,CACA,KAAA,eAAA,CACA,EAEA,QAAA,CACA,UAAAC,EAAA,CACA,GAAA,CAAA,MAAAC,EAAA,QAAAC,CAAA,EAAAF,EAGA,KAAA,wBACAE,EAAA,GACA,KAAA,sBAAA,GACAF,EAAA,QAAA,IAGA,KAAA,cAAAC,EAAAC,CAAA,EAGA,KAAA,MAAA,QAAAA,CAAA,CACA,EAEA,gBAAA,CACA,KAAA,oBAAA,KAAA,SAAA,KAAA,OAAA,YAAA,CAAA,CACA,CACA,CACA"}

package/dist/vue2/lib/checkbox-group/checkbox-group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-group.cjs","sources":["../../../components/checkbox_group/checkbox_group.vue"],"sourcesContent":["<script>\nimport Vue from 'vue';\nimport { DtInputGroup } from '../input_group';\n\n/**\n * Checkbox Groups are convenience components for a grouping of related Checkboxes.\n * While each Checkbox within the group is independent, the `v-model` on the group provides\n * a convenient interface for determining which Checkboxes within the group are checked.\n * @see https://dialtone.dialpad.com/components/checkbox_group.html\n */\nexport default {\n  name: 'DtCheckboxGroup',\n\n  extends: DtInputGroup,\n\n  model: {\n    prop: 'selectedValues',\n  },\n\n  props: {\n    /**\n     * Not supported by this component, please use selectedValues\n     */\n    value: {\n      type: [],\n      default: null,\n      validator: value => {\n        if (!value) {\n          return true;\n        }\n\n        Vue.util.warn(\n          'Component uses selectedValues to initialize the model, value is not supported by this component',\n          this,\n        );\n\n        return false;\n      },\n    },\n\n    /**\n     * A provided list of selected values(s) for the checkbox group\n     * @model selectedValues\n     */\n    selectedValues: {\n      type: Array,\n      default () {\n        return [];\n      },\n    },\n\n    /**\n     * A data qa tag for the radio group\n     */\n    dataQaGroup: {\n      type: String,\n      default: 'checkbox-group',\n    },\n\n    /**\n     * A data qa tag for the radio group legend\n     */\n    dataQaGroupLegend: {\n      type: String,\n      default: 'checkbox-group-legend',\n    },\n\n    /**\n     * A data qa tag for the radio group messages\n     */\n    dataQaGroupMessages: {\n      type: String,\n      default: 'checkbox-group-messages',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Array}\n     */\n    'input',\n  ],\n\n  data () {\n    return {\n      internalValue: this.selectedValues,\n      // wrap values in object to make reactive\n      provideObj: {\n        selectedValues: this.selectedValues,\n      },\n    };\n  },\n\n  watch: {\n    selectedValues (newSelectedValues) {\n      this.internalValue = newSelectedValues;\n    },\n\n    /*\n     * watching value to support 2 way binding for slotted checkboxes.\n     * need this to pass value to slotted checkboxes if modified outside\n     * checkbox group.\n     */\n    internalValue (newInternalValue) {\n      this.provideObj.selectedValues = newInternalValue;\n    },\n  },\n\n  methods: {\n    /*\n     * provided value to support 2 way binding for slotted checkboxes.\n     * slotted checkbox will change this value and need to emit new value up.\n     */\n    setGroupValue (value, checked) {\n      if (!checked) {\n        this.internalValue = this.internalValue.filter(checkedValue => checkedValue !== value);\n      } else if (!this.internalValue.includes(value)) {\n        this.internalValue.push(value);\n      }\n\n      this.$emit('input', this.internalValue);\n    },\n\n    getMessageKey (type, index) {\n      return `checkbox-group-message-${type}-${index}-${this.id}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtInputGroup","value","Vue","this","newSelectedValues","newInternalValue","checked","checkedValue","type","index"],"mappings":"uOAUAA,EAAA,CACA,KAAA,kBAEA,QAAAC,EAAA,QAEA,MAAA,CACA,KAAA,gBACA,EAEA,MAAA,CAIA,MAAA,CACA,KAAA,CAAA,EACA,QAAA,KACA,UAAAC,GACAA,GAIAC,EAAA,KAAA,KACA,kGACAC,MACA,EAEA,IARA,EAUA,EAMA,eAAA,CACA,KAAA,MACA,SAAA,CACA,MAAA,EACA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,gBACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,uBACA,EAKA,oBAAA,CACA,KAAA,OACA,QAAA,yBACA,CACA,EAEA,MAAA,CAOA,OACA,EAEA,MAAA,CACA,MAAA,CACA,cAAA,KAAA,eAEA,WAAA,CACA,eAAA,KAAA,cACA,CACA,CACA,EAEA,MAAA,CACA,eAAAC,EAAA,CACA,KAAA,cAAAA,CACA,EAOA,cAAAC,EAAA,CACA,KAAA,WAAA,eAAAA,CACA,CACA,EAEA,QAAA,CAKA,cAAAJ,EAAAK,EAAA,CACAA,EAEA,KAAA,cAAA,SAAAL,CAAA,GACA,KAAA,cAAA,KAAAA,CAAA,EAFA,KAAA,cAAA,KAAA,cAAA,OAAAM,GAAAA,IAAAN,CAAA,EAKA,KAAA,MAAA,QAAA,KAAA,aAAA,CACA,EAEA,cAAAO,EAAAC,EAAA,CACA,MAAA,0BAAAD,CAAA,IAAAC,CAAA,IAAA,KAAA,EAAA,EACA,CACA,CACA"}
+{"version":3,"file":"checkbox-group.cjs","sources":["../../../components/checkbox_group/checkbox_group.vue"],"sourcesContent":["<script>\nimport Vue from 'vue';\nimport { DtInputGroup } from '../input_group';\n\n/**\n * Checkbox Groups are convenience components for a grouping of related Checkboxes.\n * While each Checkbox within the group is independent, the `v-model` on the group provides\n * a convenient interface for determining which Checkboxes within the group are checked.\n * @see https://dialtone.dialpad.com/components/checkbox_group.html\n */\nexport default {\n  name: 'DtCheckboxGroup',\n\n  extends: DtInputGroup,\n\n  model: {\n    prop: 'selectedValues',\n  },\n\n  props: {\n    /**\n     * Not supported by this component, please use selectedValues\n     */\n    value: {\n      type: [],\n      default: null,\n      validator: value => {\n        if (!value) {\n          return true;\n        }\n\n        Vue.util.warn(\n          'Component uses selectedValues to initialize the model, value is not supported by this component',\n          this,\n        );\n\n        return false;\n      },\n    },\n\n    /**\n     * A provided list of selected values(s) for the checkbox group\n     * @model selectedValues\n     */\n    selectedValues: {\n      type: Array,\n      default () {\n        return [];\n      },\n    },\n\n    /**\n     * A data qa tag for the radio group\n     */\n    dataQaGroup: {\n      type: String,\n      default: 'checkbox-group',\n    },\n\n    /**\n     * A data qa tag for the radio group legend\n     */\n    dataQaGroupLegend: {\n      type: String,\n      default: 'checkbox-group-legend',\n    },\n\n    /**\n     * A data qa tag for the radio group messages\n     */\n    dataQaGroupMessages: {\n      type: String,\n      default: 'checkbox-group-messages',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Array}\n     */\n    'input',\n  ],\n\n  data () {\n    return {\n      internalValue: this.selectedValues,\n      // wrap values in object to make reactive\n      provideObj: {\n        selectedValues: this.selectedValues,\n      },\n    };\n  },\n\n  watch: {\n    selectedValues (newSelectedValues) {\n      this.internalValue = newSelectedValues;\n    },\n\n    /*\n     * watching value to support 2 way binding for slotted checkboxes.\n     * need this to pass value to slotted checkboxes if modified outside\n     * checkbox group.\n     */\n    internalValue (newInternalValue) {\n      this.provideObj.selectedValues = newInternalValue;\n    },\n  },\n\n  methods: {\n    /*\n     * provided value to support 2 way binding for slotted checkboxes.\n     * slotted checkbox will change this value and need to emit new value up.\n     */\n    setGroupValue (value, checked) {\n      if (!checked) {\n        this.internalValue = this.internalValue.filter(checkedValue => checkedValue !== value);\n      } else if (!this.internalValue.includes(value)) {\n        this.internalValue.push(value);\n      }\n\n      this.$emit('input', this.internalValue);\n    },\n\n    getMessageKey (type, index) {\n      return `checkbox-group-message-${type}-${index}-${this.id}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtInputGroup","value","Vue","this","newSelectedValues","newInternalValue","checked","checkedValue","type","index"],"mappings":"uOAUAA,EAAA,CACA,KAAA,kBAEA,QAAAC,EAAAA,QAEA,MAAA,CACA,KAAA,gBACA,EAEA,MAAA,CAIA,MAAA,CACA,KAAA,CAAA,EACA,QAAA,KACA,UAAAC,GACAA,GAIAC,EAAA,KAAA,KACA,kGACAC,MACA,EAEA,IARA,EAUA,EAMA,eAAA,CACA,KAAA,MACA,SAAA,CACA,MAAA,CAAA,CACA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,gBACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,uBACA,EAKA,oBAAA,CACA,KAAA,OACA,QAAA,yBACA,CACA,EAEA,MAAA,CAOA,OACA,EAEA,MAAA,CACA,MAAA,CACA,cAAA,KAAA,eAEA,WAAA,CACA,eAAA,KAAA,cACA,CACA,CACA,EAEA,MAAA,CACA,eAAAC,EAAA,CACA,KAAA,cAAAA,CACA,EAOA,cAAAC,EAAA,CACA,KAAA,WAAA,eAAAA,CACA,CACA,EAEA,QAAA,CAKA,cAAAJ,EAAAK,EAAA,CACAA,EAEA,KAAA,cAAA,SAAAL,CAAA,GACA,KAAA,cAAA,KAAAA,CAAA,EAFA,KAAA,cAAA,KAAA,cAAA,OAAAM,GAAAA,IAAAN,CAAA,EAKA,KAAA,MAAA,QAAA,KAAA,aAAA,CACA,EAEA,cAAAO,EAAAC,EAAA,CACA,MAAA,0BAAAD,CAAA,IAAAC,CAAA,IAAA,KAAA,EAAA,EACA,CACA,CACA"}

package/dist/vue2/lib/checkbox-group/checkbox-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-group.js","sources":["../../../components/checkbox_group/checkbox_group.vue"],"sourcesContent":["<script>\nimport Vue from 'vue';\nimport { DtInputGroup } from '../input_group';\n\n/**\n * Checkbox Groups are convenience components for a grouping of related Checkboxes.\n * While each Checkbox within the group is independent, the `v-model` on the group provides\n * a convenient interface for determining which Checkboxes within the group are checked.\n * @see https://dialtone.dialpad.com/components/checkbox_group.html\n */\nexport default {\n  name: 'DtCheckboxGroup',\n\n  extends: DtInputGroup,\n\n  model: {\n    prop: 'selectedValues',\n  },\n\n  props: {\n    /**\n     * Not supported by this component, please use selectedValues\n     */\n    value: {\n      type: [],\n      default: null,\n      validator: value => {\n        if (!value) {\n          return true;\n        }\n\n        Vue.util.warn(\n          'Component uses selectedValues to initialize the model, value is not supported by this component',\n          this,\n        );\n\n        return false;\n      },\n    },\n\n    /**\n     * A provided list of selected values(s) for the checkbox group\n     * @model selectedValues\n     */\n    selectedValues: {\n      type: Array,\n      default () {\n        return [];\n      },\n    },\n\n    /**\n     * A data qa tag for the radio group\n     */\n    dataQaGroup: {\n      type: String,\n      default: 'checkbox-group',\n    },\n\n    /**\n     * A data qa tag for the radio group legend\n     */\n    dataQaGroupLegend: {\n      type: String,\n      default: 'checkbox-group-legend',\n    },\n\n    /**\n     * A data qa tag for the radio group messages\n     */\n    dataQaGroupMessages: {\n      type: String,\n      default: 'checkbox-group-messages',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Array}\n     */\n    'input',\n  ],\n\n  data () {\n    return {\n      internalValue: this.selectedValues,\n      // wrap values in object to make reactive\n      provideObj: {\n        selectedValues: this.selectedValues,\n      },\n    };\n  },\n\n  watch: {\n    selectedValues (newSelectedValues) {\n      this.internalValue = newSelectedValues;\n    },\n\n    /*\n     * watching value to support 2 way binding for slotted checkboxes.\n     * need this to pass value to slotted checkboxes if modified outside\n     * checkbox group.\n     */\n    internalValue (newInternalValue) {\n      this.provideObj.selectedValues = newInternalValue;\n    },\n  },\n\n  methods: {\n    /*\n     * provided value to support 2 way binding for slotted checkboxes.\n     * slotted checkbox will change this value and need to emit new value up.\n     */\n    setGroupValue (value, checked) {\n      if (!checked) {\n        this.internalValue = this.internalValue.filter(checkedValue => checkedValue !== value);\n      } else if (!this.internalValue.includes(value)) {\n        this.internalValue.push(value);\n      }\n\n      this.$emit('input', this.internalValue);\n    },\n\n    getMessageKey (type, index) {\n      return `checkbox-group-message-${type}-${index}-${this.id}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtInputGroup","value","Vue","this","newSelectedValues","newInternalValue","checked","checkedValue","type","index"],"mappings":";;;AAUA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,SAAAC;AAAA,EAEA,OAAA;AAAA,IACA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,OAAA;AAAA,MACA,MAAA,CAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MACAA,KAIAC,EAAA,KAAA;AAAA,QACA;AAAA,QACAC;AAAAA,MACA,GAEA,MARA;AAAA,IAUA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AACA,eAAA;MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,qBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,eAAA,KAAA;AAAA;AAAA,MAEA,YAAA;AAAA,QACA,gBAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,eAAAC,GAAA;AACA,WAAA,gBAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,cAAAC,GAAA;AACA,WAAA,WAAA,iBAAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAAJ,GAAAK,GAAA;AACA,MAAAA,IAEA,KAAA,cAAA,SAAAL,CAAA,KACA,KAAA,cAAA,KAAAA,CAAA,IAFA,KAAA,gBAAA,KAAA,cAAA,OAAA,CAAAM,MAAAA,MAAAN,CAAA,GAKA,KAAA,MAAA,SAAA,KAAA,aAAA;AAAA,IACA;AAAA,IAEA,cAAAO,GAAAC,GAAA;AACA,aAAA,0BAAAD,CAAA,IAAAC,CAAA,IAAA,KAAA,EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;"}
+{"version":3,"file":"checkbox-group.js","sources":["../../../components/checkbox_group/checkbox_group.vue"],"sourcesContent":["<script>\nimport Vue from 'vue';\nimport { DtInputGroup } from '../input_group';\n\n/**\n * Checkbox Groups are convenience components for a grouping of related Checkboxes.\n * While each Checkbox within the group is independent, the `v-model` on the group provides\n * a convenient interface for determining which Checkboxes within the group are checked.\n * @see https://dialtone.dialpad.com/components/checkbox_group.html\n */\nexport default {\n  name: 'DtCheckboxGroup',\n\n  extends: DtInputGroup,\n\n  model: {\n    prop: 'selectedValues',\n  },\n\n  props: {\n    /**\n     * Not supported by this component, please use selectedValues\n     */\n    value: {\n      type: [],\n      default: null,\n      validator: value => {\n        if (!value) {\n          return true;\n        }\n\n        Vue.util.warn(\n          'Component uses selectedValues to initialize the model, value is not supported by this component',\n          this,\n        );\n\n        return false;\n      },\n    },\n\n    /**\n     * A provided list of selected values(s) for the checkbox group\n     * @model selectedValues\n     */\n    selectedValues: {\n      type: Array,\n      default () {\n        return [];\n      },\n    },\n\n    /**\n     * A data qa tag for the radio group\n     */\n    dataQaGroup: {\n      type: String,\n      default: 'checkbox-group',\n    },\n\n    /**\n     * A data qa tag for the radio group legend\n     */\n    dataQaGroupLegend: {\n      type: String,\n      default: 'checkbox-group-legend',\n    },\n\n    /**\n     * A data qa tag for the radio group messages\n     */\n    dataQaGroupMessages: {\n      type: String,\n      default: 'checkbox-group-messages',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Array}\n     */\n    'input',\n  ],\n\n  data () {\n    return {\n      internalValue: this.selectedValues,\n      // wrap values in object to make reactive\n      provideObj: {\n        selectedValues: this.selectedValues,\n      },\n    };\n  },\n\n  watch: {\n    selectedValues (newSelectedValues) {\n      this.internalValue = newSelectedValues;\n    },\n\n    /*\n     * watching value to support 2 way binding for slotted checkboxes.\n     * need this to pass value to slotted checkboxes if modified outside\n     * checkbox group.\n     */\n    internalValue (newInternalValue) {\n      this.provideObj.selectedValues = newInternalValue;\n    },\n  },\n\n  methods: {\n    /*\n     * provided value to support 2 way binding for slotted checkboxes.\n     * slotted checkbox will change this value and need to emit new value up.\n     */\n    setGroupValue (value, checked) {\n      if (!checked) {\n        this.internalValue = this.internalValue.filter(checkedValue => checkedValue !== value);\n      } else if (!this.internalValue.includes(value)) {\n        this.internalValue.push(value);\n      }\n\n      this.$emit('input', this.internalValue);\n    },\n\n    getMessageKey (type, index) {\n      return `checkbox-group-message-${type}-${index}-${this.id}`;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtInputGroup","value","Vue","this","newSelectedValues","newInternalValue","checked","checkedValue","type","index"],"mappings":";;;AAUA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,SAAAC;AAAA,EAEA,OAAA;AAAA,IACA,MAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,OAAA;AAAA,MACA,MAAA,CAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MACAA,KAIAC,EAAA,KAAA;AAAA,QACA;AAAA,QACAC;AAAAA,MACA,GAEA,MARA;AAAA,IAUA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AACA,eAAA,CAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,qBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,eAAA,KAAA;AAAA;AAAA,MAEA,YAAA;AAAA,QACA,gBAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,eAAAC,GAAA;AACA,WAAA,gBAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA,cAAAC,GAAA;AACA,WAAA,WAAA,iBAAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAAJ,GAAAK,GAAA;AACA,MAAAA,IAEA,KAAA,cAAA,SAAAL,CAAA,KACA,KAAA,cAAA,KAAAA,CAAA,IAFA,KAAA,gBAAA,KAAA,cAAA,OAAA,CAAAM,MAAAA,MAAAN,CAAA,GAKA,KAAA,MAAA,SAAA,KAAA,aAAA;AAAA,IACA;AAAA,IAEA,cAAAO,GAAAC,GAAA;AACA,aAAA,0BAAAD,CAAA,IAAAC,CAAA,IAAA,KAAA,EAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;"}

package/dist/vue2/lib/checkbox-group/checkboxes-decorator.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkboxes-decorator.cjs","sources":["../../../components/checkbox_group/checkboxes_decorator.vue"],"sourcesContent":["<template>\n  <div>\n    <dt-checkbox\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :value=\"option.value\"\n    >\n      <span>{{ option.label }}</span>\n    </dt-checkbox>\n  </div>\n</template>\n\n<script>\nimport { DtCheckbox } from '../checkbox';\n\nexport default {\n  name: 'CheckboxesDecorator',\n  components: { DtCheckbox },\n  created () {\n    this.options = [\n      { label: 'Apple', value: 'apple' },\n      { label: 'Banana', value: 'banana' },\n      { label: 'Other', value: 'other' },\n    ];\n  },\n};\n</script>\n"],"names":["_sfc_main","DtCheckbox"],"mappings":"gNAeAA,EAAA,CACA,KAAA,sBACA,WAAA,CAAAC,WAAAA,EAAAA,OAAA,EACA,SAAA,CACA,KAAA,QAAA,CACA,CAAA,MAAA,QAAA,MAAA,OAAA,EACA,CAAA,MAAA,SAAA,MAAA,QAAA,EACA,CAAA,MAAA,QAAA,MAAA,OAAA,CACA,CACA,CACA"}
+{"version":3,"file":"checkboxes-decorator.cjs","sources":["../../../components/checkbox_group/checkboxes_decorator.vue"],"sourcesContent":["<template>\n  <div>\n    <dt-checkbox\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      :value=\"option.value\"\n    >\n      <span>{{ option.label }}</span>\n    </dt-checkbox>\n  </div>\n</template>\n\n<script>\nimport { DtCheckbox } from '../checkbox';\n\nexport default {\n  name: 'CheckboxesDecorator',\n  components: { DtCheckbox },\n  created () {\n    this.options = [\n      { label: 'Apple', value: 'apple' },\n      { label: 'Banana', value: 'banana' },\n      { label: 'Other', value: 'other' },\n    ];\n  },\n};\n</script>\n"],"names":["_sfc_main","DtCheckbox"],"mappings":"gNAeAA,EAAA,CACA,KAAA,sBACA,WAAA,CAAA,WAAAC,EAAAA,OAAA,EACA,SAAA,CACA,KAAA,QAAA,CACA,CAAA,MAAA,QAAA,MAAA,OAAA,EACA,CAAA,MAAA,SAAA,MAAA,QAAA,EACA,CAAA,MAAA,QAAA,MAAA,OAAA,CACA,CACA,CACA"}

package/dist/vue2/lib/chip/chip-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"chip-constants.cjs","sources":["../../../components/chip/chip_constants.js"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n"],"names":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","chip_constants"],"mappings":"4GAAY,MAACA,EAAsB,CACjC,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAmC,CAC9C,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAkB,CAC7B,GAAI,MACJ,GAAI,MACJ,GAAI,KACN,EAEeC,EAAA,CACb,oBAAAH,EACA,iCAAAC,EACA,gBAAAC,CACF"}
+{"version":3,"file":"chip-constants.cjs","sources":["../../../components/chip/chip_constants.js"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n"],"names":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","chip_constants"],"mappings":"4GAAY,MAACA,EAAsB,CACjC,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAmC,CAC9C,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAkB,CAC7B,GAAI,MACJ,GAAI,MACJ,GAAI,KACN,EAEAC,EAAe,CACb,oBAAAH,EACA,iCAAAC,EACA,gBAAAC,CACF"}

package/dist/vue2/lib/chip/chip-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip-constants.js","sources":["../../../components/chip/chip_constants.js"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n"],"names":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","chip_constants"],"mappings":"AAAY,MAACA,IAAsB;AAAA,EACjC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAmC;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAkB;AAAA,EAC7B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEeC,IAAA;AAAA,EACb,qBAAAH;AAAA,EACA,kCAAAC;AAAA,EACA,iBAAAC;AACF;"}
+{"version":3,"file":"chip-constants.js","sources":["../../../components/chip/chip_constants.js"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n"],"names":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","chip_constants"],"mappings":"AAAY,MAACA,IAAsB;AAAA,EACjC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAmC;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAkB;AAAA,EAC7B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEAC,IAAe;AAAA,EACb,qBAAAH;AAAA,EACA,kCAAAC;AAAA,EACA,iBAAAC;AACF;"}

package/dist/vue2/lib/chip/chip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"chip.cjs","sources":["../../../components/chip/chip.vue"],"sourcesContent":["<template>\n  <span class=\"d-chip\">\n    <component\n      :is=\"interactive ? 'button' : 'span'\"\n      :id=\"id\"\n      :aria-label=\"ariaLabel\"\n      :aria-labelledby=\"ariaLabel ? undefined : `${id}-content`\"\n      :class=\"chipClasses()\"\n      :type=\"interactive && 'button'\"\n      data-qa=\"dt-chip\"\n      v-on=\"chipListeners\"\n    >\n      <span\n        v-if=\"$slots.icon\"\n        class=\"d-chip__icon\"\n        data-qa=\"dt-chip-icon\"\n      >\n        <!-- @slot slot for Chip icon -->\n        <slot name=\"icon\" />\n      </span>\n      <span\n        v-else-if=\"$slots.avatar\"\n        data-qa=\"dt-chip-avatar\"\n      >\n        <!-- @slot slot for Chip avatar -->\n        <slot name=\"avatar\" />\n      </span>\n      <span\n        v-if=\"$slots.default\"\n        :id=\"`${id}-content`\"\n        :class=\"['d-chip__text', contentClass]\"\n        data-qa=\"dt-chip-label\"\n      >\n        <!-- @slot slot for Content within chip -->\n        <slot />\n      </span>\n    </component>\n    <dt-button\n      v-if=\"!hideClose\"\n      :class=\"chipCloseButtonClasses()\"\n      data-qa=\"dt-chip-close\"\n      :aria-label=\"closeButtonTitle\"\n      :title=\"closeButtonTitle\"\n      @click=\"$emit('close')\"\n    >\n      <template #icon>\n        <dt-icon-close\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIconClose } from '@dialpad/dialtone-icons/vue2';\nimport {\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n} from './chip_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\n/**\n * A chip is a compact UI element that provides brief, descriptive information about an element.\n * It is terse, ideally one word. It is important a button is identifiable, consistent, and\n * communicates its actions clearly, and is appropriately sized to its action.\n * @see https://dialtone.dialpad.com/components/chip.html\n */\nexport default {\n  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIconClose,\n  },\n\n  props: {\n    /**\n     * Hides the close button on the chip\n     * @values true, false\n     */\n    hideClose: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The size of the chip.\n     * @values xs, sm, md\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(CHIP_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * The interactivity of the chip.\n     * Makes chip clickable, apply hover/focus/active style, emit keyboard events etc.\n     * @values true, false\n     */\n    interactive: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Id to use for the dialog's aria-labelledby.\n     */\n    id: {\n      type: String,\n      default: function () { return getUniqueString(); },\n    },\n\n    /**\n     * Descriptive label for the chip content.\n     * If this prop is unset the content in the default slot will be used as an aria-label.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the chip element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the span element.\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native chip click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Close button click event\n     *\n     * @event close\n     */\n    'close',\n\n    /**\n     * Native chip key up event\n     *\n     * @event keyup\n     * @type {KeyboardEvent}\n     */\n    'keyup',\n  ],\n\n  data () {\n    return {\n      isActive: false,\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    chipListeners () {\n      return {\n        ...this.$listeners,\n        click: event => {\n          if (this.interactive) this.$emit('click', event);\n        },\n\n        keyup: event => {\n          if (event.code?.toLowerCase() === 'delete') {\n            this.onClose();\n          } else {\n            this.$emit('keyup', event);\n          }\n        },\n      };\n    },\n\n    closeButtonIconSize () {\n      return CHIP_ICON_SIZES[this.size];\n    },\n\n    closeButtonTitle () {\n      return this.i18n.$t('DIALTONE_CLOSE_BUTTON');\n    },\n  },\n\n  methods: {\n    chipClasses () {\n      return [\n        this.$attrs['grouped-chip'] ? 'd-chip' : 'd-chip__label',\n        CHIP_SIZE_MODIFIERS[this.size],\n        this.labelClass,\n      ];\n    },\n\n    chipCloseButtonClasses () {\n      return [\n        'd-chip__close',\n        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],\n      ];\n    },\n\n    onClose () {\n      if (!this.hideClose) {\n        this.$emit('close');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconClose","s","CHIP_SIZE_MODIFIERS","getUniqueString","DialtoneLocalization","event","_a","CHIP_ICON_SIZES","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS"],"mappings":"4WAuEAA,EAAA,CACA,KAAA,SAEA,WAAA,CACA,SAAAC,EAAA,QACA,YAAAC,EAAA,WACA,EAEA,MAAA,CAKA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAA,OAAA,KAAAC,qBAAA,EAAA,SAAAD,CAAA,CACA,EAOA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,GAAA,CACA,KAAA,OACA,QAAA,UAAA,CAAA,OAAAE,EAAA,gBAAA,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,QAOA,QAQA,OACA,EAEA,MAAA,CACA,MAAA,CACA,SAAA,GACA,KAAA,IAAAC,EAAAA,oBACA,CACA,EAEA,SAAA,CACA,eAAA,CACA,MAAA,CACA,GAAA,KAAA,WACA,MAAAC,GAAA,CACA,KAAA,aAAA,KAAA,MAAA,QAAAA,CAAA,CACA,EAEA,MAAAA,GAAA,SACAC,EAAAD,EAAA,OAAA,YAAAC,EAAA,iBAAA,SACA,KAAA,QAAA,EAEA,KAAA,MAAA,QAAAD,CAAA,CAEA,CACA,CACA,EAEA,qBAAA,CACA,OAAAE,EAAA,gBAAA,KAAA,IAAA,CACA,EAEA,kBAAA,CACA,OAAA,KAAA,KAAA,GAAA,uBAAA,CACA,CACA,EAEA,QAAA,CACA,aAAA,CACA,MAAA,CACA,KAAA,OAAA,cAAA,EAAA,SAAA,gBACAL,EAAA,oBAAA,KAAA,IAAA,EACA,KAAA,UACA,CACA,EAEA,wBAAA,CACA,MAAA,CACA,gBACAM,EAAA,iCAAA,KAAA,IAAA,CACA,CACA,EAEA,SAAA,CACA,KAAA,WACA,KAAA,MAAA,OAAA,CAEA,CACA,CACA"}
+{"version":3,"file":"chip.cjs","sources":["../../../components/chip/chip.vue"],"sourcesContent":["<template>\n  <span class=\"d-chip\">\n    <component\n      :is=\"interactive ? 'button' : 'span'\"\n      :id=\"id\"\n      :aria-label=\"ariaLabel\"\n      :aria-labelledby=\"ariaLabel ? undefined : `${id}-content`\"\n      :class=\"chipClasses()\"\n      :type=\"interactive && 'button'\"\n      data-qa=\"dt-chip\"\n      v-on=\"chipListeners\"\n    >\n      <span\n        v-if=\"$slots.icon\"\n        class=\"d-chip__icon\"\n        data-qa=\"dt-chip-icon\"\n      >\n        <!-- @slot slot for Chip icon -->\n        <slot name=\"icon\" />\n      </span>\n      <span\n        v-else-if=\"$slots.avatar\"\n        data-qa=\"dt-chip-avatar\"\n      >\n        <!-- @slot slot for Chip avatar -->\n        <slot name=\"avatar\" />\n      </span>\n      <span\n        v-if=\"$slots.default\"\n        :id=\"`${id}-content`\"\n        :class=\"['d-chip__text', contentClass]\"\n        data-qa=\"dt-chip-label\"\n      >\n        <!-- @slot slot for Content within chip -->\n        <slot />\n      </span>\n    </component>\n    <dt-button\n      v-if=\"!hideClose\"\n      :class=\"chipCloseButtonClasses()\"\n      data-qa=\"dt-chip-close\"\n      :aria-label=\"closeButtonTitle\"\n      :title=\"closeButtonTitle\"\n      @click=\"$emit('close')\"\n    >\n      <template #icon>\n        <dt-icon-close\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIconClose } from '@dialpad/dialtone-icons/vue2';\nimport {\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n} from './chip_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\n/**\n * A chip is a compact UI element that provides brief, descriptive information about an element.\n * It is terse, ideally one word. It is important a button is identifiable, consistent, and\n * communicates its actions clearly, and is appropriately sized to its action.\n * @see https://dialtone.dialpad.com/components/chip.html\n */\nexport default {\n  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIconClose,\n  },\n\n  props: {\n    /**\n     * Hides the close button on the chip\n     * @values true, false\n     */\n    hideClose: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The size of the chip.\n     * @values xs, sm, md\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(CHIP_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * The interactivity of the chip.\n     * Makes chip clickable, apply hover/focus/active style, emit keyboard events etc.\n     * @values true, false\n     */\n    interactive: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Id to use for the dialog's aria-labelledby.\n     */\n    id: {\n      type: String,\n      default: function () { return getUniqueString(); },\n    },\n\n    /**\n     * Descriptive label for the chip content.\n     * If this prop is unset the content in the default slot will be used as an aria-label.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the chip element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the span element.\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native chip click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Close button click event\n     *\n     * @event close\n     */\n    'close',\n\n    /**\n     * Native chip key up event\n     *\n     * @event keyup\n     * @type {KeyboardEvent}\n     */\n    'keyup',\n  ],\n\n  data () {\n    return {\n      isActive: false,\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    chipListeners () {\n      return {\n        ...this.$listeners,\n        click: event => {\n          if (this.interactive) this.$emit('click', event);\n        },\n\n        keyup: event => {\n          if (event.code?.toLowerCase() === 'delete') {\n            this.onClose();\n          } else {\n            this.$emit('keyup', event);\n          }\n        },\n      };\n    },\n\n    closeButtonIconSize () {\n      return CHIP_ICON_SIZES[this.size];\n    },\n\n    closeButtonTitle () {\n      return this.i18n.$t('DIALTONE_CLOSE_BUTTON');\n    },\n  },\n\n  methods: {\n    chipClasses () {\n      return [\n        this.$attrs['grouped-chip'] ? 'd-chip' : 'd-chip__label',\n        CHIP_SIZE_MODIFIERS[this.size],\n        this.labelClass,\n      ];\n    },\n\n    chipCloseButtonClasses () {\n      return [\n        'd-chip__close',\n        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],\n      ];\n    },\n\n    onClose () {\n      if (!this.hideClose) {\n        this.$emit('close');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconClose","s","CHIP_SIZE_MODIFIERS","getUniqueString","DialtoneLocalization","event","_a","CHIP_ICON_SIZES","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS"],"mappings":"4WAuEAA,EAAA,CACA,KAAA,SAEA,WAAA,CACA,SAAAC,EAAAA,QACA,YAAAC,EAAAA,WACA,EAEA,MAAA,CAKA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAA,OAAA,KAAAC,qBAAA,EAAA,SAAAD,CAAA,CACA,EAOA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,GAAA,CACA,KAAA,OACA,QAAA,UAAA,CAAA,OAAAE,EAAAA,gBAAA,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,QAOA,QAQA,OACA,EAEA,MAAA,CACA,MAAA,CACA,SAAA,GACA,KAAA,IAAAC,EAAAA,oBACA,CACA,EAEA,SAAA,CACA,eAAA,CACA,MAAA,CACA,GAAA,KAAA,WACA,MAAAC,GAAA,CACA,KAAA,aAAA,KAAA,MAAA,QAAAA,CAAA,CACA,EAEA,MAAAA,GAAA,SACAC,EAAAD,EAAA,OAAA,YAAAC,EAAA,iBAAA,SACA,KAAA,QAAA,EAEA,KAAA,MAAA,QAAAD,CAAA,CAEA,CACA,CACA,EAEA,qBAAA,CACA,OAAAE,EAAAA,gBAAA,KAAA,IAAA,CACA,EAEA,kBAAA,CACA,OAAA,KAAA,KAAA,GAAA,uBAAA,CACA,CACA,EAEA,QAAA,CACA,aAAA,CACA,MAAA,CACA,KAAA,OAAA,cAAA,EAAA,SAAA,gBACAL,EAAAA,oBAAA,KAAA,IAAA,EACA,KAAA,UACA,CACA,EAEA,wBAAA,CACA,MAAA,CACA,gBACAM,EAAAA,iCAAA,KAAA,IAAA,CACA,CACA,EAEA,SAAA,CACA,KAAA,WACA,KAAA,MAAA,OAAA,CAEA,CACA,CACA"}

package/dist/vue2/lib/chip/chip.js

@@ -1,5 +1,5 @@
 import { DtIconClose as a } from "@dialpad/dialtone-icons/vue2";
-import { CHIP_SIZE_MODIFIERS as s, CHIP_ICON_SIZES as n, CHIP_CLOSE_BUTTON_SIZE_MODIFIERS as o } from "./chip-constants.js";
+import { CHIP_CLOSE_BUTTON_SIZE_MODIFIERS as n, CHIP_SIZE_MODIFIERS as s, CHIP_ICON_SIZES as o } from "./chip-constants.js";
 import { getUniqueString as l } from "../../common/utils/index.js";
 import { DialtoneLocalization as r } from "../../localization/index.js";
 import { n as c } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
@@ -111,7 +111,7 @@ const d = {
       };
     },
     closeButtonIconSize() {
-      return n[this.size];
+      return o[this.size];
     },
     closeButtonTitle() {
       return this.i18n.$t("DIALTONE_CLOSE_BUTTON");
@@ -128,7 +128,7 @@ const d = {
     chipCloseButtonClasses() {
       return [
         "d-chip__close",
-        o[this.size]
+        n[this.size]
       ];
     },
     onClose() {

package/dist/vue2/lib/collapsible/collapsible.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../common/utils/index.cjs"),i=require("./collapsible-lazy-show.cjs"),l=require("@dialpad/dialtone-icons/vue2"),o=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),r=require("../button/button.cjs"),s=require("../lazy-show/lazy-show.cjs"),c={name:"DtCollapsible",components:{DtButton:r.default,DtCollapsibleLazyShow:i.default,DtLazyShow:s.default,DtIconChevronDown:l.DtIconChevronDown,DtIconChevronRight:l.DtIconChevronRight},props:{anchorText:{type:String,default:null},open:{type:Boolean,default:null},id:{type:String,default(){return a.getUniqueString()}},elementType:{type:String,default:"div"},contentElementType:{type:String,default:"div"},anchorClass:{type:[String,Array,Object],default:null},contentClass:{type:[String,Array,Object],default:null},maxWidth:{type:String,default:null},maxHeight:{type:String,default:null},ariaLabel:{type:String,default:null},ariaLabelledBy:{type:String,default:null}},emits:["update:open","opened"],data(){return{isOpen:!0}},computed:{labelledBy(){return this.ariaLabelledBy||!this.ariaLabel&&a.getUniqueString("DtCollapsible__anchor")}},watch:{open:{handler:function(n){n!==null&&(this.isOpen=n)},immediate:!0}},mounted(){this.validateProperAnchor()},methods:{onLeaveTransitionComplete(){this.$emit("opened",!1),this.open!==null&&this.$emit("update:open",!1)},onEnterTransitionComplete(){this.$emit("opened",!0,this.$refs.content),this.open!==null&&this.$emit("update:open",!0)},defaultToggleOpen(){this.open===null&&this.toggleOpen()},toggleOpen(){this.isOpen=!this.isOpen},validateProperAnchor(){!this.anchorText&&!this.$scopedSlots.anchor&&console.error("anchor text and anchor slot content cannot both be falsy")}}};var d=function(){var e=this,t=e._self._c;return t(e.elementType,e._g({ref:"collapsible",tag:"component"},e.$listeners),[t("div",{ref:"anchor",class:e.anchorClass,attrs:{id:!e.ariaLabelledBy&&e.labelledBy}},[e._t("anchor",function(){return[t("dt-button",{style:{width:e.maxWidth},attrs:{importance:"clear",kind:"muted","aria-controls":e.id,"aria-expanded":`${e.isOpen}`},on:{click:e.defaultToggleOpen}},[e.isOpen?t("dt-icon-chevron-down",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}):t("dt-icon-chevron-right",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}),t("span",{staticClass:"d-collapsible__anchor-text",attrs:{title:e.anchorText}},[e._v(" "+e._s(e.anchorText)+" ")])],1)]},{attrs:{"aria-controls":e.id,"aria-expanded":e.isOpen.toString(),role:"button"}})],2),t("dt-collapsible-lazy-show",e._g({ref:"contentWrapper",class:e.contentClass,style:{"max-height":e.maxHeight,"max-width":e.maxWidth},attrs:{id:e.id,"aria-hidden":`${!e.isOpen}`,"aria-labelledby":e.labelledBy,"aria-label":e.ariaLabel,show:e.isOpen,"element-type":e.contentElementType,"data-qa":"dt-collapsible--content",tabindex:"-1",appear:""},on:{"after-leave":e.onLeaveTransitionComplete,"after-enter":e.onEnterTransitionComplete}},e.$listeners),[e._t("content")],2)],1)},p=[],u=o.n(c,d,p);const h=u.exports;exports.default=h;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../common/utils/index.cjs"),i=require("./collapsible-lazy-show.cjs"),l=require("@dialpad/dialtone-icons/vue2"),o=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),r=require("../lazy-show/lazy-show.cjs"),s=require("../button/button.cjs"),c={name:"DtCollapsible",components:{DtButton:s.default,DtCollapsibleLazyShow:i.default,DtLazyShow:r.default,DtIconChevronDown:l.DtIconChevronDown,DtIconChevronRight:l.DtIconChevronRight},props:{anchorText:{type:String,default:null},open:{type:Boolean,default:null},id:{type:String,default(){return a.getUniqueString()}},elementType:{type:String,default:"div"},contentElementType:{type:String,default:"div"},anchorClass:{type:[String,Array,Object],default:null},contentClass:{type:[String,Array,Object],default:null},maxWidth:{type:String,default:null},maxHeight:{type:String,default:null},ariaLabel:{type:String,default:null},ariaLabelledBy:{type:String,default:null}},emits:["update:open","opened"],data(){return{isOpen:!0}},computed:{labelledBy(){return this.ariaLabelledBy||!this.ariaLabel&&a.getUniqueString("DtCollapsible__anchor")}},watch:{open:{handler:function(n){n!==null&&(this.isOpen=n)},immediate:!0}},mounted(){this.validateProperAnchor()},methods:{onLeaveTransitionComplete(){this.$emit("opened",!1),this.open!==null&&this.$emit("update:open",!1)},onEnterTransitionComplete(){this.$emit("opened",!0,this.$refs.content),this.open!==null&&this.$emit("update:open",!0)},defaultToggleOpen(){this.open===null&&this.toggleOpen()},toggleOpen(){this.isOpen=!this.isOpen},validateProperAnchor(){!this.anchorText&&!this.$scopedSlots.anchor&&console.error("anchor text and anchor slot content cannot both be falsy")}}};var d=function(){var e=this,t=e._self._c;return t(e.elementType,e._g({ref:"collapsible",tag:"component"},e.$listeners),[t("div",{ref:"anchor",class:e.anchorClass,attrs:{id:!e.ariaLabelledBy&&e.labelledBy}},[e._t("anchor",function(){return[t("dt-button",{style:{width:e.maxWidth},attrs:{importance:"clear",kind:"muted","aria-controls":e.id,"aria-expanded":`${e.isOpen}`},on:{click:e.defaultToggleOpen}},[e.isOpen?t("dt-icon-chevron-down",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}):t("dt-icon-chevron-right",{staticClass:"d-collapsible__icon",attrs:{size:"300"}}),t("span",{staticClass:"d-collapsible__anchor-text",attrs:{title:e.anchorText}},[e._v(" "+e._s(e.anchorText)+" ")])],1)]},{attrs:{"aria-controls":e.id,"aria-expanded":e.isOpen.toString(),role:"button"}})],2),t("dt-collapsible-lazy-show",e._g({ref:"contentWrapper",class:e.contentClass,style:{"max-height":e.maxHeight,"max-width":e.maxWidth},attrs:{id:e.id,"aria-hidden":`${!e.isOpen}`,"aria-labelledby":e.labelledBy,"aria-label":e.ariaLabel,show:e.isOpen,"element-type":e.contentElementType,"data-qa":"dt-collapsible--content",tabindex:"-1",appear:""},on:{"after-leave":e.onLeaveTransitionComplete,"after-enter":e.onEnterTransitionComplete}},e.$listeners),[e._t("content")],2)],1)},p=[],u=o.n(c,d,p);const h=u.exports;exports.default=h;
 //# sourceMappingURL=collapsible.cjs.map

package/dist/vue2/lib/collapsible/collapsible.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible.cjs","sources":["../../../components/collapsible/collapsible.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    ref=\"collapsible\"\n    v-on=\"$listeners\"\n  >\n    <!-- Element for capturing keypress events -->\n    <div\n      :id=\"!ariaLabelledBy && labelledBy\"\n      ref=\"anchor\"\n      :class=\"anchorClass\"\n    >\n      <!-- @slot Slot for the anchor element that toggles the collapsible content -->\n      <slot\n        name=\"anchor\"\n        :attrs=\"{\n          'aria-controls': id,\n          'aria-expanded': isOpen.toString(),\n          'role': 'button',\n        }\"\n      >\n        <dt-button\n          importance=\"clear\"\n          kind=\"muted\"\n          :aria-controls=\"id\"\n          :aria-expanded=\"`${isOpen}`\"\n          :style=\"{\n            'width': maxWidth,\n          }\"\n          @click=\"defaultToggleOpen\"\n        >\n          <dt-icon-chevron-down\n            v-if=\"isOpen\"\n            class=\"d-collapsible__icon\"\n            size=\"300\"\n          />\n          <dt-icon-chevron-right\n            v-else\n            class=\"d-collapsible__icon\"\n            size=\"300\"\n          />\n          <span\n            class=\"d-collapsible__anchor-text\"\n            :title=\"anchorText\"\n          >\n            {{ anchorText }}\n          </span>\n        </dt-button>\n      </slot>\n    </div>\n    <dt-collapsible-lazy-show\n      :id=\"id\"\n      ref=\"contentWrapper\"\n      :aria-hidden=\"`${!isOpen}`\"\n      :aria-labelledby=\"labelledBy\"\n      :aria-label=\"ariaLabel\"\n      :show=\"isOpen\"\n      :element-type=\"contentElementType\"\n      :class=\"contentClass\"\n      :style=\"{\n        'max-height': maxHeight,\n        'max-width': maxWidth,\n      }\"\n      data-qa=\"dt-collapsible--content\"\n      tabindex=\"-1\"\n      appear\n      v-on=\"$listeners\"\n      @after-leave=\"onLeaveTransitionComplete\"\n      @after-enter=\"onEnterTransitionComplete\"\n    >\n      <!-- @slot Slot for the collapsible element that is expanded by the anchor -->\n      <slot\n        name=\"content\"\n      />\n    </dt-collapsible-lazy-show>\n  </component>\n</template>\n\n<script>\nimport { getUniqueString } from '@/common/utils';\nimport DtCollapsibleLazyShow from './collapsible_lazy_show.vue';\nimport { DtButton } from '@/components/button';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue2';\n\n/**\n * A collapsible is a component consisting of an interactive anchor that toggled the expandable/collapsible element.\n * @see https://dialtone.dialpad.com/components/collapsible.html\n */\nexport default {\n  name: 'DtCollapsible',\n\n  components: {\n    DtButton,\n    DtCollapsibleLazyShow,\n    DtLazyShow,\n    DtIconChevronDown,\n    DtIconChevronRight,\n  },\n\n  props: {\n    /**\n     * Text that is displayed on the anchor if nothing is passed in the slot.\n     * Ignored if the anchor slot is used.\n     */\n    anchorText: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Controls whether the collapsible is shown. Leaving this null will have the collapsible start\n     * expanded and trigger on click by default. If you set this value, the default trigger\n     * behavior will be disabled, and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    open: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * The id of the content wrapper.\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * HTML element type (tag name) of the root element of the component.\n     */\n    elementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    contentElementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * Additional class name for the anchor wrapper element.\n     */\n    anchorClass: {\n      type: [String, Array, Object],\n      default: null,\n    },\n\n    /**\n     * Additional class name for the content wrapper element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: null,\n    },\n\n    /**\n     * The maximum width of the anchor and collapsible element.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The maximum height of the collapsible element.\n     * Possible units rem|px|%|em\n     */\n    maxHeight: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Label on the collapsible content. Should provide this or ariaLabelledBy but not both.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Id of the element that labels the collapsible content. Defaults to the anchor element.\n     * Should provide this or ariaLabel but not both.\n     */\n    ariaLabelledBy: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Event fired when the content is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean}\n     */\n    'opened',\n  ],\n\n  data () {\n    return {\n      isOpen: true,\n    };\n  },\n\n  computed: {\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('DtCollapsible__anchor'));\n    },\n  },\n\n  watch: {\n    open: {\n      handler: function (open) {\n        if (open !== null) {\n          this.isOpen = open;\n        }\n      },\n\n      immediate: true,\n    },\n  },\n\n  mounted () {\n    this.validateProperAnchor();\n  },\n\n  methods: {\n    onLeaveTransitionComplete () {\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('opened', true, this.$refs.content);\n      if (this.open !== null) {\n        this.$emit('update:open', true);\n      }\n    },\n\n    defaultToggleOpen () {\n      if (this.open === null) {\n        this.toggleOpen();\n      }\n    },\n\n    toggleOpen () {\n      this.isOpen = !this.isOpen;\n    },\n\n    validateProperAnchor () {\n      if (!this.anchorText && !this.$scopedSlots.anchor) {\n        console.error('anchor text and anchor slot content cannot both be falsy');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtCollapsibleLazyShow","DtLazyShow","DtIconChevronDown","DtIconChevronRight","getUniqueString","open"],"mappings":"iXAyFAA,EAAA,CACA,KAAA,gBAEA,WAAA,CACA,SAAAC,EAAA,QACA,sBAAAC,EAAA,QACA,WAAAC,EAAA,QACA,kBAAAC,EAAA,kBACA,mBAAAC,EAAA,kBACA,EAEA,MAAA,CAKA,WAAA,CACA,KAAA,OACA,QAAA,IACA,EASA,KAAA,CACA,KAAA,QACA,QAAA,IACA,EAKA,GAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAC,EAAA,gBAAA,CAAA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,KACA,EAKA,mBAAA,CACA,KAAA,OACA,QAAA,KACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,IACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,IACA,EAMA,SAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,eAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CAKA,cAQA,QACA,EAEA,MAAA,CACA,MAAA,CACA,OAAA,EACA,CACA,EAEA,SAAA,CACA,YAAA,CAGA,OAAA,KAAA,gBAAA,CAAA,KAAA,WAAAA,EAAA,gBAAA,uBAAA,CACA,CACA,EAEA,MAAA,CACA,KAAA,CACA,QAAA,SAAAC,EAAA,CACAA,IAAA,OACA,KAAA,OAAAA,EAEA,EAEA,UAAA,EACA,CACA,EAEA,SAAA,CACA,KAAA,qBAAA,CACA,EAEA,QAAA,CACA,2BAAA,CACA,KAAA,MAAA,SAAA,EAAA,EACA,KAAA,OAAA,MACA,KAAA,MAAA,cAAA,EAAA,CAEA,EAEA,2BAAA,CACA,KAAA,MAAA,SAAA,GAAA,KAAA,MAAA,OAAA,EACA,KAAA,OAAA,MACA,KAAA,MAAA,cAAA,EAAA,CAEA,EAEA,mBAAA,CACA,KAAA,OAAA,MACA,KAAA,WAAA,CAEA,EAEA,YAAA,CACA,KAAA,OAAA,CAAA,KAAA,MACA,EAEA,sBAAA,CACA,CAAA,KAAA,YAAA,CAAA,KAAA,aAAA,QACA,QAAA,MAAA,0DAAA,CAEA,CACA,CACA"}
+{"version":3,"file":"collapsible.cjs","sources":["../../../components/collapsible/collapsible.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    ref=\"collapsible\"\n    v-on=\"$listeners\"\n  >\n    <!-- Element for capturing keypress events -->\n    <div\n      :id=\"!ariaLabelledBy && labelledBy\"\n      ref=\"anchor\"\n      :class=\"anchorClass\"\n    >\n      <!-- @slot Slot for the anchor element that toggles the collapsible content -->\n      <slot\n        name=\"anchor\"\n        :attrs=\"{\n          'aria-controls': id,\n          'aria-expanded': isOpen.toString(),\n          'role': 'button',\n        }\"\n      >\n        <dt-button\n          importance=\"clear\"\n          kind=\"muted\"\n          :aria-controls=\"id\"\n          :aria-expanded=\"`${isOpen}`\"\n          :style=\"{\n            'width': maxWidth,\n          }\"\n          @click=\"defaultToggleOpen\"\n        >\n          <dt-icon-chevron-down\n            v-if=\"isOpen\"\n            class=\"d-collapsible__icon\"\n            size=\"300\"\n          />\n          <dt-icon-chevron-right\n            v-else\n            class=\"d-collapsible__icon\"\n            size=\"300\"\n          />\n          <span\n            class=\"d-collapsible__anchor-text\"\n            :title=\"anchorText\"\n          >\n            {{ anchorText }}\n          </span>\n        </dt-button>\n      </slot>\n    </div>\n    <dt-collapsible-lazy-show\n      :id=\"id\"\n      ref=\"contentWrapper\"\n      :aria-hidden=\"`${!isOpen}`\"\n      :aria-labelledby=\"labelledBy\"\n      :aria-label=\"ariaLabel\"\n      :show=\"isOpen\"\n      :element-type=\"contentElementType\"\n      :class=\"contentClass\"\n      :style=\"{\n        'max-height': maxHeight,\n        'max-width': maxWidth,\n      }\"\n      data-qa=\"dt-collapsible--content\"\n      tabindex=\"-1\"\n      appear\n      v-on=\"$listeners\"\n      @after-leave=\"onLeaveTransitionComplete\"\n      @after-enter=\"onEnterTransitionComplete\"\n    >\n      <!-- @slot Slot for the collapsible element that is expanded by the anchor -->\n      <slot\n        name=\"content\"\n      />\n    </dt-collapsible-lazy-show>\n  </component>\n</template>\n\n<script>\nimport { getUniqueString } from '@/common/utils';\nimport DtCollapsibleLazyShow from './collapsible_lazy_show.vue';\nimport { DtButton } from '@/components/button';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue2';\n\n/**\n * A collapsible is a component consisting of an interactive anchor that toggled the expandable/collapsible element.\n * @see https://dialtone.dialpad.com/components/collapsible.html\n */\nexport default {\n  name: 'DtCollapsible',\n\n  components: {\n    DtButton,\n    DtCollapsibleLazyShow,\n    DtLazyShow,\n    DtIconChevronDown,\n    DtIconChevronRight,\n  },\n\n  props: {\n    /**\n     * Text that is displayed on the anchor if nothing is passed in the slot.\n     * Ignored if the anchor slot is used.\n     */\n    anchorText: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Controls whether the collapsible is shown. Leaving this null will have the collapsible start\n     * expanded and trigger on click by default. If you set this value, the default trigger\n     * behavior will be disabled, and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    open: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * The id of the content wrapper.\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * HTML element type (tag name) of the root element of the component.\n     */\n    elementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    contentElementType: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * Additional class name for the anchor wrapper element.\n     */\n    anchorClass: {\n      type: [String, Array, Object],\n      default: null,\n    },\n\n    /**\n     * Additional class name for the content wrapper element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: null,\n    },\n\n    /**\n     * The maximum width of the anchor and collapsible element.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The maximum height of the collapsible element.\n     * Possible units rem|px|%|em\n     */\n    maxHeight: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Label on the collapsible content. Should provide this or ariaLabelledBy but not both.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Id of the element that labels the collapsible content. Defaults to the anchor element.\n     * Should provide this or ariaLabel but not both.\n     */\n    ariaLabelledBy: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Event fired when the content is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean}\n     */\n    'opened',\n  ],\n\n  data () {\n    return {\n      isOpen: true,\n    };\n  },\n\n  computed: {\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('DtCollapsible__anchor'));\n    },\n  },\n\n  watch: {\n    open: {\n      handler: function (open) {\n        if (open !== null) {\n          this.isOpen = open;\n        }\n      },\n\n      immediate: true,\n    },\n  },\n\n  mounted () {\n    this.validateProperAnchor();\n  },\n\n  methods: {\n    onLeaveTransitionComplete () {\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('opened', true, this.$refs.content);\n      if (this.open !== null) {\n        this.$emit('update:open', true);\n      }\n    },\n\n    defaultToggleOpen () {\n      if (this.open === null) {\n        this.toggleOpen();\n      }\n    },\n\n    toggleOpen () {\n      this.isOpen = !this.isOpen;\n    },\n\n    validateProperAnchor () {\n      if (!this.anchorText && !this.$scopedSlots.anchor) {\n        console.error('anchor text and anchor slot content cannot both be falsy');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtCollapsibleLazyShow","DtLazyShow","DtIconChevronDown","DtIconChevronRight","getUniqueString","open"],"mappings":"iXAyFAA,EAAA,CACA,KAAA,gBAEA,WAAA,CACA,SAAAC,EAAAA,QACA,sBAAAC,EAAAA,QACA,WAAAC,EAAAA,QACA,kBAAAC,EAAAA,kBACA,mBAAAC,EAAAA,kBACA,EAEA,MAAA,CAKA,WAAA,CACA,KAAA,OACA,QAAA,IACA,EASA,KAAA,CACA,KAAA,QACA,QAAA,IACA,EAKA,GAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAC,EAAAA,gBAAA,CAAA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,KACA,EAKA,mBAAA,CACA,KAAA,OACA,QAAA,KACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,IACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,IACA,EAMA,SAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,eAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CAKA,cAQA,QACA,EAEA,MAAA,CACA,MAAA,CACA,OAAA,EACA,CACA,EAEA,SAAA,CACA,YAAA,CAGA,OAAA,KAAA,gBAAA,CAAA,KAAA,WAAAA,EAAAA,gBAAA,uBAAA,CACA,CACA,EAEA,MAAA,CACA,KAAA,CACA,QAAA,SAAAC,EAAA,CACAA,IAAA,OACA,KAAA,OAAAA,EAEA,EAEA,UAAA,EACA,CACA,EAEA,SAAA,CACA,KAAA,qBAAA,CACA,EAEA,QAAA,CACA,2BAAA,CACA,KAAA,MAAA,SAAA,EAAA,EACA,KAAA,OAAA,MACA,KAAA,MAAA,cAAA,EAAA,CAEA,EAEA,2BAAA,CACA,KAAA,MAAA,SAAA,GAAA,KAAA,MAAA,OAAA,EACA,KAAA,OAAA,MACA,KAAA,MAAA,cAAA,EAAA,CAEA,EAEA,mBAAA,CACA,KAAA,OAAA,MACA,KAAA,WAAA,CAEA,EAEA,YAAA,CACA,KAAA,OAAA,CAAA,KAAA,MACA,EAEA,sBAAA,CACA,CAAA,KAAA,YAAA,CAAA,KAAA,aAAA,QACA,QAAA,MAAA,0DAAA,CAEA,CACA,CACA"}

package/dist/vue2/lib/collapsible/collapsible.js

@@ -1,17 +1,17 @@
 import { getUniqueString as a } from "../../common/utils/index.js";
 import l from "./collapsible-lazy-show.js";
-import { DtIconChevronDown as i, DtIconChevronRight as o } from "@dialpad/dialtone-icons/vue2";
+import { DtIconChevronRight as i, DtIconChevronDown as o } from "@dialpad/dialtone-icons/vue2";
 import { n as r } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
-import s from "../button/button.js";
-import p from "../lazy-show/lazy-show.js";
+import s from "../lazy-show/lazy-show.js";
+import p from "../button/button.js";
 const d = {
   name: "DtCollapsible",
   components: {
-    DtButton: s,
+    DtButton: p,
     DtCollapsibleLazyShow: l,
-    DtLazyShow: p,
-    DtIconChevronDown: i,
-    DtIconChevronRight: o
+    DtLazyShow: s,
+    DtIconChevronDown: o,
+    DtIconChevronRight: i
   },
   props: {
     /**

package/dist/vue2/lib/combobox/combobox-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-constants.cjs","sources":["../../../components/combobox/combobox_constants.js"],"sourcesContent":["export const COMBOBOX_LABEL_SIZES = {\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n  LARGE: 'lg',\n  EXTRA_LARGE: 'xl',\n};\n\nexport default {\n  COMBOBOX_LABEL_SIZES,\n};\n"],"names":["COMBOBOX_LABEL_SIZES","combobox_constants"],"mappings":"4GAAY,MAACA,EAAuB,CAClC,YAAa,KACb,MAAO,KACP,QAAS,KACT,MAAO,KACP,YAAa,IACf,EAEeC,EAAA,CACb,qBAAAD,CACF"}
+{"version":3,"file":"combobox-constants.cjs","sources":["../../../components/combobox/combobox_constants.js"],"sourcesContent":["export const COMBOBOX_LABEL_SIZES = {\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n  LARGE: 'lg',\n  EXTRA_LARGE: 'xl',\n};\n\nexport default {\n  COMBOBOX_LABEL_SIZES,\n};\n"],"names":["COMBOBOX_LABEL_SIZES","combobox_constants"],"mappings":"4GAAY,MAACA,EAAuB,CAClC,YAAa,KACb,MAAO,KACP,QAAS,KACT,MAAO,KACP,YAAa,IACf,EAEAC,EAAe,CACb,qBAAAD,CACF"}

package/dist/vue2/lib/combobox/combobox-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-constants.js","sources":["../../../components/combobox/combobox_constants.js"],"sourcesContent":["export const COMBOBOX_LABEL_SIZES = {\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n  LARGE: 'lg',\n  EXTRA_LARGE: 'xl',\n};\n\nexport default {\n  COMBOBOX_LABEL_SIZES,\n};\n"],"names":["COMBOBOX_LABEL_SIZES","combobox_constants"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,aAAa;AAAA,EACb,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AAAA,EACP,aAAa;AACf,GAEeC,IAAA;AAAA,EACb,sBAAAD;AACF;"}
+{"version":3,"file":"combobox-constants.js","sources":["../../../components/combobox/combobox_constants.js"],"sourcesContent":["export const COMBOBOX_LABEL_SIZES = {\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n  LARGE: 'lg',\n  EXTRA_LARGE: 'xl',\n};\n\nexport default {\n  COMBOBOX_LABEL_SIZES,\n};\n"],"names":["COMBOBOX_LABEL_SIZES","combobox_constants"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,aAAa;AAAA,EACb,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AAAA,EACP,aAAa;AACf,GAEAC,IAAe;AAAA,EACb,sBAAAD;AACF;"}

package/dist/vue2/lib/combobox/combobox-empty-list.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-empty-list.cjs","sources":["../../../components/combobox/combobox_empty-list.vue"],"sourcesContent":["<template>\n  <ol\n    class=\"d-combobox__empty-list\"\n    data-qa=\"dt-combobox-empty-list\"\n  >\n    <slot>\n      <dt-list-item\n        role=\"option\"\n        navigation-type=\"none\"\n        type=\"custom\"\n        :class=\"['d-combobox__empty-list-item', itemClass]\"\n      >\n        <span>{{ message }}</span>\n      </dt-list-item>\n    </slot>\n  </ol>\n</template>\n\n<script>\nimport { DtListItem } from '@/components/list_item';\n\nexport default {\n  name: 'ComboboxEmptyList',\n\n  components: { DtListItem },\n\n  props: {\n    /**\n     * Message to display when list is empty\n     */\n    message: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Additional class name for the empty list element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    itemClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtListItem"],"mappings":"kNAqBAA,EAAA,CACA,KAAA,oBAEA,WAAA,CAAAC,WAAAA,EAAAA,OAAA,EAEA,MAAA,CAIA,QAAA,CACA,KAAA,OACA,SAAA,EACA,EAOA,UAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,CACA,CACA"}
+{"version":3,"file":"combobox-empty-list.cjs","sources":["../../../components/combobox/combobox_empty-list.vue"],"sourcesContent":["<template>\n  <ol\n    class=\"d-combobox__empty-list\"\n    data-qa=\"dt-combobox-empty-list\"\n  >\n    <slot>\n      <dt-list-item\n        role=\"option\"\n        navigation-type=\"none\"\n        type=\"custom\"\n        :class=\"['d-combobox__empty-list-item', itemClass]\"\n      >\n        <span>{{ message }}</span>\n      </dt-list-item>\n    </slot>\n  </ol>\n</template>\n\n<script>\nimport { DtListItem } from '@/components/list_item';\n\nexport default {\n  name: 'ComboboxEmptyList',\n\n  components: { DtListItem },\n\n  props: {\n    /**\n     * Message to display when list is empty\n     */\n    message: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Additional class name for the empty list element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    itemClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtListItem"],"mappings":"kNAqBAA,EAAA,CACA,KAAA,oBAEA,WAAA,CAAA,WAAAC,EAAAA,OAAA,EAEA,MAAA,CAIA,QAAA,CACA,KAAA,OACA,SAAA,EACA,EAOA,UAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,CACA,CACA"}

package/dist/vue2/lib/combobox/combobox-loading-list.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),s=require("../list-item/list-item.cjs"),i=require("../skeleton/skeleton.cjs"),r={name:"ComboboxLoadingList",components:{DtListItem:s.default,DtSkeleton:i.default}};var a=function(){var e=this,t=e._self._c;return t("ol",{staticClass:"d-combobox__loading-list",attrs:{"aria-busy":"true"}},e._l(7,function(o){return t("dt-list-item",{key:o,attrs:{role:"option","navigation-type":"none"}},[t("dt-skeleton",{attrs:{"text-option":{type:"body"},offset:0}})],1)}),1)},l=[],_=n.n(r,a,l);const u=_.exports;exports.default=u;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),s=require("../skeleton/skeleton.cjs"),i=require("../list-item/list-item.cjs"),r={name:"ComboboxLoadingList",components:{DtListItem:i.default,DtSkeleton:s.default}};var a=function(){var e=this,t=e._self._c;return t("ol",{staticClass:"d-combobox__loading-list",attrs:{"aria-busy":"true"}},e._l(7,function(o){return t("dt-list-item",{key:o,attrs:{role:"option","navigation-type":"none"}},[t("dt-skeleton",{attrs:{"text-option":{type:"body"},offset:0}})],1)}),1)},l=[],_=n.n(r,a,l);const u=_.exports;exports.default=u;
 //# sourceMappingURL=combobox-loading-list.cjs.map

package/dist/vue2/lib/combobox/combobox-loading-list.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-loading-list.cjs","sources":["../../../components/combobox/combobox_loading-list.vue"],"sourcesContent":["<template>\n  <ol\n    class=\"d-combobox__loading-list\"\n    aria-busy=\"true\"\n  >\n    <dt-list-item\n      v-for=\"index in 7\"\n      :key=\"index\"\n      role=\"option\"\n      navigation-type=\"none\"\n    >\n      <dt-skeleton\n        :text-option=\"{ type: 'body' }\"\n        :offset=\"0\"\n      />\n    </dt-list-item>\n  </ol>\n</template>\n\n<script>\nimport { DtListItem } from '@/components/list_item';\nimport { DtSkeleton } from '@/components/skeleton';\n\nexport default {\n  name: 'ComboboxLoadingList',\n\n  components: { DtListItem, DtSkeleton },\n};\n</script>\n"],"names":["_sfc_main","DtListItem","DtSkeleton"],"mappings":"wPAuBAA,EAAA,CACA,KAAA,sBAEA,WAAA,CAAA,WAAAC,EAAA,QAAA,WAAAC,SAAA,CACA"}
+{"version":3,"file":"combobox-loading-list.cjs","sources":["../../../components/combobox/combobox_loading-list.vue"],"sourcesContent":["<template>\n  <ol\n    class=\"d-combobox__loading-list\"\n    aria-busy=\"true\"\n  >\n    <dt-list-item\n      v-for=\"index in 7\"\n      :key=\"index\"\n      role=\"option\"\n      navigation-type=\"none\"\n    >\n      <dt-skeleton\n        :text-option=\"{ type: 'body' }\"\n        :offset=\"0\"\n      />\n    </dt-list-item>\n  </ol>\n</template>\n\n<script>\nimport { DtListItem } from '@/components/list_item';\nimport { DtSkeleton } from '@/components/skeleton';\n\nexport default {\n  name: 'ComboboxLoadingList',\n\n  components: { DtListItem, DtSkeleton },\n};\n</script>\n"],"names":["_sfc_main","DtListItem","DtSkeleton"],"mappings":"wPAuBAA,EAAA,CACA,KAAA,sBAEA,WAAA,CAAA,WAAAC,EAAAA,QAAA,WAAAC,SAAA,CACA"}

package/dist/vue2/lib/combobox/combobox-loading-list.js

@@ -1,9 +1,9 @@
 import { n as e } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
-import r from "../list-item/list-item.js";
-import s from "../skeleton/skeleton.js";
+import r from "../skeleton/skeleton.js";
+import s from "../list-item/list-item.js";
 const i = {
   name: "ComboboxLoadingList",
-  components: { DtListItem: r, DtSkeleton: s }
+  components: { DtListItem: s, DtSkeleton: r }
 };
 var a = function() {
   var o = this, t = o._self._c;

package/dist/vue2/lib/combobox/combobox.cjs

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./combobox-loading-list.cjs"),o=require("./combobox-empty-list.cjs"),l=require("../../common/utils/index.cjs"),r=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),a=require("../../common/mixins/keyboard-list-navigation.cjs"),d=require("./combobox-constants.cjs"),h={name:"DtCombobox",components:{ComboboxLoadingList:n.default,ComboboxEmptyList:o.default},mixins:[a.default({indexKey:"highlightIndex",idKey:"highlightId",listElementKey:"getListElement",afterHighlightMethod:"afterHighlight",beginningOfListMethod:"beginningOfListMethod",endOfListMethod:"endOfListMethod",activeItemKey:"activeItemEl"})],props:{label:{type:String,required:!0},labelVisible:{type:Boolean,default:!0},size:{type:String,default:null,validator:i=>Object.values(d.COMBOBOX_LABEL_SIZES).includes(i)},description:{type:String,default:""},listId:{type:String,default(){return l.getUniqueString()}},onBeginningOfList:{type:Function,default:null},onEndOfList:{type:Function,default:null},showList:{type:Boolean,default:!1},listRenderedOutside:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},emptyList:{type:Boolean,default:!1},emptyStateMessage:{type:String,default:""},emptyStateClass:{type:[String,Object,Array],default:""},clickOnSelect:{type:Boolean,default:!1}},emits:["select","escape","highlight","opened"],data(){return{outsideRenderedListRef:null}},computed:{inputProps(){return{label:this.label,labelVisible:this.labelVisible,size:this.size,description:this.description,role:"combobox","aria-label":this.label,"aria-expanded":this.showList.toString(),"aria-owns":this.listId,"aria-haspopup":"listbox","aria-activedescendant":this.activeItemId,"aria-controls":this.listId}},listProps(){return{role:"listbox",id:this.listId,class:"d-ps-relative","aria-label":this.label}},beginningOfListMethod(){return this.onBeginningOfList||this.jumpToEnd},endOfListMethod(){return this.onEndOfList||this.jumpToBeginning},activeItemId(){if(!(!this.showList||this.highlightIndex<0||this.loading))return this.highlightId},activeItemEl(){return this.highlightId?this.getListElement().querySelector("#"+this.highlightId):""}},watch:{showList(i){this.listRenderedOutside||(this.setInitialHighlightIndex(),this.$emit("opened",i)),!i&&this.outsideRenderedListRef&&(this.outsideRenderedListRef.removeEventListener("mousemove",this.onMouseHighlight),this.outsideRenderedListRef=null)},loading(i){this.$nextTick(()=>{this.setInitialHighlightIndex()})},$props:{deep:!0,immediate:!0,handler(){this.validateEmptyListProps()}}},created(){this.validateEmptyListProps()},methods:{onMouseHighlight(i){if(this.loading)return;const t=i.target.closest("li");t&&this.highlightId!==t.id&&this.setHighlightId(t.id)},getListElement(){var i;return this.outsideRenderedListRef??((i=this.$refs.listWrapper)==null?void 0:i.querySelector(`#${this.listId}`))},clearHighlightIndex(){this.showList&&this.setHighlightIndex(-1)},afterHighlight(){this.loading||this.$emit("highlight",this.highlightIndex)},onEnterKey(){var i;this.loading||this.emptyList||this.highlightIndex>=0&&(this.$emit("select",this.highlightIndex),this.clickOnSelect&&((i=this.activeItemEl)==null||i.click()))},onEscapeKey(){this.$emit("escape")},onOpen(i,t){var s;this.outsideRenderedListRef=t,(s=this.outsideRenderedListRef)==null||s.addEventListener("mousemove",this.onMouseHighlight),this.$emit("opened",i),i&&this.setInitialHighlightIndex()},onKeyValidation(i,t){!this.showList||!this.getListElement()||this[t](i)},setInitialHighlightIndex(){this.showList&&this.$nextTick(()=>{this.setHighlightIndex(this.loading?-1:0)})},validateEmptyListProps(){this.$slots.emptyListItem||this.emptyList&&!this.emptyStateMessage&&console.error(`Invalid props: you must pass both props emptyList and emptyStateMessage to show the
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./combobox-loading-list.cjs"),o=require("./combobox-empty-list.cjs"),l=require("../../common/utils/index.cjs"),r=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),a=require("../../common/mixins/keyboard-list-navigation.cjs"),d=require("./combobox-constants.cjs"),h={name:"DtCombobox",components:{ComboboxLoadingList:n.default,ComboboxEmptyList:o.default},mixins:[a.default({indexKey:"highlightIndex",idKey:"highlightId",listElementKey:"getListElement",afterHighlightMethod:"afterHighlight",beginningOfListMethod:"beginningOfListMethod",endOfListMethod:"endOfListMethod",activeItemKey:"activeItemEl"})],props:{label:{type:String,required:!0},labelVisible:{type:Boolean,default:!0},size:{type:String,default:null,validator:i=>Object.values(d.COMBOBOX_LABEL_SIZES).includes(i)},description:{type:String,default:""},listId:{type:String,default(){return l.getUniqueString()}},onBeginningOfList:{type:Function,default:null},onEndOfList:{type:Function,default:null},showList:{type:Boolean,default:!1},listRenderedOutside:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},emptyList:{type:Boolean,default:!1},emptyStateMessage:{type:String,default:""},emptyStateClass:{type:[String,Object,Array],default:""},clickOnSelect:{type:Boolean,default:!1}},emits:["select","escape","highlight","opened"],data(){return{outsideRenderedListRef:null}},computed:{inputProps(){return{label:this.label,labelVisible:this.labelVisible,size:this.size,description:this.description,role:"combobox","aria-label":this.label,"aria-expanded":this.showList.toString(),"aria-owns":this.listId,"aria-haspopup":"listbox","aria-activedescendant":this.activeItemId,"aria-controls":this.listId}},listProps(){return{role:"listbox",id:this.listId,class:"d-ps-relative","aria-label":this.label}},beginningOfListMethod(){return this.onBeginningOfList||this.jumpToEnd},endOfListMethod(){return this.onEndOfList||this.jumpToBeginning},activeItemId(){if(!(!this.showList||this.highlightIndex<0||this.loading))return this.highlightId},activeItemEl(){return this.highlightId?this.getListElement().querySelector("#"+this.highlightId):""}},watch:{showList(i){this.listRenderedOutside||(this.setInitialHighlightIndex(),this.$emit("opened",i)),!i&&this.outsideRenderedListRef&&(this.outsideRenderedListRef.removeEventListener("mousemove",this.onMouseHighlight),this.outsideRenderedListRef=null)},loading(){this.$nextTick(()=>{this.setInitialHighlightIndex()})},$props:{deep:!0,immediate:!0,handler(){this.validateEmptyListProps()}}},created(){this.validateEmptyListProps()},methods:{onMouseHighlight(i){if(this.loading)return;const t=i.target.closest("li");t&&this.highlightId!==t.id&&this.setHighlightId(t.id)},getListElement(){var i;return this.outsideRenderedListRef??((i=this.$refs.listWrapper)==null?void 0:i.querySelector(`#${this.listId}`))},clearHighlightIndex(){this.showList&&this.setHighlightIndex(-1)},afterHighlight(){this.loading||this.$emit("highlight",this.highlightIndex)},onEnterKey(){var i;this.loading||this.emptyList||this.highlightIndex>=0&&(this.$emit("select",this.highlightIndex),this.clickOnSelect&&((i=this.activeItemEl)==null||i.click()))},onEscapeKey(){this.$emit("escape")},onOpen(i,t){var s;this.outsideRenderedListRef=t,(s=this.outsideRenderedListRef)==null||s.addEventListener("mousemove",this.onMouseHighlight),this.$emit("opened",i),i&&this.setInitialHighlightIndex()},onKeyValidation(i,t){!this.showList||!this.getListElement()||this[t](i)},setInitialHighlightIndex(){this.showList&&this.$nextTick(()=>{this.setHighlightIndex(this.loading?-1:0)})},validateEmptyListProps(){this.$slots.emptyListItem||this.emptyList&&!this.emptyStateMessage&&console.error(`Invalid props: you must pass both props emptyList and emptyStateMessage to show the
       empty message.`)}}};var u=function(){var t=this,s=t._self._c;return s("div",{on:{keydown:[function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"esc",27,e.key,["Esc","Escape"])?null:(e.stopPropagation(),t.onKeyValidation(e,"onEscapeKey"))},function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"enter",13,e.key,"Enter")||e.ctrlKey||e.shiftKey||e.altKey||e.metaKey?null:t.onKeyValidation(e,"onEnterKey")},function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"up",38,e.key,["Up","ArrowUp"])?null:(e.stopPropagation(),e.preventDefault(),t.onKeyValidation(e,"onUpKey"))},function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"down",40,e.key,["Down","ArrowDown"])?null:(e.stopPropagation(),e.preventDefault(),t.onKeyValidation(e,"onDownKey"))},function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"home",void 0,e.key,void 0)?null:(e.stopPropagation(),e.preventDefault(),t.onKeyValidation(e,"onHomeKey"))},function(e){return!e.type.indexOf("key")&&t._k(e.keyCode,"end",void 0,e.key,void 0)?null:(e.stopPropagation(),e.preventDefault(),t.onKeyValidation(e,"onEndKey"))}]}},[s("div",{attrs:{"data-qa":"dt-combobox-input-wrapper"}},[t._t("input",null,{inputProps:t.inputProps})],2),t.showList?s("div",{ref:"listWrapper",attrs:{"data-qa":"dt-combobox-list-wrapper"},on:{mouseleave:t.clearHighlightIndex,focusout:t.clearHighlightIndex,"!mousemove":function(e){return t.onMouseHighlight.apply(null,arguments)}}},[t.loading&&!t.listRenderedOutside?s("combobox-loading-list",t._b({},"combobox-loading-list",t.listProps,!1)):t.emptyList&&(t.emptyStateMessage||t.$slots.emptyListItem)&&!t.listRenderedOutside?s("combobox-empty-list",t._b({attrs:{message:t.emptyStateMessage,"item-class":t.emptyStateClass}},"combobox-empty-list",t.listProps,!1),[t._t("emptyListItem")],2):t._t("list",null,{listProps:t.listProps,opened:t.onOpen,clearHighlightIndex:t.clearHighlightIndex})],2):t._e()])},p=[],g=r.n(h,u,p);const f=g.exports;exports.default=f;
 //# sourceMappingURL=combobox.cjs.map

package/dist/vue2/lib/combobox/combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.cjs","sources":["../../../components/combobox/combobox.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/no-static-element-interactions -->\n<template>\n  <div\n    @keydown.esc.stop=\"onKeyValidation($event, 'onEscapeKey')\"\n    @keydown.enter.exact=\"onKeyValidation($event, 'onEnterKey')\"\n    @keydown.up.stop.prevent=\"onKeyValidation($event, 'onUpKey')\"\n    @keydown.down.stop.prevent=\"onKeyValidation($event, 'onDownKey')\"\n    @keydown.home.stop.prevent=\"onKeyValidation($event, 'onHomeKey')\"\n    @keydown.end.stop.prevent=\"onKeyValidation($event, 'onEndKey')\"\n  >\n    <div data-qa=\"dt-combobox-input-wrapper\">\n      <!-- @slot Slot for the combobox input element -->\n      <slot\n        name=\"input\"\n        :input-props=\"inputProps\"\n      />\n    </div>\n\n    <div\n      v-if=\"showList\"\n      ref=\"listWrapper\"\n      data-qa=\"dt-combobox-list-wrapper\"\n      @mouseleave=\"clearHighlightIndex\"\n      @focusout=\"clearHighlightIndex\"\n      @mousemove.capture=\"onMouseHighlight\"\n    >\n      <combobox-loading-list\n        v-if=\"loading && !listRenderedOutside\"\n        v-bind=\"listProps\"\n      />\n      <combobox-empty-list\n        v-else-if=\"emptyList && (emptyStateMessage || $slots.emptyListItem) && !listRenderedOutside\"\n        v-bind=\"listProps\"\n        :message=\"emptyStateMessage\"\n        :item-class=\"emptyStateClass\"\n      >\n        <slot name=\"emptyListItem\" />\n      </combobox-empty-list>\n      <!-- @slot Slot for the combobox list element -->\n      <slot\n        v-else\n        name=\"list\"\n        :list-props=\"listProps\"\n        :opened=\"onOpen\"\n        :clear-highlight-index=\"clearHighlightIndex\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport ComboboxLoadingList from './combobox_loading-list.vue';\nimport ComboboxEmptyList from './combobox_empty-list.vue';\nimport { DtKeyboardListNavigationMixin } from '@/common/mixins';\nimport { getUniqueString } from '@/common/utils';\nimport { COMBOBOX_LABEL_SIZES } from '@/components/combobox';\n\n/**\n * A combobox is a semantic component that displays an input element combined with a listbox,\n * which enables the user to select items from the list.\n * @see https://dialtone.dialpad.com/components/combobox.html\n */\nexport default {\n  name: 'DtCombobox',\n\n  components: {\n    ComboboxLoadingList,\n    ComboboxEmptyList,\n  },\n\n  mixins: [\n    DtKeyboardListNavigationMixin({\n      indexKey: 'highlightIndex',\n      idKey: 'highlightId',\n      listElementKey: 'getListElement',\n      afterHighlightMethod: 'afterHighlight',\n      beginningOfListMethod: 'beginningOfListMethod',\n      endOfListMethod: 'endOfListMethod',\n      activeItemKey: 'activeItemEl',\n    }),\n  ],\n\n  props: {\n    /**\n     * String to use for the input label.\n     */\n    label: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Determines visibility of input label.\n     * @values true, false\n     */\n    labelVisible: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n     * @values null, xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: null,\n      validator: (t) => Object.values(COMBOBOX_LABEL_SIZES).includes(t),\n    },\n\n    /**\n     * Description for the input\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Sets an ID on the list element of the component. Used by several aria attributes\n     * as well as when deriving the IDs for each item.\n     */\n    listId: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * A method that will be called when the selection goes past the beginning of the list.\n     */\n    onBeginningOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * A method that will be called when the selection goes past the end of the list.\n     */\n    onEndOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * Determines when to show the list element and also controls the aria-expanded attribute.\n     * @values true, false\n     */\n    showList: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If the list is rendered outside the component, like when using popover as the list wrapper.\n     * @values true, false\n     */\n    listRenderedOutside: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines when to show the skeletons and also controls aria-busy attribute.\n     * @values true, false\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the list to an empty state, and displays the message from prop `emptyStateMessage`.\n     * @values true, false\n     */\n    emptyList: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Message to show when the list is empty\n     */\n    emptyStateMessage: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the empty list element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    emptyStateClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * Programmatically click on the active list item element when a selection\n     * comes from keyboard navigation, i.e. pressing the \"Enter\" key.\n     * @values true, false\n     */\n    clickOnSelect: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when item selected\n     *\n     * @event select\n     * @type {Number}\n     */\n    'select',\n\n    /**\n     * Event fired when pressing escape\n     *\n     * @event escape\n     */\n    'escape',\n\n    /**\n     * Event fired when the highlight changes\n     *\n     * @event highlight\n     * @type {Number}\n     */\n    'highlight',\n\n    /**\n     * Event fired when list is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean}\n     */\n    'opened',\n  ],\n\n  data () {\n    return {\n      // If the list is rendered at the root, rather than as a child\n      // of this component, this is the ref to that dom element. Set\n      // by the onOpen method.\n      outsideRenderedListRef: null,\n    };\n  },\n\n  computed: {\n    inputProps () {\n      return {\n        label: this.label,\n        labelVisible: this.labelVisible,\n        size: this.size,\n        description: this.description,\n        role: 'combobox',\n        'aria-label': this.label,\n        'aria-expanded': this.showList.toString(),\n        'aria-owns': this.listId,\n        'aria-haspopup': 'listbox',\n        'aria-activedescendant': this.activeItemId,\n        'aria-controls': this.listId,\n      };\n    },\n\n    listProps () {\n      return {\n        role: 'listbox',\n        id: this.listId,\n        // The list has to be positioned relatively so that the auto-scroll can\n        // calculate the correct offset for the list items.\n        class: 'd-ps-relative',\n        'aria-label': this.label,\n      };\n    },\n\n    beginningOfListMethod () {\n      return this.onBeginningOfList || this.jumpToEnd;\n    },\n\n    endOfListMethod () {\n      return this.onEndOfList || this.jumpToBeginning;\n    },\n\n    activeItemId () {\n      if (!this.showList || this.highlightIndex < 0 || this.loading) {\n        return;\n      }\n      return this.highlightId;\n    },\n\n    activeItemEl () {\n      if (!this.highlightId) return '';\n      return this.getListElement().querySelector('#' + this.highlightId);\n    },\n  },\n\n  watch: {\n    showList (showList) {\n      // When the list's visibility changes reset the highlight index.\n\n      if (!this.listRenderedOutside) {\n        this.setInitialHighlightIndex();\n        this.$emit('opened', showList);\n      }\n\n      if (!showList && this.outsideRenderedListRef) {\n        this.outsideRenderedListRef.removeEventListener('mousemove', this.onMouseHighlight);\n        this.outsideRenderedListRef = null;\n      }\n    },\n\n    loading (loading) {\n      this.$nextTick(() => {\n        this.setInitialHighlightIndex();\n      });\n    },\n\n    $props: {\n      deep: true,\n      immediate: true,\n      handler () {\n        this.validateEmptyListProps();\n      },\n    },\n  },\n\n  created () {\n    this.validateEmptyListProps();\n  },\n\n  methods: {\n    onMouseHighlight (e) {\n      if (this.loading) return;\n\n      const liElement = e.target.closest('li');\n\n      if (liElement && this.highlightId !== liElement.id) {\n        this.setHighlightId(liElement.id);\n      }\n    },\n\n    getListElement () {\n      return this.outsideRenderedListRef ?? this.$refs.listWrapper?.querySelector(`#${this.listId}`);\n    },\n\n    clearHighlightIndex () {\n      if (this.showList) {\n        this.setHighlightIndex(-1);\n      }\n    },\n\n    afterHighlight () {\n      if (this.loading) return;\n      this.$emit('highlight', this.highlightIndex);\n    },\n\n    onEnterKey () {\n      if (this.loading || this.emptyList) return;\n\n      if (this.highlightIndex >= 0) {\n        this.$emit('select', this.highlightIndex);\n\n        if (this.clickOnSelect) {\n          this.activeItemEl?.click();\n        }\n      }\n    },\n\n    onEscapeKey () {\n      this.$emit('escape');\n    },\n\n    onOpen (open, contentRef) {\n      this.outsideRenderedListRef = contentRef;\n      this.outsideRenderedListRef?.addEventListener('mousemove', this.onMouseHighlight);\n      this.$emit('opened', open);\n\n      if (open) {\n        this.setInitialHighlightIndex();\n      }\n    },\n\n    onKeyValidation (e, eventHandler) {\n      if (!this.showList || !this.getListElement()) return;\n\n      this[eventHandler](e);\n    },\n\n    setInitialHighlightIndex () {\n      if (!this.showList) return;\n      this.$nextTick(() => {\n      // When the list's is shown, reset the highlight index.\n      // If the list is loading, set to -1\n        this.setHighlightIndex(this.loading ? -1 : 0);\n      });\n    },\n\n    validateEmptyListProps () {\n      if (this.$slots.emptyListItem) { return; }\n\n      if (this.emptyList && !this.emptyStateMessage) {\n        console.error(`Invalid props: you must pass both props emptyList and emptyStateMessage to show the\n      empty message.`);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","ComboboxLoadingList","ComboboxEmptyList","DtKeyboardListNavigationMixin","t","COMBOBOX_LABEL_SIZES","getUniqueString","showList","loading","e","liElement","_a","open","contentRef","eventHandler"],"mappings":"wYA8DAA,EAAA,CACA,KAAA,aAEA,WAAA,CACA,oBAAAC,EAAA,QACA,kBAAAC,EAAA,OACA,EAEA,OAAA,CACAC,UAAA,CACA,SAAA,iBACA,MAAA,cACA,eAAA,iBACA,qBAAA,iBACA,sBAAA,wBACA,gBAAA,kBACA,cAAA,cACA,CAAA,CACA,EAEA,MAAA,CAIA,MAAA,CACA,KAAA,OACA,SAAA,EACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAA,OAAA,OAAAC,sBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,OAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAE,EAAA,gBAAA,CAAA,CACA,EAKA,kBAAA,CACA,KAAA,SACA,QAAA,IACA,EAKA,YAAA,CACA,KAAA,SACA,QAAA,IACA,EAMA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,oBAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAOA,gBAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,EAOA,cAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,SAOA,SAQA,YAQA,QACA,EAEA,MAAA,CACA,MAAA,CAIA,uBAAA,IACA,CACA,EAEA,SAAA,CACA,YAAA,CACA,MAAA,CACA,MAAA,KAAA,MACA,aAAA,KAAA,aACA,KAAA,KAAA,KACA,YAAA,KAAA,YACA,KAAA,WACA,aAAA,KAAA,MACA,gBAAA,KAAA,SAAA,SAAA,EACA,YAAA,KAAA,OACA,gBAAA,UACA,wBAAA,KAAA,aACA,gBAAA,KAAA,MACA,CACA,EAEA,WAAA,CACA,MAAA,CACA,KAAA,UACA,GAAA,KAAA,OAGA,MAAA,gBACA,aAAA,KAAA,KACA,CACA,EAEA,uBAAA,CACA,OAAA,KAAA,mBAAA,KAAA,SACA,EAEA,iBAAA,CACA,OAAA,KAAA,aAAA,KAAA,eACA,EAEA,cAAA,CACA,GAAA,GAAA,KAAA,UAAA,KAAA,eAAA,GAAA,KAAA,SAGA,OAAA,KAAA,WACA,EAEA,cAAA,CACA,OAAA,KAAA,YACA,KAAA,iBAAA,cAAA,IAAA,KAAA,WAAA,EADA,EAEA,CACA,EAEA,MAAA,CACA,SAAAC,EAAA,CAGA,KAAA,sBACA,KAAA,yBAAA,EACA,KAAA,MAAA,SAAAA,CAAA,GAGA,CAAAA,GAAA,KAAA,yBACA,KAAA,uBAAA,oBAAA,YAAA,KAAA,gBAAA,EACA,KAAA,uBAAA,KAEA,EAEA,QAAAC,EAAA,CACA,KAAA,UAAA,IAAA,CACA,KAAA,yBAAA,CACA,CAAA,CACA,EAEA,OAAA,CACA,KAAA,GACA,UAAA,GACA,SAAA,CACA,KAAA,uBAAA,CACA,CACA,CACA,EAEA,SAAA,CACA,KAAA,uBAAA,CACA,EAEA,QAAA,CACA,iBAAAC,EAAA,CACA,GAAA,KAAA,QAAA,OAEA,MAAAC,EAAAD,EAAA,OAAA,QAAA,IAAA,EAEAC,GAAA,KAAA,cAAAA,EAAA,IACA,KAAA,eAAAA,EAAA,EAAA,CAEA,EAEA,gBAAA,OACA,OAAA,KAAA,0BAAAC,EAAA,KAAA,MAAA,cAAA,YAAAA,EAAA,cAAA,IAAA,KAAA,MAAA,IACA,EAEA,qBAAA,CACA,KAAA,UACA,KAAA,kBAAA,EAAA,CAEA,EAEA,gBAAA,CACA,KAAA,SACA,KAAA,MAAA,YAAA,KAAA,cAAA,CACA,EAEA,YAAA,OACA,KAAA,SAAA,KAAA,WAEA,KAAA,gBAAA,IACA,KAAA,MAAA,SAAA,KAAA,cAAA,EAEA,KAAA,iBACAA,EAAA,KAAA,eAAA,MAAAA,EAAA,SAGA,EAEA,aAAA,CACA,KAAA,MAAA,QAAA,CACA,EAEA,OAAAC,EAAAC,EAAA,OACA,KAAA,uBAAAA,GACAF,EAAA,KAAA,yBAAA,MAAAA,EAAA,iBAAA,YAAA,KAAA,kBACA,KAAA,MAAA,SAAAC,CAAA,EAEAA,GACA,KAAA,yBAAA,CAEA,EAEA,gBAAAH,EAAAK,EAAA,CACA,CAAA,KAAA,UAAA,CAAA,KAAA,eAAA,GAEA,KAAAA,CAAA,EAAAL,CAAA,CACA,EAEA,0BAAA,CACA,KAAA,UACA,KAAA,UAAA,IAAA,CAGA,KAAA,kBAAA,KAAA,QAAA,GAAA,CAAA,CACA,CAAA,CACA,EAEA,wBAAA,CACA,KAAA,OAAA,eAEA,KAAA,WAAA,CAAA,KAAA,mBACA,QAAA,MAAA;AAAA,qBACA,CAEA,CACA,CACA"}
+{"version":3,"file":"combobox.cjs","sources":["../../../components/combobox/combobox.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/no-static-element-interactions -->\n<template>\n  <div\n    @keydown.esc.stop=\"onKeyValidation($event, 'onEscapeKey')\"\n    @keydown.enter.exact=\"onKeyValidation($event, 'onEnterKey')\"\n    @keydown.up.stop.prevent=\"onKeyValidation($event, 'onUpKey')\"\n    @keydown.down.stop.prevent=\"onKeyValidation($event, 'onDownKey')\"\n    @keydown.home.stop.prevent=\"onKeyValidation($event, 'onHomeKey')\"\n    @keydown.end.stop.prevent=\"onKeyValidation($event, 'onEndKey')\"\n  >\n    <div data-qa=\"dt-combobox-input-wrapper\">\n      <!-- @slot Slot for the combobox input element -->\n      <slot\n        name=\"input\"\n        :input-props=\"inputProps\"\n      />\n    </div>\n\n    <div\n      v-if=\"showList\"\n      ref=\"listWrapper\"\n      data-qa=\"dt-combobox-list-wrapper\"\n      @mouseleave=\"clearHighlightIndex\"\n      @focusout=\"clearHighlightIndex\"\n      @mousemove.capture=\"onMouseHighlight\"\n    >\n      <combobox-loading-list\n        v-if=\"loading && !listRenderedOutside\"\n        v-bind=\"listProps\"\n      />\n      <combobox-empty-list\n        v-else-if=\"emptyList && (emptyStateMessage || $slots.emptyListItem) && !listRenderedOutside\"\n        v-bind=\"listProps\"\n        :message=\"emptyStateMessage\"\n        :item-class=\"emptyStateClass\"\n      >\n        <slot name=\"emptyListItem\" />\n      </combobox-empty-list>\n      <!-- @slot Slot for the combobox list element -->\n      <slot\n        v-else\n        name=\"list\"\n        :list-props=\"listProps\"\n        :opened=\"onOpen\"\n        :clear-highlight-index=\"clearHighlightIndex\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport ComboboxLoadingList from './combobox_loading-list.vue';\nimport ComboboxEmptyList from './combobox_empty-list.vue';\nimport { DtKeyboardListNavigationMixin } from '@/common/mixins';\nimport { getUniqueString } from '@/common/utils';\nimport { COMBOBOX_LABEL_SIZES } from '@/components/combobox';\n\n/**\n * A combobox is a semantic component that displays an input element combined with a listbox,\n * which enables the user to select items from the list.\n * @see https://dialtone.dialpad.com/components/combobox.html\n */\nexport default {\n  name: 'DtCombobox',\n\n  components: {\n    ComboboxLoadingList,\n    ComboboxEmptyList,\n  },\n\n  mixins: [\n    DtKeyboardListNavigationMixin({\n      indexKey: 'highlightIndex',\n      idKey: 'highlightId',\n      listElementKey: 'getListElement',\n      afterHighlightMethod: 'afterHighlight',\n      beginningOfListMethod: 'beginningOfListMethod',\n      endOfListMethod: 'endOfListMethod',\n      activeItemKey: 'activeItemEl',\n    }),\n  ],\n\n  props: {\n    /**\n     * String to use for the input label.\n     */\n    label: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Determines visibility of input label.\n     * @values true, false\n     */\n    labelVisible: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Size of the input, one of `xs`, `sm`, `md`, `lg`, `xl`\n     * @values null, xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: null,\n      validator: (t) => Object.values(COMBOBOX_LABEL_SIZES).includes(t),\n    },\n\n    /**\n     * Description for the input\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Sets an ID on the list element of the component. Used by several aria attributes\n     * as well as when deriving the IDs for each item.\n     */\n    listId: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * A method that will be called when the selection goes past the beginning of the list.\n     */\n    onBeginningOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * A method that will be called when the selection goes past the end of the list.\n     */\n    onEndOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * Determines when to show the list element and also controls the aria-expanded attribute.\n     * @values true, false\n     */\n    showList: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If the list is rendered outside the component, like when using popover as the list wrapper.\n     * @values true, false\n     */\n    listRenderedOutside: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines when to show the skeletons and also controls aria-busy attribute.\n     * @values true, false\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the list to an empty state, and displays the message from prop `emptyStateMessage`.\n     * @values true, false\n     */\n    emptyList: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Message to show when the list is empty\n     */\n    emptyStateMessage: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the empty list element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    emptyStateClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * Programmatically click on the active list item element when a selection\n     * comes from keyboard navigation, i.e. pressing the \"Enter\" key.\n     * @values true, false\n     */\n    clickOnSelect: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired when item selected\n     *\n     * @event select\n     * @type {Number}\n     */\n    'select',\n\n    /**\n     * Event fired when pressing escape\n     *\n     * @event escape\n     */\n    'escape',\n\n    /**\n     * Event fired when the highlight changes\n     *\n     * @event highlight\n     * @type {Number}\n     */\n    'highlight',\n\n    /**\n     * Event fired when list is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean}\n     */\n    'opened',\n  ],\n\n  data () {\n    return {\n      // If the list is rendered at the root, rather than as a child\n      // of this component, this is the ref to that dom element. Set\n      // by the onOpen method.\n      outsideRenderedListRef: null,\n    };\n  },\n\n  computed: {\n    inputProps () {\n      return {\n        label: this.label,\n        labelVisible: this.labelVisible,\n        size: this.size,\n        description: this.description,\n        role: 'combobox',\n        'aria-label': this.label,\n        'aria-expanded': this.showList.toString(),\n        'aria-owns': this.listId,\n        'aria-haspopup': 'listbox',\n        'aria-activedescendant': this.activeItemId,\n        'aria-controls': this.listId,\n      };\n    },\n\n    listProps () {\n      return {\n        role: 'listbox',\n        id: this.listId,\n        // The list has to be positioned relatively so that the auto-scroll can\n        // calculate the correct offset for the list items.\n        class: 'd-ps-relative',\n        'aria-label': this.label,\n      };\n    },\n\n    beginningOfListMethod () {\n      return this.onBeginningOfList || this.jumpToEnd;\n    },\n\n    endOfListMethod () {\n      return this.onEndOfList || this.jumpToBeginning;\n    },\n\n    activeItemId () {\n      if (!this.showList || this.highlightIndex < 0 || this.loading) {\n        return;\n      }\n      return this.highlightId;\n    },\n\n    activeItemEl () {\n      if (!this.highlightId) return '';\n      return this.getListElement().querySelector('#' + this.highlightId);\n    },\n  },\n\n  watch: {\n    showList (showList) {\n      // When the list's visibility changes reset the highlight index.\n\n      if (!this.listRenderedOutside) {\n        this.setInitialHighlightIndex();\n        this.$emit('opened', showList);\n      }\n\n      if (!showList && this.outsideRenderedListRef) {\n        this.outsideRenderedListRef.removeEventListener('mousemove', this.onMouseHighlight);\n        this.outsideRenderedListRef = null;\n      }\n    },\n\n    loading () {\n      this.$nextTick(() => {\n        this.setInitialHighlightIndex();\n      });\n    },\n\n    $props: {\n      deep: true,\n      immediate: true,\n      handler () {\n        this.validateEmptyListProps();\n      },\n    },\n  },\n\n  created () {\n    this.validateEmptyListProps();\n  },\n\n  methods: {\n    onMouseHighlight (e) {\n      if (this.loading) return;\n\n      const liElement = e.target.closest('li');\n\n      if (liElement && this.highlightId !== liElement.id) {\n        this.setHighlightId(liElement.id);\n      }\n    },\n\n    getListElement () {\n      return this.outsideRenderedListRef ?? this.$refs.listWrapper?.querySelector(`#${this.listId}`);\n    },\n\n    clearHighlightIndex () {\n      if (this.showList) {\n        this.setHighlightIndex(-1);\n      }\n    },\n\n    afterHighlight () {\n      if (this.loading) return;\n      this.$emit('highlight', this.highlightIndex);\n    },\n\n    onEnterKey () {\n      if (this.loading || this.emptyList) return;\n\n      if (this.highlightIndex >= 0) {\n        this.$emit('select', this.highlightIndex);\n\n        if (this.clickOnSelect) {\n          this.activeItemEl?.click();\n        }\n      }\n    },\n\n    onEscapeKey () {\n      this.$emit('escape');\n    },\n\n    onOpen (open, contentRef) {\n      this.outsideRenderedListRef = contentRef;\n      this.outsideRenderedListRef?.addEventListener('mousemove', this.onMouseHighlight);\n      this.$emit('opened', open);\n\n      if (open) {\n        this.setInitialHighlightIndex();\n      }\n    },\n\n    onKeyValidation (e, eventHandler) {\n      if (!this.showList || !this.getListElement()) return;\n\n      this[eventHandler](e);\n    },\n\n    setInitialHighlightIndex () {\n      if (!this.showList) return;\n      this.$nextTick(() => {\n      // When the list's is shown, reset the highlight index.\n      // If the list is loading, set to -1\n        this.setHighlightIndex(this.loading ? -1 : 0);\n      });\n    },\n\n    validateEmptyListProps () {\n      if (this.$slots.emptyListItem) { return; }\n\n      if (this.emptyList && !this.emptyStateMessage) {\n        console.error(`Invalid props: you must pass both props emptyList and emptyStateMessage to show the\n      empty message.`);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","ComboboxLoadingList","ComboboxEmptyList","DtKeyboardListNavigationMixin","t","COMBOBOX_LABEL_SIZES","getUniqueString","showList","e","liElement","_a","open","contentRef","eventHandler"],"mappings":"wYA8DAA,EAAA,CACA,KAAA,aAEA,WAAA,CACA,oBAAAC,EAAAA,QACA,kBAAAC,EAAAA,OACA,EAEA,OAAA,CACAC,UAAA,CACA,SAAA,iBACA,MAAA,cACA,eAAA,iBACA,qBAAA,iBACA,sBAAA,wBACA,gBAAA,kBACA,cAAA,cACA,CAAA,CACA,EAEA,MAAA,CAIA,MAAA,CACA,KAAA,OACA,SAAA,EACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAC,GAAA,OAAA,OAAAC,sBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,OAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAE,EAAAA,gBAAA,CAAA,CACA,EAKA,kBAAA,CACA,KAAA,SACA,QAAA,IACA,EAKA,YAAA,CACA,KAAA,SACA,QAAA,IACA,EAMA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,oBAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,UAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAOA,gBAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,EAOA,cAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,SAOA,SAQA,YAQA,QACA,EAEA,MAAA,CACA,MAAA,CAIA,uBAAA,IACA,CACA,EAEA,SAAA,CACA,YAAA,CACA,MAAA,CACA,MAAA,KAAA,MACA,aAAA,KAAA,aACA,KAAA,KAAA,KACA,YAAA,KAAA,YACA,KAAA,WACA,aAAA,KAAA,MACA,gBAAA,KAAA,SAAA,SAAA,EACA,YAAA,KAAA,OACA,gBAAA,UACA,wBAAA,KAAA,aACA,gBAAA,KAAA,MACA,CACA,EAEA,WAAA,CACA,MAAA,CACA,KAAA,UACA,GAAA,KAAA,OAGA,MAAA,gBACA,aAAA,KAAA,KACA,CACA,EAEA,uBAAA,CACA,OAAA,KAAA,mBAAA,KAAA,SACA,EAEA,iBAAA,CACA,OAAA,KAAA,aAAA,KAAA,eACA,EAEA,cAAA,CACA,GAAA,GAAA,KAAA,UAAA,KAAA,eAAA,GAAA,KAAA,SAGA,OAAA,KAAA,WACA,EAEA,cAAA,CACA,OAAA,KAAA,YACA,KAAA,eAAA,EAAA,cAAA,IAAA,KAAA,WAAA,EADA,EAEA,CACA,EAEA,MAAA,CACA,SAAAC,EAAA,CAGA,KAAA,sBACA,KAAA,yBAAA,EACA,KAAA,MAAA,SAAAA,CAAA,GAGA,CAAAA,GAAA,KAAA,yBACA,KAAA,uBAAA,oBAAA,YAAA,KAAA,gBAAA,EACA,KAAA,uBAAA,KAEA,EAEA,SAAA,CACA,KAAA,UAAA,IAAA,CACA,KAAA,yBAAA,CACA,CAAA,CACA,EAEA,OAAA,CACA,KAAA,GACA,UAAA,GACA,SAAA,CACA,KAAA,uBAAA,CACA,CACA,CACA,EAEA,SAAA,CACA,KAAA,uBAAA,CACA,EAEA,QAAA,CACA,iBAAAC,EAAA,CACA,GAAA,KAAA,QAAA,OAEA,MAAAC,EAAAD,EAAA,OAAA,QAAA,IAAA,EAEAC,GAAA,KAAA,cAAAA,EAAA,IACA,KAAA,eAAAA,EAAA,EAAA,CAEA,EAEA,gBAAA,OACA,OAAA,KAAA,0BAAAC,EAAA,KAAA,MAAA,cAAA,YAAAA,EAAA,cAAA,IAAA,KAAA,MAAA,IACA,EAEA,qBAAA,CACA,KAAA,UACA,KAAA,kBAAA,EAAA,CAEA,EAEA,gBAAA,CACA,KAAA,SACA,KAAA,MAAA,YAAA,KAAA,cAAA,CACA,EAEA,YAAA,OACA,KAAA,SAAA,KAAA,WAEA,KAAA,gBAAA,IACA,KAAA,MAAA,SAAA,KAAA,cAAA,EAEA,KAAA,iBACAA,EAAA,KAAA,eAAA,MAAAA,EAAA,SAGA,EAEA,aAAA,CACA,KAAA,MAAA,QAAA,CACA,EAEA,OAAAC,EAAAC,EAAA,OACA,KAAA,uBAAAA,GACAF,EAAA,KAAA,yBAAA,MAAAA,EAAA,iBAAA,YAAA,KAAA,kBACA,KAAA,MAAA,SAAAC,CAAA,EAEAA,GACA,KAAA,yBAAA,CAEA,EAEA,gBAAAH,EAAAK,EAAA,CACA,CAAA,KAAA,UAAA,CAAA,KAAA,eAAA,GAEA,KAAAA,CAAA,EAAAL,CAAA,CACA,EAEA,0BAAA,CACA,KAAA,UACA,KAAA,UAAA,IAAA,CAGA,KAAA,kBAAA,KAAA,QAAA,GAAA,CAAA,CACA,CAAA,CACA,EAEA,wBAAA,CACA,KAAA,OAAA,eAEA,KAAA,WAAA,CAAA,KAAA,mBACA,QAAA,MAAA;AAAA,qBACA,CAEA,CACA,CACA"}

package/dist/vue2/lib/combobox/combobox.js

@@ -216,7 +216,7 @@ const h = {
     showList(i) {
       this.listRenderedOutside || (this.setInitialHighlightIndex(), this.$emit("opened", i)), !i && this.outsideRenderedListRef && (this.outsideRenderedListRef.removeEventListener("mousemove", this.onMouseHighlight), this.outsideRenderedListRef = null);
     },
-    loading(i) {
+    loading() {
       this.$nextTick(() => {
         this.setInitialHighlightIndex();
       });