@ibiz-template/vue3-components 0.7.38-alpha.31 → 0.7.38-alpha.56

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

@@ -0,0 +1,83 @@
+import { Ref } from 'vue';
+import { DropDownListEditorController } from '../dropdown-list-editor.controller';
+import './ibiz-virtualized-list.scss';
+export declare const IBizVirtualizedList: import("vue").DefineComponent<{
+    value: (StringConstructor | NumberConstructor)[];
+    controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<DropDownListEditorController>, undefined, undefined>;
+    data: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<IData>, undefined, undefined>;
+    disabled: {
+        type: BooleanConstructor;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    overflowMode: {
+        type: StringConstructor;
+    };
+    controlParams: {
+        type: ObjectConstructor;
+        required: boolean;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    c: DropDownListEditorController;
+    curValue: import("vue").WritableComputedRef<string | string[] | undefined>;
+    items: Ref<readonly IData[]>;
+    customNodeClass: (data: IData, _node: Node) => string | null;
+    valueText: import("vue").ComputedRef<string>;
+    hasChildren: Ref<boolean>;
+    onBlur: (e: IData) => void;
+    onFocus: (e: IData) => void;
+    editorRef: Ref<any>;
+    treeNodes: Ref<IData[]>;
+    handleKeyUp: (e: KeyboardEvent) => void;
+    getCodeListItem: (text: string) => IData | undefined;
+    onVisibleChange: (visible: boolean) => Promise<void>;
+    isLoading: Ref<boolean>;
+    prefix: {
+        prefix?: (() => JSX.Element[] | undefined) | undefined;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
+    blur: (_event?: IData | undefined) => boolean;
+    focus: (_event?: IData | undefined) => boolean;
+    enter: (_event?: IData | undefined) => boolean;
+    infoTextChange: (_text: string) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    value: (StringConstructor | NumberConstructor)[];
+    controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<DropDownListEditorController>, undefined, undefined>;
+    data: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<IData>, undefined, undefined>;
+    disabled: {
+        type: BooleanConstructor;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    overflowMode: {
+        type: StringConstructor;
+    };
+    controlParams: {
+        type: ObjectConstructor;
+        required: boolean;
+    };
+}>> & {
+    onFocus?: ((_event?: IData | undefined) => any) | undefined;
+    onBlur?: ((_event?: IData | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
+}, {
+    disabled: boolean;
+    readonly: boolean;
+    autoFocus: boolean;
+}, {}>;

package/es/editor/dropdown-list/ibiz-virtualized-list/ibiz-virtualized-list.mjs

@@ -0,0 +1,382 @@
+import { defineComponent, ref, watch, computed, nextTick, onMounted, onUnmounted, createVNode, resolveComponent, mergeProps } from 'vue';
+import { getDropdownProps, getEditorEmits, useNamespace, useCodeListListen, useClickOutside } from '@ibiz-template/vue3-util';
+import { showTitle } from '@ibiz-template/core';
+import { useCodeListSelection } from '@ibiz-template/runtime';
+import './ibiz-virtualized-list.css';
+
+"use strict";
+const IBizVirtualizedList = /* @__PURE__ */ defineComponent({
+  name: "IBizVirtualizedList",
+  props: getDropdownProps(),
+  emits: getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace("dropdown");
+    const c = props.controller;
+    const items = ref([]);
+    const codeListItems = ref([]);
+    const isLoadedCodeList = ref(false);
+    const hasChildren = ref(false);
+    const treeNodes = ref([]);
+    const editorRef = ref();
+    const editorItems = c.model.editorItems;
+    const isLoading = ref(false);
+    let editorState = "";
+    let funcs;
+    const codeItemValueNumber = ref(false);
+    const handleTreeNodes = (nodes) => {
+      if (nodes.length === 0) {
+        return [];
+      }
+      const list = [];
+      nodes.forEach((codeItem) => {
+        var _a;
+        const index = codeListItems.value.findIndex((_item) => {
+          return _item.value === codeItem.value;
+        });
+        if (index === -1) {
+          codeListItems.value.push(codeItem);
+        }
+        const tempObj = {
+          label: codeItem.text,
+          value: (_a = codeItem.value) == null ? void 0 : _a.toString(),
+          color: codeItem == null ? void 0 : codeItem.color,
+          textCls: codeItem == null ? void 0 : codeItem.textCls,
+          sysImage: codeItem.sysImage,
+          disabled: codeItem.disableSelect === true,
+          children: []
+        };
+        if (codeItem.children && codeItem.children.length > 0) {
+          tempObj.children = handleTreeNodes(codeItem.children);
+        }
+        list.push(tempObj);
+      });
+      return list;
+    };
+    const afterLoadCodeList = (codeList) => {
+      items.value = [];
+      codeListItems.value = [];
+      if (c.multiple && !codeList.some((item) => item.children)) {
+        codeList = c.handleCodeListAllItems(codeList);
+      }
+      if (c.blankItemName && !c.multiple) {
+        items.value = [{
+          value: void 0,
+          text: c.blankItemName
+        }, ...codeList];
+      } else {
+        items.value = codeList;
+      }
+      for (let i = 0; i < items.value.length; i++) {
+        const _item = items.value[i];
+        if (_item.children) {
+          hasChildren.value = true;
+          treeNodes.value = handleTreeNodes(codeList);
+          break;
+        }
+      }
+    };
+    const loadCodeList = async () => {
+      if (c.model.appCodeListId) {
+        const app = ibiz.hub.getApp(c.context.srfappid);
+        const codeListModel = app.codeList.getCodeList(c.model.appCodeListId);
+        if (codeListModel) {
+          codeItemValueNumber.value = codeListModel.codeItemValueNumber || false;
+        }
+      }
+      isLoading.value = true;
+      const codeList = await c.loadCodeList(props.data);
+      afterLoadCodeList(codeList);
+      isLoadedCodeList.value = true;
+      isLoading.value = false;
+    };
+    watch(() => props.value, async (newVal, oldVal) => {
+      if (newVal || newVal === null || newVal === 0) {
+        if (!isLoadedCodeList.value && oldVal === void 0) {
+          await loadCodeList();
+        }
+      }
+    }, {
+      immediate: true
+    });
+    const useEditorNavParams = () => {
+      const {
+        navigateContexts = [],
+        navigateParams = []
+      } = c.model;
+      const navParamName = [];
+      [...navigateContexts, ...navigateParams].forEach((nav) => {
+        if (!nav.rawValue && nav.value) {
+          navParamName.push(nav.value);
+        }
+      });
+      watch(() => {
+        const data = {};
+        Object.keys(props.data).forEach((key) => {
+          if (navParamName.includes(key)) {
+            data[key] = props.data[key];
+          }
+        });
+        return data;
+      }, () => loadCodeList(), {
+        deep: true
+      });
+    };
+    const getCodeListItemByValue = (value) => {
+      const list = hasChildren.value ? codeListItems.value : items.value;
+      return list.find((item) => item.value === value);
+    };
+    const {
+      getSelection,
+      getSelectionValue
+    } = useCodeListSelection(c.allItemsValue);
+    const curValue = computed({
+      get() {
+        var _a, _b, _c;
+        if (!isLoadedCodeList.value) {
+          return c.multiple ? [] : "";
+        }
+        if (editorItems && editorItems.length > 0 && !c.multiple) {
+          return (_a = props.data[editorItems[0].id]) == null ? void 0 : _a.toString();
+        }
+        if (props.value && typeof props.value === "string") {
+          if (c.allItems && c.multiple && !hasChildren.value) {
+            return getSelection([], props.value.split(","), items.value, items.value).map((v) => "".concat(v));
+          }
+          return c.multiple ? (_b = props.value) == null ? void 0 : _b.toString().split(",") : props.value.toString();
+        }
+        if (props.value && Array.isArray(props.value)) {
+          if (c.allItems && c.multiple && !hasChildren.value) {
+            return getSelection([], props.value, items.value, items.value).map((v) => "".concat(v));
+          }
+          return c.multiple ? props.value : props.value.toString();
+        }
+        return (_c = props.value) == null ? void 0 : _c.toString();
+      },
+      set(_select) {
+        let select = _select;
+        if (c.blankItemName && !_select) {
+          select = void 0;
+        }
+        if (Array.isArray(select)) {
+          if (c.allItems && c.multiple && !hasChildren.value) {
+            const selection = getSelection(curValue.value, select, items.value, items.value);
+            select = getSelectionValue(selection).map((v) => "".concat(v));
+          }
+          let selectArr = null;
+          if (select.length === 0) {
+            selectArr = null;
+          } else if (c.model.valueType === "SIMPLES") {
+            selectArr = select;
+          } else {
+            selectArr = select.join(",");
+          }
+          emit("change", selectArr);
+        } else if (editorItems && editorItems.length > 0) {
+          emit("change", codeItemValueNumber.value ? Number(select) : select, editorItems[0].id);
+          const selectItem = getCodeListItemByValue(codeItemValueNumber.value ? Number(select) : select);
+          if (selectItem) {
+            emit("change", selectItem.text);
+          }
+        } else {
+          emit("change", codeItemValueNumber.value ? Number(select) : select);
+        }
+        if (c.editorParams.alwaysLoad === "true") {
+          loadCodeList();
+        }
+        if (props.autoFocus) {
+          editorState = "blur";
+          emit("blur");
+        }
+      }
+    });
+    const valueText = computed(() => {
+      const valueArr = Array.isArray(curValue.value) ? curValue.value : [curValue.value];
+      const list = hasChildren.value ? codeListItems.value : items.value;
+      const textArr = [];
+      valueArr.forEach((item) => {
+        list.forEach((codeItem) => {
+          if (codeItemValueNumber.value ? codeItem.value === Number(item) : codeItem.value === item) {
+            textArr.push(codeItem.text);
+          }
+        });
+      });
+      return textArr.join(",");
+    });
+    watch(valueText, (newVal, oldVal) => {
+      if (newVal !== oldVal) {
+        emit("infoTextChange", newVal);
+      }
+    }, {
+      immediate: true
+    });
+    watch(editorRef, (newVal) => {
+      var _a;
+      if (props.autoFocus && newVal && newVal.focus) {
+        (_a = newVal.focus) == null ? void 0 : _a.call(newVal);
+      }
+    });
+    const onFocus = (e) => {
+      editorState = "focus";
+      emit("focus", e);
+    };
+    const onBlur = (e) => {
+      editorState = "blur";
+      emit("blur", e);
+    };
+    const handleKeyUp = (e) => {
+      if (e && e.code === "Enter") {
+        emit("enter", e);
+      }
+    };
+    const customNodeClass = (data, _node) => {
+      return data.children.length ? ns.e("branch-node") : null;
+    };
+    const getCodeListItem = (text) => {
+      const list = hasChildren.value ? codeListItems.value : items.value;
+      return list.find((item) => item.text === text);
+    };
+    const onVisibleChange = async (visible) => {
+      if (visible && (!isLoadedCodeList.value || c.editorParams.alwaysLoad === "true")) {
+        await loadCodeList();
+        if (hasChildren.value && editorRef.value && editorState !== "outside") {
+          nextTick(() => {
+            var _a, _b;
+            (_b = (_a = editorRef.value).focus) == null ? void 0 : _b.call(_a);
+          });
+        }
+        nextTick(() => {
+          window.dispatchEvent(new Event("resize"));
+        });
+      }
+    };
+    const fn = (data) => {
+      if (data)
+        afterLoadCodeList(data);
+    };
+    useCodeListListen(c.model.appCodeListId, c.context.srfappid, fn);
+    onMounted(() => {
+      useEditorNavParams();
+      if (editorRef.value) {
+        funcs = useClickOutside(editorRef, async (_evt) => {
+          editorState = "outside";
+        });
+      }
+    });
+    onUnmounted(() => {
+      if (funcs && funcs.stop) {
+        funcs.stop();
+      }
+    });
+    const prefix = {};
+    if (c.editorParams.type === "round") {
+      Object.assign(prefix, {
+        prefix: () => {
+          return valueText.value.split(",").map((text) => {
+            const codeListItem = getCodeListItem(text);
+            return createVNode("div", {
+              "class": [ns.b("select-option-text"), codeListItem == null ? void 0 : codeListItem.textCls],
+              "style": (codeListItem == null ? void 0 : codeListItem.color) || (codeListItem == null ? void 0 : codeListItem.bkcolor) ? ns.cssVarBlock({
+                "select-option-item-color": "".concat(codeListItem.color || ""),
+                "select-option-item-bkcolor": "".concat(codeListItem.bkcolor || ""),
+                "select-option-item-padding": "0 var(".concat(ns.cssVarName("spacing-base"), ")")
+              }) : ""
+            }, [(codeListItem == null ? void 0 : codeListItem.sysImage) && createVNode(resolveComponent("iBizIcon"), {
+              "icon": codeListItem == null ? void 0 : codeListItem.sysImage
+            }, null), text || ""]);
+          });
+        }
+      });
+    }
+    return {
+      ns,
+      c,
+      curValue,
+      items,
+      customNodeClass,
+      valueText,
+      hasChildren,
+      onBlur,
+      onFocus,
+      editorRef,
+      treeNodes,
+      handleKeyUp,
+      getCodeListItem,
+      onVisibleChange,
+      isLoading,
+      prefix
+    };
+  },
+  render() {
+    const overflowMode = this.c.editorParams.overflowMode || ibiz.config.pickerEditor.overflowMode;
+    const isEllipsis = overflowMode === "ellipsis";
+    const editContent = createVNode(resolveComponent("el-select-v2"), mergeProps({
+      "ref": "editorRef",
+      "modelValue": this.curValue,
+      "onUpdate:modelValue": ($event) => this.curValue = $event,
+      "clearable": true,
+      "class": [this.ns.b("select")],
+      "filterable": true,
+      "multiple": this.c.multiple,
+      "allow-create": !this.c.forceSelection,
+      "placeholder": this.c.placeHolder ? this.c.placeHolder : " ",
+      "disabled": this.disabled,
+      "loading": this.isLoading,
+      "fit-input-width": isEllipsis,
+      "popper-class": "".concat(this.ns.b("popper"), " ").concat(this.c.editorParams.type === "round" ? this.ns.bm("popper", "round") : "", " ").concat(this.ns.bm("popper", "".concat(this.c.model.id))),
+      "onBlur": this.onBlur,
+      "onFocus": this.onFocus,
+      "onKeyup": this.handleKeyUp,
+      "onVisibleChange": this.onVisibleChange,
+      "options": this.items,
+      "props": {
+        key: "value",
+        label: "text"
+      }
+    }, this.$attrs), {
+      default: (data) => {
+        const {
+          item
+        } = data;
+        return createVNode("div", {
+          "style": item.bkcolor ? this.ns.cssVarBlock({
+            "select-option-item-bkcolor": "".concat(item.bkcolor)
+          }) : "",
+          "class": ["select-v2-option-item", item.cls ? item.cls : null, item.disableSelect === true ? "disabled-select-v2" : null],
+          "title": showTitle(isEllipsis ? item.text : "")
+        }, [createVNode("div", {
+          "class": [this.ns.b("select-option-content"), item.textCls ? item.textCls : null],
+          "style": item.color ? this.ns.cssVarBlock({
+            "select-option-item-color": "".concat(item.color)
+          }) : ""
+        }, [item.sysImage && createVNode(resolveComponent("iBizIcon"), {
+          "icon": item.sysImage
+        }, null), createVNode("span", {
+          "class": [isEllipsis && this.ns.be("select-option-content", "text")]
+        }, [item.text])])]);
+      },
+      ...this.prefix
+    });
+    const readonlyContent = this.valueText.split(",").map((text) => {
+      const codeListItem = this.getCodeListItem(text);
+      return createVNode("span", {
+        "class": [this.ns.b("readonly-text-item"), codeListItem == null ? void 0 : codeListItem.textCls],
+        "style": (codeListItem == null ? void 0 : codeListItem.color) || (codeListItem == null ? void 0 : codeListItem.bkcolor) ? this.ns.cssVarBlock({
+          "readonly-text-item-color": "".concat(codeListItem.color || ""),
+          "select-option-item-color": "".concat(codeListItem.color || ""),
+          "select-option-item-bkcolor": "".concat((this.c.editorParams.type === "round" ? codeListItem.bkcolor : "") || "")
+        }) : ""
+      }, [(codeListItem == null ? void 0 : codeListItem.sysImage) && createVNode(resolveComponent("iBizIcon"), {
+        "icon": codeListItem == null ? void 0 : codeListItem.sysImage
+      }, null), createVNode("span", {
+        "class": this.ns.be("readonly-text-item", "label")
+      }, [text])]);
+    });
+    return createVNode("div", {
+      "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.c.editorParams.type === "round" && this.ns.m("round")]
+    }, [this.readonly ? readonlyContent : editContent]);
+  }
+});
+
+export { IBizVirtualizedList };

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

@@ -1,4 +1,5 @@
 export { IBizDropdown } from './ibiz-dropdown/ibiz-dropdown';
 export { IBizEmojiPicker } from './ibiz-emoji-picker/ibiz-emoji-picker';
+export { IBizVirtualizedList } from './ibiz-virtualized-list/ibiz-virtualized-list';
 export * from './dropdown-list-editor.controller';
 export * from './dropdown-list-editor.provider';

package/es/editor/dropdown-list/index.mjs

@@ -1,5 +1,6 @@
 export { IBizDropdown } from './ibiz-dropdown/ibiz-dropdown.mjs';
 export { IBizEmojiPicker } from './ibiz-emoji-picker/ibiz-emoji-picker.mjs';
+export { IBizVirtualizedList } from './ibiz-virtualized-list/ibiz-virtualized-list.mjs';
 export { DropDownListEditorController } from './dropdown-list-editor.controller.mjs';
 export { DropDownListEditorProvider } from './dropdown-list-editor.provider.mjs';
 

package/es/editor/html/wang-editor/wang-editor.d.ts

@@ -54,7 +54,7 @@ declare const IBizHtml: import("vue").DefineComponent<{
     readonlyState: Ref<boolean>;
     changeFullScreenState: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -84,7 +84,7 @@ declare const IBizHtml: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/html/wang-editor/wang-editor.mjs

@@ -1,9 +1,9 @@
 import { defineComponent, ref, shallowRef, watch, onBeforeUnmount, onMounted, nextTick, createVNode, onUnmounted, resolveComponent } from 'vue';
 import { Toolbar, Editor } from '@wangeditor/editor-for-vue';
-import { getCookie, createUUID } from 'qx-util';
+import { createUUID } from 'qx-util';
 import { isNil } from 'ramda';
 import { getHtmlProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
-import { CoreConst, awaitTimeout } from '@ibiz-template/core';
+import { getAppCookie, CoreConst, awaitTimeout } from '@ibiz-template/core';
 import { ElMessageBox } from 'element-plus';
 import './wang-editor.css';
 
@@ -25,7 +25,7 @@ const IBizHtml = /* @__PURE__ */ defineComponent({
     const editorRef = shallowRef();
     const valueHtml = ref("");
     const headers = ref({
-      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(getCookie(CoreConst.TOKEN))
+      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(getAppCookie(CoreConst.TOKEN))
     });
     const uploadUrl = ref("");
     const downloadUrl = ref("");

package/es/editor/index.mjs

@@ -29,6 +29,7 @@ import './preset/index.mjs';
 import './carousel/index.mjs';
 import './user/ibiz-searchcond-edit/index.mjs';
 import './date-range-select/index.mjs';
+import { IBizImageCropping } from './upload/ibiz-image-cropping/ibiz-image-cropping.mjs';
 import { IBizSpan } from './span/span/span.mjs';
 import { IBizSpanLink } from './span/span-link/span-link.mjs';
 import { IBizInput } from './text-box/input/input.mjs';
@@ -66,6 +67,7 @@ import { IBizPresetRawitem } from './preset/preset-rawitem/ibiz-preset-rawitem/i
 import { IBizSearchCondEdit } from './user/ibiz-searchcond-edit/ibiz-searchcond-edit.mjs';
 import { IBizCarousel } from './carousel/ibiz-carousel/ibiz-carousel.mjs';
 import { IBizDateRangeSelect } from './date-range-select/date-range-select-picker/date-range-select.mjs';
+import { IBizVirtualizedList } from './dropdown-list/ibiz-virtualized-list/ibiz-virtualized-list.mjs';
 import { SpanEditorProvider } from './span/span-editor.provider.mjs';
 import { TextBoxEditorProvider } from './text-box/text-box-editor.provider.mjs';
 import { DropDownListEditorProvider } from './dropdown-list/dropdown-list-editor.provider.mjs';
@@ -97,6 +99,7 @@ import { CarouselEditorProvider } from './carousel/carousel-editor.provider.mjs'
 "use strict";
 const IBizEditor = {
   install: (v) => {
+    v.component(IBizImageCropping.name, IBizImageCropping);
     v.component(NotSupportedEditor.name, NotSupportedEditor);
     v.component(IBizSpan.name, IBizSpan);
     v.component(IBizSpanLink.name, IBizSpanLink);
@@ -145,6 +148,7 @@ const IBizEditor = {
       )
     );
     v.component(IBizDateRangeSelect.name, IBizDateRangeSelect);
+    v.component(IBizVirtualizedList.name, IBizVirtualizedList);
     registerEditorProvider("SPAN", () => new SpanEditorProvider());
     registerEditorProvider(
       "SPAN_ADDRESSPICKUP",
@@ -180,6 +184,14 @@ const IBizEditor = {
       "DROPDOWNLIST_EMOJI_PICKER",
       () => new DropDownListEditorProvider("EMOJI_PICKER")
     );
+    registerEditorProvider(
+      "DROPDOWNLIST_VIRTUALIZED_LIST",
+      () => new DropDownListEditorProvider("VIRTUALIZED_LIST")
+    );
+    registerEditorProvider(
+      "MDROPDOWNLIST_VIRTUALIZED_LIST",
+      () => new DropDownListEditorProvider("VIRTUALIZED_LIST")
+    );
     registerEditorProvider("CHECKBOX", () => new CheckBoxEditorProvider());
     registerEditorProvider(
       "CHECKBOXLIST",
@@ -225,6 +237,10 @@ const IBizEditor = {
       "PICTURE_ONE_RAW",
       () => new FileUploaderEditorProvider("PICTURE_ONE_RAW")
     );
+    registerEditorProvider(
+      "PICTURE_CROPPING",
+      () => new FileUploaderEditorProvider("PICTURE_CROPPING")
+    );
     registerEditorProvider("RAW", () => new RawEditorProvider());
     registerEditorProvider("STEPPER", () => new StepperEditorProvider());
     registerEditorProvider("RATING", () => new RateEditorProvider());

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

@@ -1,7 +1,7 @@
 import { Ref } from 'vue';
-import './ibiz-list-box.scss';
 import { ListBoxEditorController } from '../list-box-editor.controller';
 import { ListBoxPickerEditorController } from '../list-box-picker-editor.controller';
+import './ibiz-list-box.scss';
 export declare const IBizListBox: import("vue").DefineComponent<{
     value: (StringConstructor | NumberConstructor)[];
     controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<ListBoxEditorController | ListBoxPickerEditorController>, undefined, undefined>;
@@ -33,7 +33,7 @@ export declare const IBizListBox: import("vue").DefineComponent<{
     editorRef: Ref<any>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -63,7 +63,7 @@ export declare const IBizListBox: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/list-box/ibiz-list-box/ibiz-list-box.mjs

@@ -1,8 +1,8 @@
 import { isVNode, defineComponent, computed, ref, watch, createVNode, resolveComponent, mergeProps, h } from 'vue';
 import { getListBoxProps, getEditorEmits, useNamespace, useAutoFocusBlur, useCodeListListen, useFocusAndBlur } from '@ibiz-template/vue3-util';
 import { isNil } from 'ramda';
-import './ibiz-list-box.css';
 import { useCalcOrMode, useCodeListSelection } from '@ibiz-template/runtime';
+import './ibiz-list-box.css';
 
 "use strict";
 function _isSlot(s) {

package/es/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.mjs

@@ -1,8 +1,8 @@
 import { defineComponent, ref, watch, nextTick, onMounted, onUnmounted, createVNode } from 'vue';
 import { getMarkDownProps, getEditorEmits, useNamespace, useUIStore } from '@ibiz-template/vue3-util';
-import { createUUID, getCookie } from 'qx-util';
+import { createUUID } from 'qx-util';
 import Cherry from 'cherry-markdown';
-import { CoreConst } from '@ibiz-template/core';
+import { getAppCookie, CoreConst } from '@ibiz-template/core';
 import './ibiz-markdown-editor.css';
 
 "use strict";
@@ -19,7 +19,7 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
     const editor = ref(null);
     const id = createUUID();
     const headers = ref({
-      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(getCookie(CoreConst.TOKEN))
+      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(getAppCookie(CoreConst.TOKEN))
     });
     const uploadUrl = ref("");
     const downloadUrl = ref("");
@@ -140,7 +140,7 @@ const IBizMarkDown = /* @__PURE__ */ defineComponent({
     const calcMarkDownStyle = () => {
       if (window.ResizeObserver && markDownBox.value) {
         const tempCssVars = {
-          width: "".concat(markDownBox.value.offsetWidth, "px")
+          width: markDownBox.value.offsetWidth ? "".concat(markDownBox.value.offsetWidth, "px") : "100%"
         };
         if (c && typeof c.parent.model.height === "number") {
           Object.assign(tempCssVars, {

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

@@ -47,7 +47,7 @@ export declare const IBizNumberRangePicker: import("vue").DefineComponent<{
     setEditable: (flag: boolean) => void;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -77,7 +77,7 @@ export declare const IBizNumberRangePicker: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/number-range/ibiz-number-range-picker/ibiz-number-range-picker.mjs

@@ -191,7 +191,7 @@ const IBizNumberRangePicker = /* @__PURE__ */ defineComponent({
       "class": this.ns.b("default-separator")
     }, [this.rangeSeparator]), createVNode("div", {
       "class": this.ns.b("default-max")
-    }, [this.maxValue])] : "-"]);
+    }, [this.maxValue])] : ibiz.config.common.emptyText]);
     return createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)],
       "ref": "componentRef"