@dialpad/dialtone-vue 3.120.0 → 3.120.2

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

@@ -1,61 +1,64 @@
-import { DtRecipeComboboxWithPopover as w } from "./combobox-with-popover.js";
-import { DtInput as I } from "./input.js";
-import { DtChip as L } from "./chip.js";
-import { DtValidationMessages as M } from "./validation-messages.js";
-import { validationMessageValidator as P } from "./validators.js";
-import { hasSlotContent as T } from "./utils.js";
-import { e as B } from "../chunks/popover_constants-qjlEkroB.js";
-import { a as k } from "../chunks/sr_only_close_button-7O-Ev8uM.js";
-import { resolveComponent as p, openBlock as h, createBlock as d, createSlots as W, withCtx as l, createElementVNode as a, createElementBlock as c, Fragment as z, renderList as O, mergeProps as m, toHandlers as f, withKeys as V, createTextVNode as E, toDisplayString as g, createVNode as b, withModifiers as R, renderSlot as u } from "vue";
-import { _ as H } from "../chunks/_plugin-vue_export-helper-hUChTQA_.js";
-import "../chunks/index-b4iXYvId.js";
-import "../chunks/keyboard_list_navigation-F0O8nht0.js";
+import { DtRecipeComboboxWithPopover } from "./combobox-with-popover.js";
+import { DtInput } from "./input.js";
+import { DtChip } from "./chip.js";
+import { DtValidationMessages } from "./validation-messages.js";
+import { validationMessageValidator } from "../common/validators.js";
+import { hasSlotContent } from "../common/utils.js";
+import { POPOVER_APPEND_TO_VALUES } from "../chunks/popover_constants-Qkpb0yh2.js";
+import { SrOnlyCloseButtonMixin } from "../chunks/sr_only_close_button-3EdsV-dH.js";
+import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createElementVNode, createElementBlock, Fragment, renderList, mergeProps, toHandlers, withKeys, createTextVNode, toDisplayString, createVNode, withModifiers, renderSlot } from "vue";
+import { _export_sfc } from "../chunks/_plugin-vue_export-helper-caHeSgYY.js";
+import "../chunks/index-b_MgDylR.js";
+import "../chunks/keyboard_list_navigation-ScXhrxya.js";
 import "./list-item.js";
-import "../chunks/list_item_constants-LTUc74pD.js";
+import "../chunks/list_item_constants-u1xcN9Dd.js";
 import "./item-layout.js";
-import "./constants.js";
+import "../common/constants.js";
 import "./icon.js";
 import "@dialpad/dialtone-icons/vue3";
-import "../chunks/icon_constants-OpYAAKwF.js";
+import "../chunks/icon_constants-Dy4MEUJL.js";
 import "@dialpad/dialtone-icons/icons.json";
 import "./skeleton.js";
 import "./popover.js";
-import "../chunks/modal-VuMFkZFH.js";
+import "../chunks/modal-XOr4kiNZ.js";
 import "./button.js";
-import "../chunks/link_constants-vIUB92L4.js";
+import "../chunks/link_constants-nWVlXQBs.js";
 import "./lazy-show.js";
 import "tippy.js";
-import "../chunks/dropdown_constants-EUcDxBrX.js";
-import "../chunks/input-4UQWegUk.js";
-const F = {
+import "../chunks/dropdown_constants-w1MXGC3Z.js";
+import "../chunks/input-NmYDD5bn.js";
+const MULTI_SELECT_SIZES = {
   // Chip has no 'lg' and 'xl' size. So we don't support that in multi-select.
   EXTRA_SMALL: "xs",
   SMALL: "sm",
   DEFAULT: "md"
-}, $ = {
+};
+const CHIP_SIZES = {
   xs: "xs",
   sm: "xs",
   md: "sm"
-}, A = {
+};
+const CHIP_TOP_POSITION = {
   xs: 1.4,
   sm: 0.4,
   md: 0.2
-}, D = {
+};
+const _sfc_main = {
   name: "DtRecipeComboboxMultiSelect",
   components: {
-    DtRecipeComboboxWithPopover: w,
-    DtInput: I,
-    DtChip: L,
-    DtValidationMessages: M
+    DtRecipeComboboxWithPopover,
+    DtInput,
+    DtChip,
+    DtValidationMessages
   },
-  mixins: [k],
+  mixins: [SrOnlyCloseButtonMixin],
   props: {
     /**
      * String to use for the input label.
      */
     label: {
       type: String,
-      required: !0
+      required: true
     },
     /**
      * Determines visibility of input label.
@@ -63,7 +66,7 @@ const F = {
      */
     labelVisible: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Description for the input
@@ -85,14 +88,16 @@ const F = {
     inputMessages: {
       type: Array,
       default: () => [],
-      validator: (e) => P(e)
+      validator: (inputMessages) => {
+        return validationMessageValidator(inputMessages);
+      }
     },
     /**
      * Show input validation message
      */
     showInputMessages: {
       type: Boolean,
-      default: !0
+      default: true
     },
     // @TODO: https://dialpad.atlassian.net/browse/DP-52324
     // type: {
@@ -105,7 +110,7 @@ const F = {
      */
     loading: {
       type: Boolean,
-      default: !1
+      default: false
     },
     /**
      * The message when the list is loading
@@ -164,7 +169,7 @@ const F = {
      */
     hasSuggestionList: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Size of the chip, one of `xs`, `sm`, `md`
@@ -172,7 +177,7 @@ const F = {
     size: {
       type: String,
       default: "md",
-      validator: (e) => Object.values(F).includes(e)
+      validator: (t) => Object.values(MULTI_SELECT_SIZES).includes(t)
     },
     /**
      * Sets the element to which the popover is going to append to.
@@ -182,7 +187,9 @@ const F = {
     appendTo: {
       type: [HTMLElement, String],
       default: "body",
-      validator: (e) => B.includes(e) || e instanceof HTMLElement
+      validator: (appendTo) => {
+        return POPOVER_APPEND_TO_VALUES.includes(appendTo) || appendTo instanceof HTMLElement;
+      }
     },
     /**
      * Named transition when the content display is toggled.
@@ -234,94 +241,121 @@ const F = {
     return {
       value: "",
       popoverOffset: [0, 4],
-      showValidationMessages: !1,
+      showValidationMessages: false,
       initialInputPadding: {},
       resizeWindowObserver: null,
       originalInputSize: null,
-      CHIP_SIZES: $,
-      hasSlotContent: T
+      CHIP_SIZES,
+      hasSlotContent
     };
   },
   computed: {
     inputPlaceHolder() {
-      var e;
-      return ((e = this.selectedItems) == null ? void 0 : e.length) > 0 ? "" : this.placeholder;
+      var _a;
+      return ((_a = this.selectedItems) == null ? void 0 : _a.length) > 0 ? "" : this.placeholder;
     },
     chipListeners() {
       return {
-        keyup: (e) => {
-          this.onChipKeyup(e), this.$emit("keyup", e);
+        keyup: (event) => {
+          this.onChipKeyup(event);
+          this.$emit("keyup", event);
         }
       };
     },
     inputListeners() {
       return {
-        input: (e) => {
-          this.$emit("input", e), this.hasSuggestionList && this.showComboboxList();
+        input: (event) => {
+          this.$emit("input", event);
+          if (this.hasSuggestionList) {
+            this.showComboboxList();
+          }
         },
-        keyup: (e) => {
-          this.onInputKeyup(e), this.$emit("keyup", e);
+        keyup: (event) => {
+          this.onInputKeyup(event);
+          this.$emit("keyup", event);
         },
-        click: (e) => {
-          this.hasSuggestionList && this.showComboboxList();
+        click: (event) => {
+          if (this.hasSuggestionList) {
+            this.showComboboxList();
+          }
         }
       };
     }
   },
   watch: {
     selectedItems: {
-      deep: !0,
+      deep: true,
       handler: async function() {
         this.initSelectedItems();
       }
     },
     async label() {
-      await this.$nextTick(), this.setChipsTopPosition();
+      await this.$nextTick();
+      this.setChipsTopPosition();
     },
     async description() {
-      await this.$nextTick(), this.setChipsTopPosition();
+      await this.$nextTick();
+      this.setChipsTopPosition();
     },
     size: {
       async handler() {
         await this.$nextTick();
-        const e = this.getInput();
-        this.revertInputPadding(e), this.originalInputSize = e.getBoundingClientRect().height, this.setInputPadding(), this.setChipsTopPosition();
+        const input = this.getInput();
+        this.revertInputPadding(input);
+        this.originalInputSize = input.getBoundingClientRect().height;
+        this.setInputPadding();
+        this.setChipsTopPosition();
       }
     }
   },
   mounted() {
     this.resizeWindowObserver = new ResizeObserver(async () => {
-      this.setChipsTopPosition(), this.setInputPadding();
-    }), this.resizeWindowObserver.observe(document.body), this.initSelectedItems();
+      this.setChipsTopPosition();
+      this.setInputPadding();
+    });
+    this.resizeWindowObserver.observe(document.body);
+    this.initSelectedItems();
   },
   beforeUnmount() {
-    var e;
-    (e = this.resizeWindowObserver) == null || e.unobserve(document.body);
+    var _a;
+    (_a = this.resizeWindowObserver) == null ? void 0 : _a.unobserve(document.body);
   },
   methods: {
     async initSelectedItems() {
-      await this.$nextTick(), this.setInputPadding(), this.setChipsTopPosition(), this.setInputMinWidth(), this.checkMaxSelected();
+      await this.$nextTick();
+      this.setInputPadding();
+      this.setChipsTopPosition();
+      this.setInputMinWidth();
+      this.checkMaxSelected();
     },
-    onChipRemove(e) {
-      var s;
-      this.$emit("remove", e), (s = this.$refs.input) == null || s.focus();
+    onChipRemove(item) {
+      var _a;
+      this.$emit("remove", item);
+      (_a = this.$refs.input) == null ? void 0 : _a.focus();
     },
-    onComboboxSelect(e) {
-      this.value = "", this.$emit("select", e);
+    onComboboxSelect(i) {
+      this.value = "";
+      this.$emit("select", i);
     },
     showComboboxList() {
-      var e;
-      this.showList == null && ((e = this.$refs.comboboxWithPopover) == null || e.showComboboxList());
+      var _a;
+      if (this.showList != null) {
+        return;
+      }
+      (_a = this.$refs.comboboxWithPopover) == null ? void 0 : _a.showComboboxList();
     },
     closeComboboxList() {
-      var e;
-      this.showList == null && ((e = this.$refs.comboboxWithPopover) == null || e.closeComboboxList());
+      var _a;
+      if (this.showList != null) {
+        return;
+      }
+      (_a = this.$refs.comboboxWithPopover) == null ? void 0 : _a.closeComboboxList();
     },
     getChipButtons() {
-      return this.$refs.chips && this.$refs.chips.map((e) => e.$el.querySelector("button"));
+      return this.$refs.chips && this.$refs.chips.map((chip) => chip.$el.querySelector("button"));
     },
     getChips() {
-      return this.$refs.chips && this.$refs.chips.map((e) => e.$el);
+      return this.$refs.chips && this.$refs.chips.map((chip) => chip.$el);
     },
     getLastChipButton() {
       return this.$refs.chips && this.getChipButtons()[this.getChipButtons().length - 1];
@@ -333,165 +367,224 @@ const F = {
       return this.$refs.chips && this.getChips()[0];
     },
     getInput() {
-      var e;
-      return (e = this.$refs.input) == null ? void 0 : e.$refs.input;
-    },
-    onChipKeyup(e) {
-      var t;
-      const s = (t = e.code) == null ? void 0 : t.toLowerCase();
-      s === "arrowleft" ? this.navigateBetweenChips(e.target, !0) : s === "arrowright" && (e.target.id === this.getLastChipButton().id ? this.moveFromChipToInput() : this.navigateBetweenChips(e.target, !1));
+      var _a;
+      return (_a = this.$refs.input) == null ? void 0 : _a.$refs.input;
+    },
+    onChipKeyup(event) {
+      var _a;
+      const key = (_a = event.code) == null ? void 0 : _a.toLowerCase();
+      if (key === "arrowleft") {
+        this.navigateBetweenChips(event.target, true);
+      } else if (key === "arrowright") {
+        if (event.target.id === this.getLastChipButton().id) {
+          this.moveFromChipToInput();
+        } else {
+          this.navigateBetweenChips(event.target, false);
+        }
+      }
     },
-    onInputKeyup(e) {
-      var t;
-      const s = (t = e.code) == null ? void 0 : t.toLowerCase();
-      this.selectedItems.length > 0 && e.target.selectionStart === 0 && (s === "backspace" || s === "arrowleft") && this.moveFromInputToChip();
+    onInputKeyup(event) {
+      var _a;
+      const key = (_a = event.code) == null ? void 0 : _a.toLowerCase();
+      if (this.selectedItems.length > 0 && event.target.selectionStart === 0) {
+        if (key === "backspace" || key === "arrowleft") {
+          this.moveFromInputToChip();
+        }
+      }
     },
     moveFromInputToChip() {
-      var e;
-      this.getLastChipButton().focus(), (e = this.$refs.input) == null || e.blur(), this.closeComboboxList();
+      var _a;
+      this.getLastChipButton().focus();
+      (_a = this.$refs.input) == null ? void 0 : _a.blur();
+      this.closeComboboxList();
     },
     moveFromChipToInput() {
-      var e;
-      this.getLastChipButton().blur(), (e = this.$refs.input) == null || e.focus(), this.showComboboxList();
-    },
-    navigateBetweenChips(e, s) {
-      var i;
-      const t = this.getChipButtons().indexOf(e), o = s ? t - 1 : t + 1;
-      o < 0 || o >= ((i = this.$refs.chips) == null ? void 0 : i.length) || (this.getChipButtons()[t].blur(), this.getChipButtons()[o].focus(), this.closeComboboxList());
+      var _a;
+      this.getLastChipButton().blur();
+      (_a = this.$refs.input) == null ? void 0 : _a.focus();
+      this.showComboboxList();
+    },
+    navigateBetweenChips(target, toLeft) {
+      var _a;
+      const from = this.getChipButtons().indexOf(target);
+      const to = toLeft ? from - 1 : from + 1;
+      if (to < 0 || to >= ((_a = this.$refs.chips) == null ? void 0 : _a.length)) {
+        return;
+      }
+      this.getChipButtons()[from].blur();
+      this.getChipButtons()[to].focus();
+      this.closeComboboxList();
     },
     setChipsTopPosition() {
-      const e = this.getInput();
-      if (!e)
+      const input = this.getInput();
+      if (!input)
         return;
-      const s = this.$refs.inputSlotWrapper, t = e.getBoundingClientRect().top - s.getBoundingClientRect().top, o = this.$refs.chipsWrapper;
-      o.style.top = t - A[this.size] + "px";
+      const inputSlotWrapper = this.$refs.inputSlotWrapper;
+      const top = input.getBoundingClientRect().top - inputSlotWrapper.getBoundingClientRect().top;
+      const chipsWrapper = this.$refs.chipsWrapper;
+      chipsWrapper.style.top = top - CHIP_TOP_POSITION[this.size] + "px";
     },
     setInputPadding() {
-      const e = this.getLastChip(), s = this.getInput(), t = this.$refs.chipsWrapper;
-      if (!s || (this.revertInputPadding(s), this.popoverOffset = [0, 4], !e))
+      const lastChip = this.getLastChip();
+      const input = this.getInput();
+      const chipsWrapper = this.$refs.chipsWrapper;
+      if (!input)
+        return;
+      this.revertInputPadding(input);
+      this.popoverOffset = [0, 4];
+      if (!lastChip)
         return;
-      const o = e.offsetLeft + this.getFullWidth(e);
-      s.style.paddingLeft = o + "px";
-      const i = t.getBoundingClientRect().height - 4, n = e.offsetTop + 2;
-      i > this.originalInputSize && (s.style.paddingTop = `${n}px`);
+      const left = lastChip.offsetLeft + this.getFullWidth(lastChip);
+      input.style.paddingLeft = left + "px";
+      const chipsSize = chipsWrapper.getBoundingClientRect().height - 4;
+      const top = lastChip.offsetTop + 2;
+      if (chipsSize > this.originalInputSize) {
+        input.style.paddingTop = `${top}px`;
+      }
     },
-    revertInputPadding(e) {
-      e.style.paddingLeft = "", e.style.paddingTop = "", e.style.paddingBottom = "";
+    revertInputPadding(input) {
+      input.style.paddingLeft = "";
+      input.style.paddingTop = "";
+      input.style.paddingBottom = "";
     },
-    getFullWidth(e) {
-      const s = window.getComputedStyle(e);
-      return e.offsetWidth + parseInt(s.marginLeft) + parseInt(s.marginRight);
+    getFullWidth(el) {
+      const styles = window.getComputedStyle(el);
+      return el.offsetWidth + parseInt(styles.marginLeft) + parseInt(styles.marginRight);
     },
     setInputMinWidth() {
-      const e = this.getFirstChip(), s = this.getInput();
-      s && (e ? s.style.minWidth = this.getFullWidth(e) + 4 + "px" : s.style.minWidth = "");
+      const firstChip = this.getFirstChip();
+      const input = this.getInput();
+      if (!input)
+        return;
+      if (firstChip) {
+        input.style.minWidth = this.getFullWidth(firstChip) + 4 + "px";
+      } else {
+        input.style.minWidth = "";
+      }
     },
     checkMaxSelected() {
-      this.maxSelected !== 0 && (this.selectedItems.length > this.maxSelected ? (this.showValidationMessages = !0, this.$emit("max-selected")) : this.showValidationMessages = !1);
+      if (this.maxSelected === 0)
+        return;
+      if (this.selectedItems.length > this.maxSelected) {
+        this.showValidationMessages = true;
+        this.$emit("max-selected");
+      } else {
+        this.showValidationMessages = false;
+      }
     }
   }
-}, K = {
+};
+const _hoisted_1 = {
   ref: "inputSlotWrapper",
   class: "combobox__input-wrapper"
-}, N = {
+};
+const _hoisted_2 = {
   ref: "chipsWrapper",
   class: "combobox__chip-wrapper"
-}, U = { ref: "header" }, Z = {
+};
+const _hoisted_3 = { ref: "header" };
+const _hoisted_4 = {
   key: 1,
   class: "combobox__list--loading"
-}, q = { ref: "footer" };
-function j(e, s, t, o, i, n) {
-  const C = p("dt-chip"), y = p("dt-input"), S = p("dt-validation-messages"), v = p("dt-recipe-combobox-with-popover");
-  return h(), d(v, {
+};
+const _hoisted_5 = { ref: "footer" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dt_chip = resolveComponent("dt-chip");
+  const _component_dt_input = resolveComponent("dt-input");
+  const _component_dt_validation_messages = resolveComponent("dt-validation-messages");
+  const _component_dt_recipe_combobox_with_popover = resolveComponent("dt-recipe-combobox-with-popover");
+  return openBlock(), createBlock(_component_dt_recipe_combobox_with_popover, {
     ref: "comboboxWithPopover",
-    label: t.label,
-    "show-list": t.showList,
-    "max-height": t.listMaxHeight,
-    "popover-offset": i.popoverOffset,
-    "has-suggestion-list": t.hasSuggestionList,
-    "visually-hidden-close-label": e.visuallyHiddenCloseLabel,
-    "visually-hidden-close": e.visuallyHiddenClose,
+    label: $props.label,
+    "show-list": $props.showList,
+    "max-height": $props.listMaxHeight,
+    "popover-offset": $data.popoverOffset,
+    "has-suggestion-list": $props.hasSuggestionList,
+    "visually-hidden-close-label": _ctx.visuallyHiddenCloseLabel,
+    "visually-hidden-close": _ctx.visuallyHiddenClose,
     "content-width": "anchor",
-    "append-to": t.appendTo,
-    transition: t.transition,
-    onSelect: n.onComboboxSelect
-  }, W({
-    input: l(({ onInput: x }) => [
-      a("span", K, [
-        a("span", N, [
-          (h(!0), c(z, null, O(t.selectedItems, (r) => (h(), d(C, m({
-            ref_for: !0,
-            ref: "chips",
-            key: r,
-            "label-class": ["d-chip__label"],
-            class: "combobox__chip",
-            "close-button-props": { ariaLabel: "close" },
-            size: i.CHIP_SIZES[t.size]
-          }, f(n.chipListeners), {
-            onKeyup: V((_) => n.onChipRemove(r), ["backspace"]),
-            onClose: (_) => n.onChipRemove(r)
-          }), {
-            default: l(() => [
-              E(g(r), 1)
-            ]),
-            _: 2
-          }, 1040, ["size", "onKeyup", "onClose"]))), 128))
+    "append-to": $props.appendTo,
+    transition: $props.transition,
+    onSelect: $options.onComboboxSelect
+  }, createSlots({
+    input: withCtx(({ onInput }) => [
+      createElementVNode("span", _hoisted_1, [
+        createElementVNode("span", _hoisted_2, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList($props.selectedItems, (item) => {
+            return openBlock(), createBlock(_component_dt_chip, mergeProps({
+              ref_for: true,
+              ref: "chips",
+              key: item,
+              "label-class": ["d-chip__label"],
+              class: "combobox__chip",
+              "close-button-props": { ariaLabel: "close" },
+              size: $data.CHIP_SIZES[$props.size]
+            }, toHandlers($options.chipListeners), {
+              onKeyup: withKeys(($event) => $options.onChipRemove(item), ["backspace"]),
+              onClose: ($event) => $options.onChipRemove(item)
+            }), {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(item), 1)
+              ]),
+              _: 2
+            }, 1040, ["size", "onKeyup", "onClose"]);
+          }), 128))
         ], 512),
-        b(y, m({
+        createVNode(_component_dt_input, mergeProps({
           ref: "input",
-          modelValue: i.value,
-          "onUpdate:modelValue": s[0] || (s[0] = (r) => i.value = r),
+          modelValue: $data.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => $data.value = $event),
           class: "combobox__input",
-          "aria-label": t.label,
-          label: t.labelVisible ? t.label : "",
-          description: t.description,
-          placeholder: n.inputPlaceHolder,
-          "show-messages": t.showInputMessages,
-          messages: t.inputMessages,
-          size: t.size
-        }, f(n.inputListeners), { onInput: x }), null, 16, ["modelValue", "aria-label", "label", "description", "placeholder", "show-messages", "messages", "size", "onInput"]),
-        b(S, {
-          "validation-messages": t.maxSelectedMessage,
-          "show-messages": i.showValidationMessages
+          "aria-label": $props.label,
+          label: $props.labelVisible ? $props.label : "",
+          description: $props.description,
+          placeholder: $options.inputPlaceHolder,
+          "show-messages": $props.showInputMessages,
+          messages: $props.inputMessages,
+          size: $props.size
+        }, toHandlers($options.inputListeners), { onInput }), null, 16, ["modelValue", "aria-label", "label", "description", "placeholder", "show-messages", "messages", "size", "onInput"]),
+        createVNode(_component_dt_validation_messages, {
+          "validation-messages": $props.maxSelectedMessage,
+          "show-messages": $data.showValidationMessages
         }, null, 8, ["validation-messages", "show-messages"])
       ], 512)
     ]),
-    list: l(() => [
-      a("div", {
+    list: withCtx(() => [
+      createElementVNode("div", {
         ref: "list",
-        onMousedown: s[1] || (s[1] = R(() => {
+        onMousedown: _cache[1] || (_cache[1] = withModifiers(() => {
         }, ["prevent"]))
       }, [
-        t.loading ? (h(), c("div", Z, g(t.loadingMessage), 1)) : u(e.$slots, "list", { key: 0 }, void 0, !0)
+        !$props.loading ? renderSlot(_ctx.$slots, "list", { key: 0 }, void 0, true) : (openBlock(), createElementBlock("div", _hoisted_4, toDisplayString($props.loadingMessage), 1))
       ], 544)
     ]),
     _: 2
   }, [
-    i.hasSlotContent(e.$slots.header) ? {
+    $data.hasSlotContent(_ctx.$slots.header) ? {
       name: "header",
-      fn: l(() => [
-        a("div", U, [
-          u(e.$slots, "header", {}, void 0, !0)
+      fn: withCtx(() => [
+        createElementVNode("div", _hoisted_3, [
+          renderSlot(_ctx.$slots, "header", {}, void 0, true)
         ], 512)
       ]),
       key: "0"
     } : void 0,
-    i.hasSlotContent(e.$slots.footer) ? {
+    $data.hasSlotContent(_ctx.$slots.footer) ? {
       name: "footer",
-      fn: l(() => [
-        a("div", q, [
-          u(e.$slots, "footer", {}, void 0, !0)
+      fn: withCtx(() => [
+        createElementVNode("div", _hoisted_5, [
+          renderSlot(_ctx.$slots, "footer", {}, void 0, true)
         ], 512)
       ]),
       key: "1"
     } : 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 we = /* @__PURE__ */ H(D, [["render", j], ["__scopeId", "data-v-d1f21523"]]);
+const combobox_multi_select = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d1f21523"]]);
 export {
-  $ as CHIP_SIZES,
-  A as CHIP_TOP_POSITION,
-  we as DtRecipeComboboxMultiSelect,
-  F as MULTI_SELECT_SIZES
+  CHIP_SIZES,
+  CHIP_TOP_POSITION,
+  combobox_multi_select as DtRecipeComboboxMultiSelect,
+  MULTI_SELECT_SIZES
 };
 //# sourceMappingURL=combobox-multi-select.js.map