@ironsource/shared-ui 1.4.2-test.7 → 1.4.2

package/components/dropdown/Dropdown.vue.js

@@ -1,23 +1,22 @@
-import { defineComponent, ref, computed, watch, useSlots, nextTick, toRaw, provide, onMounted, openBlock, createElementBlock, normalizeClass, renderSlot, createVNode, unref, withCtx, Transition, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, createBlock, mergeProps, withModifiers, Fragment, renderList, pushScopeId, popScopeId } from 'vue';
+import { defineComponent, ref, computed, watch, useSlots, nextTick, toRaw, provide, onMounted, openBlock, createElementBlock, normalizeClass, unref, renderSlot, createVNode, withCtx, Transition, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, createBlock, mergeProps, withModifiers, Fragment, renderList, pushScopeId, popScopeId } from 'vue';
 import Button from '../button/Button.vue.js';
-import '../button/IconButton.vue.js';
-import '../button/ScrollButton.vue.js';
-import Option from './Option.vue.js';
 import Icon from '../icon/Icon.vue.js';
-import Search from '../search/Search.vue.js';
-import '../typography/Heading.vue.js';
+import { DropdownTestIdModifiers } from '../../testids/index.vue.js';
+/* empty css                                                                     */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
 import Text from '../typography/Text.vue.js';
+/* empty css                                                                    *//* empty css                                                                    *//* empty css                                                                               */import { Dropdown as Dropdown$1 } from 'floating-vue';
+/* empty css                                                      *//* empty css                                                                      */import Option from './Option.vue.js';
+import Search from '../search/Search.vue.js';
 import { useToggle } from '../../composables/useToggle.vue.js';
 import { isObjectInArray } from '../../utils/array.vue.js';
 import { objectsEqual } from '../../utils/object.vue.js';
 import { useClamp, useVirtualList, onClickOutside } from '@vueuse/core';
-import { Dropdown as Dropdown$1 } from 'floating-vue';
 import { Mode, Type, DropdownContext } from './DropdownContext.vue.js';
-/* empty css                                                          *//* empty css                                              */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
-
+import { pxToRem } from '../../utils/style.vue.js';
+/* empty css                                                          *//* empty css                                              */
 import "../../Dropdown.vue_vue_type_style_index_0_scoped_true_lang.css";import "../../Dropdown.vue_vue_type_style_index_1_lang.css";
-const _withScopeId = (n) => (pushScopeId("data-v-49790baa"), n = n(), popScopeId(), n);
-const _hoisted_1 = ["tabindex"];
+const _withScopeId = (n) => (pushScopeId("data-v-6b0dd6db"), n = n(), popScopeId(), n);
+const _hoisted_1 = ["tabindex", "data-testid"];
 const _hoisted_2 = ["disabled", "aria-expanded", "aria-labelledby", "aria-disabled"];
 const _hoisted_3 = {
   key: 0,
@@ -28,19 +27,17 @@ const _hoisted_5 = {
   key: 0,
   class: "dropdown-title"
 };
-const _hoisted_6 = {
-  key: 0,
-  class: "dropdown-title__text"
-};
-const _hoisted_7 = {
+const _hoisted_6 = ["data-testid"];
+const _hoisted_7 = ["data-testid"];
+const _hoisted_8 = {
   key: 0,
   class: "no-result-container"
 };
-const _hoisted_8 = {
+const _hoisted_9 = {
   key: 1,
   class: "loader"
 };
-const _hoisted_9 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("svg", {
+const _hoisted_10 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("svg", {
   width: "100",
   height: "100",
   viewBox: "0 0 100 100"
@@ -64,16 +61,13 @@ const _hoisted_9 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElem
     })
   ])
 ], -1));
-const _hoisted_10 = { key: 2 };
-const _hoisted_11 = ["aria-selected", "aria-disabled", "onClick"];
-const _hoisted_12 = {
+const _hoisted_11 = { key: 2 };
+const _hoisted_12 = ["aria-selected", "aria-disabled", "onClick"];
+const _hoisted_13 = {
   key: 0,
   class: "actions"
 };
-const MULTILINE_LIST_HEIGHT = 48;
-const LIST_HEIGHT = 34;
-const IS_ON_TOP_PADDING = 8;
-const _sfc_main = defineComponent({
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Dropdown",
   props: {
     modelValue: { default: null },
@@ -101,8 +95,8 @@ const _sfc_main = defineComponent({
     clearable: { type: Boolean, default: false },
     error: { default: "" },
     size: { default: "lg" },
-    displayValue: {},
-    options: {},
+    displayValue: null,
+    options: null,
     onSearch: { type: Function, default: () => true },
     theme: { default: "is-dropdown" },
     container: { default: "body" },
@@ -111,10 +105,11 @@ const _sfc_main = defineComponent({
     autoSize: { type: Boolean, default: false },
     disableKeyboardEvents: { type: Boolean, default: false },
     multiOptionsPlaceholderPrefix: { default: "" },
-    multiOptionsPlaceholderSuffix: { default: "" }
+    multiOptionsPlaceholderSuffix: { default: "" },
+    testId: { default: "" }
   },
   emits: ["update:selected", "update:isOpen", "closed", "opened", "apply"],
-  setup(__props, { expose: __expose, emit }) {
+  setup(__props, { expose, emit }) {
     const props = __props;
     const isSelected = (arr, element) => {
       if (props.multi) {
@@ -122,6 +117,8 @@ const _sfc_main = defineComponent({
       }
       return toRaw(arr) === element;
     };
+    const MULTILINE_LIST_HEIGHT = 48;
+    const LIST_HEIGHT = 34;
     const selectedOptionRef = ref(props.selected);
     const selectedOption = computed({
       get() {
@@ -146,6 +143,7 @@ const _sfc_main = defineComponent({
     const buttonRef = ref(null);
     const apply = ref(null);
     const cancel = ref(null);
+    const IS_ON_TOP_PADDING = 8;
     const location = computed(() => {
       return buttonRef.value?.getBoundingClientRect().height + IS_ON_TOP_PADDING + props.distance;
     });
@@ -225,13 +223,16 @@ const _sfc_main = defineComponent({
     );
     const hasSubtitle = computed(() => optionsIds.value[0]?.hasSubtitle);
     const isMulti = computed(() => api.mode === Mode.Multi);
+    const itemHeight = computed(
+      () => hasSubtitle.value ? MULTILINE_LIST_HEIGHT : LIST_HEIGHT
+    );
     const {
       list: virtualOptions,
       containerProps,
       wrapperProps,
       scrollTo
     } = useVirtualList(filteredOptions, {
-      itemHeight: () => hasSubtitle.value ? MULTILINE_LIST_HEIGHT : LIST_HEIGHT
+      itemHeight: itemHeight.value
     });
     watch(
       () => props.isOpen,
@@ -509,7 +510,17 @@ const _sfc_main = defineComponent({
         }
       }
     };
-    __expose({
+    const calculateTableHeight = computed(() => {
+      const MAX_NUMBER_OF_OPTIONS = 7;
+      const PADDING_PX = 8;
+      const optionsLength = virtualOptions.value.length;
+      const showSelectAllAddition = props.showSelectAll ? 1 : 0;
+      const isThereMoreOptionsThenMax = optionsLength > MAX_NUMBER_OF_OPTIONS;
+      const numberOfRows = optionsLength + showSelectAllAddition;
+      const numToCalculate = isThereMoreOptionsThenMax ? MAX_NUMBER_OF_OPTIONS + 0.5 : numberOfRows;
+      return pxToRem(numToCalculate * itemHeight.value + PADDING_PX);
+    });
+    expose({
       selectItem: onSelect,
       scrollTo
     });
@@ -517,26 +528,28 @@ const _sfc_main = defineComponent({
       return openBlock(), createElementBlock("div", {
         ref_key: "el",
         ref: el,
-        class: normalizeClass(["dropdown", { "dropdown--disabled": _ctx.disabled }]),
-        tabindex: _ctx.disabled ? -1 : 0,
+        class: normalizeClass(["dropdown", { "dropdown--disabled": __props.disabled }]),
+        tabindex: __props.disabled ? -1 : 0,
+        "data-testid": `${__props.testId}-${unref(DropdownTestIdModifiers).WRAPPER}`,
         onKeydown
       }, [
         renderSlot(_ctx.$slots, "label", {}, void 0, true),
         createVNode(unref(Dropdown$1), {
-          theme: _ctx.theme,
+          theme: __props.theme,
           "popper-class": [
-            _ctx.popperClass,
-            _ctx.autoSize ? "v-popper--theme-is-dropdown--auto-size" : null
+            __props.popperClass,
+            __props.autoSize ? "v-popper--theme-is-dropdown--auto-size" : null
           ],
-          placement: _ctx.placement,
-          skidding: _ctx.isOnTop ? 0 : _ctx.skidding,
-          distance: _ctx.isOnTop ? -location.value : _ctx.distance,
-          flip: _ctx.flip,
+          placement: __props.placement,
+          skidding: __props.isOnTop ? 0 : __props.skidding,
+          distance: __props.isOnTop ? -unref(location) : __props.distance,
+          flip: __props.flip,
           triggers: [],
           shown: !!unref(open),
           "auto-hide": false,
-          container: _ctx.container,
-          "auto-size": _ctx.autoSize
+          container: __props.container,
+          "auto-size": __props.autoSize,
+          "data-testid": `${__props.testId}-${unref(DropdownTestIdModifiers).TRIGGER}`
         }, {
           popper: withCtx(() => [
             createVNode(Transition, null, {
@@ -545,25 +558,30 @@ const _sfc_main = defineComponent({
                   ref_key: "listRef",
                   ref: listRef
                 }, [
-                  _ctx.inlineSearch || _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_5, [
-                    _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_6, [
+                  __props.inlineSearch || __props.title ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                    __props.title ? (openBlock(), createElementBlock("div", {
+                      key: 0,
+                      class: "dropdown-title__text",
+                      "data-testid": `${__props.testId}-${unref(DropdownTestIdModifiers).TITLE}`
+                    }, [
                       createVNode(unref(Text), { strong: "" }, {
                         default: withCtx(() => [
-                          createTextVNode(toDisplayString(_ctx.title), 1)
+                          createTextVNode(toDisplayString(__props.title), 1)
                         ]),
                         _: 1
                       })
-                    ])) : createCommentVNode("", true),
-                    _ctx.inlineSearch ? (openBlock(), createBlock(unref(Search), {
+                    ], 8, _hoisted_6)) : createCommentVNode("", true),
+                    __props.inlineSearch ? (openBlock(), createBlock(unref(Search), {
                       key: 1,
                       modelValue: query.value,
                       "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => query.value = $event),
-                      placeholder: _ctx.searchPlaceholder,
+                      placeholder: __props.searchPlaceholder,
                       class: "dropdown-title__search",
                       variant: "transparent",
                       size: "md",
+                      "test-id": `${__props.testId}-${unref(DropdownTestIdModifiers).SEARCH}`,
                       onKeydown
-                    }, null, 8, ["modelValue", "placeholder"])) : createCommentVNode("", true)
+                    }, null, 8, ["modelValue", "placeholder", "test-id"])) : createCommentVNode("", true)
                   ])) : createCommentVNode("", true),
                   unref(open) ? (openBlock(), createElementBlock("div", {
                     key: 1,
@@ -572,30 +590,32 @@ const _sfc_main = defineComponent({
                   }, [
                     renderSlot(_ctx.$slots, "input-list", { open: unref(open) }, void 0, true),
                     createElementVNode("div", mergeProps(unref(containerProps), {
-                      class: ["list-container", { "list-container--multi": _ctx.multi }]
+                      class: ["list-container", { "list-container--multi": __props.multi }],
+                      style: { height: `${unref(calculateTableHeight)}rem` },
+                      "data-testid": `${__props.testId}-${unref(DropdownTestIdModifiers).LIST_CONTAINER}`
                     }), [
                       createElementVNode("ul", mergeProps(unref(wrapperProps), {
                         role: "listbox",
-                        class: ["list", { "list--multi": _ctx.multi }]
+                        class: ["list", { "list--multi": __props.multi }]
                       }), [
-                        !filteredOptions.value.length && !_ctx.loading ? (openBlock(), createElementBlock("li", _hoisted_7, [
+                        !unref(filteredOptions).length && !__props.loading ? (openBlock(), createElementBlock("li", _hoisted_8, [
                           createVNode(unref(Text), {
                             size: "sm",
                             class: "no-result"
                           }, {
                             default: withCtx(() => [
-                              createTextVNode(toDisplayString(_ctx.noResultsText), 1)
+                              createTextVNode(toDisplayString(__props.noResultsText), 1)
                             ]),
                             _: 1
                           })
                         ])) : createCommentVNode("", true),
-                        _ctx.loading ? (openBlock(), createElementBlock("li", _hoisted_8, [
+                        __props.loading ? (openBlock(), createElementBlock("li", _hoisted_9, [
                           createVNode(unref(Icon), {
                             "font-size": "md",
                             class: "loader-icon"
                           }, {
                             default: withCtx(() => [
-                              _hoisted_9
+                              _hoisted_10
                             ]),
                             _: 1
                           }),
@@ -606,12 +626,12 @@ const _sfc_main = defineComponent({
                             _: 1
                           })
                         ])) : createCommentVNode("", true),
-                        _ctx.showSelectAll ? (openBlock(), createElementBlock("li", _hoisted_10, [
+                        __props.showSelectAll ? (openBlock(), createElementBlock("li", _hoisted_11, [
                           createVNode(Option, {
-                            "aria-selected": allSelected.value,
-                            "aria-disabled": !!_ctx.disabled,
-                            "selected-prop": allSelected.value,
-                            "is-indeterminate": isIndeterminate.value,
+                            "aria-selected": unref(allSelected),
+                            "aria-disabled": !!__props.disabled,
+                            "selected-prop": unref(allSelected),
+                            "is-indeterminate": unref(isIndeterminate),
                             "select-all-option": "",
                             onClick: _cache[3] || (_cache[3] = withModifiers(($event) => onSelectAll(), ["stop"]))
                           }, {
@@ -621,49 +641,51 @@ const _sfc_main = defineComponent({
                             _: 1
                           }, 8, ["aria-selected", "aria-disabled", "selected-prop", "is-indeterminate"])
                         ])) : createCommentVNode("", true),
-                        unref(virtualOptions).length && !_ctx.loading ? (openBlock(true), createElementBlock(Fragment, { key: 3 }, renderList(unref(virtualOptions), ({ data, index }) => {
+                        unref(virtualOptions).length && !__props.loading ? (openBlock(true), createElementBlock(Fragment, { key: 3 }, renderList(unref(virtualOptions), ({ data, index }) => {
                           return openBlock(), createElementBlock("li", {
                             key: index,
-                            "aria-selected": isSelected(toRaw(selectedOption.value), data),
-                            "aria-disabled": !!_ctx.disabled,
+                            "aria-selected": isSelected(toRaw(unref(selectedOption)), data),
+                            "aria-disabled": !!__props.disabled,
                             onClick: withModifiers(() => onSelect(data, index), ["stop"])
                           }, [
                             renderSlot(_ctx.$slots, "default", {
                               option: data,
-                              selected: isSelected(toRaw(selectedOption.value), data),
+                              selected: isSelected(toRaw(unref(selectedOption)), data),
                               active: toRaw(unref(activeIndex)) === index
                             }, void 0, true)
-                          ], 8, _hoisted_11);
+                          ], 8, _hoisted_12);
                         }), 128)) : createCommentVNode("", true)
                       ], 16)
-                    ], 16),
-                    _ctx.multi ? (openBlock(), createElementBlock("div", _hoisted_12, [
+                    ], 16, _hoisted_7),
+                    __props.multi ? (openBlock(), createElementBlock("div", _hoisted_13, [
                       createVNode(unref(Button), {
                         ref_key: "cancel",
                         ref: cancel,
                         size: "sm",
                         variant: "border",
                         theme: "third",
+                        "test-id": `${__props.testId}-${unref(DropdownTestIdModifiers).ACTION_CANCEL}`,
                         onClick: onCancel
                       }, {
                         default: withCtx(() => [
                           createTextVNode(" Cancel ")
                         ]),
                         _: 1
-                      }, 512),
+                      }, 8, ["test-id"]),
                       createVNode(unref(Button), {
                         ref_key: "apply",
                         ref: apply,
                         "data-testid": "mutli-apply",
                         size: "sm",
                         class: "apply-button",
+                        "test-id": `${__props.testId}-${unref(DropdownTestIdModifiers).ACTION_APPLY}`,
                         onClick: onApply
                       }, {
                         default: withCtx(() => [
                           createTextVNode("Apply ")
                         ]),
                         _: 1
-                      }, 512)
+                      }, 8, ["test-id"])
                     ])) : createCommentVNode("", true)
                   ], 32)) : createCommentVNode("", true)
                 ], 512)
@@ -675,8 +697,8 @@ const _sfc_main = defineComponent({
             createElementVNode("div", {
               class: normalizeClass(["button__container", {
                 "button__container--open": !!unref(open),
-                [`button__container--${_ctx.size}`]: true,
-                "button__container--disabled": _ctx.disabled
+                [`button__container--${__props.size}`]: true,
+                "button__container--disabled": __props.disabled
               }])
             }, [
               _ctx.$slots.input ? (openBlock(), createElementBlock("div", {
@@ -688,23 +710,23 @@ const _sfc_main = defineComponent({
               }, [
                 renderSlot(_ctx.$slots, "input", {
                   open: unref(open),
-                  value: displayedValue.value,
-                  disabled: _ctx.disabled
+                  value: unref(displayedValue),
+                  disabled: __props.disabled
                 }, void 0, true)
               ], 544)) : createCommentVNode("", true),
               !_ctx.$slots.input ? (openBlock(), createElementBlock("button", {
                 key: 1,
                 ref_key: "buttonRef",
                 ref: buttonRef,
-                disabled: _ctx.disabled,
+                disabled: __props.disabled,
                 "aria-haspopup": true,
                 "aria-expanded": !!unref(open),
                 "aria-labelledby": labelRef.value?.id,
-                "aria-disabled": _ctx.disabled,
+                "aria-disabled": __props.disabled,
                 class: normalizeClass([{
                   "button--open": !!unref(open),
-                  [`button--${_ctx.size}`]: true,
-                  "button--disabled": _ctx.disabled
+                  [`button--${__props.size}`]: true,
+                  "button--disabled": __props.disabled
                 }, "button"]),
                 onKeydown: onButtonKeydown,
                 onClick: _cache[1] || (_cache[1] = ($event) => toggleMenu())
@@ -717,7 +739,7 @@ const _sfc_main = defineComponent({
                   "is-truncated": ""
                 }, {
                   default: withCtx(() => [
-                    createTextVNode(toDisplayString(displayedValue.value), 1)
+                    createTextVNode(toDisplayString(unref(displayedValue)), 1)
                   ]),
                   _: 1
                 }),
@@ -731,31 +753,33 @@ const _sfc_main = defineComponent({
             ], 2)
           ]),
           _: 3
-        }, 8, ["theme", "popper-class", "placement", "skidding", "distance", "flip", "shown", "container", "auto-size"]),
-        !_ctx.error && _ctx.helperText ? (openBlock(), createBlock(unref(Text), {
+        }, 8, ["theme", "popper-class", "placement", "skidding", "distance", "flip", "shown", "container", "auto-size", "data-testid"]),
+        !__props.error && __props.helperText ? (openBlock(), createBlock(unref(Text), {
           key: 0,
           size: "caption",
-          class: "helper-text"
+          class: "helper-text",
+          "test-id": `${__props.testId}-${unref(DropdownTestIdModifiers).HELPER_TEXT}`
         }, {
           default: withCtx(() => [
-            createTextVNode(toDisplayString(_ctx.helperText), 1)
+            createTextVNode(toDisplayString(__props.helperText), 1)
           ]),
           _: 1
-        })) : createCommentVNode("", true),
-        _ctx.error ? (openBlock(), createBlock(unref(Text), {
+        }, 8, ["test-id"])) : createCommentVNode("", true),
+        __props.error ? (openBlock(), createBlock(unref(Text), {
           key: 1,
           size: "caption",
-          class: "helper-text helper-text--error"
+          class: "helper-text helper-text--error",
+          "test-id": `${__props.testId}-${unref(DropdownTestIdModifiers).HELPER_TEXT_ERROR}`
         }, {
           default: withCtx(() => [
-            createTextVNode(toDisplayString(_ctx.error), 1)
+            createTextVNode(toDisplayString(__props.error), 1)
           ]),
           _: 1
-        })) : createCommentVNode("", true)
+        }, 8, ["test-id"])) : createCommentVNode("", true)
       ], 42, _hoisted_1);
     };
   }
 });
-var Dropdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-49790baa"]]);
+var Dropdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6b0dd6db"]]);
 
 export { Dropdown as default };

package/components/dropdown/Label.vue.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/components/dropdown/Label.vue.js

@@ -1,12 +1,11 @@
 import { defineComponent, openBlock, createElementBlock, unref, normalizeClass, createVNode, withCtx, renderSlot, createBlock, createTextVNode, createCommentVNode } from 'vue';
-import '../typography/Heading.vue.js';
+/* empty css                                                                     */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
 import Text from '../typography/Text.vue.js';
 import { useDropdownContext } from './DropdownContext.vue.js';
 import { useId } from '../../composables/useId.vue.js';
-/* empty css                                                       */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
-
+/* empty css                                                       */
 import "../../Label.vue_vue_type_style_index_0_scoped_true_lang.css";
-const _sfc_main = defineComponent({
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Label",
   setup(__props) {
     const id = `is-system-label-${useId().value}`;

package/components/dropdown/Option.vue.d.ts

@@ -35,7 +35,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     subtitle: string;
     selectAllOption: boolean;
     active: boolean;
-}, {}>;
+}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/components/dropdown/Option.vue.js

@@ -1,13 +1,12 @@
-import { defineComponent, ref, onMounted, onUnmounted, computed, toRaw, openBlock, createElementBlock, normalizeClass, createElementVNode, createBlock, unref, createCommentVNode, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, withModifiers } from 'vue';
-import '../typography/Heading.vue.js';
+import { defineComponent, ref, onMounted, onUnmounted, computed, toRaw, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, createBlock, createCommentVNode, renderSlot, createVNode, withCtx, createTextVNode, toDisplayString, withModifiers } from 'vue';
+/* empty css                                                                     */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
 import Text from '../typography/Text.vue.js';
 import { useDropdownContext, Mode } from './DropdownContext.vue.js';
 import { useId } from '../../composables/useId.vue.js';
 import Checkbox from '../checkbox/Checkbox.vue.js';
 import Icon from '../icon/Icon.vue.js';
 import { NOOP } from '@vue/shared';
-/* empty css                                                        */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
-
+/* empty css                                                        */
 import "../../Option.vue_vue_type_style_index_0_scoped_true_lang.css";
 const _hoisted_1 = {
   key: 1,
@@ -19,7 +18,7 @@ const _hoisted_2 = {
 };
 const _hoisted_3 = { class: "text-container" };
 const _hoisted_4 = { key: 0 };
-const _sfc_main = defineComponent({
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Option",
   props: {
     option: { default: null },
@@ -66,27 +65,27 @@ const _sfc_main = defineComponent({
         ref_key: "el",
         ref: el,
         class: normalizeClass(["item-container", {
-          "item-container--disabled": _ctx.disabled,
-          "item-container--active": active.value,
-          "item-container--selected": selected.value,
-          "item-container--multi": isMulti.value
+          "item-container--disabled": __props.disabled,
+          "item-container--active": unref(active),
+          "item-container--selected": unref(selected),
+          "item-container--multi": unref(isMulti)
         }])
       }, [
         createElementVNode("div", {
           class: normalizeClass(["item", {
-            "item--multi": isMulti.value,
+            "item--multi": unref(isMulti),
             "item--with-icon": _ctx.$slots["icon-start"] || _ctx.$slots.image
           }])
         }, [
-          isMulti.value ? (openBlock(), createBlock(unref(Checkbox), {
+          unref(isMulti) ? (openBlock(), createBlock(unref(Checkbox), {
             key: 0,
             id: unref(id).toString(),
             tabindex: "-1",
             class: "checkbox",
             size: "sm",
-            "is-checked": selected.value,
-            "is-indeterminate": _ctx.isIndeterminate && !_ctx.option,
-            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.disabled ? unref(NOOP)() : onClick($event))
+            "is-checked": unref(selected),
+            "is-indeterminate": __props.isIndeterminate && !__props.option,
+            onClick: _cache[0] || (_cache[0] = ($event) => __props.disabled ? unref(NOOP)() : onClick($event))
           }, null, 8, ["id", "is-checked", "is-indeterminate"])) : createCommentVNode("", true),
           _ctx.$slots.image ? (openBlock(), createElementBlock("div", _hoisted_1, [
             renderSlot(_ctx.$slots, "image", {}, void 0, true)
@@ -101,19 +100,19 @@ const _sfc_main = defineComponent({
               ]),
               _: 3
             }),
-            _ctx.subtitle ? (openBlock(), createBlock(unref(Text), {
+            __props.subtitle ? (openBlock(), createBlock(unref(Text), {
               key: 0,
               class: "subtitle",
               size: "xs"
             }, {
               default: withCtx(() => [
-                createTextVNode(toDisplayString(_ctx.subtitle), 1)
+                createTextVNode(toDisplayString(__props.subtitle), 1)
               ]),
               _: 1
             })) : createCommentVNode("", true)
           ])
         ], 2),
-        unref(api).clearable && selected.value ? (openBlock(), createElementBlock("div", _hoisted_4, [
+        unref(api).clearable && unref(selected) ? (openBlock(), createElementBlock("div", _hoisted_4, [
           createElementVNode("button", {
             class: "clear-button",
             onClick: _cache[1] || (_cache[1] = withModifiers(($event) => unref(api).clearSelection(), ["prevent", "stop"]))

package/components/dropdown/SearchInput.vue.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/components/dropdown/SearchInput.vue.js

@@ -10,7 +10,7 @@ const _hoisted_1 = {
   class: "prefix"
 };
 const _hoisted_2 = ["disabled", "placeholder"];
-const _sfc_main = defineComponent({
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SearchInput",
   setup(__props) {
     const api = useDropdownContext("searchInput");
@@ -63,7 +63,7 @@ const _sfc_main = defineComponent({
         inputRef: inputEl.value,
         disabled: unref(api).disabled,
         change: onChange,
-        placeholder: placeholder.value
+        placeholder: unref(placeholder)
       }, () => [
         createElementVNode("div", {
           class: normalizeClass(["container", {
@@ -73,7 +73,7 @@ const _sfc_main = defineComponent({
             focused: isFocused.value
           }])
         }, [
-          showPrefix.value ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          unref(showPrefix) ? (openBlock(), createElementBlock("div", _hoisted_1, [
             renderSlot(_ctx.$slots, "prefix", {}, void 0, true)
           ])) : createCommentVNode("", true),
           createElementVNode("input", {
@@ -81,7 +81,7 @@ const _sfc_main = defineComponent({
             ref: inputEl,
             disabled: unref(api).disabled,
             class: normalizeClass(["input", { "input--disabled": unref(api).disabled }]),
-            placeholder: placeholder.value,
+            placeholder: unref(placeholder),
             onFocusin: _cache[0] || (_cache[0] = ($event) => isFocused.value = true),
             onFocusout: _cache[1] || (_cache[1] = ($event) => isFocused.value = false),
             onInput: onChange
@@ -90,7 +90,7 @@ const _sfc_main = defineComponent({
             variant: "colorized",
             size: "sm",
             theme: "secondary",
-            class: normalizeClass(["search-right-icon", { "search-right-icon-clear": showClear.value }]),
+            class: normalizeClass(["search-right-icon", { "search-right-icon-clear": unref(showClear) }]),
             disabled: unref(api).disabled
           }, {
             default: withCtx(() => [
@@ -103,7 +103,7 @@ const _sfc_main = defineComponent({
               unref(api).open.value ? (openBlock(), createBlock(unref(Icon), {
                 key: 1,
                 "font-size": "sm",
-                name: rightIcon.value,
+                name: unref(rightIcon),
                 onClick: onClearClick
               }, null, 8, ["name"])) : createCommentVNode("", true)
             ]),