@ibiz-template/mob-vue3-components 0.0.4 → 0.0.6

package/es/editor/check-box/ibiz-checkbox/ibiz-checkbox.d.ts

@@ -50,8 +50,8 @@ export declare const IBizCheckbox: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/check-box-list/ibiz-checkbox-list/ibiz-checkbox-list.d.ts

@@ -53,8 +53,8 @@ export declare const IBizCheckboxList: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/color-picker/ibiz-color-picker/ibiz-color-picker.d.ts

@@ -54,8 +54,8 @@ export declare const IBizColorPicker: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/common/data-mpicker/ibiz-data-mpicker.css

@@ -0,0 +1 @@
+.ibiz-data-mpicker .ibiz-data-mpicker-toolbar{display:flex;align-items:center;justify-content:space-between;padding:var(--ibiz-spacing-base-tight)}.ibiz-data-mpicker .ibiz-data-mpicker-toolbar button{padding:0;background-color:transparent;border:none}.ibiz-data-mpicker-toolbar__confirm{color:var(--ibiz-color-primary)}.ibiz-data-mpicker-toolbar__cancel{color:var(--ibiz-color-text-3)}.ibiz-data-mpicker .ibiz-data-mpicker-columns{min-height:30vh;max-height:50vh;overflow:auto}.ibiz-data-mpicker .ibiz-data-mpicker-columns .van-cell-group{height:100%;overflow:auto}.ibiz-data-mpicker .ibiz-data-mpicker-columns .van-cell{justify-content:flex-end;padding:var(--ibiz-spacing-base-tight)}.ibiz-data-mpicker .van-cell-group--inset{margin:0}

package/es/editor/common/data-mpicker/ibiz-data-mpicker.d.ts

@@ -0,0 +1,44 @@
+import { Ref, PropType } from 'vue';
+import './ibiz-data-mpicker.scss';
+export declare const IBizDataMPicker: import("vue").DefineComponent<{
+    value: {
+        type: PropType<string[]>;
+        default: never[];
+    };
+    items: {
+        type: PropType<IData[]>;
+        default: () => never[];
+    };
+    showPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    checkboxRefs: Ref<IData>;
+    curValue: import("vue").WritableComputedRef<string[]>;
+    emit: (event: "change" | "update:showPicker", ...args: any[]) => void;
+    toggle: (index: number) => void;
+    onCancel: (e: Event) => void;
+    onConfirm: (e: Event) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:showPicker")[], "change" | "update:showPicker", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    value: {
+        type: PropType<string[]>;
+        default: never[];
+    };
+    items: {
+        type: PropType<IData[]>;
+        default: () => never[];
+    };
+    showPicker: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:showPicker"?: ((...args: any[]) => any) | undefined;
+}, {
+    value: string[];
+    items: IData[];
+    showPicker: boolean;
+}, {}>;

package/es/editor/common/data-mpicker/ibiz-data-mpicker.mjs

@@ -0,0 +1,139 @@
+import { isVNode, ref, computed, watch, createTextVNode, createVNode, resolveComponent, defineComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import './ibiz-data-mpicker.css';
+import { clone } from 'ramda';
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const IBizDataMPicker = /* @__PURE__ */ defineComponent({
+  name: "IBizDataMPicker",
+  props: {
+    value: {
+      type: Object,
+      // eslint-disable-next-line vue/require-valid-default-prop
+      default: []
+    },
+    items: {
+      type: Object,
+      // eslint-disable-next-line vue/require-valid-default-prop
+      default: () => []
+    },
+    showPicker: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["update:showPicker", "change"],
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace("data-mpicker");
+    const localSelectValue = ref([]);
+    const curValue = computed({
+      get() {
+        return localSelectValue.value;
+      },
+      set(select) {
+        localSelectValue.value = select;
+      }
+    });
+    watch(() => props.value, (newVal) => {
+      if (newVal || newVal === null) {
+        localSelectValue.value = newVal;
+      }
+    }, {
+      immediate: true
+    });
+    const onConfirm = (e) => {
+      e.stopPropagation();
+      emit("update:showPicker", false);
+      const value = clone(localSelectValue.value);
+      emit("change", value);
+    };
+    const onCancel = (e) => {
+      e.stopPropagation();
+      emit("update:showPicker", false);
+      localSelectValue.value = props.value;
+    };
+    const checkboxRefs = ref([]);
+    const toggle = (index) => {
+      checkboxRefs.value[index].toggle();
+    };
+    return {
+      ns,
+      checkboxRefs,
+      curValue,
+      emit,
+      toggle,
+      onCancel,
+      onConfirm
+    };
+  },
+  render() {
+    const renderToolbar = () => {
+      return createVNode("div", {
+        "class": this.ns.b("toolbar")
+      }, [createVNode("button", {
+        "type": "button",
+        "class": this.ns.be("toolbar", "cancel"),
+        "onClick": (e) => {
+          this.onCancel(e);
+        }
+      }, [createTextVNode("\u53D6\u6D88")]), createVNode("button", {
+        "type": "button",
+        "class": this.ns.be("toolbar", "confirm"),
+        "onClick": (e) => {
+          this.onConfirm(e);
+        }
+      }, [createTextVNode("\u786E\u5B9A")])]);
+    };
+    const renderColumns = () => {
+      let _slot;
+      return createVNode(resolveComponent("van-checkbox-group"), {
+        "class": this.ns.b("columns"),
+        "modelValue": this.curValue,
+        "onUpdate:modelValue": ($event) => this.curValue = $event
+      }, {
+        default: () => [createVNode(resolveComponent("van-cell-group"), {
+          "inset": true
+        }, _isSlot(_slot = this.items.map((item, index) => {
+          return createVNode(resolveComponent("van-cell"), {
+            "title": item.text,
+            "clickable": true,
+            "onClick": () => {
+              this.toggle(index);
+            }
+          }, {
+            "right-icon": () => {
+              return createVNode(resolveComponent("van-checkbox"), {
+                "ref": (el) => this.checkboxRefs[index] = el,
+                "name": item.value,
+                "onClick": (e) => e.stopPropagation()
+              }, null);
+            }
+          });
+        })) ? _slot : {
+          default: () => [_slot]
+        })]
+      });
+    };
+    return createVNode(resolveComponent("van-popup"), {
+      "class": this.ns.b(),
+      "show": this.showPicker,
+      "onUpdate:show": ($event) => this.showPicker = $event,
+      "round": true,
+      "position": "bottom",
+      "close-on-click-overlay": false,
+      "onClickOverlay": (e) => {
+        e.stopPropagation();
+        this.emit("update:showPicker", false);
+      }
+    }, {
+      default: () => [renderToolbar(), renderColumns()]
+    });
+  }
+});
+
+export { IBizDataMPicker };

package/es/editor/data-picker/ibiz-mpicker/ibiz-mpicker.css

@@ -1 +1 @@
-@charset "UTF-8";.ibiz-mpicker{--van-tag-radius:3.125rem}.ibiz-mpicker .van-field{font-size:var(--ibiz-form-item-font-size)}.ibiz-mpicker .van-field__button button{color:var(--van-field-right-icon-color);border:none}.ibiz-mpicker .van-field__control--custom{flex-wrap:wrap}.ibiz-mpicker .van-field__control{gap:.5rem}.ibiz-mpicker .van-field__control .van-tag{height:100%;padding:.3125rem;--van-tag-font-size:var(--ibiz-form-item-font-size)}.ibiz-mpicker input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color);-webkit-text-fill-color:var(--ibiz-form-item-disabled-color)}.ibiz-mpicker--disabled{opacity:.8}.ibiz-mpicker--readonly{color:var(--ibiz-form-item-readonly-color);-webkit-text-fill-color:var(--ibiz-form-item-readonly-color)}
+@charset "UTF-8";.ibiz-mpicker{--van-tag-radius:3.125rem}.ibiz-mpicker .van-field{font-size:var(--ibiz-form-item-font-size)}.ibiz-mpicker .van-field::after{display:none}.ibiz-mpicker .van-field__right-icon button{color:var(--van-field-right-icon-color);border:none}.ibiz-mpicker .van-field__control--custom{flex-wrap:wrap}.ibiz-mpicker .van-field__control{gap:.5rem}.ibiz-mpicker .van-field__control .van-tag{height:100%;padding:.3125rem;--van-tag-font-size:var(--ibiz-form-item-font-size)}.ibiz-mpicker input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color);-webkit-text-fill-color:var(--ibiz-form-item-disabled-color)}.ibiz-mpicker--disabled{opacity:.8}.ibiz-mpicker--readonly{color:var(--ibiz-form-item-readonly-color);-webkit-text-fill-color:var(--ibiz-form-item-readonly-color)}

package/es/editor/data-picker/ibiz-mpicker/ibiz-mpicker.d.ts

@@ -26,11 +26,12 @@ export declare const IBizMPicker: import("vue").DefineComponent<{
     items: Ref<IData[]>;
     valueText: import("vue").ComputedRef<string>;
     selectItems: Ref<IData[]>;
-    onSearch: (query: string) => Promise<void>;
+    showPicker: Ref<boolean>;
+    onSearch: (query?: string) => Promise<void>;
     onRemove: (tag: string) => void;
-    onOpenChange: (flag: boolean) => void;
     onSelect: (selects: string[]) => void;
     openPickUpView: () => Promise<void>;
+    openPicker: () => Promise<void>;
     onFocus: () => void;
     onBlur: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -61,8 +62,8 @@ export declare const IBizMPicker: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/data-picker/ibiz-mpicker/ibiz-mpicker.mjs

@@ -1,6 +1,8 @@
 import { ref, watch, computed, resolveComponent, createVNode, defineComponent } from 'vue';
 import { getDataPickerProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-mpicker.css';
+import { IBizDataMPicker } from '../../common/data-mpicker/ibiz-data-mpicker.mjs';
+import { IBizCommonRightIcon } from '../../common/right-icon/right-icon.mjs';
 
 "use strict";
 const IBizMPicker = /* @__PURE__ */ defineComponent({
@@ -15,20 +17,26 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
     const curValue = ref([]);
     const items = ref([]);
     const selectItems = ref([]);
-    const open = ref(false);
+    const showPicker = ref(false);
+    const formatter = (item) => {
+      return {
+        srfkey: item[c.keyName] || item.srfkey,
+        value: item[c.keyName] || item.srfkey,
+        srfmajortext: item[c.textName] || item.srfmajortext,
+        text: item[c.textName] || item.srfmajortext,
+        ...item
+      };
+    };
     watch(() => props.value, (newVal) => {
       curValue.value = [];
       selectItems.value = [];
       if (newVal) {
-        selectItems.value = JSON.parse(newVal);
+        selectItems.value = JSON.parse(newVal).map(formatter);
         selectItems.value.forEach((item) => {
           curValue.value.push(item.srfkey);
           const index = items.value.findIndex((i) => Object.is(i.srfkey, item.srfkey));
           if (index < 0) {
-            items.value.push({
-              srfkey: item.srfkey,
-              srfmajortext: item.srfmajortext
-            });
+            items.value.push(formatter(item));
           }
         });
       }
@@ -40,10 +48,7 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
       const valArr = [];
       if (result && Array.isArray(result)) {
         result.forEach((select) => {
-          const formattedItem = {
-            srfkey: select[c.keyName] || select.srfkey,
-            srfmajortext: select[c.textName] || select.srfmajortext
-          };
+          const formattedItem = formatter(select);
           valArr.push(formattedItem);
           const index = items.value.findIndex((item) => Object.is(item[c.keyName], select[c.keyName]));
           if (index < 0) {
@@ -70,27 +75,22 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
         selects.forEach((select) => {
           const findItem = items.value.find((item) => Object.is(item.srfkey, select));
           if (findItem) {
-            valArr.push({
-              srfkey: findItem.srfkey,
-              srfmajortext: findItem.srfmajortext
-            });
+            valArr.push(formatter(findItem));
           }
         });
         const value = valArr.length > 0 ? JSON.stringify(valArr) : "";
+        selectItems.value = valArr;
         emit("change", value);
       } else {
         emit("change", "");
       }
     };
-    const onSearch = async (query) => {
+    const onSearch = async (query = "") => {
       if (c.model.appDataEntityId) {
         const trimQuery = query.trim();
         const res = await c.getServiceData(trimQuery, props.data);
         if (res) {
-          items.value = res.data.map((item) => ({
-            srfkey: item[c.keyName],
-            srfmajortext: item[c.textName]
-          }));
+          items.value = res.data.map((item) => formatter(item));
         }
       }
     };
@@ -125,13 +125,6 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
         emit("change", value);
       }
     };
-    const onOpenChange = (flag) => {
-      open.value = flag;
-      if (open.value) {
-        items.value = [];
-        onSearch("");
-      }
-    };
     const valueText = computed(() => {
       return selectItems.value.map((item) => {
         return item.srfmajortext;
@@ -143,6 +136,10 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
     const onBlur = () => {
       emit("blur");
     };
+    const openPicker = async () => {
+      showPicker.value = true;
+      onSearch();
+    };
     return {
       ns,
       c,
@@ -150,11 +147,12 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
       items,
       valueText,
       selectItems,
+      showPicker,
       onSearch,
       onRemove,
-      onOpenChange,
       onSelect,
       openPickUpView,
+      openPicker,
       onFocus,
       onBlur
     };
@@ -162,6 +160,9 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
   render() {
     return createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : ""],
+      "onClick": () => {
+        this.openPicker();
+      },
       "ref": "editorRef"
     }, [this.readonly && this.valueText, !this.readonly && createVNode(resolveComponent("van-field"), {
       "ref": "editorRef",
@@ -184,23 +185,29 @@ const IBizMPicker = /* @__PURE__ */ defineComponent({
           });
         });
       },
-      button: () => {
+      "right-icon": () => {
         if (this.$slots.append) {
           return this.$slots.append({});
         }
         if (this.disabled || this.readonly) {
           return null;
         }
-        return [this.c.model.pickupAppViewId ? createVNode(resolveComponent("van-button"), {
+        return [this.c.model.pickupAppViewId && createVNode(resolveComponent("van-button"), {
           "size": "small",
           "onClick": this.openPickUpView
         }, {
           default: () => [createVNode("ion-icon", {
             "name": "search"
           }, null)]
-        }) : null];
+        }), this.c.model.appDEDataSetId && createVNode(IBizCommonRightIcon, null, null)];
       }
-    })]);
+    }), createVNode(IBizDataMPicker, {
+      "items": this.items,
+      "onChange": this.onSelect,
+      "showPicker": this.showPicker,
+      "onUpdate:showPicker": ($event) => this.showPicker = $event,
+      "value": this.curValue
+    }, null)]);
   }
 });
 

package/es/editor/data-picker/ibiz-picker/ibiz-picker.d.ts

@@ -70,8 +70,8 @@ export declare const IBizPicker: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/data-picker/ibiz-picker-select-view/ibiz-picker-select-view.d.ts

@@ -74,8 +74,8 @@ export declare const IBizPickerSelectView: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/date-picker/ibiz-date-picker/ibiz-date-picker.d.ts

@@ -56,8 +56,8 @@ export declare const IBizDatePicker: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/date-range/ibiz-date-range-picker/ibiz-date-range-picker.css

@@ -1 +1 @@
-.ibiz-date-range-picker{display:flex;align-items:center;justify-content:center}.ibiz-date-range-picker input{width:100%;font-size:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-text-color);text-align:center;background-color:transparent;border:none;border-color:var(--ibiz-form-item-border-color);box-shadow:none}.ibiz-date-range-picker--disabled{--van-field-input-text-color:var(--ibiz-form-item-disabled-color)}.ibiz-date-range-picker--disabled input{color:var(--ibiz-form-item-disabled-color)}.ibiz-date-range-picker--readonly{--van-field-input-text-color:var(--ibiz-form-item-readonly-color)}.ibiz-date-range-picker--readonly input{color:var(--ibiz-form-item-readonly-color)}
+.ibiz-date-range-picker{display:flex;align-items:center;justify-content:center}.ibiz-date-range-picker .van-field::after{display:none}.ibiz-date-range-picker input{width:100%;font-size:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-text-color);text-align:center;background-color:transparent;border:none;border-color:var(--ibiz-form-item-border-color);box-shadow:none}.ibiz-date-range-picker--disabled{--van-field-input-text-color:var(--ibiz-form-item-disabled-color)}.ibiz-date-range-picker--disabled input{color:var(--ibiz-form-item-disabled-color)}.ibiz-date-range-picker--readonly{--van-field-input-text-color:var(--ibiz-form-item-readonly-color)}.ibiz-date-range-picker--readonly input{color:var(--ibiz-form-item-readonly-color)}

package/es/editor/date-range/ibiz-date-range-picker/ibiz-date-range-picker.d.ts

@@ -62,8 +62,8 @@ export declare const IBizDateRangePicker: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.d.ts

@@ -62,8 +62,8 @@ export declare const IBizDropdown: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;

package/es/editor/dropdown-list/ibiz-dropdown-list/ibiz-dropdown-list.css

@@ -1 +1 @@
-.ibiz-dropdown-list{height:100%;--van-tag-radius:3.125rem}.ibiz-dropdown-list .van-field__control{gap:.5rem}.ibiz-dropdown-list .van-field__control .van-tag{height:100%;padding:.3125rem;--van-tag-font-size:var(--ibiz-form-item-font-size)}.ibiz-dropdown-list .van-picker .van-picker__mask{background-image:var(--ibiz-color-overlay-bg)}.ibiz-dropdown-list .ibiz-dropdown-list-toolbar{display:flex;align-items:center;justify-content:space-between;padding:var(--ibiz-spacing-base-tight)}.ibiz-dropdown-list .ibiz-dropdown-list-toolbar button{padding:0;background-color:transparent;border:none}.ibiz-dropdown-list-toolbar__confirm{color:var(--ibiz-color-primary)}.ibiz-dropdown-list-toolbar__cancel{color:var(--ibiz-color-text-3)}.ibiz-dropdown-list .ibiz-dropdown-list-columns{min-height:30vh;max-height:50vh;overflow:auto}.ibiz-dropdown-list .ibiz-dropdown-list-columns .van-cell-group{height:100%;overflow:auto}.ibiz-dropdown-list .ibiz-dropdown-list-columns .van-cell{padding:var(--ibiz-spacing-base-tight)}.ibiz-dropdown-list input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color);-webkit-text-fill-color:var(--ibiz-form-item-disabled-color)}.ibiz-dropdown-list--disabled{opacity:.8}.ibiz-dropdown-list--readonly{color:var(--ibiz-form-item-readonly-color);-webkit-text-fill-color:var(--ibiz-form-item-readonly-color)}.ibiz-dropdown-list .van-cell-group--inset{margin:0}.ibiz-dropdown-list__select::after{display:none}
+.ibiz-dropdown-list{height:100%;--van-tag-radius:3.125rem}.ibiz-dropdown-list .van-field__control{gap:.5rem}.ibiz-dropdown-list .van-field__control .van-tag{height:100%;padding:.3125rem;--van-tag-font-size:var(--ibiz-form-item-font-size)}.ibiz-dropdown-list .van-picker .van-picker__mask{background-image:var(--ibiz-color-overlay-bg)}.ibiz-dropdown-list .ibiz-dropdown-list-toolbar{display:flex;align-items:center;justify-content:space-between;padding:var(--ibiz-spacing-base-tight)}.ibiz-dropdown-list .ibiz-dropdown-list-toolbar button{padding:0;background-color:transparent;border:none}.ibiz-dropdown-list-toolbar__confirm{color:var(--ibiz-color-primary)}.ibiz-dropdown-list-toolbar__cancel{color:var(--ibiz-color-text-3)}.ibiz-dropdown-list .ibiz-dropdown-list-columns{min-height:30vh;max-height:50vh;overflow:auto}.ibiz-dropdown-list .ibiz-dropdown-list-columns .van-cell-group{height:100%;overflow:auto}.ibiz-dropdown-list .ibiz-dropdown-list-columns .van-cell{padding:var(--ibiz-spacing-base-tight)}.ibiz-dropdown-list input:disabled{color:var(--ibiz-form-item-disabled-color);background-color:var(--ibiz-form-item-disabled-bg-color);border-color:var(--ibiz-form-item-disabled-border-color);-webkit-text-fill-color:var(--ibiz-form-item-disabled-color)}.ibiz-dropdown-list--disabled{opacity:.8}.ibiz-dropdown-list--readonly{color:var(--ibiz-form-item-readonly-color);-webkit-text-fill-color:var(--ibiz-form-item-readonly-color)}.ibiz-dropdown-list .van-cell-group--inset{margin:0}.ibiz-dropdown-list__select::after{display:none}.ibiz-dropdown-list .van-cell__title,.ibiz-dropdown-list .van-cell__value{text-align:left}

package/es/editor/dropdown-list/ibiz-dropdown-list/ibiz-dropdown-list.d.ts

@@ -23,17 +23,14 @@ export declare const IBizDropdownList: import("vue").DefineComponent<{
     ns: import("@ibiz-template/core").Namespace;
     c: DropDownListEditorController;
     items: Ref<readonly IData[]>;
-    curValue: import("vue").WritableComputedRef<string[]>;
     showPicker: Ref<boolean>;
     valueText: import("vue").ComputedRef<string>;
     selectItems: Ref<IData[]>;
-    checkboxRefs: Ref<IData>;
+    selectKeys: Ref<string[]>;
     onBlur: () => void;
-    toggle: (index: number) => void;
     onFocus: () => void;
-    onCancel: () => void;
     onRemove: (item: IData) => void;
-    onConfirm: () => void;
+    onConfirm: (selects: string[]) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (_value: unknown, _name?: string | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
@@ -62,8 +59,8 @@ export declare const IBizDropdownList: import("vue").DefineComponent<{
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
     onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
-    onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
 }, {
     disabled: boolean;
     readonly: boolean;