@dialpad/dialtone 9.55.1 → 9.56.1

package/dist/vue2/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts

@@ -1,186 +1,4 @@
-declare const _default: import("vue").DefineComponent<{
-    /**
-     * String to use for the input label.
-     */
-    label: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Determines visibility of input label.
-     * @values true, false
-     */
-    labelVisible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Description for the input
-     */
-    description: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Input placeholder
-     */
-    placeholder: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Input validation messages
-     */
-    inputMessages: {
-        type: ArrayConstructor;
-        default: () => never[];
-        validator: (inputMessages: unknown) => any;
-    };
-    /**
-     * Show input validation message
-     */
-    showInputMessages: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Determines if the list is loading
-     */
-    loading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The message when the list is loading
-     */
-    loadingMessage: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Determines when to show the list element and also controls the aria-expanded attribute.
-     * Leaving this null will have the combobox trigger on input focus by default.
-     * If you set this value, the default trigger behavior will be disabled and you can
-     * control it as you need.
-     */
-    showList: {
-        type: BooleanConstructor;
-        default: null;
-    };
-    /**
-     * Determines maximum height for the popover before overflow.
-     * Possible units rem|px|em
-     */
-    listMaxHeight: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * The selected items
-     */
-    selectedItems: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    /**
-     * Would be the maximum number of selections you can make. 0 is unlimited
-     */
-    maxSelected: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * Max select message when the max selections is exceeded with the structure:
-     * `[{"message": string, "type": VALIDATION_MESSAGE_TYPES }]`
-     */
-    maxSelectedMessage: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    /**
-     * Displays the list when the combobox is focused, before the user has typed anything.
-     * When this is enabled the list will not close after selection.
-     */
-    hasSuggestionList: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Size of the chip, one of `xs`, `sm`, `md`
-     */
-    size: {
-        type: StringConstructor;
-        default: string;
-        validator: (t: unknown) => boolean;
-    };
-    /**
-     * Sets the element to which the popover is going to append to.
-     * 'body' will append to the nearest body (supports shadow DOM).
-     * @values 'body', 'parent', HTMLElement,
-     */
-    appendTo: {
-        type: (StringConstructor | {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        })[];
-        default: string;
-        validator: (appendTo: unknown) => boolean;
-    };
-    /**
-     * Named transition when the content display is toggled.
-     * @see DtLazyShow
-     */
-    transition: {
-        type: StringConstructor;
-        default: string;
-    };
-}, {}, {
-    value: string;
-    popoverOffset: number[];
-    showValidationMessages: boolean;
-    initialInputPadding: {};
-    resizeWindowObserver: null;
-    originalInputSize: null;
-    CHIP_SIZES: {
-        xs: string;
-        sm: string;
-        md: string;
-    };
-}, {
-    inputPlaceHolder(): any;
-    chipListeners(): {
-        keyup: (event: any) => void;
-    };
-    inputListeners(): {
-        input: (event: any) => void;
-        keyup: (event: any) => void;
-        click: (event: any) => void;
-    };
-    selectedItemsWithKeys(): any;
-}, {
-    initSelectedItems(): Promise<void>;
-    onChipRemove(item: any): void;
-    onComboboxSelect(i: any): void;
-    showComboboxList(): void;
-    closeComboboxList(): void;
-    getChipButtons(): any;
-    getChips(): any;
-    getLastChipButton(): any;
-    getLastChip(): any;
-    getFirstChip(): any;
-    getInput(): any;
-    onChipKeyup(event: any): void;
-    onInputKeyup(event: any): void;
-    moveFromInputToChip(): void;
-    moveFromChipToInput(): void;
-    navigateBetweenChips(target: any, toLeft: any): void;
-    setChipsTopPosition(): void;
-    setInputPadding(): void;
-    revertInputPadding(input: any): void;
-    getFullWidth(el: any): any;
-    setInputMinWidth(): void;
-    checkMaxSelected(): void;
-}, {
+declare const _default: import("vue").DefineComponent<{}, any, {}, {}, {}, {
     props: {
         visuallyHiddenClose: {
             type: BooleanConstructor;
@@ -204,159 +22,6 @@ declare const _default: import("vue").DefineComponent<{
     methods: {
         validateVisuallyHiddenCloseProps(): void;
     };
-}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("input" | "select" | "remove" | "keyup" | "max-selected")[], string, Readonly<import("vue").ExtractPropTypes<{
-    /**
-     * String to use for the input label.
-     */
-    label: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Determines visibility of input label.
-     * @values true, false
-     */
-    labelVisible: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Description for the input
-     */
-    description: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Input placeholder
-     */
-    placeholder: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Input validation messages
-     */
-    inputMessages: {
-        type: ArrayConstructor;
-        default: () => never[];
-        validator: (inputMessages: unknown) => any;
-    };
-    /**
-     * Show input validation message
-     */
-    showInputMessages: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Determines if the list is loading
-     */
-    loading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The message when the list is loading
-     */
-    loadingMessage: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Determines when to show the list element and also controls the aria-expanded attribute.
-     * Leaving this null will have the combobox trigger on input focus by default.
-     * If you set this value, the default trigger behavior will be disabled and you can
-     * control it as you need.
-     */
-    showList: {
-        type: BooleanConstructor;
-        default: null;
-    };
-    /**
-     * Determines maximum height for the popover before overflow.
-     * Possible units rem|px|em
-     */
-    listMaxHeight: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * The selected items
-     */
-    selectedItems: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    /**
-     * Would be the maximum number of selections you can make. 0 is unlimited
-     */
-    maxSelected: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * Max select message when the max selections is exceeded with the structure:
-     * `[{"message": string, "type": VALIDATION_MESSAGE_TYPES }]`
-     */
-    maxSelectedMessage: {
-        type: ArrayConstructor;
-        default: () => never[];
-    };
-    /**
-     * Displays the list when the combobox is focused, before the user has typed anything.
-     * When this is enabled the list will not close after selection.
-     */
-    hasSuggestionList: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Size of the chip, one of `xs`, `sm`, `md`
-     */
-    size: {
-        type: StringConstructor;
-        default: string;
-        validator: (t: unknown) => boolean;
-    };
-    /**
-     * Sets the element to which the popover is going to append to.
-     * 'body' will append to the nearest body (supports shadow DOM).
-     * @values 'body', 'parent', HTMLElement,
-     */
-    appendTo: {
-        type: (StringConstructor | {
-            new (): HTMLElement;
-            prototype: HTMLElement;
-        })[];
-        default: string;
-        validator: (appendTo: unknown) => boolean;
-    };
-    /**
-     * Named transition when the content display is toggled.
-     * @see DtLazyShow
-     */
-    transition: {
-        type: StringConstructor;
-        default: string;
-    };
-}>>, {
-    description: string;
-    loading: boolean;
-    size: string;
-    transition: string;
-    showList: boolean;
-    labelVisible: boolean;
-    appendTo: string | HTMLElement;
-    placeholder: string;
-    hasSuggestionList: boolean;
-    selectedItems: unknown[];
-    inputMessages: unknown[];
-    showInputMessages: boolean;
-    loadingMessage: string;
-    listMaxHeight: string;
-    maxSelected: number;
-    maxSelectedMessage: unknown[];
-}>;
+}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("input" | "select" | "remove" | "keyup" | "max-selected")[], string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;
 //# sourceMappingURL=combobox_multi_select.vue.d.ts.map

package/dist/vue2/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combobox_multi_select.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js"],"names":[],"mappings":";IA+BI;;OAEG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IASH;;OAEG;;;;;IAaH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;OAKG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;;;;;IAUH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA3JH;;OAEG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IASH;;OAEG;;;;;IAaH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;OAKG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;IAMH;;;OAGG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;;;;;IAUH;;;OAGG"}
+{"version":3,"file":"combobox_multi_select.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js"],"names":[],"mappings":""}

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

@@ -200,6 +200,14 @@ const _sfc_main = {
     transition: {
       type: String,
       default: "fade"
+    },
+    /**
+     * Determines whether the combobox should collapse to a single when losing focus.
+     * @type {boolean}
+     */
+    collapseOnFocusOut: {
+      type: Boolean,
+      default: false
     }
   },
   emits: [
@@ -244,11 +252,11 @@ const _sfc_main = {
       value: "",
       popoverOffset: [0, 4],
       showValidationMessages: false,
-      initialInputPadding: {},
       resizeWindowObserver: null,
-      originalInputSize: null,
+      initialInputHeight: null,
       CHIP_SIZES,
-      hasSlotContent: common_utils.hasSlotContent
+      hasSlotContent: common_utils.hasSlotContent,
+      inputFocused: false
     };
   },
   computed: {
@@ -282,6 +290,11 @@ const _sfc_main = {
           }
         }
       };
+    },
+    chipWrapperClass() {
+      return {
+        [`combobox__chip-wrapper-${this.size}--collapsed`]: !this.inputFocused && this.collapseOnFocusOut
+      };
     }
   },
   watch: {
@@ -304,13 +317,14 @@ const _sfc_main = {
         await this.$nextTick();
         const input = this.getInput();
         this.revertInputPadding(input);
-        this.originalInputSize = input.getBoundingClientRect().height;
+        this.initialInputHeight = input.getBoundingClientRect().height;
         this.setInputPadding();
         this.setChipsTopPosition();
       }
     }
   },
   mounted() {
+    this.setInitialInputHeight();
     this.resizeWindowObserver = new ResizeObserver(async () => {
       this.setChipsTopPosition();
       this.setInputPadding();
@@ -440,7 +454,7 @@ const _sfc_main = {
       input.style.paddingLeft = left + "px";
       const chipsSize = chipsWrapper.getBoundingClientRect().height - 4;
       const top = lastChip.offsetTop + 2;
-      if (chipsSize > this.originalInputSize) {
+      if (chipsSize > this.initialInputHeight) {
         input.style.paddingTop = `${top}px`;
       }
     },
@@ -473,23 +487,37 @@ const _sfc_main = {
       } else {
         this.showValidationMessages = false;
       }
+    },
+    setInitialInputHeight() {
+      const input = this.getInput();
+      if (!input)
+        return;
+      this.initialInputHeight = input.getBoundingClientRect().height;
+    },
+    async handleInputFocusIn() {
+      this.inputFocused = true;
+      if (this.collapseOnFocusOut) {
+        await this.$nextTick();
+        this.setInputPadding();
+      }
+    },
+    async handleInputFocusOut() {
+      this.inputFocused = false;
+      if (this.collapseOnFocusOut) {
+        const input = this.getInput();
+        if (!input)
+          return;
+        this.revertInputPadding(input);
+      }
     }
   }
 };
-const _hoisted_1 = {
-  ref: "inputSlotWrapper",
-  class: "combobox__input-wrapper"
-};
+const _hoisted_1 = { ref: "header" };
 const _hoisted_2 = {
-  ref: "chipsWrapper",
-  class: "combobox__chip-wrapper"
-};
-const _hoisted_3 = { ref: "header" };
-const _hoisted_4 = {
   key: 1,
   class: "combobox__list--loading"
 };
-const _hoisted_5 = { ref: "footer" };
+const _hoisted_3 = { ref: "footer" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_chip = vue.resolveComponent("dt-chip");
   const _component_dt_input = vue.resolveComponent("dt-input");
@@ -510,8 +538,16 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onSelect: $options.onComboboxSelect
   }, vue.createSlots({
     input: vue.withCtx(({ onInput }) => [
-      vue.createElementVNode("span", _hoisted_1, [
-        vue.createElementVNode("span", _hoisted_2, [
+      vue.createElementVNode("span", {
+        ref: "inputSlotWrapper",
+        class: "combobox__input-wrapper",
+        onFocusin: _cache[1] || (_cache[1] = (...args) => $options.handleInputFocusIn && $options.handleInputFocusIn(...args)),
+        onFocusout: _cache[2] || (_cache[2] = (...args) => $options.handleInputFocusOut && $options.handleInputFocusOut(...args))
+      }, [
+        vue.createElementVNode("span", {
+          ref: "chipsWrapper",
+          class: vue.normalizeClass(["combobox__chip-wrapper", $options.chipWrapperClass])
+        }, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.selectedItems, (item) => {
             return vue.openBlock(), vue.createBlock(_component_dt_chip, vue.mergeProps({
               ref_for: true,
@@ -531,7 +567,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               _: 2
             }, 1040, ["size", "onKeyup", "onClose"]);
           }), 128))
-        ], 512),
+        ], 2),
         vue.createVNode(_component_dt_input, vue.mergeProps({
           ref: "input",
           modelValue: $data.value,
@@ -549,15 +585,15 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           "validation-messages": $props.maxSelectedMessage,
           "show-messages": $data.showValidationMessages
         }, null, 8, ["validation-messages", "show-messages"])
-      ], 512)
+      ], 544)
     ]),
     list: vue.withCtx(() => [
       vue.createElementVNode("div", {
         ref: "list",
-        onMousedown: _cache[1] || (_cache[1] = vue.withModifiers(() => {
+        onMousedown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
         }, ["prevent"]))
       }, [
-        !$props.loading ? vue.renderSlot(_ctx.$slots, "list", { key: 0 }, void 0, true) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, vue.toDisplayString($props.loadingMessage), 1))
+        !$props.loading ? vue.renderSlot(_ctx.$slots, "list", { key: 0 }, void 0, true) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, vue.toDisplayString($props.loadingMessage), 1))
       ], 544)
     ]),
     _: 2
@@ -565,7 +601,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     $data.hasSlotContent(_ctx.$slots.header) ? {
       name: "header",
       fn: vue.withCtx(() => [
-        vue.createElementVNode("div", _hoisted_3, [
+        vue.createElementVNode("div", _hoisted_1, [
           vue.renderSlot(_ctx.$slots, "header", {}, void 0, true)
         ], 512)
       ]),
@@ -574,7 +610,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     $data.hasSlotContent(_ctx.$slots.footer) ? {
       name: "footer",
       fn: vue.withCtx(() => [
-        vue.createElementVNode("div", _hoisted_5, [
+        vue.createElementVNode("div", _hoisted_3, [
           vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
         ], 512)
       ]),
@@ -582,7 +618,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     } : void 0
   ]), 1032, ["label", "show-list", "max-height", "popover-offset", "has-suggestion-list", "visually-hidden-close-label", "visually-hidden-close", "append-to", "transition", "onSelect"]);
 }
-const combobox_multi_select = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d1f21523"]]);
+const combobox_multi_select = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-a41f6d52"]]);
 exports.CHIP_SIZES = CHIP_SIZES;
 exports.CHIP_TOP_POSITION = CHIP_TOP_POSITION;
 exports.DtRecipeComboboxMultiSelect = combobox_multi_select;

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

@@ -1 +1 @@
-{"version":3,"file":"combobox-multi-select.cjs","sources":["../../recipes/comboboxes/combobox_multi_select/combobox_multi_select_constants.js","../../recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue"],"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\nexport const CHIP_TOP_POSITION = {\n  xs: 1.4,\n  sm: 0.4,\n  md: 0.2,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n","<template>\n  <dt-recipe-combobox-with-popover\n    ref=\"comboboxWithPopover\"\n    :label=\"label\"\n    :show-list=\"showList\"\n    :max-height=\"listMaxHeight\"\n    :popover-offset=\"popoverOffset\"\n    :has-suggestion-list=\"hasSuggestionList\"\n    :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n    :visually-hidden-close=\"visuallyHiddenClose\"\n    content-width=\"anchor\"\n    :append-to=\"appendTo\"\n    :transition=\"transition\"\n    @select=\"onComboboxSelect\"\n  >\n    <template #input=\"{ onInput }\">\n      <span\n        ref=\"inputSlotWrapper\"\n        class=\"combobox__input-wrapper\"\n      >\n        <span\n          ref=\"chipsWrapper\"\n          class=\"combobox__chip-wrapper\"\n        >\n          <dt-chip\n            v-for=\"item in selectedItems\"\n            ref=\"chips\"\n            :key=\"item\"\n            :label-class=\"['d-chip__label']\"\n            class=\"combobox__chip\"\n            :close-button-props=\"{ ariaLabel: 'close' }\"\n            :size=\"CHIP_SIZES[size]\"\n            v-on=\"chipListeners\"\n            @keyup.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=\"combobox__input\"\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-on=\"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        @mousedown.prevent\n      >\n        <slot\n          v-if=\"!loading\"\n          name=\"list\"\n        />\n        <div\n          v-else\n          class=\"combobox__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-recipe-combobox-with-popover>\n</template>\n\n<script>\nimport DtRecipeComboboxWithPopover from '@/recipes/comboboxes/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 { hasSlotContent } from '@/common/utils';\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';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\n\nexport default {\n  name: 'DtRecipeComboboxMultiSelect',\n\n  components: {\n    DtRecipeComboboxWithPopover,\n    DtInput,\n    DtChip,\n    DtValidationMessages,\n  },\n\n  mixins: [SrOnlyCloseButtonMixin],\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: [HTMLElement, 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  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 keyup event\n     *\n     * @event keyup\n     * @type {KeyboardEvent}\n      */\n    'keyup',\n  ],\n\n  data () {\n    return {\n      value: '',\n      popoverOffset: [0, 4],\n      showValidationMessages: false,\n      initialInputPadding: {},\n      resizeWindowObserver: null,\n      originalInputSize: null,\n      CHIP_SIZES,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    inputPlaceHolder () {\n      return this.selectedItems?.length > 0 ? '' : this.placeholder;\n    },\n\n    chipListeners () {\n      return {\n        keyup: event => {\n          this.onChipKeyup(event);\n          this.$emit('keyup', event);\n        },\n      };\n    },\n\n    inputListeners () {\n      return {\n        input: event => {\n          this.$emit('input', event);\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n\n        keyup: event => {\n          this.onInputKeyup(event);\n          this.$emit('keyup', event);\n        },\n\n        click: event => {\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n      };\n    },\n  },\n\n  watch: {\n    selectedItems: {\n      deep: true,\n      handler: async function () {\n        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.originalInputSize = input.getBoundingClientRect().height;\n        this.setInputPadding();\n        this.setChipsTopPosition();\n      },\n    },\n  },\n\n  mounted () {\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    this.initSelectedItems();\n  },\n\n  beforeUnmount () {\n    this.resizeWindowObserver?.unobserve(document.body);\n  },\n\n  methods: {\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      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    getChipButtons () {\n      return this.$refs.chips && this.$refs.chips.map(chip => chip.$el.querySelector('button'));\n    },\n\n    getChips () {\n      return this.$refs.chips && this.$refs.chips.map(chip => chip.$el);\n    },\n\n    getLastChipButton () {\n      return this.$refs.chips && this.getChipButtons()[this.getChipButtons().length - 1];\n    },\n\n    getLastChip () {\n      return this.$refs.chips && this.getChips()[this.getChips().length - 1];\n    },\n\n    getFirstChip () {\n      return this.$refs.chips && this.getChips()[0];\n    },\n\n    getInput () {\n      return this.$refs.input?.$refs.input;\n    },\n\n    onChipKeyup (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    onInputKeyup (event) {\n      const key = event.code?.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 (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      const chipsWrapper = this.$refs.chipsWrapper;\n      if (!input) return;\n      this.revertInputPadding(input);\n      this.popoverOffset = [0, 4];\n      if (!lastChip) 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      input.style.paddingLeft = left + 'px';\n\n      // Get the chip size minus the 4px padding\n      const chipsSize = chipsWrapper.getBoundingClientRect().height - 4;\n\n      // Get lastChip offsetTop plus 2px of the input padding.\n      const top = lastChip.offsetTop + 2;\n\n      // Add padding to Top only if the chips need more space\n      if (chipsSize > this.originalInputSize) {\n        input.style.paddingTop = `${top}px`;\n      }\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};\n</script>\n\n<style scoped lang=\"less\">\n.combobox__input-wrapper {\n  position: relative;\n  display: block;\n}\n\n.combobox__chip-wrapper {\n  position: absolute;\n  margin-left: var(--dt-space-200);\n  margin-right: var(--dt-space-200);\n  padding-left: var(--dt-space-100);\n  max-width: calc(var(--dt-size-100-percent) - var(--dt-space-400));\n}\n\n.combobox__chip {\n  margin-top: var(--dt-space-300);\n  margin-left: var(--dt-space-200);\n  margin-right: var(--dt-space-200);\n  z-index: var(--zi-base1);\n  max-width: var(--dt-size-100-percent);\n}\n\n.combobox__input {\n  flex-grow: 1;\n}\n\n.combobox__list--loading {\n  text-align: center;\n  padding-top: var(--dt-space-500);\n  padding-bottom: var(--dt-space-500);\n}\n</style>\n"],"names":["DtRecipeComboboxWithPopover","DtInput","DtChip","DtValidationMessages","SrOnlyCloseButtonMixin","validationMessageValidator","POPOVER_APPEND_TO_VALUES","hasSlotContent","_createBlock","_withCtx","_createElementVNode","_createElementBlock","_Fragment","_renderList","_openBlock","_mergeProps","_toHandlers","_withKeys","_createVNode","_renderSlot","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"combobox-multi-select.cjs","sources":["../../recipes/comboboxes/combobox_multi_select/combobox_multi_select_constants.js","../../recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue"],"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\nexport const CHIP_TOP_POSITION = {\n  xs: 1.4,\n  sm: 0.4,\n  md: 0.2,\n};\n\nexport default {\n  MULTI_SELECT_SIZES,\n  CHIP_SIZES,\n  CHIP_TOP_POSITION,\n};\n","<template>\n  <dt-recipe-combobox-with-popover\n    ref=\"comboboxWithPopover\"\n    :label=\"label\"\n    :show-list=\"showList\"\n    :max-height=\"listMaxHeight\"\n    :popover-offset=\"popoverOffset\"\n    :has-suggestion-list=\"hasSuggestionList\"\n    :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n    :visually-hidden-close=\"visuallyHiddenClose\"\n    content-width=\"anchor\"\n    :append-to=\"appendTo\"\n    :transition=\"transition\"\n    @select=\"onComboboxSelect\"\n  >\n    <template #input=\"{ onInput }\">\n      <span\n        ref=\"inputSlotWrapper\"\n        class=\"combobox__input-wrapper\"\n        @focusin=\"handleInputFocusIn\"\n        @focusout=\"handleInputFocusOut\"\n      >\n        <span\n          ref=\"chipsWrapper\"\n          :class=\"['combobox__chip-wrapper', chipWrapperClass]\"\n        >\n          <dt-chip\n            v-for=\"item in selectedItems\"\n            ref=\"chips\"\n            :key=\"item\"\n            :label-class=\"['d-chip__label']\"\n            class=\"combobox__chip\"\n            :close-button-props=\"{ ariaLabel: 'close' }\"\n            :size=\"CHIP_SIZES[size]\"\n            v-on=\"chipListeners\"\n            @keyup.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=\"combobox__input\"\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-on=\"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        @mousedown.prevent\n      >\n        <slot\n          v-if=\"!loading\"\n          name=\"list\"\n        />\n        <div\n          v-else\n          class=\"combobox__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-recipe-combobox-with-popover>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport DtRecipeComboboxWithPopover from '@/recipes/comboboxes/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 { hasSlotContent } from '@/common/utils';\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';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\n\nexport default {\n  name: 'DtRecipeComboboxMultiSelect',\n\n  components: {\n    DtRecipeComboboxWithPopover,\n    DtInput,\n    DtChip,\n    DtValidationMessages,\n  },\n\n  mixins: [SrOnlyCloseButtonMixin],\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: [HTMLElement, 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  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 keyup event\n     *\n     * @event keyup\n     * @type {KeyboardEvent}\n      */\n    'keyup',\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    };\n  },\n\n  computed: {\n    inputPlaceHolder () {\n      return this.selectedItems?.length > 0 ? '' : this.placeholder;\n    },\n\n    chipListeners () {\n      return {\n        keyup: event => {\n          this.onChipKeyup(event);\n          this.$emit('keyup', event);\n        },\n      };\n    },\n\n    inputListeners () {\n      return {\n        input: event => {\n          this.$emit('input', event);\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n\n        keyup: event => {\n          this.onInputKeyup(event);\n          this.$emit('keyup', event);\n        },\n\n        click: event => {\n          if (this.hasSuggestionList) {\n            this.showComboboxList();\n          }\n        },\n      };\n    },\n\n    chipWrapperClass () {\n      return {\n        [`combobox__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        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.initialInputHeight = input.getBoundingClientRect().height;\n        this.setInputPadding();\n        this.setChipsTopPosition();\n      },\n    },\n  },\n\n  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    this.initSelectedItems();\n  },\n\n  beforeUnmount () {\n    this.resizeWindowObserver?.unobserve(document.body);\n  },\n\n  methods: {\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      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    getChipButtons () {\n      return this.$refs.chips && this.$refs.chips.map(chip => chip.$el.querySelector('button'));\n    },\n\n    getChips () {\n      return this.$refs.chips && this.$refs.chips.map(chip => chip.$el);\n    },\n\n    getLastChipButton () {\n      return this.$refs.chips && this.getChipButtons()[this.getChipButtons().length - 1];\n    },\n\n    getLastChip () {\n      return this.$refs.chips && this.getChips()[this.getChips().length - 1];\n    },\n\n    getFirstChip () {\n      return this.$refs.chips && this.getChips()[0];\n    },\n\n    getInput () {\n      return this.$refs.input?.$refs.input;\n    },\n\n    onChipKeyup (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    onInputKeyup (event) {\n      const key = event.code?.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 (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      const chipsWrapper = this.$refs.chipsWrapper;\n      if (!input) return;\n      this.revertInputPadding(input);\n      this.popoverOffset = [0, 4];\n      if (!lastChip) 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      input.style.paddingLeft = left + 'px';\n\n      // Get the chip size minus the 4px padding\n      const chipsSize = chipsWrapper.getBoundingClientRect().height - 4;\n\n      // Get lastChip offsetTop plus 2px of the input padding.\n      const top = lastChip.offsetTop + 2;\n\n      // Add padding to Top only if the chips need more space\n      if (chipsSize > this.initialInputHeight) {\n        input.style.paddingTop = `${top}px`;\n      }\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      this.initialInputHeight = input.getBoundingClientRect().height;\n    },\n\n    async handleInputFocusIn () {\n      this.inputFocused = true;\n      if (this.collapseOnFocusOut) {\n        await this.$nextTick();\n        this.setInputPadding();\n      }\n    },\n\n    async handleInputFocusOut () {\n      this.inputFocused = false;\n      if (this.collapseOnFocusOut) {\n        const input = this.getInput();\n        if (!input) return;\n        this.revertInputPadding(input);\n      }\n    },\n  },\n};\n</script>\n\n<style scoped lang=\"less\">\n.combobox__input-wrapper {\n  position: relative;\n  display: block;\n}\n\n.combobox__chip-wrapper {\n  position: absolute;\n  margin-left: var(--dt-space-200);\n  margin-right: var(--dt-space-200);\n  padding-left: var(--dt-space-100);\n  max-width: calc(var(--dt-size-100-percent) - var(--dt-space-400));\n  max-height: initial;\n  overflow-y: visible;\n}\n\n.combobox__chip-wrapper-md--collapsed {\n  max-height: 2.8rem;\n  overflow-y: hidden;\n}\n\n.combobox__chip-wrapper-sm--collapsed,\n.combobox__chip-wrapper-xs--collapsed {\n  max-height: 2.5rem;\n  overflow-y: hidden;\n}\n\n.combobox__chip {\n  margin-top: var(--dt-space-300);\n  margin-left: var(--dt-space-200);\n  margin-right: var(--dt-space-200);\n  z-index: var(--zi-base1);\n  max-width: var(--dt-size-100-percent);\n}\n\n.combobox__input {\n  flex-grow: 1;\n}\n\n.combobox__list--loading {\n  text-align: center;\n  padding-top: var(--dt-space-500);\n  padding-bottom: var(--dt-space-500);\n}\n</style>\n"],"names":["DtRecipeComboboxWithPopover","DtInput","DtChip","DtValidationMessages","SrOnlyCloseButtonMixin","validationMessageValidator","POPOVER_APPEND_TO_VALUES","hasSlotContent","_createBlock","_withCtx","_createElementVNode","_createElementBlock","_Fragment","_renderList","_openBlock","_mergeProps","_toHandlers","_withKeys","_createVNode","_renderSlot","_toDisplayString"],"mappings":"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"}