@knime/kds-components 0.28.7 → 0.28.9

package/dist/index.js

@@ -16,7 +16,7 @@ const _hoisted_3$t = {
   class: "kds-avatar-initials",
   "aria-hidden": "true"
 };
-const _sfc_main$1z = /* @__PURE__ */ defineComponent({
+const _sfc_main$1A = /* @__PURE__ */ defineComponent({
   __name: "KdsAvatar",
   props: {
     initials: {},
@@ -96,7 +96,7 @@ const _export_sfc = (sfc, props) => {
   return target;
 };
 
-const KdsAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$1z, [["__scopeId", "data-v-9e1a5abe"]]);
+const KdsAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$1A, [["__scopeId", "data-v-9e1a5abe"]]);
 
 const _hoisted_1$$ = ["aria-label"];
 const _hoisted_2$B = { class: "avatars" };
@@ -105,7 +105,7 @@ const _hoisted_3$s = {
   class: "more-count",
   "aria-hidden": "true"
 };
-const _sfc_main$1y = /* @__PURE__ */ defineComponent({
+const _sfc_main$1z = /* @__PURE__ */ defineComponent({
   __name: "KdsAvatarCounter",
   props: {
     moreCount: { default: 0 },
@@ -145,7 +145,7 @@ const _sfc_main$1y = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsAvatarCounter = /* @__PURE__ */ _export_sfc(_sfc_main$1y, [["__scopeId", "data-v-1aef516d"]]);
+const KdsAvatarCounter = /* @__PURE__ */ _export_sfc(_sfc_main$1z, [["__scopeId", "data-v-1aef516d"]]);
 
 const __variableDynamicImportRuntimeHelper = (glob$1, path$13, segs) => {
 	const v = glob$1[path$13];
@@ -202,7 +202,7 @@ function useIcon({
   };
 }
 
-const _sfc_main$1x = /* @__PURE__ */ defineComponent({
+const _sfc_main$1y = /* @__PURE__ */ defineComponent({
   __name: "KdsIcon",
   props: {
     name: {},
@@ -232,7 +232,7 @@ const _sfc_main$1x = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1x, [["__scopeId", "data-v-bff4f419"]]);
+const KdsIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1y, [["__scopeId", "data-v-bff4f419"]]);
 
 const ID_TO_ICON_MAP = {
   // Flow Variables
@@ -576,7 +576,7 @@ const kdsDataTypeSize = {
 const kdsDataTypeSizes = Object.values(kdsDataTypeSize);
 
 const _hoisted_1$_ = ["title"];
-const _sfc_main$1w = /* @__PURE__ */ defineComponent({
+const _sfc_main$1x = /* @__PURE__ */ defineComponent({
   __name: "KdsDataType",
   props: {
     iconName: { default: "unknown-datatype" },
@@ -622,7 +622,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsDataType = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["__scopeId", "data-v-38e9537f"]]);
+const KdsDataType = /* @__PURE__ */ _export_sfc(_sfc_main$1x, [["__scopeId", "data-v-38e9537f"]]);
 
 const kdsBadgeVariant = {
   NEUTRAL: "neutral",
@@ -640,7 +640,7 @@ const kdsBadgeSize = {
 const kdsBadgeSizes = Object.values(kdsBadgeSize);
 
 const _hoisted_1$Z = { class: "label-wrapper" };
-const _sfc_main$1v = /* @__PURE__ */ defineComponent({
+const _sfc_main$1w = /* @__PURE__ */ defineComponent({
   __name: "KdsBadge",
   props: {
     label: {},
@@ -668,7 +668,7 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsBadge = /* @__PURE__ */ _export_sfc(_sfc_main$1v, [["__scopeId", "data-v-df64f7cf"]]);
+const KdsBadge = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["__scopeId", "data-v-df64f7cf"]]);
 
 const kdsColorSwatchType = {
   LEARNER: "learner",
@@ -694,7 +694,7 @@ const ALPHA_NIBBLE_INDEX = 3;
 const ALPHA_BYTE_START = 6;
 const RGB_SHORT_HEX_LENGTH = 3;
 const RGB_LONG_HEX_LENGTH = 6;
-const _sfc_main$1u = /* @__PURE__ */ defineComponent({
+const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   __name: "KdsColorSwatch",
   props: {
     color: {},
@@ -774,7 +774,7 @@ const _sfc_main$1u = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main$1u, [["__scopeId", "data-v-91e0130d"]]);
+const KdsColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main$1v, [["__scopeId", "data-v-91e0130d"]]);
 
 const kdsDarkModeType = {
   LIGHT: "light",
@@ -896,7 +896,7 @@ function useKdsIsTruncated(elementRef) {
 
 const _hoisted_1$X = ["title", "aria-label"];
 const _hoisted_2$A = ["title"];
-const _sfc_main$1t = /* @__PURE__ */ defineComponent({
+const _sfc_main$1u = /* @__PURE__ */ defineComponent({
   __name: "KdsLiveStatus",
   props: {
     status: { default: "red" },
@@ -931,7 +931,7 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsLiveStatus = /* @__PURE__ */ _export_sfc(_sfc_main$1t, [["__scopeId", "data-v-01555495"]]);
+const KdsLiveStatus = /* @__PURE__ */ _export_sfc(_sfc_main$1u, [["__scopeId", "data-v-01555495"]]);
 
 const kdsLiveStatusStatus = {
   RED: "red",
@@ -948,7 +948,7 @@ const kdsLiveStatusSize = {
 const kdsLiveStatusSizes = Object.values(kdsLiveStatusSize);
 
 const _hoisted_1$W = ["data-style"];
-const _sfc_main$1s = /* @__PURE__ */ defineComponent({
+const _sfc_main$1t = /* @__PURE__ */ defineComponent({
   __name: "KdsLoadingSpinner",
   props: {
     size: { default: "medium" },
@@ -978,7 +978,7 @@ const _sfc_main$1s = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$1s, [["__scopeId", "data-v-54835dc0"]]);
+const KdsLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$1t, [["__scopeId", "data-v-54835dc0"]]);
 
 const kdsLoadingSpinnerVariant = {
   ON_PRIMARY: "onPrimary",
@@ -995,7 +995,7 @@ const _hoisted_4$n = {
   key: 0,
   class: "body"
 };
-const _sfc_main$1r = /* @__PURE__ */ defineComponent({
+const _sfc_main$1s = /* @__PURE__ */ defineComponent({
   __name: "KdsInlineMessage",
   props: {
     headline: {},
@@ -1040,7 +1040,7 @@ const _sfc_main$1r = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsInlineMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-af14056f"]]);
+const KdsInlineMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1s, [["__scopeId", "data-v-af14056f"]]);
 
 const kdsInlineMessageVariant = {
   ERROR: "error",
@@ -1050,6 +1050,24 @@ const kdsInlineMessageVariant = {
 };
 const kdsInlineMessageVariants = Object.values(kdsInlineMessageVariant);
 
+const _sfc_main$1r = /* @__PURE__ */ defineComponent({
+  __name: "KdsMissingValueIcon",
+  props: {
+    size: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(KdsIcon, {
+        name: "circle-question",
+        size: __props.size,
+        class: "kds-missing-value-icon"
+      }, null, 8, ["size"]);
+    };
+  }
+});
+
+const KdsMissingValueIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-df682150"]]);
+
 const _hoisted_1$U = { class: "donut-container" };
 const _hoisted_2$y = ["height", "width", "viewBox"];
 const _hoisted_3$q = ["r", "stroke-width"];
@@ -2337,11 +2355,12 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
           active: __props.activeId === __props.item.id,
           variant: __props.variant,
           badge: __props.item.badge,
+          "trailing-icon": __props.item.trailingIcon,
           shortcut: __props.item.shortcut,
           role: "menuitem"
         }, _ctx.$attrs, {
           onClick: _cache[2] || (_cache[2] = ($event) => !__props.item.disabled && _ctx.$emit("click", $event))
-        }), null, 16, ["id", "accessory", "text", "sub-text", "disabled", "active", "variant", "badge", "shortcut"])),
+        }), null, 16, ["id", "accessory", "text", "sub-text", "disabled", "active", "variant", "badge", "trailing-icon", "shortcut"])),
         __props.item.separator && !__props.isLast ? (openBlock(), createBlock(unref(KdsDivider), {
           key: 3,
           class: "kds-list-item-divider",
@@ -2353,7 +2372,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["__scopeId", "data-v-00c46d78"]]);
+const KdsMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["__scopeId", "data-v-677d6ca6"]]);
 
 const _hoisted_1$N = ["id", "aria-label", "aria-activedescendant"];
 const _sfc_main$1e = /* @__PURE__ */ defineComponent({
@@ -2467,10 +2486,24 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
 const KdsMenuContainer = /* @__PURE__ */ _export_sfc(_sfc_main$1e, [["__scopeId", "data-v-cce3fc40"]]);
 
 const kdsPopoverPlacement = {
+  TOP_LEFT: "top-left",
+  TOP_RIGHT: "top-right",
+  BOTTOM_LEFT: "bottom-left",
+  BOTTOM_RIGHT: "bottom-right",
   CUSTOM: "custom"
 };
+const kdsPopoverPlacements = Object.values(kdsPopoverPlacement);
+const kdsPopoverRole = {
+  DIALOG: "dialog",
+  MENU: "menu",
+  LISTBOX: "listbox"
+};
+const kdsPopoverRoles = Object.values(kdsPopoverRole);
 const kdsPopoverType = {
-  AUTO: "auto"};
+  AUTO: "auto",
+  MANUAL: "manual"
+};
+const kdsPopoverTypes = Object.values(kdsPopoverType);
 
 const _hoisted_1$M = ["id", "popover", "role"];
 const _hoisted_2$t = {
@@ -2554,7 +2587,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
     inheritAttrs: false
   },
   __name: "KdsMenuButton",
-  props: {
+  props: /* @__PURE__ */ mergeModels({
     dataTestId: {},
     size: {},
     disabled: { type: Boolean },
@@ -2566,8 +2599,11 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
     ariaLabel: {},
     items: {},
     menuMaxHeight: {}
-  },
-  emits: ["itemClick"],
+  }, {
+    "modelValue": { type: Boolean, ...{ default: false } },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["itemClick"], ["update:modelValue"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = createPropsRestProxy(__props, ["variant", "menuMaxHeight"]);
     const attrs = useAttrs();
@@ -2581,7 +2617,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
       } = attrs;
       return { ...safeAttrs, ...rest, variant: __props.variant };
     });
-    const isMenuOpen = ref(false);
+    const isMenuOpen = useModel(__props, "modelValue");
     const popoverEl = useTemplateRef("popover");
     const menuContainerEl = useTemplateRef("menuContainer");
     const menuButtonEl = useTemplateRef("menuButton");
@@ -4960,8 +4996,8 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
     const handleInputDragEnd = (event) => {
       handleDragEnd(event);
     };
-    const focusInput = () => {
-      inputRef.value?.focus();
+    const focusInput = (options) => {
+      inputRef.value?.focus(options);
     };
     const clearAndFocusInput = () => {
       modelValue.value = "";
@@ -5072,7 +5108,7 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
   }
 });
 
-const BaseInput = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["__scopeId", "data-v-b8ccb955"]]);
+const BaseInput = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["__scopeId", "data-v-93daa14e"]]);
 
 const usePointerHandler = (updateFromEvent) => {
   const activePointerId = ref(null);
@@ -5399,7 +5435,7 @@ const _sfc_main$V = /* @__PURE__ */ defineComponent({
       adjustByStep(direction);
     };
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(props, {
@@ -5568,7 +5604,7 @@ const _sfc_main$U = /* @__PURE__ */ defineComponent({
     };
     const suggestionId = useId();
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, {
@@ -5635,7 +5671,7 @@ const _sfc_main$U = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsTextInput = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["__scopeId", "data-v-c9f1be40"]]);
+const KdsTextInput = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["__scopeId", "data-v-83f45d15"]]);
 
 const HEX_RADIX = 16;
 const RGB_MAX = 255;
@@ -6338,7 +6374,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
       }
     };
     __expose({
-      focus: () => input.value?.focus()
+      focus: (options) => input.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(props, {
@@ -6426,7 +6462,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     const modelValue = useModel(__props, "modelValue");
     const baseInput = useTemplateRef("baseInput");
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(props, {
@@ -11652,7 +11688,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
       }
     });
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(_ctx.$props, {
@@ -12091,7 +12127,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     );
     const baseInput = useTemplateRef("baseInput");
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(props, {
@@ -12232,7 +12268,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
       emit("resultClick", itemId);
     };
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, {
@@ -12308,7 +12344,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsSearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-3e274ed2"]]);
+const KdsSearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-aec3e3d0"]]);
 
 const _hoisted_1$u = ["rows", "placeholder", "disabled", "autocomplete"];
 const DEFAULT_ROWS = 3;
@@ -12358,8 +12394,8 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     useResizeObserver(textareaElement, resize);
     watch(modelValue, resize, { immediate: true });
     __expose({
-      focus: () => {
-        textareaElement.value?.focus();
+      focus: (options) => {
+        textareaElement.value?.focus(options);
       }
     });
     return (_ctx, _cache) => {
@@ -12388,7 +12424,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
   }
 });
 
-const KdsTextarea = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-8e5a54cf"]]);
+const KdsTextarea = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-36211819"]]);
 
 const _hoisted_1$t = { class: "kds-time-picker" };
 const _hoisted_2$h = { class: "kds-time-picker-fields" };
@@ -12887,7 +12923,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
       }
     });
     __expose({
-      focus: () => baseInput.value?.focus()
+      focus: (options) => baseInput.value?.focus(options)
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, mergeProps(_ctx.$props, {
@@ -13547,6 +13583,7 @@ const _hoisted_4$a = {
   class: "trailing",
   "aria-hidden": "true"
 };
+const TRIGGER_REF = "triggerEl";
 const _sfc_main$A = /* @__PURE__ */ defineComponent({
   __name: "BaseDropdown",
   props: /* @__PURE__ */ mergeModels({
@@ -13567,10 +13604,17 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     "openModifiers": {}
   }),
   emits: /* @__PURE__ */ mergeModels(["click", "keydown"], ["update:open"]),
-  setup(__props, { emit: __emit }) {
+  setup(__props, { expose: __expose, emit: __emit }) {
     const props = createPropsRestProxy(__props, ["disabled", "error", "missing", "ariaInvalid"]);
     const open = useModel(__props, "open");
     const valueTextId = useId();
+    const triggerEl = useTemplateRef(TRIGGER_REF);
+    __expose({
+      /**
+       * Focuses the trigger button
+       */
+      focus: () => triggerEl.value?.focus()
+    });
     const ariaLabelledby = computed(() => {
       if (props.ariaLabel) {
         return void 0;
@@ -13606,6 +13650,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("button", {
         id: props.id,
+        ref: TRIGGER_REF,
         class: normalizeClass(["kds-dropdown-trigger-button", { error: __props.error }]),
         type: "button",
         "aria-expanded": open.value,
@@ -13643,7 +13688,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
   }
 });
 
-const BaseDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-0f4de8fb"]]);
+const BaseDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-1bb2d375"]]);
 
 const DROPDOWN_SEARCH_THRESHOLD = 12;
 
@@ -13791,12 +13836,13 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
     "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const props = createPropsRestProxy(__props, ["placeholder", "disabled", "loading", "error", "validating", "preserveSubTextSpace"]);
     const modelValue = useModel(__props, "modelValue");
     const open = ref(false);
     const popoverEl = useTemplateRef("popoverEl");
     const dropdownContainerEl = useTemplateRef("dropdownContainerEl");
+    const baseDropdownEl = useTemplateRef("baseDropdownEl");
     const selectedOption = computed(
       () => props.possibleValues.find((o) => o.id === modelValue.value)
     );
@@ -13808,6 +13854,12 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
     const closeDropdown = () => {
       open.value = false;
     };
+    __expose({
+      /**
+       * Focuses the trigger button
+       */
+      focus: () => baseDropdownEl.value?.focus()
+    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, {
         id: props.id,
@@ -13820,7 +13872,10 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
         "preserve-sub-text-space": __props.preserveSubTextSpace
       }, {
         default: withCtx((slotProps) => [
-          createVNode(BaseDropdown, mergeProps(slotProps, {
+          createVNode(BaseDropdown, mergeProps({
+            ref_key: "baseDropdownEl",
+            ref: baseDropdownEl
+          }, slotProps, {
             open: open.value,
             "onUpdate:open": _cache[0] || (_cache[0] = ($event) => open.value = $event),
             text: modelValue.value && !selectedOption.value ? `(Missing) ${modelValue.value}` : selectedOption.value?.text,
@@ -14102,12 +14157,13 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const props = createPropsRestProxy(__props, ["placeholder", "disabled", "loading", "allowNewValues", "error", "validating", "preserveSubTextSpace"]);
     const modelValue = useModel(__props, "modelValue");
     const open = ref(false);
     const dropdownContainerEl = useTemplateRef("dropdownContainerEl");
     const popoverEl = useTemplateRef("popoverEl");
+    const baseDropdownEl = useTemplateRef("baseDropdownEl");
     watchEffect(() => {
       if (open.value) {
         nextTick(() => dropdownContainerEl.value?.focus());
@@ -14146,6 +14202,12 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
       addedOptions.value = [...addedOptions.value, { id: text, text }];
       modelValue.value = [...modelValue.value, text];
     };
+    __expose({
+      /**
+       * Focuses the trigger button
+       */
+      focus: () => baseDropdownEl.value?.focus()
+    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(BaseFormFieldWrapper, {
         id: props.id,
@@ -14158,7 +14220,10 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
         "preserve-sub-text-space": __props.preserveSubTextSpace
       }, {
         default: withCtx((slotProps) => [
-          createVNode(BaseDropdown, mergeProps(slotProps, {
+          createVNode(BaseDropdown, mergeProps({
+            ref_key: "baseDropdownEl",
+            ref: baseDropdownEl
+          }, slotProps, {
             open: open.value,
             "onUpdate:open": _cache[0] || (_cache[0] = ($event) => open.value = $event),
             text: summary.value,
@@ -18001,5 +18066,5 @@ const kdsResponsiveButtonGroupAlignments = Object.values(
   kdsResponsiveButtonGroupAlignment
 );
 
-export { KdsAccordion, KdsAvatar, KdsAvatarCounter, KdsBadge, KdsBreadcrumb, _sfc_main$1n as KdsButton, _sfc_main$g as KdsCard, _sfc_main$12 as KdsCheckbox, KdsCheckboxGroup, KdsClickableCard, _sfc_main$R as KdsColorInput, KdsColorSwatch, _sfc_main$17 as KdsContextMenu, KdsDataType, _sfc_main$K as KdsDateInput, _sfc_main$I as KdsDateTimeFormatInput, KdsDivider, KdsDonutChart, _sfc_main$y as KdsDropdown, KdsDynamicModalProvider, KdsEmptyState, KdsIcon, KdsInfoToggleButton, KdsInlineMessage, _sfc_main$B as KdsIntervalInput, KdsLabel, KdsLink, _sfc_main$1m as KdsLinkButton, KdsLinkCard, KdsListContainer, KdsLiveStatus, KdsLoadingSkeleton, KdsLoadingSpinner, _sfc_main$18 as KdsMenu, _sfc_main$1c as KdsMenuButton, KdsModal, KdsModalLayout, _sfc_main$v as KdsMultiSelectDropdown, KdsNavItem, KdsNavigation, _sfc_main$V as KdsNumberInput, KdsPanel, _sfc_main$Q as KdsPasswordInput, _sfc_main$H as KdsPatternInput, KdsPreviewList, KdsProgressButton, KdsRadioButton, KdsRadioButtonGroup, KdsResponsiveButtonGroup, KdsSearchInput, KdsSelectableCard, KdsSortableListBox, KdsSplitButton, KdsSubText, KdsTabBar, KdsTextInput, KdsTextarea, _sfc_main$D as KdsTimeInput, _sfc_main$1k as KdsToggleButton, KdsTwinList, _sfc_main$P as KdsUsernameInput, KdsValueSwitch, KdsVariableToggleButton, kdsAvatarSize, kdsAvatarSizes, kdsBadgeSize, kdsBadgeSizes, kdsBadgeVariant, kdsBadgeVariants, kdsButtonSize, kdsButtonSizes, kdsButtonVariant, kdsButtonVariants, kdsCardVariant, kdsCardVariants, kdsCheckboxGroupAlignment, kdsCheckboxGroupAlignments, kdsCheckboxValue, kdsCheckboxValues, kdsColorSwatchSize, kdsColorSwatchSizes, kdsColorSwatchType, kdsColorSwatchTypes, kdsDarkModeType, kdsDarkModeTypes, kdsDataTypeSize, kdsDataTypeSizes, kdsDateFormatCategories, kdsDateFormatCategory, kdsIconName, iconNames as kdsIconNames, kdsIconSize, kdsIconSizes, kdsInlineMessageVariant, kdsInlineMessageVariants, kdsIntervalDirectionalities, kdsIntervalDirectionality, kdsIntervalInputFormat, kdsIntervalInputFormats, kdsLiveStatusSize, kdsLiveStatusSizes, kdsLiveStatusStatus, kdsLiveStatusStatuses, kdsLoadingSkeletonVariant, kdsLoadingSkeletonVariants, kdsLoadingSpinnerVariant, kdsLoadingSpinnerVariants, kdsModalClosedBy, kdsModalClosedByOptions, kdsModalHeight, kdsModalHeightSizes, kdsModalVariant, kdsModalVariants, kdsModalWidth, kdsModalWidthSizes, kdsPanelBodyOverflow, kdsPanelBodyOverflows, kdsPanelBodyVariant, kdsPanelBodyVariants, kdsPasswordInputAutocomplete, kdsPasswordInputAutocompletes, kdsPasswordInputVariant, kdsPasswordInputVariants, kdsProgressButtonState, kdsProgressButtonStates, kdsRadioButtonGroupAlignment, kdsRadioButtonGroupAlignments, kdsResponsiveButtonGroupAlignment, kdsResponsiveButtonGroupAlignments, kdsTabBarSize, kdsTabBarSizes, kdsTemporalType, kdsTemporalTypes, kdsTimeInputGranularities, kdsTimeInputGranularity, kdsToggleButtonVariant, kdsToggleButtonVariants, kdsTwinListSearchMode, kdsTwinListSearchModes, kdsTypeIconName, typeIconNames as kdsTypeIconNames, kdsUsernameInputAutocomplete, kdsUsernameInputAutocompletes, kdsValueSwitchSize, kdsValueSwitchSizes, kdsValueSwitchVariant, kdsValueSwitchVariants, useKdsDarkMode, useKdsDynamicModal, useKdsIsTruncated, useKdsLegacyMode };
+export { KdsAccordion, KdsAvatar, KdsAvatarCounter, KdsBadge, KdsBreadcrumb, _sfc_main$1n as KdsButton, _sfc_main$g as KdsCard, _sfc_main$12 as KdsCheckbox, KdsCheckboxGroup, KdsClickableCard, _sfc_main$R as KdsColorInput, KdsColorSwatch, _sfc_main$17 as KdsContextMenu, KdsDataType, _sfc_main$K as KdsDateInput, _sfc_main$I as KdsDateTimeFormatInput, KdsDivider, KdsDonutChart, _sfc_main$y as KdsDropdown, KdsDynamicModalProvider, KdsEmptyState, KdsIcon, KdsInfoToggleButton, KdsInlineMessage, _sfc_main$B as KdsIntervalInput, KdsLabel, KdsLink, _sfc_main$1m as KdsLinkButton, KdsLinkCard, KdsListContainer, KdsLiveStatus, KdsLoadingSkeleton, KdsLoadingSpinner, _sfc_main$18 as KdsMenu, _sfc_main$1c as KdsMenuButton, KdsMissingValueIcon, KdsModal, KdsModalLayout, _sfc_main$v as KdsMultiSelectDropdown, KdsNavItem, KdsNavigation, _sfc_main$V as KdsNumberInput, KdsPanel, _sfc_main$Q as KdsPasswordInput, _sfc_main$H as KdsPatternInput, KdsPopover, KdsPreviewList, KdsProgressButton, KdsRadioButton, KdsRadioButtonGroup, KdsResponsiveButtonGroup, KdsSearchInput, KdsSelectableCard, KdsSortableListBox, KdsSplitButton, KdsSubText, KdsTabBar, KdsTextInput, KdsTextarea, _sfc_main$D as KdsTimeInput, _sfc_main$1k as KdsToggleButton, KdsTwinList, _sfc_main$P as KdsUsernameInput, KdsValueSwitch, KdsVariableToggleButton, kdsAvatarSize, kdsAvatarSizes, kdsBadgeSize, kdsBadgeSizes, kdsBadgeVariant, kdsBadgeVariants, kdsButtonSize, kdsButtonSizes, kdsButtonVariant, kdsButtonVariants, kdsCardVariant, kdsCardVariants, kdsCheckboxGroupAlignment, kdsCheckboxGroupAlignments, kdsCheckboxValue, kdsCheckboxValues, kdsColorSwatchSize, kdsColorSwatchSizes, kdsColorSwatchType, kdsColorSwatchTypes, kdsDarkModeType, kdsDarkModeTypes, kdsDataTypeSize, kdsDataTypeSizes, kdsDateFormatCategories, kdsDateFormatCategory, kdsIconName, iconNames as kdsIconNames, kdsIconSize, kdsIconSizes, kdsInlineMessageVariant, kdsInlineMessageVariants, kdsIntervalDirectionalities, kdsIntervalDirectionality, kdsIntervalInputFormat, kdsIntervalInputFormats, kdsLiveStatusSize, kdsLiveStatusSizes, kdsLiveStatusStatus, kdsLiveStatusStatuses, kdsLoadingSkeletonVariant, kdsLoadingSkeletonVariants, kdsLoadingSpinnerVariant, kdsLoadingSpinnerVariants, kdsModalClosedBy, kdsModalClosedByOptions, kdsModalHeight, kdsModalHeightSizes, kdsModalVariant, kdsModalVariants, kdsModalWidth, kdsModalWidthSizes, kdsPanelBodyOverflow, kdsPanelBodyOverflows, kdsPanelBodyVariant, kdsPanelBodyVariants, kdsPasswordInputAutocomplete, kdsPasswordInputAutocompletes, kdsPasswordInputVariant, kdsPasswordInputVariants, kdsPopoverPlacement, kdsPopoverPlacements, kdsPopoverRole, kdsPopoverRoles, kdsPopoverType, kdsPopoverTypes, kdsProgressButtonState, kdsProgressButtonStates, kdsRadioButtonGroupAlignment, kdsRadioButtonGroupAlignments, kdsResponsiveButtonGroupAlignment, kdsResponsiveButtonGroupAlignments, kdsTabBarSize, kdsTabBarSizes, kdsTemporalType, kdsTemporalTypes, kdsTimeInputGranularities, kdsTimeInputGranularity, kdsToggleButtonVariant, kdsToggleButtonVariants, kdsTwinListSearchMode, kdsTwinListSearchModes, kdsTypeIconName, typeIconNames as kdsTypeIconNames, kdsUsernameInputAutocomplete, kdsUsernameInputAutocompletes, kdsValueSwitchSize, kdsValueSwitchSizes, kdsValueSwitchVariant, kdsValueSwitchVariants, useKdsDarkMode, useKdsDynamicModal, useKdsIsTruncated, useKdsLegacyMode };
 //# sourceMappingURL=index.js.map