@dialpad/dialtone-vue 3.222.2 → 3.223.0-next.1

package/dist/lib/collapsible/collapsible.js.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible.js","names":[],"sources":["../../../components/collapsible/collapsible.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    ref=\"collapsible\"\n    v-on=\"collapsibleListeners\"\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=\"collapsibleListeners\"\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 { extractVueListeners, getUniqueString, hasSlotContent } 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/vue3';\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  compatConfig: { MODE: 3 },\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    collapsibleListeners () {\n      return extractVueListeners(this.$attrs);\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  created () {\n    this.validateProperAnchor();\n  },\n\n  beforeUnmount () {\n    this._isUnmounting = true;\n    // Prevent transition callbacks from calling into dead lifecycle methods\n    // after this component is torn down (DP-185811).\n  },\n\n  methods: {\n    onLeaveTransitionComplete () {\n      if (this._isUnmounting) return;\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      if (this._isUnmounting) return;\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 && !hasSlotContent(this.$slots.anchor)) {\n        console.error('anchor text and anchor slot content cannot both be falsy');\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"collapsible.js","names":[],"sources":["../../../components/Collapsible/Collapsible.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    ref=\"collapsible\"\n    v-on=\"collapsibleListeners\"\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=\"collapsibleListeners\"\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 { extractVueListeners, getUniqueString, hasSlotContent } from '@/common/utils';\nimport DtCollapsibleLazyShow from './CollapsibleLazyShow.vue';\nimport { DtButton } from '@/components/Button';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue';\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    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. When null (default), the collapsible\n     * starts expanded and toggles on click. When set to true or false, the default\n     * trigger is disabled and the parent controls visibility via v-model:open.\n     * @values null, true, false\n     */\n    open: {\n      type: [Boolean, null],\n      default: null,\n    },\n\n    /**\n     * 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    collapsibleListeners () {\n      return extractVueListeners(this.$attrs);\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  created () {\n    this.validateProperAnchor();\n  },\n\n  beforeUnmount () {\n    this._isUnmounting = true;\n    // Prevent transition callbacks from calling into dead lifecycle methods\n    // after this component is torn down (DP-185811).\n  },\n\n  methods: {\n    onLeaveTransitionComplete () {\n      if (this._isUnmounting) return;\n      this.$emit('opened', false);\n      if (this.open !== null) {\n        this.$emit('update:open', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      if (this._isUnmounting) return;\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 && !hasSlotContent(this.$slots.anchor)) {\n        console.error('anchor text and anchor slot content cannot both be falsy');\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-constants.cjs","names":[],"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"],"mappings":"+FAAA,IAAa,EAAuB,CAClC,YAAa,KACb,MAAO,KACP,QAAS,KACT,MAAO,KACP,YAAa,KACd,CAED,EAAe,CACb,uBACD"}
+{"version":3,"file":"combobox-constants.cjs","names":[],"sources":["../../../components/Combobox/ComboboxConstants.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"],"mappings":"+FAAA,IAAa,EAAuB,CAClC,YAAa,KACb,MAAO,KACP,QAAS,KACT,MAAO,KACP,YAAa,KACd,CAED,EAAe,CACb,uBACD"}

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

@@ -1,4 +1,4 @@
-//#region components/combobox/combobox_constants.js
+//#region components/Combobox/ComboboxConstants.js
 var e = {
 	EXTRA_SMALL: "xs",
 	SMALL: "sm",

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-constants.js","names":[],"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"],"mappings":";AAAA,IAAa,IAAuB;CAClC,aAAa;CACb,OAAO;CACP,SAAS;CACT,OAAO;CACP,aAAa;CACd,EAED,IAAe,EACb,yBACD"}
+{"version":3,"file":"combobox-constants.js","names":[],"sources":["../../../components/Combobox/ComboboxConstants.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"],"mappings":";AAAA,IAAa,IAAuB;CAClC,aAAa;CACb,OAAO;CACP,SAAS;CACT,OAAO;CACP,aAAa;CACd,EAED,IAAe,EACb,yBACD"}

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-empty-list.cjs","names":[],"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"],"mappings":"gQAqBA,IAAK,EAAU,CACb,KAAM,oBAEN,WAAY,CAAE,WAAA,EAAA,QAAY,CAE1B,MAAO,CAIL,QAAS,CACP,KAAM,OACN,SAAU,GACX,CAOD,UAAW,CACT,KAAM,CAAC,OAAQ,OAAQ,MAAM,CAC7B,QAAS,GACV,CACF,CACF,IA3CG,MAAM,yBACN,UAAQ,gJAYL,KAdL,EAcK,EAAA,EAAA,EAAA,YADI,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,aADU,EAAA,CANb,KAAK,SACL,kBAAgB,OAChB,KAAK,SACJ,OAAA,EAAA,EAAA,gBAAK,CAAA,8BAAkC,EAAA,UAAS,CAAA,6BAEvB,EAAA,EAAA,EAAA,oBAAA,OAAA,MAAA,EAAA,EAAA,iBAAjB,EAAA,QAAO,CAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"combobox-empty-list.cjs","names":[],"sources":["../../../components/Combobox/ComboboxEmptyList.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/ListItem';\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"],"mappings":"gQAqBA,IAAK,EAAU,CACb,KAAM,oBAEN,WAAY,CAAE,WAAA,EAAA,QAAY,CAE1B,MAAO,CAIL,QAAS,CACP,KAAM,OACN,SAAU,GACX,CAOD,UAAW,CACT,KAAM,CAAC,OAAQ,OAAQ,MAAM,CAC7B,QAAS,GACV,CACF,CACF,IA3CG,MAAM,yBACN,UAAQ,gJAYL,KAdL,EAcK,EAAA,EAAA,EAAA,YADI,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,aADU,EAAA,CANb,KAAK,SACL,kBAAgB,OAChB,KAAK,SACJ,OAAA,EAAA,EAAA,gBAAK,CAAA,8BAAkC,EAAA,UAAS,CAAA,6BAEvB,EAAA,EAAA,EAAA,oBAAA,OAAA,MAAA,EAAA,EAAA,iBAAjB,EAAA,QAAO,CAAA,EAAA,CAAA,CAAA"}

package/dist/lib/combobox/combobox-empty-list.js

@@ -1,7 +1,7 @@
 import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import t from "../list-item/list-item.js";
 import { createElementBlock as n, createElementVNode as r, createVNode as i, normalizeClass as a, openBlock as o, renderSlot as s, resolveComponent as c, toDisplayString as l, withCtx as u } from "vue";
-//#region components/combobox/combobox_empty-list.vue
+//#region components/Combobox/ComboboxEmptyList.vue
 var d = {
 	name: "ComboboxEmptyList",
 	components: { DtListItem: t },

package/dist/lib/combobox/combobox-empty-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-empty-list.js","names":[],"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"],"mappings":";;;;AAqBA,IAAK,IAAU;CACb,MAAM;CAEN,YAAY,EAAE,YAAA,GAAY;CAE1B,OAAO;EAIL,SAAS;GACP,MAAM;GACN,UAAU;GACX;EAOD,WAAW;GACT,MAAM;IAAC;IAAQ;IAAQ;IAAM;GAC7B,SAAS;GACV;EACF;CACF;CA3CG,OAAM;CACN,WAAQ;;;;aAFV,EAcK,MAdL,GAcK,CAVH,EASO,EAAA,QAAA,WAAA,EAAA,QAAA,CARL,EAOe,GAAA;EANb,MAAK;EACL,mBAAgB;EAChB,MAAK;EACJ,OAAK,EAAA,CAAA,+BAAkC,EAAA,UAAS,CAAA;;mBAEvB,CAA1B,EAA0B,QAAA,MAAA,EAAjB,EAAA,QAAO,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"combobox-empty-list.js","names":[],"sources":["../../../components/Combobox/ComboboxEmptyList.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/ListItem';\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"],"mappings":";;;;AAqBA,IAAK,IAAU;CACb,MAAM;CAEN,YAAY,EAAE,YAAA,GAAY;CAE1B,OAAO;EAIL,SAAS;GACP,MAAM;GACN,UAAU;GACX;EAOD,WAAW;GACT,MAAM;IAAC;IAAQ;IAAQ;IAAM;GAC7B,SAAS;GACV;EACF;CACF;CA3CG,OAAM;CACN,WAAQ;;;;aAFV,EAcK,MAdL,GAcK,CAVH,EASO,EAAA,QAAA,WAAA,EAAA,QAAA,CARL,EAOe,GAAA;EANb,MAAK;EACL,mBAAgB;EAChB,MAAK;EACJ,OAAK,EAAA,CAAA,+BAAkC,EAAA,UAAS,CAAA;;mBAEvB,CAA1B,EAA0B,QAAA,MAAA,EAAjB,EAAA,QAAO,EAAA,EAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-loading-list.cjs","names":[],"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"],"mappings":"sSAuBA,IAAK,EAAU,CACb,KAAM,sBAEN,WAAY,CAAE,WAAA,EAAA,QAAY,WAAA,EAAA,QAAY,CACvC,IAzBG,MAAM,2BACN,YAAU,sKAaP,KAfL,EAeK,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBADY,EAAA,SAAA,MAAA,EAAA,EAAA,YATG,EAAT,qBASM,EAAA,CARZ,IAAK,EACN,KAAK,SACL,kBAAgB,mCAKd,EAAA,EAAA,EAAA,aAAA,EAAA,CAFC,cAAa,CAAA,KAAA,OAAgB,CAC7B,OAAQ"}
+{"version":3,"file":"combobox-loading-list.cjs","names":[],"sources":["../../../components/Combobox/ComboboxLoadingList.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/ListItem';\nimport { DtSkeleton } from '@/components/Skeleton';\n\nexport default {\n  name: 'ComboboxLoadingList',\n\n  components: { DtListItem, DtSkeleton },\n};\n</script>\n"],"mappings":"sSAuBA,IAAK,EAAU,CACb,KAAM,sBAEN,WAAY,CAAE,WAAA,EAAA,QAAY,WAAA,EAAA,QAAY,CACvC,IAzBG,MAAM,2BACN,YAAU,sKAaP,KAfL,EAeK,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBADY,EAAA,SAAA,MAAA,EAAA,EAAA,YATG,EAAT,qBASM,EAAA,CARZ,IAAK,EACN,KAAK,SACL,kBAAgB,mCAKd,EAAA,EAAA,EAAA,aAAA,EAAA,CAFC,cAAa,CAAA,KAAA,OAAgB,CAC7B,OAAQ"}

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

@@ -2,7 +2,7 @@ import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import t from "../list-item/list-item.js";
 import n from "../skeleton/skeleton.js";
 import { Fragment as r, createElementBlock as i, createVNode as a, openBlock as o, renderList as s, resolveComponent as c, withCtx as l } from "vue";
-//#region components/combobox/combobox_loading-list.vue
+//#region components/Combobox/ComboboxLoadingList.vue
 var u = {
 	name: "ComboboxLoadingList",
 	components: {

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-loading-list.js","names":[],"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"],"mappings":";;;;;AAuBA,IAAK,IAAU;CACb,MAAM;CAEN,YAAY;EAAE,YAAA;EAAY,YAAA;EAAY;CACvC;CAzBG,OAAM;CACN,aAAU;;;;aAFZ,EAeK,MAfL,GAeK,EAAA,GAAA,EAXH,EAUe,GAAA,MAAA,EATG,IAAT,MADT,EAUe,GAAA;EARZ,KAAK;EACN,MAAK;EACL,mBAAgB;;mBAKd,CAHF,EAGE,GAAA;GAFC,eAAa,EAAA,MAAA,QAAgB;GAC7B,QAAQ"}
+{"version":3,"file":"combobox-loading-list.js","names":[],"sources":["../../../components/Combobox/ComboboxLoadingList.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/ListItem';\nimport { DtSkeleton } from '@/components/Skeleton';\n\nexport default {\n  name: 'ComboboxLoadingList',\n\n  components: { DtListItem, DtSkeleton },\n};\n</script>\n"],"mappings":";;;;;AAuBA,IAAK,IAAU;CACb,MAAM;CAEN,YAAY;EAAE,YAAA;EAAY,YAAA;EAAY;CACvC;CAzBG,OAAM;CACN,aAAU;;;;aAFZ,EAeK,MAfL,GAeK,EAAA,GAAA,EAXH,EAUe,GAAA,MAAA,EATG,IAAT,MADT,EAUe,GAAA;EARZ,KAAK;EACN,MAAK;EACL,mBAAgB;;mBAKd,CAHF,EAGE,GAAA;GAFC,eAAa,EAAA,MAAA,QAAgB;GAC7B,QAAQ"}

package/dist/lib/combobox/combobox.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../combobox-DhjZxfUw.cjs`);exports.default=e.t;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../Combobox-D4hc1-41.cjs`);exports.default=e.t;

package/dist/lib/combobox/combobox.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../combobox-DgClbLOg.js";
+import { t as e } from "../../Combobox-By01ETlj.js";
 export { e as default };

package/dist/lib/combobox/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../combobox-DhjZxfUw.cjs`),t=require(`./combobox-constants.cjs`);exports.COMBOBOX_LABEL_SIZES=t.COMBOBOX_LABEL_SIZES,exports.DtCombobox=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../Combobox-D4hc1-41.cjs`),t=require(`./combobox-constants.cjs`);exports.COMBOBOX_LABEL_SIZES=t.COMBOBOX_LABEL_SIZES,exports.DtCombobox=e.t;

package/dist/lib/combobox/index.js

@@ -1,3 +1,3 @@
-import { t as e } from "../../combobox-DgClbLOg.js";
+import { t as e } from "../../Combobox-By01ETlj.js";
 import { COMBOBOX_LABEL_SIZES as t } from "./combobox-constants.js";
 export { t as COMBOBOX_LABEL_SIZES, e as DtCombobox };

package/dist/lib/combobox-multi-select/combobox-multi-select-constants.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={EXTRA_SMALL:`xs`,SMALL:`sm`,DEFAULT:`md`},t={xs:`xs`,sm:`xs`,md:`sm`},n={xs:1.4,sm:-.1,md:-.3},r={MULTI_SELECT_SIZES:e,CHIP_SIZES:t,CHIP_TOP_POSITION:n};exports.CHIP_SIZES=t,exports.CHIP_TOP_POSITION=n,exports.MULTI_SELECT_SIZES=e,exports.default=r;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={EXTRA_SMALL:`xs`,SMALL:`sm`,DEFAULT:`md`},t={100:`xs`,200:`xs`,300:`sm`,xs:`xs`,sm:`xs`,md:`sm`},n={100:1.4,200:.4,300:.2,xs:1.4,sm:-.1,md:-.3},r={MULTI_SELECT_SIZES:e,CHIP_SIZES:t,CHIP_TOP_POSITION:n};exports.CHIP_SIZES=t,exports.CHIP_TOP_POSITION=n,exports.MULTI_SELECT_SIZES=e,exports.default=r;
 //# sourceMappingURL=combobox-multi-select-constants.cjs.map

package/dist/lib/combobox-multi-select/combobox-multi-select-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select-constants.cjs","names":[],"sources":["../../../components/combobox_multi_select/combobox_multi_select_constants.js"],"sourcesContent":["export const MULTI_SELECT_SIZES = {\n  // Chip has no 'lg' and 'xl' size. So we don't support that in multi-select.\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n};\n\nexport const CHIP_SIZES = {\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n};\n\n// Adjusted in DLT-3409 for sub-pixel offset for sizes sm and md\nexport const CHIP_TOP_POSITION = {\n  xs: 1.4,\n  sm: -0.1,\n  md: -0.3,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n"],"mappings":"+FAAA,IAAa,EAAqB,CAEhC,YAAa,KACb,MAAO,KACP,QAAS,KACV,CAEY,EAAa,CACxB,GAAI,KACJ,GAAI,KACJ,GAAI,KACL,CAGY,EAAoB,CAC/B,GAAI,IACJ,GAAI,IACJ,GAAI,IACL,CAED,EAAe,CACb,qBACA,aACA,oBACD"}
+{"version":3,"file":"combobox-multi-select-constants.cjs","names":[],"sources":["../../../components/ComboboxMultiSelect/ComboboxMultiSelectConstants.js"],"sourcesContent":["export const MULTI_SELECT_SIZES = {\n  // Chip has no 'lg' and 'xl' size. So we don't support that in multi-select.\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n};\n\nexport const CHIP_SIZES = {\n  // Numeric (preferred)\n  100: 'xs',\n  200: 'xs',\n  300: 'sm',\n  // T-shirt aliases (deprecated)\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n};\n\n// Adjusted in DLT-3409 for sub-pixel offset for sizes sm and md\nexport const CHIP_TOP_POSITION = {\n  // Numeric (preferred)\n  100: 1.4,\n  200: 0.4,\n  300: 0.2,\n  // T-shirt aliases (deprecated)\n  xs: 1.4,\n  sm: -0.1,\n  md: -0.3,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n"],"mappings":"+FAAA,IAAa,EAAqB,CAEhC,YAAa,KACb,MAAO,KACP,QAAS,KACV,CAEY,EAAa,CAExB,IAAK,KACL,IAAK,KACL,IAAK,KAEL,GAAI,KACJ,GAAI,KACJ,GAAI,KACL,CAGY,EAAoB,CAE/B,IAAK,IACL,IAAK,GACL,IAAK,GAEL,GAAI,IACJ,GAAI,IACJ,GAAI,IACL,CAED,EAAe,CACb,qBACA,aACA,oBACD"}

package/dist/lib/combobox-multi-select/combobox-multi-select-constants.js

@@ -1,13 +1,19 @@
-//#region components/combobox_multi_select/combobox_multi_select_constants.js
+//#region components/ComboboxMultiSelect/ComboboxMultiSelectConstants.js
 var e = {
 	EXTRA_SMALL: "xs",
 	SMALL: "sm",
 	DEFAULT: "md"
 }, t = {
+	100: "xs",
+	200: "xs",
+	300: "sm",
 	xs: "xs",
 	sm: "xs",
 	md: "sm"
 }, n = {
+	100: 1.4,
+	200: .4,
+	300: .2,
 	xs: 1.4,
 	sm: -.1,
 	md: -.3

package/dist/lib/combobox-multi-select/combobox-multi-select-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select-constants.js","names":[],"sources":["../../../components/combobox_multi_select/combobox_multi_select_constants.js"],"sourcesContent":["export const MULTI_SELECT_SIZES = {\n  // Chip has no 'lg' and 'xl' size. So we don't support that in multi-select.\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n};\n\nexport const CHIP_SIZES = {\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n};\n\n// Adjusted in DLT-3409 for sub-pixel offset for sizes sm and md\nexport const CHIP_TOP_POSITION = {\n  xs: 1.4,\n  sm: -0.1,\n  md: -0.3,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n"],"mappings":";AAAA,IAAa,IAAqB;CAEhC,aAAa;CACb,OAAO;CACP,SAAS;CACV,EAEY,IAAa;CACxB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGY,IAAoB;CAC/B,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAED,IAAe;CACb;CACA;CACA;CACD"}
+{"version":3,"file":"combobox-multi-select-constants.js","names":[],"sources":["../../../components/ComboboxMultiSelect/ComboboxMultiSelectConstants.js"],"sourcesContent":["export const MULTI_SELECT_SIZES = {\n  // Chip has no 'lg' and 'xl' size. So we don't support that in multi-select.\n  EXTRA_SMALL: 'xs',\n  SMALL: 'sm',\n  DEFAULT: 'md',\n};\n\nexport const CHIP_SIZES = {\n  // Numeric (preferred)\n  100: 'xs',\n  200: 'xs',\n  300: 'sm',\n  // T-shirt aliases (deprecated)\n  xs: 'xs',\n  sm: 'xs',\n  md: 'sm',\n};\n\n// Adjusted in DLT-3409 for sub-pixel offset for sizes sm and md\nexport const CHIP_TOP_POSITION = {\n  // Numeric (preferred)\n  100: 1.4,\n  200: 0.4,\n  300: 0.2,\n  // T-shirt aliases (deprecated)\n  xs: 1.4,\n  sm: -0.1,\n  md: -0.3,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n"],"mappings":";AAAA,IAAa,IAAqB;CAEhC,aAAa;CACb,OAAO;CACP,SAAS;CACV,EAEY,IAAa;CAExB,KAAK;CACL,KAAK;CACL,KAAK;CAEL,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGY,IAAoB;CAE/B,KAAK;CACL,KAAK;CACL,KAAK;CAEL,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAED,IAAe;CACb;CACA;CACA;CACD"}

package/dist/lib/combobox-multi-select/combobox-multi-select-story-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select-story-constants.cjs","names":[],"sources":["../../../components/combobox_multi_select/combobox_multi_select_story_constants.js"],"sourcesContent":["// The item list for default story\nexport const ITEMS_LIST_DATA = [\n  { id: 'item1', value: 'item1', type: 'MAINLINE' },\n  { id: 'item2', value: 'item2', type: 'MAINLINE' },\n  { id: 'item3', value: 'item3', type: 'MAINLINE' },\n  { id: 'item4', value: 'item4', type: 'MAINLINE' },\n  { id: 'item5', value: 'item5 this is a longer item for testing truncation', type: 'MAINLINE' },\n  { id: 'item6', value: 'item6', type: 'MAINLINE' },\n  { id: 'item7', value: 'item7', type: 'MAINLINE' },\n  { id: 'item8', value: 'item8', type: 'Other' },\n  { id: 'item9', value: 'item9', type: 'MAINLINE' },\n  { id: 'item10', value: 'item10 another longer item', type: 'MAINLINE' },\n  { id: 'item11', value: 'item11', type: 'MAINLINE' },\n  { id: 'item12', value: 'item12', type: 'Other' },\n  { id: 'item13', value: 'item13', type: 'MAINLINE' },\n  { id: 'item14', value: 'item14', type: 'MAINLINE' },\n  { id: 'item15', value: 'item15 one more slightly longer item', type: 'MAINLINE' },\n  { id: 'item16', value: 'item16', type: 'MAINLINE' },\n  { id: 'item17', value: 'item17', type: 'MAINLINE' },\n  { id: 'item18', value: 'item18', type: 'Other' },\n  { id: 'item19', value: 'item19', type: 'MAINLINE' },\n  { id: 'item20', value: 'item20', type: 'MAINLINE' },\n  { id: 'item21', value: 'item21', type: 'MAINLINE' },\n  { id: 'item22', value: 'item22', type: 'Other' },\n];\n"],"mappings":"mEACA,IAAa,EAAkB,CAC7B,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,qDAAsD,KAAM,WAAY,CAC9F,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,QAAS,CAC9C,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,SAAU,MAAO,6BAA8B,KAAM,WAAY,CACvE,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CAChD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,uCAAwC,KAAM,WAAY,CACjF,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CAChD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CACjD"}
+{"version":3,"file":"combobox-multi-select-story-constants.cjs","names":[],"sources":["../../../components/ComboboxMultiSelect/ComboboxMultiSelectStoryConstants.js"],"sourcesContent":["// The item list for default story\nexport const ITEMS_LIST_DATA = [\n  { id: 'item1', value: 'item1', type: 'MAINLINE' },\n  { id: 'item2', value: 'item2', type: 'MAINLINE' },\n  { id: 'item3', value: 'item3', type: 'MAINLINE' },\n  { id: 'item4', value: 'item4', type: 'MAINLINE' },\n  { id: 'item5', value: 'item5 this is a longer item for testing truncation', type: 'MAINLINE' },\n  { id: 'item6', value: 'item6', type: 'MAINLINE' },\n  { id: 'item7', value: 'item7', type: 'MAINLINE' },\n  { id: 'item8', value: 'item8', type: 'Other' },\n  { id: 'item9', value: 'item9', type: 'MAINLINE' },\n  { id: 'item10', value: 'item10 another longer item', type: 'MAINLINE' },\n  { id: 'item11', value: 'item11', type: 'MAINLINE' },\n  { id: 'item12', value: 'item12', type: 'Other' },\n  { id: 'item13', value: 'item13', type: 'MAINLINE' },\n  { id: 'item14', value: 'item14', type: 'MAINLINE' },\n  { id: 'item15', value: 'item15 one more slightly longer item', type: 'MAINLINE' },\n  { id: 'item16', value: 'item16', type: 'MAINLINE' },\n  { id: 'item17', value: 'item17', type: 'MAINLINE' },\n  { id: 'item18', value: 'item18', type: 'Other' },\n  { id: 'item19', value: 'item19', type: 'MAINLINE' },\n  { id: 'item20', value: 'item20', type: 'MAINLINE' },\n  { id: 'item21', value: 'item21', type: 'MAINLINE' },\n  { id: 'item22', value: 'item22', type: 'Other' },\n];\n"],"mappings":"mEACA,IAAa,EAAkB,CAC7B,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,qDAAsD,KAAM,WAAY,CAC9F,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,QAAS,CAC9C,CAAE,GAAI,QAAS,MAAO,QAAS,KAAM,WAAY,CACjD,CAAE,GAAI,SAAU,MAAO,6BAA8B,KAAM,WAAY,CACvE,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CAChD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,uCAAwC,KAAM,WAAY,CACjF,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CAChD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,WAAY,CACnD,CAAE,GAAI,SAAU,MAAO,SAAU,KAAM,QAAS,CACjD"}

package/dist/lib/combobox-multi-select/combobox-multi-select-story-constants.js

@@ -1,4 +1,4 @@
-//#region components/combobox_multi_select/combobox_multi_select_story_constants.js
+//#region components/ComboboxMultiSelect/ComboboxMultiSelectStoryConstants.js
 var e = [
 	{
 		id: "item1",

package/dist/lib/combobox-multi-select/combobox-multi-select-story-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select-story-constants.js","names":[],"sources":["../../../components/combobox_multi_select/combobox_multi_select_story_constants.js"],"sourcesContent":["// The item list for default story\nexport const ITEMS_LIST_DATA = [\n  { id: 'item1', value: 'item1', type: 'MAINLINE' },\n  { id: 'item2', value: 'item2', type: 'MAINLINE' },\n  { id: 'item3', value: 'item3', type: 'MAINLINE' },\n  { id: 'item4', value: 'item4', type: 'MAINLINE' },\n  { id: 'item5', value: 'item5 this is a longer item for testing truncation', type: 'MAINLINE' },\n  { id: 'item6', value: 'item6', type: 'MAINLINE' },\n  { id: 'item7', value: 'item7', type: 'MAINLINE' },\n  { id: 'item8', value: 'item8', type: 'Other' },\n  { id: 'item9', value: 'item9', type: 'MAINLINE' },\n  { id: 'item10', value: 'item10 another longer item', type: 'MAINLINE' },\n  { id: 'item11', value: 'item11', type: 'MAINLINE' },\n  { id: 'item12', value: 'item12', type: 'Other' },\n  { id: 'item13', value: 'item13', type: 'MAINLINE' },\n  { id: 'item14', value: 'item14', type: 'MAINLINE' },\n  { id: 'item15', value: 'item15 one more slightly longer item', type: 'MAINLINE' },\n  { id: 'item16', value: 'item16', type: 'MAINLINE' },\n  { id: 'item17', value: 'item17', type: 'MAINLINE' },\n  { id: 'item18', value: 'item18', type: 'Other' },\n  { id: 'item19', value: 'item19', type: 'MAINLINE' },\n  { id: 'item20', value: 'item20', type: 'MAINLINE' },\n  { id: 'item21', value: 'item21', type: 'MAINLINE' },\n  { id: 'item22', value: 'item22', type: 'Other' },\n];\n"],"mappings":";AACA,IAAa,IAAkB;CAC7B;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAsD,MAAM;EAAY;CAC9F;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAS;CAC9C;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAU,OAAO;EAA8B,MAAM;EAAY;CACvE;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CAChD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAwC,MAAM;EAAY;CACjF;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CAChD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CACjD"}
+{"version":3,"file":"combobox-multi-select-story-constants.js","names":[],"sources":["../../../components/ComboboxMultiSelect/ComboboxMultiSelectStoryConstants.js"],"sourcesContent":["// The item list for default story\nexport const ITEMS_LIST_DATA = [\n  { id: 'item1', value: 'item1', type: 'MAINLINE' },\n  { id: 'item2', value: 'item2', type: 'MAINLINE' },\n  { id: 'item3', value: 'item3', type: 'MAINLINE' },\n  { id: 'item4', value: 'item4', type: 'MAINLINE' },\n  { id: 'item5', value: 'item5 this is a longer item for testing truncation', type: 'MAINLINE' },\n  { id: 'item6', value: 'item6', type: 'MAINLINE' },\n  { id: 'item7', value: 'item7', type: 'MAINLINE' },\n  { id: 'item8', value: 'item8', type: 'Other' },\n  { id: 'item9', value: 'item9', type: 'MAINLINE' },\n  { id: 'item10', value: 'item10 another longer item', type: 'MAINLINE' },\n  { id: 'item11', value: 'item11', type: 'MAINLINE' },\n  { id: 'item12', value: 'item12', type: 'Other' },\n  { id: 'item13', value: 'item13', type: 'MAINLINE' },\n  { id: 'item14', value: 'item14', type: 'MAINLINE' },\n  { id: 'item15', value: 'item15 one more slightly longer item', type: 'MAINLINE' },\n  { id: 'item16', value: 'item16', type: 'MAINLINE' },\n  { id: 'item17', value: 'item17', type: 'MAINLINE' },\n  { id: 'item18', value: 'item18', type: 'Other' },\n  { id: 'item19', value: 'item19', type: 'MAINLINE' },\n  { id: 'item20', value: 'item20', type: 'MAINLINE' },\n  { id: 'item21', value: 'item21', type: 'MAINLINE' },\n  { id: 'item22', value: 'item22', type: 'Other' },\n];\n"],"mappings":";AACA,IAAa,IAAkB;CAC7B;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAsD,MAAM;EAAY;CAC9F;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAS;CAC9C;EAAE,IAAI;EAAS,OAAO;EAAS,MAAM;EAAY;CACjD;EAAE,IAAI;EAAU,OAAO;EAA8B,MAAM;EAAY;CACvE;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CAChD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAwC,MAAM;EAAY;CACjF;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CAChD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAY;CACnD;EAAE,IAAI;EAAU,OAAO;EAAU,MAAM;EAAS;CACjD"}

package/dist/lib/combobox-multi-select/combobox-multi-select.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/constants/index.cjs`),t=require(`../../common/validators/index.cjs`),n=require(`../../common/utils/index.cjs`),r=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),i=require(`../validation-messages/validation-messages.cjs`),a=require(`../chip/chip.cjs`),o=require(`../popover/popover-constants.cjs`),s=require(`../input/input.cjs`),c=require(`../combobox-with-popover/combobox-with-popover.cjs`),l=require(`./combobox-multi-select-constants.cjs`);let u=require(`vue`);var d={compatConfig:{MODE:3},name:`DtComboboxMultiSelect`,components:{DtComboboxWithPopover:c.default,DtInput:s.default,DtChip:a.default,DtValidationMessages:i.default},inheritAttrs:!1,props:{label:{type:String,required:!0},labelVisible:{type:Boolean,default:!0},description:{type:String,default:``},placeholder:{type:String,default:`Select one or start typing`},inputMessages:{type:Array,default:()=>[],validator:e=>t.validationMessageValidator(e)},showInputMessages:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},loadingMessage:{type:String,default:`loading...`},showList:{type:Boolean,default:null},listMaxHeight:{type:String,default:`300px`},selectedItems:{type:Array,default:function(){return[]}},maxSelected:{type:Number,default:0},maxSelectedMessage:{type:Array,default:function(){return[]}},hasSuggestionList:{type:Boolean,default:!0},size:{type:String,default:`md`,validator:e=>Object.values(l.MULTI_SELECT_SIZES).includes(e)},appendTo:{type:[e.HTML_ELEMENT_TYPE,String],default:`body`,validator:e=>o.POPOVER_APPEND_TO_VALUES.includes(e)||e instanceof HTMLElement},transition:{type:String,default:`fade`},collapseOnFocusOut:{type:Boolean,default:!1},listMaxWidth:{type:String,default:``},reservedRightSpace:{type:Number,default:64},chipMaxWidth:{type:String,default:``},inputClass:{type:[String,Object,Array],default:``},inputWrapperClass:{type:[String,Object,Array],default:``},disabled:{type:Boolean,default:!1},dialogClass:{type:[String,Object,Array],default:``}},emits:[`input`,`select`,`remove`,`max-selected`,`keydown`,`chip-keydown`,`escape`,`enter`,`combobox-highlight`],data(){return{value:``,popoverOffset:[0,4],showValidationMessages:!1,resizeWindowObserver:null,initialInputHeight:null,CHIP_SIZES:l.CHIP_SIZES,hasSlotContent:n.hasSlotContent,inputFocused:!1,hideInputText:!1}},computed:{inputPlaceHolder(){return this.selectedItems?.length>0?``:this.placeholder},chipListeners(){return{keydown:e=>{this.disabled||(this.onChipKeyDown(e),this.$emit(`chip-keydown`,e))}}},inputListeners(){return{...n.extractVueListeners(this.$attrs),onInput:e=>{this.$emit(`input`,e),this.hasSuggestionList&&this.showComboboxList()},onKeydown:e=>{if(this.disabled)return;this.onInputKeyDown(e),this.$emit(`keydown`,e);let t=e.key?.toLowerCase();t===`escape`?this.$emit(`escape`,e):t===`enter`&&this.$emit(`enter`,e)},onClick:()=>{this.hasSuggestionList&&this.showComboboxList()}}},chipWrapperClass(){return{[`d-recipe-combobox-multi-select__chip-wrapper-${this.size}--collapsed`]:!this.inputFocused&&this.collapseOnFocusOut}}},watch:{selectedItems:{deep:!0,handler:async function(){await this.initSelectedItems()}},chipMaxWidth:{async handler(){await this.initSelectedItems()}},async label(){await this.$nextTick(),this.setChipsTopPosition()},async description(){await this.$nextTick(),this.setChipsTopPosition()},size:{async handler(){await this.$nextTick();let e=this.getInput();this.revertInputPadding(e),this.setInitialInputHeight(),this.setInputPadding(),this.setChipsTopPosition()}}},async mounted(){this.setInitialInputHeight(),this.resizeWindowObserver=new ResizeObserver(async()=>{this.setChipsTopPosition(),this.setInputPadding()}),this.resizeWindowObserver.observe(document.body),await this.initSelectedItems()},beforeUnmount(){this.resizeWindowObserver?.unobserve(document.body)},methods:{extractNonListeners:n.extractNonListeners,comboboxHighlight(e){this.$emit(`combobox-highlight`,e)},async initSelectedItems(){await this.$nextTick(),this.setInputPadding(),this.setChipsTopPosition(),this.setInputMinWidth(),this.checkMaxSelected()},onChipRemove(e){this.$emit(`remove`,e),this.$refs.input?.focus()},onComboboxSelect(e){this.loading||(this.value=``,this.$emit(`select`,e))},showComboboxList(){this.showList??this.$refs.comboboxWithPopover?.showComboboxList()},closeComboboxList(){this.showList??this.$refs.comboboxWithPopover?.closeComboboxList()},getChips(){if(!this.selectedItems.length||!this.$refs.chips)return null;let e=new Set;return this.selectedItems.map(t=>this.$refs.chips.find((r,i)=>e.has(i)?!1:n.returnFirstEl(r.$el)?.querySelector(`.d-chip__label`)?.textContent?.trim()===t?(e.add(i),!0):!1)).filter(Boolean).map(e=>n.returnFirstEl(e.$el))},getChipButtons(){let e=this.getChips();return e&&e.map(e=>n.returnFirstEl(e).querySelector(`button`))},getLastChipButton(){let e=this.getChipButtons();return e&&e[e.length-1]},getLastChip(){let e=this.getChips();return e&&e[e.length-1]},getFirstChip(){let e=this.getChips();return e&&e[0]},getInput(){return this.$refs.input?.$refs.input},onChipKeyDown(e){let t=e.code?.toLowerCase();t===`arrowleft`?this.navigateBetweenChips(e.target,!0):t===`arrowright`&&(e.target.id===this.getLastChipButton().id?this.moveFromChipToInput():this.navigateBetweenChips(e.target,!1))},onInputKeyDown(e){let t=e.key?.toLowerCase();if(this.selectedItems.length>0&&e.target.selectionStart===0){if(e.target.selectionEnd!==e.target.selectionStart)return;(t===`backspace`||t===`arrowleft`)&&this.moveFromInputToChip()}},moveFromInputToChip(){this.getLastChipButton().focus(),this.$refs.input?.blur(),this.closeComboboxList()},moveFromChipToInput(){this.getLastChipButton().blur(),this.$refs.input?.focus(),this.showComboboxList()},navigateBetweenChips(e,t){let n=this.getChipButtons().indexOf(e),r=t?n-1:n+1;r<0||r>=this.$refs.chips?.length||(this.getChipButtons()[n].blur(),this.getChipButtons()[r].focus(),this.closeComboboxList())},setChipsTopPosition(){let e=this.getInput();if(!e)return;let t=this.$refs.inputSlotWrapper,n=e.getBoundingClientRect().top-t.getBoundingClientRect().top,r=this.$refs.chipsWrapper;r.style.top=n-l.CHIP_TOP_POSITION[this.size]+`px`},setInputPadding(){let e=this.getLastChip(),t=this.getInput();if(!t||(this.revertInputPadding(t),this.popoverOffset=[0,4],!e)||this.collapseOnFocusOut&&!this.inputFocused)return;let n=e.offsetLeft+this.getFullWidth(e),r=t.getBoundingClientRect().width-n,i=this.getFirstChip(),a=i&&e.offsetTop>i.offsetTop;r>this.reservedRightSpace?t.style.paddingLeft=n+`px`:t.style.paddingLeft=`4px`;let o=this.getInputPaddingTop(e,r>this.reservedRightSpace,a);o!=null&&(t.style.paddingTop=`${o}px`)},getInputPaddingTop(e,t,n){if(t&&!n)return null;if(t)return e.offsetTop+2;let r=parseFloat(getComputedStyle(e).marginTop)||0,i=e.getBoundingClientRect().height;return e.offsetTop+i+r+2},revertInputPadding(e){e.style.paddingLeft=``,e.style.paddingTop=``,e.style.paddingBottom=``},getFullWidth(e){let t=window.getComputedStyle(e);return e.offsetWidth+parseInt(t.marginLeft)+parseInt(t.marginRight)},setInputMinWidth(){let e=this.getFirstChip(),t=this.getInput();t&&(e?t.style.minWidth=this.getFullWidth(e)+4+`px`:t.style.minWidth=``)},checkMaxSelected(){this.maxSelected!==0&&(this.selectedItems.length>this.maxSelected?(this.showValidationMessages=!0,this.$emit(`max-selected`)):this.showValidationMessages=!1)},setInitialInputHeight(){let e=this.getInput();e&&(e.style.minHeight=``,e.style.height=``,this.initialInputHeight=e.getBoundingClientRect().height,this.size!==`xs`&&(e.style.minHeight=`${this.initialInputHeight}px`,e.style.height=`auto`))},async handleInputFocusIn(){this.inputFocused=!0,this.collapseOnFocusOut&&(this.hideInputText=!1,await this.$nextTick(),this.setInputPadding())},async handleInputFocusOut(){if(this.inputFocused=!1,this.collapseOnFocusOut){this.hideInputText=!0;let e=this.getInput();if(!e||!e.style.paddingTop)return;this.revertInputPadding(e)}}}},f={ref:`header`},p={key:1,class:`d-recipe-combobox-multi-select__list--loading`},m={ref:`footer`};function h(e,t,n,r,i,a){let o=(0,u.resolveComponent)(`dt-chip`),s=(0,u.resolveComponent)(`dt-input`),c=(0,u.resolveComponent)(`dt-validation-messages`),l=(0,u.resolveComponent)(`dt-combobox-with-popover`);return(0,u.openBlock)(),(0,u.createBlock)(l,(0,u.mergeProps)({ref:`comboboxWithPopover`,label:n.label,"show-list":n.showList,"max-height":n.listMaxHeight,"max-width":n.listMaxWidth,"popover-offset":i.popoverOffset,"has-suggestion-list":n.hasSuggestionList,"content-width":`anchor`,"append-to":n.appendTo,"dialog-class":n.dialogClass,transition:n.transition},a.extractNonListeners(e.$attrs),{onSelect:a.onComboboxSelect,onHighlight:a.comboboxHighlight}),(0,u.createSlots)({input:(0,u.withCtx)(({onInput:e})=>[(0,u.createElementVNode)(`span`,{ref:`inputSlotWrapper`,class:`d-recipe-combobox-multi-select__input-wrapper`,onFocusin:t[1]||(t[1]=(...e)=>a.handleInputFocusIn&&a.handleInputFocusIn(...e)),onFocusout:t[2]||(t[2]=(...e)=>a.handleInputFocusOut&&a.handleInputFocusOut(...e))},[(0,u.createElementVNode)(`span`,{ref:`chipsWrapper`,class:(0,u.normalizeClass)([`d-recipe-combobox-multi-select__chip-wrapper`,a.chipWrapperClass])},[((0,u.openBlock)(!0),(0,u.createElementBlock)(u.Fragment,null,(0,u.renderList)(n.selectedItems,(e,t)=>((0,u.openBlock)(),(0,u.createBlock)(o,(0,u.mergeProps)({ref_for:!0,ref:`chips`,key:`${t}-${e}`,"label-class":[`d-chip__label`],class:[`d-recipe-combobox-multi-select__chip`,{"d-recipe-combobox-multi-select__chip--truncate":!!n.chipMaxWidth}],style:{maxWidth:n.chipMaxWidth},size:i.CHIP_SIZES[n.size],disabled:n.disabled},(0,u.toHandlers)(a.chipListeners),{onKeydown:(0,u.withKeys)(t=>a.onChipRemove(e),[`backspace`]),onClose:t=>a.onChipRemove(e)}),{default:(0,u.withCtx)(()=>[(0,u.createTextVNode)((0,u.toDisplayString)(e),1)]),_:2},1040,[`class`,`style`,`size`,`disabled`,`onKeydown`,`onClose`]))),128))],2),(0,u.createVNode)(s,(0,u.mergeProps)({ref:`input`,modelValue:i.value,"onUpdate:modelValue":t[0]||(t[0]=e=>i.value=e),class:`d-recipe-combobox-multi-select__input`,"input-class":[n.inputClass,{"d-recipe-combobox-multi-select__input--hidden":i.hideInputText}],"input-wrapper-class":n.inputWrapperClass,disabled:n.disabled,"aria-label":n.label,label:n.labelVisible?n.label:``,description:n.description,placeholder:a.inputPlaceHolder,"show-messages":n.showInputMessages,messages:n.inputMessages,size:n.size},a.inputListeners,{onInput:e}),null,16,[`modelValue`,`input-class`,`input-wrapper-class`,`disabled`,`aria-label`,`label`,`description`,`placeholder`,`show-messages`,`messages`,`size`,`onInput`]),(0,u.createVNode)(c,{"validation-messages":n.maxSelectedMessage,"show-messages":i.showValidationMessages},null,8,[`validation-messages`,`show-messages`])],544)]),list:(0,u.withCtx)(()=>[(0,u.createElementVNode)(`div`,{ref:`list`,class:`d-recipe-combobox-multi-select__list`,onMousedown:t[3]||(t[3]=(0,u.withModifiers)(()=>{},[`prevent`]))},[n.loading?((0,u.openBlock)(),(0,u.createElementBlock)(`div`,p,(0,u.toDisplayString)(n.loadingMessage),1)):(0,u.renderSlot)(e.$slots,`list`,{key:0})],544)]),_:2},[i.hasSlotContent(e.$slots.header)?{name:`header`,fn:(0,u.withCtx)(()=>[(0,u.createElementVNode)(`div`,f,[(0,u.renderSlot)(e.$slots,`header`)],512)]),key:`0`}:void 0,i.hasSlotContent(e.$slots.footer)?{name:`footer`,fn:(0,u.withCtx)(()=>[(0,u.createElementVNode)(`div`,m,[(0,u.renderSlot)(e.$slots,`footer`)],512)]),key:`1`}:void 0]),1040,[`label`,`show-list`,`max-height`,`max-width`,`popover-offset`,`has-suggestion-list`,`append-to`,`dialog-class`,`transition`,`onSelect`,`onHighlight`])}var g=r.t(d,[[`render`,h]]);exports.default=g;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/constants/sizes.cjs`),t=require(`../../common/constants/index.cjs`),n=require(`../../common/validators/index.cjs`),r=require(`../../common/utils/index.cjs`),i=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),a=require(`../validation-messages/validation-messages.cjs`),o=require(`../chip/chip.cjs`),s=require(`../popover/popover-constants.cjs`),c=require(`../input/input.cjs`),l=require(`../combobox-with-popover/combobox-with-popover.cjs`),u=require(`./combobox-multi-select-constants.cjs`);let d=require(`vue`);var f={name:`DtComboboxMultiSelect`,components:{DtComboboxWithPopover:l.default,DtInput:c.default,DtChip:o.default,DtValidationMessages:a.default},inheritAttrs:!1,props:{label:{type:String,required:!0},showLabel:{type:Boolean,default:!0},description:{type:String,default:``},placeholder:{type:String,default:`Select one or start typing`},inputMessages:{type:Array,default:()=>[],validator:e=>n.validationMessageValidator(e)},showInputMessages:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},loadingMessage:{type:String,default:`loading...`},showList:{type:Boolean,default:null},listMaxHeight:{type:String,default:`300px`},selectedItems:{type:Array,default:function(){return[]}},maxSelected:{type:Number,default:0},maxSelectedMessage:{type:Array,default:function(){return[]}},hasSuggestionList:{type:Boolean,default:!0},size:{type:[String,Number],default:300,validator:e=>Object.keys(u.CHIP_SIZES).includes(String(e))},appendTo:{type:[t.HTML_ELEMENT_TYPE,String],default:`body`,validator:e=>s.POPOVER_APPEND_TO_VALUES.includes(e)||e instanceof HTMLElement},transition:{type:String,default:`fade`},collapseOnFocusOut:{type:Boolean,default:!1},listMaxWidth:{type:String,default:``},reservedRightSpace:{type:Number,default:64},chipMaxWidth:{type:String,default:``},inputClass:{type:[String,Object,Array],default:``},inputWrapperClass:{type:[String,Object,Array],default:``},disabled:{type:Boolean,default:!1},headerClass:{type:[String,Array,Object],default:``},footerClass:{type:[String,Array,Object],default:``},listClass:{type:[String,Array,Object],default:``},dialogClass:{type:[String,Object,Array],default:``}},emits:[`update:modelValue`,`select`,`remove`,`max-selected`,`keydown`,`chip-keydown`,`escape`,`enter`,`combobox-highlight`],data(){return{value:``,popoverOffset:[0,4],showValidationMessages:!1,resizeWindowObserver:null,initialInputHeight:null,CHIP_SIZES:u.CHIP_SIZES,hasSlotContent:r.hasSlotContent,inputFocused:!1,hideInputText:!1,messagesId:r.getUniqueString()}},computed:{inputPlaceHolder(){return this.selectedItems?.length>0?``:this.placeholder},chipListeners(){return{keydown:e=>{this.disabled||(this.onChipKeyDown(e),this.$emit(`chip-keydown`,e))}}},inputListeners(){return{...r.extractVueListeners(this.$attrs),onInput:e=>{this.$emit(`update:modelValue`,e),this.hasSuggestionList&&this.showComboboxList()},onKeydown:e=>{if(this.disabled)return;this.onInputKeyDown(e),this.$emit(`keydown`,e);let t=e.key?.toLowerCase();t===`escape`?this.$emit(`escape`,e):t===`enter`&&this.$emit(`enter`,e)},onClick:()=>{this.hasSuggestionList&&this.showComboboxList()}}},ariaInvalid(){return r.getValidationState(this.maxSelectedMessage)===t.VALIDATION_MESSAGE_TYPES.CRITICAL?`true`:void 0},ariaDescribedBy(){return this.showValidationMessages&&this.maxSelectedMessage.length>0?this.messagesId:void 0},chipWrapperClass(){return{[`d-recipe-combobox-multi-select__chip-wrapper-${e.COMPONENT_SIZES[String(this.size)]||this.size}--collapsed`]:!this.inputFocused&&this.collapseOnFocusOut}}},watch:{selectedItems:{deep:!0,handler:async function(){await this.initSelectedItems()}},chipMaxWidth:{async handler(){await this.initSelectedItems()}},async label(){await this.$nextTick(),this.setChipsTopPosition()},async description(){await this.$nextTick(),this.setChipsTopPosition()},size:{async handler(){await this.$nextTick();let e=this.getInput();this.revertInputPadding(e),this.setInitialInputHeight(),this.setInputPadding(),this.setChipsTopPosition()}}},async mounted(){this.setInitialInputHeight(),this.resizeWindowObserver=new ResizeObserver(async()=>{this.setChipsTopPosition(),this.setInputPadding()}),this.resizeWindowObserver.observe(document.body),await this.initSelectedItems()},beforeUnmount(){this.resizeWindowObserver?.unobserve(document.body)},methods:{extractNonListeners:r.extractNonListeners,comboboxHighlight(e){this.$emit(`combobox-highlight`,e)},async initSelectedItems(){await this.$nextTick(),this.setInputPadding(),this.setChipsTopPosition(),this.setInputMinWidth(),this.checkMaxSelected()},onChipRemove(e){this.$emit(`remove`,e),this.$refs.input?.focus()},onComboboxSelect(e){this.loading||(this.value=``,this.$emit(`select`,e))},showComboboxList(){this.showList??this.$refs.comboboxWithPopover?.showComboboxList()},closeComboboxList(){this.showList??this.$refs.comboboxWithPopover?.closeComboboxList()},getChips(){if(!this.selectedItems.length||!this.$refs.chips)return null;let e=new Set;return this.selectedItems.map(t=>this.$refs.chips.find((n,i)=>e.has(i)?!1:r.returnFirstEl(n.$el)?.querySelector(`.d-chip__label`)?.textContent?.trim()===t?(e.add(i),!0):!1)).filter(Boolean).map(e=>r.returnFirstEl(e.$el))},getChipButtons(){let e=this.getChips();return e&&e.map(e=>r.returnFirstEl(e).querySelector(`button`))},getLastChipButton(){let e=this.getChipButtons();return e&&e[e.length-1]},getLastChip(){let e=this.getChips();return e&&e[e.length-1]},getFirstChip(){let e=this.getChips();return e&&e[0]},getInput(){return this.$refs.input?.$refs.input},onChipKeyDown(e){let t=e.code?.toLowerCase();t===`arrowleft`?this.navigateBetweenChips(e.target,!0):t===`arrowright`&&(e.target.id===this.getLastChipButton().id?this.moveFromChipToInput():this.navigateBetweenChips(e.target,!1))},onInputKeyDown(e){let t=e.key?.toLowerCase();if(this.selectedItems.length>0&&e.target.selectionStart===0){if(e.target.selectionEnd!==e.target.selectionStart)return;(t===`backspace`||t===`arrowleft`)&&this.moveFromInputToChip()}},moveFromInputToChip(){this.getLastChipButton().focus(),this.$refs.input?.blur(),this.closeComboboxList()},moveFromChipToInput(){this.getLastChipButton().blur(),this.$refs.input?.focus(),this.showComboboxList()},navigateBetweenChips(e,t){let n=this.getChipButtons().indexOf(e),r=t?n-1:n+1;r<0||r>=this.$refs.chips?.length||(this.getChipButtons()[n].blur(),this.getChipButtons()[r].focus(),this.closeComboboxList())},setChipsTopPosition(){let e=this.getInput();if(!e)return;let t=this.$refs.inputSlotWrapper,n=e.getBoundingClientRect().top-t.getBoundingClientRect().top,r=this.$refs.chipsWrapper;r.style.top=n-u.CHIP_TOP_POSITION[String(this.size)]+`px`},setInputPadding(){let e=this.getLastChip(),t=this.getInput();if(!t||(this.revertInputPadding(t),this.popoverOffset=[0,4],!e)||this.collapseOnFocusOut&&!this.inputFocused)return;let n=e.offsetLeft+this.getFullWidth(e),r=t.getBoundingClientRect().width-n,i=this.getFirstChip(),a=i&&e.offsetTop>i.offsetTop;r>this.reservedRightSpace?t.style.paddingInlineStart=n+`px`:t.style.paddingInlineStart=`4px`;let o=this.getInputPaddingTop(e,r>this.reservedRightSpace,a);o!=null&&(t.style.paddingTop=`${o}px`)},getInputPaddingTop(e,t,n){if(t&&!n)return null;if(t)return e.offsetTop+2;let r=parseFloat(getComputedStyle(e).marginTop)||0,i=e.getBoundingClientRect().height;return e.offsetTop+i+r+2},revertInputPadding(e){e.style.paddingInlineStart=``,e.style.paddingBlockStart=``,e.style.paddingBlockEnd=``},getFullWidth(e){let t=window.getComputedStyle(e);return e.offsetWidth+parseInt(t.marginLeft)+parseInt(t.marginRight)},setInputMinWidth(){let e=this.getFirstChip(),t=this.getInput();t&&(e?t.style.minWidth=this.getFullWidth(e)+4+`px`:t.style.minWidth=``)},checkMaxSelected(){this.maxSelected!==0&&(this.selectedItems.length>this.maxSelected?(this.showValidationMessages=!0,this.$emit(`max-selected`)):this.showValidationMessages=!1)},setInitialInputHeight(){let e=this.getInput();e&&(e.style.minHeight=``,e.style.height=``,this.initialInputHeight=e.getBoundingClientRect().height,this.size!==`xs`&&(e.style.minHeight=`${this.initialInputHeight}px`,e.style.height=`auto`))},async handleInputFocusIn(){this.inputFocused=!0,this.collapseOnFocusOut&&(this.hideInputText=!1,await this.$nextTick(),this.setInputPadding())},async handleInputFocusOut(){if(this.inputFocused=!1,this.collapseOnFocusOut){this.hideInputText=!0;let e=this.getInput();if(!e||!e.style.paddingTop)return;this.revertInputPadding(e)}}}},p={key:1,class:`d-recipe-combobox-multi-select__list--loading`};function m(e,t,n,r,i,a){let o=(0,d.resolveComponent)(`dt-chip`),s=(0,d.resolveComponent)(`dt-input`),c=(0,d.resolveComponent)(`dt-validation-messages`),l=(0,d.resolveComponent)(`dt-combobox-with-popover`);return(0,d.openBlock)(),(0,d.createBlock)(l,(0,d.mergeProps)({ref:`comboboxWithPopover`,label:n.label,"show-list":n.showList,"max-height":n.listMaxHeight,"max-width":n.listMaxWidth,"popover-offset":i.popoverOffset,"has-suggestion-list":n.hasSuggestionList,"content-width":`anchor`,"append-to":n.appendTo,"dialog-class":n.dialogClass,transition:n.transition},a.extractNonListeners(e.$attrs),{onSelect:a.onComboboxSelect,onHighlight:a.comboboxHighlight}),(0,d.createSlots)({input:(0,d.withCtx)(({onInput:e})=>[(0,d.createElementVNode)(`span`,{ref:`inputSlotWrapper`,class:`d-recipe-combobox-multi-select__input-wrapper`,onFocusin:t[1]||(t[1]=(...e)=>a.handleInputFocusIn&&a.handleInputFocusIn(...e)),onFocusout:t[2]||(t[2]=(...e)=>a.handleInputFocusOut&&a.handleInputFocusOut(...e))},[(0,d.createElementVNode)(`span`,{ref:`chipsWrapper`,class:(0,d.normalizeClass)([`d-recipe-combobox-multi-select__chip-wrapper`,a.chipWrapperClass])},[((0,d.openBlock)(!0),(0,d.createElementBlock)(d.Fragment,null,(0,d.renderList)(n.selectedItems,(e,t)=>((0,d.openBlock)(),(0,d.createBlock)(o,(0,d.mergeProps)({ref_for:!0,ref:`chips`,key:`${t}-${e}`,interactive:!0,"label-class":[`d-chip__label`],class:[`d-recipe-combobox-multi-select__chip`,{"d-recipe-combobox-multi-select__chip--truncate":!!n.chipMaxWidth}],style:{maxWidth:n.chipMaxWidth},size:i.CHIP_SIZES[String(n.size)],disabled:n.disabled},(0,d.toHandlers)(a.chipListeners),{onKeydown:(0,d.withKeys)(t=>a.onChipRemove(e),[`backspace`]),onClose:t=>a.onChipRemove(e)}),{default:(0,d.withCtx)(()=>[(0,d.createTextVNode)((0,d.toDisplayString)(e),1)]),_:2},1040,[`class`,`style`,`size`,`disabled`,`onKeydown`,`onClose`]))),128))],2),(0,d.createVNode)(s,(0,d.mergeProps)({ref:`input`,modelValue:i.value,"onUpdate:modelValue":t[0]||(t[0]=e=>i.value=e),class:`d-recipe-combobox-multi-select__input`,"input-class":[n.inputClass,{"d-recipe-combobox-multi-select__input--hidden":i.hideInputText}],"input-wrapper-class":n.inputWrapperClass,disabled:n.disabled,"aria-label":n.label,"aria-invalid":a.ariaInvalid,"aria-describedby":a.ariaDescribedBy,label:n.showLabel?n.label:``,description:n.description,placeholder:a.inputPlaceHolder,"show-messages":n.showInputMessages,messages:n.inputMessages,size:n.size},a.inputListeners,{onInput:e}),null,16,[`modelValue`,`input-class`,`input-wrapper-class`,`disabled`,`aria-label`,`aria-invalid`,`aria-describedby`,`label`,`description`,`placeholder`,`show-messages`,`messages`,`size`,`onInput`]),(0,d.createVNode)(c,{id:i.messagesId,"validation-messages":n.maxSelectedMessage,"show-messages":i.showValidationMessages},null,8,[`id`,`validation-messages`,`show-messages`])],544)]),list:(0,d.withCtx)(()=>[(0,d.createElementVNode)(`div`,{ref:`list`,class:(0,d.normalizeClass)([`d-recipe-combobox-multi-select__list`,n.listClass]),onMousedown:t[3]||(t[3]=(0,d.withModifiers)(()=>{},[`prevent`]))},[n.loading?((0,d.openBlock)(),(0,d.createElementBlock)(`div`,p,(0,d.toDisplayString)(n.loadingMessage),1)):(0,d.renderSlot)(e.$slots,`list`,{key:0})],34)]),_:2},[i.hasSlotContent(e.$slots.header)?{name:`header`,fn:(0,d.withCtx)(()=>[(0,d.createElementVNode)(`div`,{ref:`header`,class:(0,d.normalizeClass)(n.headerClass)},[(0,d.renderSlot)(e.$slots,`header`)],2)]),key:`0`}:void 0,i.hasSlotContent(e.$slots.footer)?{name:`footer`,fn:(0,d.withCtx)(()=>[(0,d.createElementVNode)(`div`,{ref:`footer`,class:(0,d.normalizeClass)(n.footerClass)},[(0,d.renderSlot)(e.$slots,`footer`)],2)]),key:`1`}:void 0]),1040,[`label`,`show-list`,`max-height`,`max-width`,`popover-offset`,`has-suggestion-list`,`append-to`,`dialog-class`,`transition`,`onSelect`,`onHighlight`])}var h=i.t(f,[[`render`,m]]);exports.default=h;
 //# sourceMappingURL=combobox-multi-select.cjs.map

package/dist/lib/combobox-multi-select/combobox-multi-select.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select.cjs","names":[],"sources":["../../../components/combobox_multi_select/combobox_multi_select.vue"],"sourcesContent":["<!-- eslint-disable vue/no-static-inline-styles -->\n<template>\n  <dt-combobox-with-popover\n    ref=\"comboboxWithPopover\"\n    :label=\"label\"\n    :show-list=\"showList\"\n    :max-height=\"listMaxHeight\"\n    :max-width=\"listMaxWidth\"\n    :popover-offset=\"popoverOffset\"\n    :has-suggestion-list=\"hasSuggestionList\"\n    content-width=\"anchor\"\n    :append-to=\"appendTo\"\n    :dialog-class=\"dialogClass\"\n    :transition=\"transition\"\n    v-bind=\"extractNonListeners($attrs)\"\n    @select=\"onComboboxSelect\"\n    @highlight=\"comboboxHighlight\"\n  >\n    <template #input=\"{ onInput }\">\n      <span\n        ref=\"inputSlotWrapper\"\n        class=\"d-recipe-combobox-multi-select__input-wrapper\"\n        @focusin=\"handleInputFocusIn\"\n        @focusout=\"handleInputFocusOut\"\n      >\n        <span\n          ref=\"chipsWrapper\"\n          :class=\"['d-recipe-combobox-multi-select__chip-wrapper', chipWrapperClass]\"\n        >\n          <dt-chip\n            v-for=\"(item, index) in selectedItems\"\n            ref=\"chips\"\n            :key=\"`${index}-${item}`\"\n            :label-class=\"['d-chip__label']\"\n            :class=\"[\n              'd-recipe-combobox-multi-select__chip',\n              { 'd-recipe-combobox-multi-select__chip--truncate': !!chipMaxWidth },\n            ]\"\n            :style=\"{ maxWidth: chipMaxWidth }\"\n            :size=\"CHIP_SIZES[size]\"\n            :disabled=\"disabled\"\n            v-on=\"chipListeners\"\n            @keydown.backspace=\"onChipRemove(item)\"\n            @close=\"onChipRemove(item)\"\n          >\n            {{ item }}\n          </dt-chip>\n        </span>\n\n        <dt-input\n          ref=\"input\"\n          v-model=\"value\"\n          class=\"d-recipe-combobox-multi-select__input\"\n          :input-class=\"[\n            inputClass, {\n              'd-recipe-combobox-multi-select__input--hidden': hideInputText,\n            }]\"\n          :input-wrapper-class=\"inputWrapperClass\"\n          :disabled=\"disabled\"\n          :aria-label=\"label\"\n          :label=\"labelVisible ? label : ''\"\n          :description=\"description\"\n          :placeholder=\"inputPlaceHolder\"\n          :show-messages=\"showInputMessages\"\n          :messages=\"inputMessages\"\n          :size=\"size\"\n          v-bind=\"inputListeners\"\n          @input=\"onInput\"\n        />\n\n        <dt-validation-messages\n          :validation-messages=\"maxSelectedMessage\"\n          :show-messages=\"showValidationMessages\"\n        />\n      </span>\n    </template>\n\n    <!-- @slot slot for popover header -->\n    <template\n      v-if=\"hasSlotContent($slots.header)\"\n      #header\n    >\n      <div ref=\"header\">\n        <slot name=\"header\" />\n      </div>\n    </template>\n\n    <!-- @slot slot for popover list -->\n    <template #list>\n      <div\n        ref=\"list\"\n        class=\"d-recipe-combobox-multi-select__list\"\n        @mousedown.prevent\n      >\n        <slot\n          v-if=\"!loading\"\n          name=\"list\"\n        />\n        <div\n          v-else\n          class=\"d-recipe-combobox-multi-select__list--loading\"\n        >\n          {{ loadingMessage }}\n        </div>\n      </div>\n    </template>\n\n    <!-- @slot slot for popover footer -->\n    <template\n      v-if=\"hasSlotContent($slots.footer)\"\n      #footer\n    >\n      <div ref=\"footer\">\n        <slot name=\"footer\" />\n      </div>\n    </template>\n  </dt-combobox-with-popover>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport DtComboboxWithPopover from '@/components/combobox_with_popover/combobox_with_popover.vue';\nimport DtInput from '@/components/input/input.vue';\nimport DtChip from '@/components/chip/chip.vue';\nimport DtValidationMessages from '@/components/validation_messages/validation_messages.vue';\nimport { validationMessageValidator } from '@/common/validators';\nimport { extractVueListeners, extractNonListeners, hasSlotContent, returnFirstEl } from '@/common/utils';\nimport { HTML_ELEMENT_TYPE } from '@/common/constants';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '@/components/popover/popover_constants';\nimport {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n} from './combobox_multi_select_constants';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtComboboxMultiSelect',\n\n  components: {\n    DtComboboxWithPopover,\n    DtInput,\n    DtChip,\n    DtValidationMessages,\n  },\n\n  inheritAttrs: false,\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     * Description for the input\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Input placeholder\n     */\n    placeholder: {\n      type: String,\n      default: 'Select one or start typing',\n    },\n\n    /**\n     * Input validation messages\n     */\n    inputMessages: {\n      type: Array,\n      default: () => [],\n      validator: inputMessages => {\n        return validationMessageValidator(inputMessages);\n      },\n    },\n\n    /**\n     * Show input validation message\n     */\n    showInputMessages: {\n      type: Boolean,\n      default: true,\n    },\n\n    // @TODO: https://dialpad.atlassian.net/browse/DP-52324\n    // type: {\n    //   type: String,\n    //   values: ['input', 'select'],\n    //   default: 'select',\n    // },\n\n    /**\n     * Determines if the list is loading\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The message when the list is loading\n     */\n    loadingMessage: {\n      type: String,\n      default: 'loading...',\n    },\n\n    /**\n     * Determines when to show the list element and also controls the aria-expanded attribute.\n     * Leaving this null will have the combobox trigger on input focus by default.\n     * If you set this value, the default trigger behavior will be disabled and you can\n     * control it as you need.\n     */\n    showList: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    listMaxHeight: {\n      type: String,\n      default: '300px',\n    },\n\n    /**\n     * The selected items\n     */\n    selectedItems: {\n      type: Array,\n      default: function () { return []; },\n    },\n\n    /**\n     * Would be the maximum number of selections you can make. 0 is unlimited\n     */\n    maxSelected: {\n      type: Number,\n      default: 0,\n    },\n\n    /**\n     * Max select message when the max selections is exceeded with the structure:\n     * `[{\"message\": string, \"type\": VALIDATION_MESSAGE_TYPES }]`\n     */\n    maxSelectedMessage: {\n      type: Array,\n      default: function () { return []; },\n    },\n\n    /**\n     * Displays the list when the combobox is focused, before the user has typed anything.\n     * When this is enabled the list will not close after selection.\n     */\n    hasSuggestionList: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Size of the chip, one of `xs`, `sm`, `md`\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (t) => Object.values(MULTI_SELECT_SIZES).includes(t),\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTML_ELEMENT_TYPE, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * Determines whether the combobox should collapse to a single when losing focus.\n     * @type {boolean}\n     */\n    collapseOnFocusOut: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    listMaxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n    * Amount of reserved space (in px) on the right side of the input\n    * before the chips and the input caret jump to the next line.\n    * default is 64\n    */\n    reservedRightSpace: {\n      type: Number,\n      default: 64,\n    },\n\n    /**\n     * Determines the maximum width of a single chip. If the text within this chip exceeds the value\n     * it will be truncated with ellipses.\n     * Possible units rem|px|em\n     */\n    chipMaxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the input element.\n     * Can accept String, Object, and Array, i.e. has the\n     * same API as Vue's built-in handling of the class attribute.\n     */\n    inputClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the input wrapper 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    inputWrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * When true, disables the underlying input.\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class for the popover dialog element.\n     */\n    dialogClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String }\n     */\n    'input',\n\n    /**\n     * Event fired when item selected\n     *\n     * @event select\n     * @type {Number}\n     */\n    'select',\n\n    /**\n     * Event fired when item removed\n     *\n     * @event remove\n     * @type {String}\n     */\n    'remove',\n\n    /**\n     * Event fired when max selected items limit is reached\n     *\n     * @event max-selected\n     * @type {Object}\n     */\n    'max-selected',\n\n    /**\n     * Native keydown event fired when a key is pressed in the text input.\n     * For the common Escape and Enter cases, listen to `escape` / `enter` instead.\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native keydown event fired when a key is pressed while a chip is focused.\n     *\n     * @event chip-keydown\n     * @type {KeyboardEvent}\n     */\n    'chip-keydown',\n\n    /**\n     * Fired when Escape is pressed in the text input.\n     * Not fired when a chip is focused.\n     *\n     * @event escape\n     * @type {KeyboardEvent}\n     */\n    'escape',\n\n    /**\n     * Fired when Enter is pressed in the text input.\n     * Not fired when a chip is focused.\n     *\n     * @event enter\n     * @type {KeyboardEvent}\n     */\n    'enter',\n\n    /**\n     * Event fired when combobox item is highlighted\n     *\n     * @event combobox-highlight\n     * @type {Object}\n     */\n    'combobox-highlight',\n  ],\n\n  data () {\n    return {\n      value: '',\n      popoverOffset: [0, 4],\n      showValidationMessages: false,\n      resizeWindowObserver: null,\n      initialInputHeight: null,\n      CHIP_SIZES,\n      hasSlotContent,\n      inputFocused: false,\n      hideInputText: false,\n    };\n  },\n\n  computed: {\n    inputPlaceHolder () {\n      return this.selectedItems?.length > 0 ? '' : this.placeholder;\n    },\n\n    chipListeners () {\n      return {\n        keydown: event => {\n          if (this.disabled) return;\n          this.onChipKeyDown(event);\n          this.$emit('chip-keydown', event);\n        },\n      };\n    },\n\n    inputListeners () {\n      return {\n        ...extractVueListeners(this.$attrs),\n        onInput: event => {\n          this.$emit('input', event);\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n\n        onKeydown: event => {\n          if (this.disabled) return;\n          this.onInputKeyDown(event);\n          this.$emit('keydown', event);\n          // Use event.key (not event.code) so NumpadEnter normalizes to 'Enter'\n          // and consumers don't have to special-case the numpad.\n          const key = event.key?.toLowerCase();\n          if (key === 'escape') {\n            this.$emit('escape', event);\n          } else if (key === 'enter') {\n            this.$emit('enter', event);\n          }\n        },\n\n        onClick: () => {\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n      };\n    },\n\n    chipWrapperClass () {\n      return {\n        [`d-recipe-combobox-multi-select__chip-wrapper-${this.size}--collapsed`]: !this.inputFocused && this.collapseOnFocusOut,\n      };\n    },\n  },\n\n  watch: {\n    selectedItems: {\n      deep: true,\n      handler: async function () {\n        await this.initSelectedItems();\n      },\n    },\n\n    chipMaxWidth: {\n      async handler () {\n        await this.initSelectedItems();\n      },\n    },\n\n    async label () {\n      await this.$nextTick();\n      // Adjust the chips position if label changed\n      this.setChipsTopPosition();\n    },\n\n    async description () {\n      await this.$nextTick();\n      // Adjust the chips position if description changed\n      this.setChipsTopPosition();\n    },\n\n    size: {\n      async handler () {\n        await this.$nextTick();\n        const input = this.getInput();\n        this.revertInputPadding(input);\n        this.setInitialInputHeight();\n        this.setInputPadding();\n        this.setChipsTopPosition();\n      },\n    },\n  },\n\n  async mounted () {\n    this.setInitialInputHeight();\n    // Recalculate chip position and input padding when resizing window\n    this.resizeWindowObserver = new ResizeObserver(async () => {\n      this.setChipsTopPosition();\n      this.setInputPadding();\n    });\n    this.resizeWindowObserver.observe(document.body);\n\n    await this.initSelectedItems();\n  },\n\n  beforeUnmount () {\n    this.resizeWindowObserver?.unobserve(document.body);\n  },\n\n  methods: {\n    extractNonListeners,\n    comboboxHighlight (highlightIndex) {\n      this.$emit('combobox-highlight', highlightIndex);\n    },\n\n    async initSelectedItems () {\n      await this.$nextTick();\n      this.setInputPadding();\n      this.setChipsTopPosition();\n      this.setInputMinWidth();\n      this.checkMaxSelected();\n    },\n\n    onChipRemove (item) {\n      this.$emit('remove', item);\n      this.$refs.input?.focus();\n    },\n\n    onComboboxSelect (i) {\n      if (this.loading) return;\n      this.value = '';\n      this.$emit('select', i);\n    },\n\n    showComboboxList () {\n      if (this.showList != null) { return; }\n      this.$refs.comboboxWithPopover?.showComboboxList();\n    },\n\n    closeComboboxList () {\n      if (this.showList != null) { return; }\n      this.$refs.comboboxWithPopover?.closeComboboxList();\n    },\n\n    getChips () {\n      if (!this.selectedItems.length || !this.$refs.chips) return null;\n\n      // Use the order from selectedItems to not rely on DOM order which may be stale.\n      // Track matched indices to handle duplicate item names correctly.\n      const matched = new Set();\n      const chips = this.selectedItems.map(item => {\n        return this.$refs.chips.find((chip, index) => {\n          if (matched.has(index)) return false;\n          const chipLabel = returnFirstEl(chip.$el)?.querySelector('.d-chip__label')?.textContent?.trim();\n          if (chipLabel === item) {\n            matched.add(index);\n            return true;\n          }\n          return false;\n        });\n      });\n      return chips.filter(Boolean).map(chip => returnFirstEl(chip.$el));\n    },\n\n    getChipButtons () {\n      const chips = this.getChips();\n      return chips && chips.map(chip => returnFirstEl(chip).querySelector('button'));\n    },\n\n    getLastChipButton () {\n      const chipButtons = this.getChipButtons();\n      return chipButtons && chipButtons[chipButtons.length - 1];\n    },\n\n    getLastChip () {\n      const chips = this.getChips();\n      return chips && chips[chips.length - 1];\n    },\n\n    getFirstChip () {\n      const chips = this.getChips();\n      return chips && chips[0];\n    },\n\n    getInput () {\n      return this.$refs.input?.$refs.input;\n    },\n\n    onChipKeyDown (event) {\n      const key = event.code?.toLowerCase();\n      if (key === 'arrowleft') {\n        // Move to the previous chip\n        this.navigateBetweenChips(event.target, true);\n      } else if (key === 'arrowright') {\n        if (event.target.id === this.getLastChipButton().id) {\n          // Move to the input if it's the last chip\n          this.moveFromChipToInput();\n        } else {\n          // Move to the next chip\n          this.navigateBetweenChips(event.target, false);\n        }\n      }\n    },\n\n    onInputKeyDown (event) {\n      const key = event.key?.toLowerCase();\n      // If the cursor is at the start of the text,\n      // press 'backspace' or 'left' focuses the last chip\n      if (this.selectedItems.length > 0 && event.target.selectionStart === 0) {\n        // if there is selected text, do not focus the last chip\n        if (event.target.selectionEnd !== event.target.selectionStart) {\n          return;\n        }\n        if (key === 'backspace' || key === 'arrowleft') {\n          this.moveFromInputToChip();\n        }\n      }\n    },\n\n    moveFromInputToChip () {\n      this.getLastChipButton().focus();\n      this.$refs.input?.blur();\n      this.closeComboboxList();\n    },\n\n    moveFromChipToInput () {\n      this.getLastChipButton().blur();\n      this.$refs.input?.focus();\n      this.showComboboxList();\n    },\n\n    navigateBetweenChips (target, toLeft) {\n      const from = this.getChipButtons().indexOf(target);\n      const to = toLeft ? from - 1 : from + 1;\n      if (to < 0 || to >= this.$refs.chips?.length) {\n        return;\n      }\n      this.getChipButtons()[from].blur();\n      this.getChipButtons()[to].focus();\n      this.closeComboboxList();\n    },\n\n    setChipsTopPosition () {\n      // To place the chips in the input box\n      // The chip \"top\" position should be the same line as the input box\n      const input = this.getInput();\n      if (!input) return;\n      const inputSlotWrapper = this.$refs.inputSlotWrapper;\n      const top = input.getBoundingClientRect().top -\n                  inputSlotWrapper.getBoundingClientRect().top;\n      const chipsWrapper = this.$refs.chipsWrapper;\n      chipsWrapper.style.top = (top - CHIP_TOP_POSITION[this.size]) + 'px';\n    },\n\n    setInputPadding () {\n      const lastChip = this.getLastChip();\n      const input = this.getInput();\n      if (!input) return;\n      this.revertInputPadding(input);\n      this.popoverOffset = [0, 4];\n      if (!lastChip) return;\n      // Avoid adding extra padding when the input is not focused if collapseOnFocusOut is true\n      // This ensures the input returns to its original state when resizing\n      if (this.collapseOnFocusOut && !this.inputFocused) return;\n\n      // Get the position of the last chip\n      // The input cursor should be the same \"top\" as that chip and next besides it\n      const left = lastChip.offsetLeft + this.getFullWidth(lastChip);\n      const spaceLeft = input.getBoundingClientRect().width - left;\n      const firstChip = this.getFirstChip();\n      const isWrapped = firstChip && lastChip.offsetTop > firstChip.offsetTop;\n\n      if (spaceLeft > this.reservedRightSpace) {\n        input.style.paddingLeft = left + 'px';\n      } else {\n        input.style.paddingLeft = '4px';\n      }\n\n      const paddingTop = this.getInputPaddingTop(lastChip, spaceLeft > this.reservedRightSpace, isWrapped);\n      if (paddingTop != null) input.style.paddingTop = `${paddingTop}px`;\n    },\n\n    getInputPaddingTop (lastChip, hasSpace, isWrapped) {\n      // Chip fits beside the cursor on its row; CSS handles vertical centering.\n      if (hasSpace && !isWrapped) return null;\n      // Chip wrapped onto a new row with space remaining; align cursor to it.\n      if (hasSpace) return lastChip.offsetTop + 2;\n      // No space on the chip's row — predict next-row offsetTop so paddingTop\n      // stays stable when a chip lands there.\n      const chipMarginTop = parseFloat(getComputedStyle(lastChip).marginTop) || 0;\n      const lastChipHeight = lastChip.getBoundingClientRect().height;\n      return lastChip.offsetTop + lastChipHeight + chipMarginTop + 2;\n    },\n\n    revertInputPadding (input) {\n      input.style.paddingLeft = '';\n      input.style.paddingTop = '';\n      input.style.paddingBottom = '';\n    },\n\n    getFullWidth (el) {\n      const styles = window.getComputedStyle(el);\n      return el.offsetWidth + parseInt(styles.marginLeft) + parseInt(styles.marginRight);\n    },\n\n    setInputMinWidth () {\n      // Ensure the width of the input is \"slightly bigger\" than the width of a single chip\n      const firstChip = this.getFirstChip();\n      const input = this.getInput();\n      if (!input) return;\n      if (firstChip) {\n        // Add 4px buffer for typing room\n        input.style.minWidth = (this.getFullWidth(firstChip) + 4) + 'px';\n      } else {\n        input.style.minWidth = '';\n      }\n    },\n\n    checkMaxSelected () {\n      if (this.maxSelected === 0) return;\n      if (this.selectedItems.length > this.maxSelected) {\n        this.showValidationMessages = true;\n        this.$emit('max-selected');\n      } else {\n        this.showValidationMessages = false;\n      }\n    },\n\n    setInitialInputHeight () {\n      const input = this.getInput();\n      if (!input) return;\n      input.style.minHeight = '';\n      input.style.height = '';\n      this.initialInputHeight = input.getBoundingClientRect().height;\n      // xs renders correctly without a min-height floor; other sizes need it to grow when chips wrap.\n      if (this.size !== 'xs') {\n        input.style.minHeight = `${this.initialInputHeight}px`;\n        input.style.height = 'auto';\n      }\n    },\n\n    async handleInputFocusIn () {\n      this.inputFocused = true;\n      if (this.collapseOnFocusOut) {\n        this.hideInputText = false;\n        await this.$nextTick();\n        this.setInputPadding();\n      }\n    },\n\n    async handleInputFocusOut () {\n      this.inputFocused = false;\n      if (this.collapseOnFocusOut) {\n        this.hideInputText = true;\n        const input = this.getInput();\n        if (!input) return;\n        // Hide the input text when is not on first line\n        if (!input.style.paddingTop) {\n          return;\n        }\n        this.revertInputPadding(input);\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"combobox-multi-select.cjs","names":[],"sources":["../../../components/ComboboxMultiSelect/ComboboxMultiSelect.vue"],"sourcesContent":["<!-- eslint-disable vue/no-static-inline-styles -->\n<template>\n  <dt-combobox-with-popover\n    ref=\"comboboxWithPopover\"\n    :label=\"label\"\n    :show-list=\"showList\"\n    :max-height=\"listMaxHeight\"\n    :max-width=\"listMaxWidth\"\n    :popover-offset=\"popoverOffset\"\n    :has-suggestion-list=\"hasSuggestionList\"\n    content-width=\"anchor\"\n    :append-to=\"appendTo\"\n    :dialog-class=\"dialogClass\"\n    :transition=\"transition\"\n    v-bind=\"extractNonListeners($attrs)\"\n    @select=\"onComboboxSelect\"\n    @highlight=\"comboboxHighlight\"\n  >\n    <template #input=\"{ onInput }\">\n      <span\n        ref=\"inputSlotWrapper\"\n        class=\"d-recipe-combobox-multi-select__input-wrapper\"\n        @focusin=\"handleInputFocusIn\"\n        @focusout=\"handleInputFocusOut\"\n      >\n        <span\n          ref=\"chipsWrapper\"\n          :class=\"['d-recipe-combobox-multi-select__chip-wrapper', chipWrapperClass]\"\n        >\n          <dt-chip\n            v-for=\"(item, index) in selectedItems\"\n            ref=\"chips\"\n            :key=\"`${index}-${item}`\"\n            :interactive=\"true\"\n            :label-class=\"['d-chip__label']\"\n            :class=\"[\n              'd-recipe-combobox-multi-select__chip',\n              { 'd-recipe-combobox-multi-select__chip--truncate': !!chipMaxWidth },\n            ]\"\n            :style=\"{ maxWidth: chipMaxWidth }\"\n            :size=\"CHIP_SIZES[String(size)]\"\n            :disabled=\"disabled\"\n            v-on=\"chipListeners\"\n            @keydown.backspace=\"onChipRemove(item)\"\n            @close=\"onChipRemove(item)\"\n          >\n            {{ item }}\n          </dt-chip>\n        </span>\n\n        <dt-input\n          ref=\"input\"\n          v-model=\"value\"\n          class=\"d-recipe-combobox-multi-select__input\"\n          :input-class=\"[\n            inputClass, {\n              'd-recipe-combobox-multi-select__input--hidden': hideInputText,\n            }]\"\n          :input-wrapper-class=\"inputWrapperClass\"\n          :disabled=\"disabled\"\n          :aria-label=\"label\"\n          :aria-invalid=\"ariaInvalid\"\n          :aria-describedby=\"ariaDescribedBy\"\n          :label=\"showLabel ? label : ''\"\n          :description=\"description\"\n          :placeholder=\"inputPlaceHolder\"\n          :show-messages=\"showInputMessages\"\n          :messages=\"inputMessages\"\n          :size=\"size\"\n          v-bind=\"inputListeners\"\n          @input=\"onInput\"\n        />\n\n        <dt-validation-messages\n          :id=\"messagesId\"\n          :validation-messages=\"maxSelectedMessage\"\n          :show-messages=\"showValidationMessages\"\n        />\n      </span>\n    </template>\n\n    <!-- @slot slot for popover header -->\n    <template\n      v-if=\"hasSlotContent($slots.header)\"\n      #header\n    >\n      <div\n        ref=\"header\"\n        :class=\"headerClass\"\n      >\n        <slot name=\"header\" />\n      </div>\n    </template>\n\n    <!-- @slot slot for popover list -->\n    <template #list>\n      <div\n        ref=\"list\"\n        :class=\"['d-recipe-combobox-multi-select__list', listClass]\"\n        @mousedown.prevent\n      >\n        <slot\n          v-if=\"!loading\"\n          name=\"list\"\n        />\n        <div\n          v-else\n          class=\"d-recipe-combobox-multi-select__list--loading\"\n        >\n          {{ loadingMessage }}\n        </div>\n      </div>\n    </template>\n\n    <!-- @slot slot for popover footer -->\n    <template\n      v-if=\"hasSlotContent($slots.footer)\"\n      #footer\n    >\n      <div\n        ref=\"footer\"\n        :class=\"footerClass\"\n      >\n        <slot name=\"footer\" />\n      </div>\n    </template>\n  </dt-combobox-with-popover>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport DtComboboxWithPopover from '@/components/ComboboxWithPopover/ComboboxWithPopover.vue';\nimport DtInput from '@/components/Input/Input.vue';\nimport DtChip from '@/components/Chip/Chip.vue';\nimport DtValidationMessages from '@/components/ValidationMessages/ValidationMessages.vue';\nimport { validationMessageValidator } from '@/common/validators';\nimport { extractVueListeners, extractNonListeners, hasSlotContent, returnFirstEl, getUniqueString, getValidationState } from '@/common/utils';\nimport { HTML_ELEMENT_TYPE } from '@/common/constants';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '@/components/Popover/PopoverConstants';\nimport {\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n} from './ComboboxMultiSelectConstants';\nimport { COMPONENT_SIZES, VALIDATION_MESSAGE_TYPES } from '@/common/constants';\n\nexport default {\n  name: 'DtComboboxMultiSelect',\n\n  components: {\n    DtComboboxWithPopover,\n    DtInput,\n    DtChip,\n    DtValidationMessages,\n  },\n\n  inheritAttrs: false,\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    showLabel: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Description for the input\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Input placeholder\n     */\n    placeholder: {\n      type: String,\n      default: 'Select one or start typing',\n    },\n\n    /**\n     * Input validation messages\n     */\n    inputMessages: {\n      type: Array,\n      default: () => [],\n      validator: inputMessages => {\n        return validationMessageValidator(inputMessages);\n      },\n    },\n\n    /**\n     * Show input validation message\n     */\n    showInputMessages: {\n      type: Boolean,\n      default: true,\n    },\n\n    // @TODO: https://dialpad.atlassian.net/browse/DP-52324\n    // type: {\n    //   type: String,\n    //   values: ['input', 'select'],\n    //   default: 'select',\n    // },\n\n    /**\n     * Determines if the list is loading\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The message when the list is loading\n     */\n    loadingMessage: {\n      type: String,\n      default: 'loading...',\n    },\n\n    /**\n     * Determines when to show the list element and also controls the aria-expanded attribute.\n     * Leaving this null will have the combobox trigger on input focus by default.\n     * If you set this value, the default trigger behavior will be disabled and you can\n     * control it as you need.\n     */\n    showList: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    listMaxHeight: {\n      type: String,\n      default: '300px',\n    },\n\n    /**\n     * The selected items\n     */\n    selectedItems: {\n      type: Array,\n      default: function () { return []; },\n    },\n\n    /**\n     * Would be the maximum number of selections you can make. 0 is unlimited\n     */\n    maxSelected: {\n      type: Number,\n      default: 0,\n    },\n\n    /**\n     * Max select message when the max selections is exceeded with the structure:\n     * `[{\"message\": string, \"type\": VALIDATION_MESSAGE_TYPES }]`\n     */\n    maxSelectedMessage: {\n      type: Array,\n      default: function () { return []; },\n    },\n\n    /**\n     * Displays the list when the combobox is focused, before the user has typed anything.\n     * When this is enabled the list will not close after selection.\n     */\n    hasSuggestionList: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Size of the chip.\n     * @values 100, 200, 300\n     */\n    size: {\n      type: [String, Number],\n      default: 300,\n      validator: (t) => Object.keys(CHIP_SIZES).includes(String(t)),\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTML_ELEMENT_TYPE, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * Determines whether the combobox should collapse to a single when losing focus.\n     * @type {boolean}\n     */\n    collapseOnFocusOut: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    listMaxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n    * Amount of reserved space (in px) on the right side of the input\n    * before the chips and the input caret jump to the next line.\n    * default is 64\n    */\n    reservedRightSpace: {\n      type: Number,\n      default: 64,\n    },\n\n    /**\n     * Determines the maximum width of a single chip. If the text within this chip exceeds the value\n     * it will be truncated with ellipses.\n     * Possible units rem|px|em\n     */\n    chipMaxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the input element.\n     * Can accept String, Object, and Array, i.e. has the\n     * same API as Vue's built-in handling of the class attribute.\n     */\n    inputClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the input wrapper 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    inputWrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * When true, disables the underlying input.\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the header wrapper element.\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the footer wrapper element.\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the list wrapper element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class for the popover dialog element.\n     */\n    dialogClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Event fired to sync the modelValue prop with the parent component\n     *\n     * @event update:modelValue\n     * @type {String}\n     */\n    'update:modelValue',\n\n    /**\n     * Event fired when item selected\n     *\n     * @event select\n     * @type {Number}\n     */\n    'select',\n\n    /**\n     * Event fired when item removed\n     *\n     * @event remove\n     * @type {String}\n     */\n    'remove',\n\n    /**\n     * Event fired when max selected items limit is reached\n     *\n     * @event max-selected\n     * @type {Object}\n     */\n    'max-selected',\n\n    /**\n     * Native keydown event fired when a key is pressed in the text input.\n     * For the common Escape and Enter cases, listen to `escape` / `enter` instead.\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native keydown event fired when a key is pressed while a chip is focused.\n     *\n     * @event chip-keydown\n     * @type {KeyboardEvent}\n     */\n    'chip-keydown',\n\n    /**\n     * Fired when Escape is pressed in the text input.\n     * Not fired when a chip is focused.\n     *\n     * @event escape\n     * @type {KeyboardEvent}\n     */\n    'escape',\n\n    /**\n     * Fired when Enter is pressed in the text input.\n     * Not fired when a chip is focused.\n     *\n     * @event enter\n     * @type {KeyboardEvent}\n     */\n    'enter',\n\n    /**\n     * Event fired when combobox item is highlighted\n     *\n     * @event combobox-highlight\n     * @type {Object}\n     */\n    'combobox-highlight',\n  ],\n\n  data () {\n    return {\n      value: '',\n      popoverOffset: [0, 4],\n      showValidationMessages: false,\n      resizeWindowObserver: null,\n      initialInputHeight: null,\n      CHIP_SIZES,\n      hasSlotContent,\n      inputFocused: false,\n      hideInputText: false,\n      messagesId: getUniqueString(),\n    };\n  },\n\n  computed: {\n    inputPlaceHolder () {\n      return this.selectedItems?.length > 0 ? '' : this.placeholder;\n    },\n\n    chipListeners () {\n      return {\n        keydown: event => {\n          if (this.disabled) return;\n          this.onChipKeyDown(event);\n          this.$emit('chip-keydown', event);\n        },\n      };\n    },\n\n    inputListeners () {\n      return {\n        ...extractVueListeners(this.$attrs),\n        onInput: event => {\n          this.$emit('update:modelValue', event);\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n\n        onKeydown: event => {\n          if (this.disabled) return;\n          this.onInputKeyDown(event);\n          this.$emit('keydown', event);\n          // Use event.key (not event.code) so NumpadEnter normalizes to 'Enter'\n          // and consumers don't have to special-case the numpad.\n          const key = event.key?.toLowerCase();\n          if (key === 'escape') {\n            this.$emit('escape', event);\n          } else if (key === 'enter') {\n            this.$emit('enter', event);\n          }\n        },\n\n        onClick: () => {\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n      };\n    },\n\n    ariaInvalid () {\n      return getValidationState(this.maxSelectedMessage) === VALIDATION_MESSAGE_TYPES.CRITICAL ? 'true' : undefined;\n    },\n\n    ariaDescribedBy () {\n      return this.showValidationMessages && this.maxSelectedMessage.length > 0 ? this.messagesId : undefined;\n    },\n\n    chipWrapperClass () {\n      return {\n        [`d-recipe-combobox-multi-select__chip-wrapper-${COMPONENT_SIZES[String(this.size)] || this.size}--collapsed`]: !this.inputFocused && this.collapseOnFocusOut,\n      };\n    },\n  },\n\n  watch: {\n    selectedItems: {\n      deep: true,\n      handler: async function () {\n        await this.initSelectedItems();\n      },\n    },\n\n    chipMaxWidth: {\n      async handler () {\n        await this.initSelectedItems();\n      },\n    },\n\n    async label () {\n      await this.$nextTick();\n      // Adjust the chips position if label changed\n      this.setChipsTopPosition();\n    },\n\n    async description () {\n      await this.$nextTick();\n      // Adjust the chips position if description changed\n      this.setChipsTopPosition();\n    },\n\n    size: {\n      async handler () {\n        await this.$nextTick();\n        const input = this.getInput();\n        this.revertInputPadding(input);\n        this.setInitialInputHeight();\n        this.setInputPadding();\n        this.setChipsTopPosition();\n      },\n    },\n  },\n\n  async mounted () {\n    this.setInitialInputHeight();\n    // Recalculate chip position and input padding when resizing window\n    this.resizeWindowObserver = new ResizeObserver(async () => {\n      this.setChipsTopPosition();\n      this.setInputPadding();\n    });\n    this.resizeWindowObserver.observe(document.body);\n\n    await this.initSelectedItems();\n  },\n\n  beforeUnmount () {\n    this.resizeWindowObserver?.unobserve(document.body);\n  },\n\n  methods: {\n    extractNonListeners,\n    comboboxHighlight (highlightIndex) {\n      this.$emit('combobox-highlight', highlightIndex);\n    },\n\n    async initSelectedItems () {\n      await this.$nextTick();\n      this.setInputPadding();\n      this.setChipsTopPosition();\n      this.setInputMinWidth();\n      this.checkMaxSelected();\n    },\n\n    onChipRemove (item) {\n      this.$emit('remove', item);\n      this.$refs.input?.focus();\n    },\n\n    onComboboxSelect (i) {\n      if (this.loading) return;\n      this.value = '';\n      this.$emit('select', i);\n    },\n\n    showComboboxList () {\n      if (this.showList != null) { return; }\n      this.$refs.comboboxWithPopover?.showComboboxList();\n    },\n\n    closeComboboxList () {\n      if (this.showList != null) { return; }\n      this.$refs.comboboxWithPopover?.closeComboboxList();\n    },\n\n    getChips () {\n      if (!this.selectedItems.length || !this.$refs.chips) return null;\n\n      // Use the order from selectedItems to not rely on DOM order which may be stale.\n      // Track matched indices to handle duplicate item names correctly.\n      const matched = new Set();\n      const chips = this.selectedItems.map(item => {\n        return this.$refs.chips.find((chip, index) => {\n          if (matched.has(index)) return false;\n          const chipLabel = returnFirstEl(chip.$el)?.querySelector('.d-chip__label')?.textContent?.trim();\n          if (chipLabel === item) {\n            matched.add(index);\n            return true;\n          }\n          return false;\n        });\n      });\n      return chips.filter(Boolean).map(chip => returnFirstEl(chip.$el));\n    },\n\n    getChipButtons () {\n      const chips = this.getChips();\n      return chips && chips.map(chip => returnFirstEl(chip).querySelector('button'));\n    },\n\n    getLastChipButton () {\n      const chipButtons = this.getChipButtons();\n      return chipButtons && chipButtons[chipButtons.length - 1];\n    },\n\n    getLastChip () {\n      const chips = this.getChips();\n      return chips && chips[chips.length - 1];\n    },\n\n    getFirstChip () {\n      const chips = this.getChips();\n      return chips && chips[0];\n    },\n\n    getInput () {\n      return this.$refs.input?.$refs.input;\n    },\n\n    onChipKeyDown (event) {\n      const key = event.code?.toLowerCase();\n      if (key === 'arrowleft') {\n        // Move to the previous chip\n        this.navigateBetweenChips(event.target, true);\n      } else if (key === 'arrowright') {\n        if (event.target.id === this.getLastChipButton().id) {\n          // Move to the input if it's the last chip\n          this.moveFromChipToInput();\n        } else {\n          // Move to the next chip\n          this.navigateBetweenChips(event.target, false);\n        }\n      }\n    },\n\n    onInputKeyDown (event) {\n      const key = event.key?.toLowerCase();\n      // If the cursor is at the start of the text,\n      // press 'backspace' or 'left' focuses the last chip\n      if (this.selectedItems.length > 0 && event.target.selectionStart === 0) {\n        // if there is selected text, do not focus the last chip\n        if (event.target.selectionEnd !== event.target.selectionStart) {\n          return;\n        }\n        if (key === 'backspace' || key === 'arrowleft') {\n          this.moveFromInputToChip();\n        }\n      }\n    },\n\n    moveFromInputToChip () {\n      this.getLastChipButton().focus();\n      this.$refs.input?.blur();\n      this.closeComboboxList();\n    },\n\n    moveFromChipToInput () {\n      this.getLastChipButton().blur();\n      this.$refs.input?.focus();\n      this.showComboboxList();\n    },\n\n    navigateBetweenChips (target, toLeft) {\n      const from = this.getChipButtons().indexOf(target);\n      const to = toLeft ? from - 1 : from + 1;\n      if (to < 0 || to >= this.$refs.chips?.length) {\n        return;\n      }\n      this.getChipButtons()[from].blur();\n      this.getChipButtons()[to].focus();\n      this.closeComboboxList();\n    },\n\n    setChipsTopPosition () {\n      // To place the chips in the input box\n      // The chip \"top\" position should be the same line as the input box\n      const input = this.getInput();\n      if (!input) return;\n      const inputSlotWrapper = this.$refs.inputSlotWrapper;\n      const top = input.getBoundingClientRect().top -\n                  inputSlotWrapper.getBoundingClientRect().top;\n      const chipsWrapper = this.$refs.chipsWrapper;\n      chipsWrapper.style.top = (top - CHIP_TOP_POSITION[String(this.size)]) + 'px';\n    },\n\n    setInputPadding () {\n      const lastChip = this.getLastChip();\n      const input = this.getInput();\n      if (!input) return;\n      this.revertInputPadding(input);\n      this.popoverOffset = [0, 4];\n      if (!lastChip) return;\n      // Avoid adding extra padding when the input is not focused if collapseOnFocusOut is true\n      // This ensures the input returns to its original state when resizing\n      if (this.collapseOnFocusOut && !this.inputFocused) return;\n\n      // Get the position of the last chip\n      // The input cursor should be the same \"top\" as that chip and next besides it\n      const left = lastChip.offsetLeft + this.getFullWidth(lastChip);\n      const spaceLeft = input.getBoundingClientRect().width - left;\n      const firstChip = this.getFirstChip();\n      const isWrapped = firstChip && lastChip.offsetTop > firstChip.offsetTop;\n\n      if (spaceLeft > this.reservedRightSpace) {\n        input.style.paddingInlineStart = left + 'px';\n      } else {\n        input.style.paddingInlineStart = '4px';\n      }\n\n      const paddingTop = this.getInputPaddingTop(lastChip, spaceLeft > this.reservedRightSpace, isWrapped);\n      if (paddingTop != null) input.style.paddingTop = `${paddingTop}px`;\n    },\n\n    getInputPaddingTop (lastChip, hasSpace, isWrapped) {\n      // Chip fits beside the cursor on its row; CSS handles vertical centering.\n      if (hasSpace && !isWrapped) return null;\n      // Chip wrapped onto a new row with space remaining; align cursor to it.\n      if (hasSpace) return lastChip.offsetTop + 2;\n      // No space on the chip's row — predict next-row offsetTop so paddingTop\n      // stays stable when a chip lands there.\n      const chipMarginTop = parseFloat(getComputedStyle(lastChip).marginTop) || 0;\n      const lastChipHeight = lastChip.getBoundingClientRect().height;\n      return lastChip.offsetTop + lastChipHeight + chipMarginTop + 2;\n    },\n\n    revertInputPadding (input) {\n      input.style.paddingInlineStart = '';\n      input.style.paddingBlockStart = '';\n      input.style.paddingBlockEnd = '';\n    },\n\n    getFullWidth (el) {\n      const styles = window.getComputedStyle(el);\n      return el.offsetWidth + parseInt(styles.marginLeft) + parseInt(styles.marginRight);\n    },\n\n    setInputMinWidth () {\n      // Ensure the width of the input is \"slightly bigger\" than the width of a single chip\n      const firstChip = this.getFirstChip();\n      const input = this.getInput();\n      if (!input) return;\n      if (firstChip) {\n        // Add 4px buffer for typing room\n        input.style.minWidth = (this.getFullWidth(firstChip) + 4) + 'px';\n      } else {\n        input.style.minWidth = '';\n      }\n    },\n\n    checkMaxSelected () {\n      if (this.maxSelected === 0) return;\n      if (this.selectedItems.length > this.maxSelected) {\n        this.showValidationMessages = true;\n        this.$emit('max-selected');\n      } else {\n        this.showValidationMessages = false;\n      }\n    },\n\n    setInitialInputHeight () {\n      const input = this.getInput();\n      if (!input) return;\n      input.style.minHeight = '';\n      input.style.height = '';\n      this.initialInputHeight = input.getBoundingClientRect().height;\n      // xs renders correctly without a min-height floor; other sizes need it to grow when chips wrap.\n      if (this.size !== 'xs') {\n        input.style.minHeight = `${this.initialInputHeight}px`;\n        input.style.height = 'auto';\n      }\n    },\n\n    async handleInputFocusIn () {\n      this.inputFocused = true;\n      if (this.collapseOnFocusOut) {\n        this.hideInputText = false;\n        await this.$nextTick();\n        this.setInputPadding();\n      }\n    },\n\n    async handleInputFocusOut () {\n      this.inputFocused = false;\n      if (this.collapseOnFocusOut) {\n        this.hideInputText = true;\n        const input = this.getInput();\n        if (!input) return;\n        // Hide the input text when is not on first line\n        if (!input.style.paddingTop) {\n          return;\n        }\n        this.revertInputPadding(input);\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"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"}