@opentiny/vue-renderless - npm Package Compare versions

Comparing version 3.6.8 to 3.8.0

action-sheet/index.js

@@ -25,3 +25,3 @@ import "../chunk-PKUHTIDK.js";
     const { scrollMenu } = refs;
-    if (!state.scroll) {
+    if (state.scroll) {
       state.scroll = new BScroll(scrollMenu, {
@@ -55,5 +55,32 @@ probeType: 3,
 };
+const close = ({ emit, vm }) => () => {
+  vm.$refs.drawer.close();
+  emit("close", false);
+};
+const hide = (emit) => () => {
+  emit("hide", false);
+  emit("update:visible", false);
+};
+const selectOption = ({ emit, props }) => (option) => {
+  const { valueField } = props;
+  emit("update:visible", false);
+  emit("update:modelValue", option[valueField]);
+  emit("click", option);
+};
+const confirm = ({ emit, state }) => () => {
+  emit("confirm", state);
+  emit("update:visible", false);
+};
+const actionSelectOption = ({ emit }) => (option, index) => {
+  emit("update:visible", false);
+  emit("click", option, index);
+};
 export {
+  actionSelectOption,
+  close,
+  confirm,
+  hide,
   initScrollMenu,
   menuHandle,
+  selectOption,
   setSheetStyle,
@@ -60,0 +87,0 @@ visibleHandle,

action-sheet/vue.js

 import "../chunk-PKUHTIDK.js";
-import { setSheetStyle, initScrollMenu, visibleHandle, watchVisible, menuHandle } from "./index";
-const api = ["state", "setSheetStyle", "initScrollMenu", "visibleHandle", "menuHandle"];
-const renderless = (props, { reactive, watch }, { emit, nextTick, refs }, { BScroll }) => {
+import { setSheetStyle, initScrollMenu, visibleHandle, watchVisible, menuHandle, close, selectOption, confirm, actionSelectOption, hide } from "./index";
+const api = ["state", "setSheetStyle", "initScrollMenu", "visibleHandle", "menuHandle", "close", "selectOption", "confirm", "actionSelectOption", "hide"];
+const renderless = (props, { reactive, watch }, { emit, nextTick, refs, vm }, { BScroll }) => {
   const api2 = {};
@@ -23,2 +23,3 @@ const state = reactive({
   );
+  watch(() => props.visible, api2.watchVisible, { immediate: true });
   Object.assign(api2, {
@@ -30,3 +31,8 @@ state,
     watchVisible: watchVisible({ emit, props, state }),
-    menuHandle: menuHandle({ state, emit })
+    menuHandle: menuHandle({ state, emit }),
+    confirm: confirm({ state, emit }),
+    selectOption: selectOption({ emit, props }),
+    actionSelectOption: actionSelectOption({ emit }),
+    close: close({ emit, vm }),
+    hide: hide(emit)
   });
@@ -33,0 +39,0 @@ return api2;

alert/index.js

@@ -6,8 +6,30 @@ import "../chunk-PKUHTIDK.js";
 };
-const computedGetIcon = ({ constants, props }) => () => props.icon || constants.ICON_MAP[props.type];
+const computedGetIcon = ({ constants, props, designConfig }) => () => {
+  var _a;
+  const designIcon = (_a = designConfig == null ? void 0 : designConfig.icons) == null ? void 0 : _a[props.type];
+  return props.icon || designIcon || constants.ICON_MAP[props.type];
+};
 const computedGetTitle = ({ constants, t, props }) => () => props.title || t(constants.TITLE_MAP[props.type]);
+const handleHeaderClick = ({ state, props, vm }) => () => {
+  if (props.showFoldable) {
+    state.contentVisible = !state.contentVisible;
+  }
+  if (vm.$refs.ContentDescribe) {
+    state.contentDescribeHeight = vm.$refs.ContentDescribe.scrollHeight;
+    if (state.contentDescribeHeight > state.contentMaxHeight) {
+      state.scrollStatus = true;
+    }
+  }
+  if (vm.$refs.ContentDefault) {
+    state.contentDefaultHeight = vm.$refs.ContentDefault.scrollHeight;
+    if (state.contentDefaultHeight > state.contentMaxHeight) {
+      state.scrollStatus = true;
+    }
+  }
+};
 export {
   close,
   computedGetIcon,
-  computedGetTitle
+  computedGetTitle,
+  handleHeaderClick
 };

alert/vue.js

 import "../chunk-PKUHTIDK.js";
-import { close, computedGetIcon, computedGetTitle } from "./index";
-const api = ["close", "state"];
-const renderless = (props, { computed, reactive }, { t, emit, constants }) => {
-  const api2 = {
-    computedGetIcon: computedGetIcon({ constants, props }),
-    computedGetTitle: computedGetTitle({ constants, props, t })
-  };
+import { close, computedGetIcon, computedGetTitle, handleHeaderClick } from "./index";
+const api = ["close", "state", "handleHeaderClick"];
+const renderless = (props, { computed, reactive }, { t, emit, constants, vm, designConfig }) => {
   const state = reactive({
     show: true,
     getIcon: computed(() => api2.computedGetIcon()),
-    getTitle: computed(() => api2.computedGetTitle())
+    getTitle: computed(() => api2.computedGetTitle()),
+    contentVisible: false,
+    contentDescribeHeight: 0,
+    contentDefaultHeight: 0,
+    contentMaxHeight: constants.CONTENT_MAXHEUGHT,
+    scrollStatus: false
   });
-  Object.assign(api2, {
+  const api2 = {
     state,
-    close: close({ state, emit })
-  });
+    computedGetIcon: computedGetIcon({ constants, props, designConfig }),
+    computedGetTitle: computedGetTitle({ constants, props, t }),
+    close: close({ state, emit }),
+    handleHeaderClick: handleHeaderClick({ state, props, vm })
+  };
   return api2;
@@ -19,0 +23,0 @@ };

amount/index.js

@@ -5,6 +5,6 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { formatNumber } from "@opentiny/vue-renderless/common/decimal";
-import { getMiniDecimal, equalsDecimal } from "@opentiny/vue-renderless/common/bigInt";
-import { isNumber } from "@opentiny/vue-renderless/common/type";
+import { on, off } from "../common/deps/dom";
+import { formatNumber } from "../common/decimal";
+import { getMiniDecimal, equalsDecimal } from "../common/bigInt";
+import { isNumber } from "../common/type";
 const initService = (service) => {
@@ -11,0 +11,0 @@ const { utils = {} } = service || {};

anchor/index.js

 import "../chunk-PKUHTIDK.js";
-import { addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
+import { addClass, removeClass } from "../common/deps/dom";
 const setFixAnchor = ({ vm }) => {
@@ -4,0 +4,0 @@ const { fixRef } = vm.$refs;

autocomplete/vue.js

 import "../chunk-PKUHTIDK.js";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
-import { guid } from "@opentiny/vue-renderless/common/string";
+import debounce from "../common/deps/debounce";
+import userPopper from "../common/deps/vue-popper";
+import { guid } from "../common/string";
 import {
@@ -6,0 +6,0 @@ computedVisible,

autonavi-map/index.js

 import "../chunk-PKUHTIDK.js";
-import { getAmap } from "@opentiny/vue-renderless/chart-core/deps/utils";
+import { getAmap } from "../chart-core/deps/utils";
 const amap = (columns, rows, settings, extra) => {
@@ -4,0 +4,0 @@ const { key, v, amap: amap2, useOuterMap, url } = settings;

badge/vue.js

 import "../chunk-PKUHTIDK.js";
 import { computedContent, computedValueRef } from "./index";
-import { xss } from "@opentiny/vue-renderless/common/xss";
+import { xss } from "../common/xss";
 const api = ["state"];
 const renderless = (props, { computed, reactive }) => {
-  const api2 = {
-    computedValueRef: computedValueRef({ props })
-  };
   const state = reactive({
@@ -15,4 +12,7 @@ isOverstep: false,
   });
-  api2.state = state;
-  api2.computedContent = computedContent({ props, state });
+  const api2 = {
+    state,
+    computedValueRef: computedValueRef({ props }),
+    computedContent: computedContent({ props, state })
+  };
   return api2;
@@ -19,0 +19,0 @@ };

baidu-map/index.js

 import "../chunk-PKUHTIDK.js";
-import { getBmap } from "@opentiny/vue-renderless/chart-core/deps/utils";
+import { getBmap } from "../chart-core/deps/utils";
 const bmap = (columns, rows, settings, extra) => {
@@ -4,0 +4,0 @@ const { key, v, bmap: bmap2, useOuterMap, url } = settings;

bulletin-board/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { xss } from "../common/xss.js";
 const getRoute = (route) => `/${route || ""}`.replace(/^\/+/, "/");
@@ -4,0 +4,0 @@ const computedDataList = ({ props, state }) => () => {

calendar/index.js

 import "../chunk-PKUHTIDK.js";
-import { isLeapYear } from "@opentiny/vue-renderless/common/date";
-import { copyArray } from "@opentiny/vue-renderless/common/object";
+import { isLeapYear } from "../common/date";
+import { copyArray } from "../common/object";
 const getDays = (year, month) => [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month - 1];
@@ -5,0 +5,0 @@ const getWeek = (year, month, day) => (/* @__PURE__ */ new Date(`${year}/${month}/${day}`)).getDay();

card-template/index.js

 import "../chunk-PKUHTIDK.js";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
+import PopupManager from "../common/deps/popup-manager";
 const toolClick = (showMoreTools) => (cb) => {
@@ -4,0 +4,0 @@ typeof cb === "function" && cb();

carousel-item/index.js

@@ -64,2 +64,8 @@ import "../chunk-PKUHTIDK.js";
 };
+const resetAnimatingMf = (state) => () => {
+  state.animatingMf = false;
+};
+const setDelta = ({ state }) => (val) => {
+  state.delta = val;
+};
 export {
@@ -70,3 +76,5 @@ calculateTranslate,
   processIndex,
+  resetAnimatingMf,
+  setDelta,
   translateItem
 };

carousel-item/vue.js

 import "../chunk-PKUHTIDK.js";
-import { processIndex, calculateTranslate, translateItem, handleItemClick, computedTransform } from "./index";
+import { processIndex, calculateTranslate, translateItem, handleItemClick, computedTransform, resetAnimatingMf, setDelta } from "./index";
 const api = [
@@ -18,3 +18,5 @@ "state",
   "translateItem",
-  "handleItemClick"
+  "handleItemClick",
+  "resetAnimatingMf",
+  "setDelta"
 ];
@@ -44,3 +46,5 @@ const renderless = (props, { computed, onMounted, onUnmounted, reactive }, { parent, dispatch }) => {
     calculateTranslate: calculateTranslate({ CARD_SCALE, state }),
-    translateItem: translateItem({ api: api2, CARD_SCALE, parent, state })
+    translateItem: translateItem({ api: api2, CARD_SCALE, parent, state }),
+    setDelta: setDelta({ state }),
+    resetAnimatingMf: resetAnimatingMf(state)
   });
@@ -47,0 +51,0 @@ onMounted(() => {

carousel/index.js

 import "../chunk-PKUHTIDK.js";
-import throttle from "@opentiny/vue-renderless/common/deps/throttle";
-import { POSITION } from "@opentiny/vue-renderless/common";
+import throttle from "../common/deps/throttle";
+import { POSITION } from "../common";
 const handleMouseEnter = ({ api, state }) => () => {
@@ -102,2 +102,9 @@ state.hover = true;
 const computedHasLable = (items) => items.some((item) => item.label.toString().length > 0);
+const computedStyle = ({ props }) => () => {
+  if (props.height) {
+    return { "height": props.height };
+  } else {
+    return { "aspect-ratio": props.aspectRatio.replace(":", " / ") };
+  }
+};
 const onComplete = ({ count, emit, props, state }) => (total) => {
@@ -112,4 +119,81 @@ if (count++ === total) {
 };
+const touchstart = ({ state, api }) => (event) => {
+  if (state.items.length <= 1 || ~state.noTouchNode.indexOf(event.target.nodeName))
+    return;
+  event.preventDefault();
+  event.stopPropagation();
+  resetTouchStatus(state);
+  api.pauseTimer();
+  state.itemsTranslate = state.items.map((item) => item.state.translate);
+  state.moving = true;
+  state.touchTime = Date.now();
+  state.startPos.X = event.touches[0].clientX;
+  state.startPos.Y = event.touches[0].clientY;
+};
+const touchmove = ({ props, state, vm }) => (event) => {
+  if (state.items.length <= 1 || ~state.noTouchNode.indexOf(event.target.nodeName))
+    return;
+  const touch = event.touches[0];
+  const itemsLen = state.items.length;
+  const carousel = vm.$refs.carousel;
+  state.deltaPos.X = touch.clientX - state.startPos.X;
+  state.deltaPos.Y = touch.clientY - state.startPos.Y;
+  state.offsetPos.X = Math.abs(state.deltaPos.X);
+  state.offsetPos.Y = Math.abs(state.deltaPos.Y);
+  state.direction = state.direction || getDirection(state.offsetPos.X, state.offsetPos.Y);
+  state.isCorrectDirection = state.direction === props.type;
+  if (!state.isCorrectDirection)
+    return;
+  state.size = state.direction === "horizontal" ? carousel.offsetWidth : carousel.offsetHeight;
+  const nextIndex = state.activeIndex === itemsLen - 1 ? 0 : state.activeIndex + 1;
+  const prevIndex = state.activeIndex === 0 ? itemsLen - 1 : state.activeIndex - 1;
+  state.delta = state.direction === "horizontal" ? state.deltaPos.X : state.deltaPos.Y;
+  state.moveDisable = !props.loop && (state.activeIndex === 0 && state.delta > 0 || state.activeIndex === state.items.length - 1 && state.delta < 0);
+  if (state.moveDisable)
+    return;
+  state.items[state.activeIndex].setDelta(state.delta);
+  state.items[nextIndex].setDelta(state.delta);
+  if (itemsLen > 2) {
+    state.items[prevIndex].setDelta(state.delta);
+  }
+};
+const touchend = ({ state, api }) => (event) => {
+  if (state.moveDisable || state.items.length <= 1 || ~state.noTouchNode.indexOf(event.target.nodeName))
+    return;
+  const speed = state.delta / (Date.now() - state.touchTime);
+  const isShouldMove = Math.abs(speed) > 0.3 || Math.abs(state.delta) > +(state.size / 2).toFixed(2);
+  state.moving = false;
+  state.itemsTranslate.forEach((item, index) => {
+    state.items[index].setDelta(0);
+  });
+  if (isShouldMove && state.isCorrectDirection) {
+    state.delta < 0 ? api.next() : api.prev();
+  } else if (Math.abs(state.delta) > 1) {
+    state.items.forEach((item) => {
+      item.resetAnimatingMf();
+    });
+  }
+  api.startTimer();
+};
+function getDirection(x, y) {
+  const MIN_DISTANCE = 10;
+  if (x > y && x > MIN_DISTANCE) {
+    return "horizontal";
+  }
+  if (y > x && y > MIN_DISTANCE) {
+    return "vertical";
+  }
+  return "";
+}
+function resetTouchStatus(state) {
+  state.direction = "";
+  state.delta = 0;
+  state.deltaPos.X = 0;
+  state.deltaPos.Y = 0;
+  state.offsetPos.X = 0;
+  state.offsetPos.Y = 0;
+}
 export {
   computedHasLable,
+  computedStyle,
   handleButtonEnter,
@@ -132,2 +216,5 @@ handleButtonLeave,
   throttledIndicatorHover,
+  touchend,
+  touchmove,
+  touchstart,
   watchActiveIndex,
@@ -134,0 +221,0 @@ watchAutoplay,

carousel/vue.js

@@ -23,5 +23,8 @@ import "../chunk-PKUHTIDK.js";
   throttledIndicatorHover,
-  computedHasLable
+  computedHasLable,
+  touchstart,
+  touchmove,
+  touchend
 } from "./index";
-import { addResizeListener, removeResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
+import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 const api = [
@@ -51,3 +54,6 @@ "state",
   "throttledArrowClick",
-  "throttledIndicatorHover"
+  "throttledIndicatorHover",
+  "touchstart",
+  "touchmove",
+  "touchend"
 ];
@@ -66,6 +72,9 @@ const initState = ({ reactive, computed, api: api2 }) => {
 };
-const initApi = ({ api: api2, state, props, emit }) => {
+const initApi = ({ api: api2, state, props, emit, vm }) => {
   Object.assign(api2, {
     state,
     computedHasLable,
+    touchstart: touchstart({ state, api: api2 }),
+    touchmove: touchmove({ props, state, vm }),
+    touchend: touchend({ state, api: api2 }),
     playSlides: playSlides({ props, state }),
@@ -139,3 +148,3 @@ pauseTimer: pauseTimer(state),
   const state = initState({ reactive, computed, api: api2 });
-  initApi({ api: api2, state, props, emit });
+  initApi({ api: api2, state, props, emit, vm });
   const { updateItems } = useItems({
@@ -142,0 +151,0 @@ api: api2,

cascader-menu/vue.js

 import "../chunk-PKUHTIDK.js";
 import { handleExpand, handleMouseMove, clearHoverZone } from "./index";
-import { CASCADER } from "@opentiny/vue-renderless/common";
-import { random } from "@opentiny/vue-renderless/common/string";
+import { CASCADER } from "../common";
+import { random } from "../common/string";
 const api = ["state", "handleMouseMove", "handleExpand"];
@@ -6,0 +6,0 @@ const renderless = (props, { computed, reactive }, { vm, parent }) => {

cascader-panel/index.js

 import "../chunk-PKUHTIDK.js";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { isEqual } from "@opentiny/vue-renderless/common/object";
-import { isEmpty } from "@opentiny/vue-renderless/cascader";
-import { KEY_CODE, CASCADER } from "@opentiny/vue-renderless/common";
+import { isNull } from "../common/type";
+import { isEqual } from "../common/object";
+import { isEmpty } from "../cascader";
+import { KEY_CODE, CASCADER } from "../common";
 const watchCheckedValue = ({ api, emit, props, state }) => (value) => {
@@ -7,0 +7,0 @@ if (!isEqual(value, props.modelValue)) {

cascader-panel/node.js

 import "../chunk-PKUHTIDK.js";
-import { isEqual } from "@opentiny/vue-renderless/common/object";
-import { capitalize } from "@opentiny/vue-renderless/common/string";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { isEqual } from "../common/object";
+import { capitalize } from "../common/string";
+import { isNull } from "../common/type";
 let uid = 0;
@@ -27,3 +27,3 @@ class Node {
     const childrenData = this.data[childrenKey];
-    this.hasChildren = Array.isArray(childrenData) && childrenData.length > 0;
+    this.hasChildren = Array.isArray(childrenData);
     this.children = (childrenData || []).map((child) => new Node(child, config, this));
@@ -30,0 +30,0 @@ }

cascader-panel/vue.js

@@ -28,4 +28,4 @@ import {
 } from "./index";
-import { merge } from "@opentiny/vue-renderless/common/object";
-import { isEmpty } from "@opentiny/vue-renderless/cascader";
+import { merge } from "../common/object";
+import { isEmpty } from "../cascader";
 import Store from "./store.js";
@@ -32,0 +32,0 @@ const api = [

cascader/index.js

 import "../chunk-PKUHTIDK.js";
-import browser from "@opentiny/vue-renderless/common/browser";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import { isEqual } from "@opentiny/vue-renderless/common/object";
-import { addResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
-import { KEY_CODE, CASCADER } from "@opentiny/vue-renderless/common";
+import browser from "../common/browser";
+import { isNull } from "../common/type";
+import debounce from "../common/deps/debounce";
+import { isEqual } from "../common/object";
+import { addResizeListener } from "../common/deps/resize-event";
+import { KEY_CODE, CASCADER } from "../common";
 const initMigratingProps = () => ({
@@ -9,0 +9,0 @@ expandTrigger: { newProp: CASCADER.PropsExpandTri, type: String },

cascader/vue.js

@@ -34,5 +34,5 @@ import {
 } from "./index";
-import { removeResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { removeResizeListener } from "../common/deps/resize-event";
+import userPopper from "../common/deps/vue-popper";
+import { DATEPICKER } from "../common";
 const api = [
@@ -39,0 +39,0 @@ "state",

chart-bar/index.js

@@ -5,5 +5,5 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, getStackMap, get, set, cloneDeep } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated, getStackMap, get, set, cloneDeep } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const VALUE_AXIS_OPACITY = 0.5;
@@ -10,0 +10,0 @@ const getValueAxisData = (dims) => {

chart-boxplot/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, htmlHandler, getLegend } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated, htmlHandler, getLegend } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getXAxis = (args) => {
@@ -7,0 +7,0 @@ const { columns, xAxisName, axisVisible, xAxisType } = args;

chart-candle/index.js

 import "../chunk-PKUHTIDK.js";
-import { getFormated } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const DEF_MA = [5, 10, 20, 30];
@@ -6,0 +6,0 @@ const DEF_DOWN_COLOR = "#eb171f";

chart-core/deps/utils.js

@@ -5,10 +5,10 @@ import {
 } from "../../chunk-PKUHTIDK.js";
-import { extend, copyArray } from "@opentiny/vue-renderless/common/object";
-import { isObject, typeOf as getType, isNull } from "@opentiny/vue-renderless/common/type";
-import _debounce from "@opentiny/vue-renderless/common/deps/debounce";
+import { extend, copyArray } from "../../common/object";
+import { isObject, typeOf as getType, isNull } from "../../common/type";
+import _debounce from "../../common/deps/debounce";
 import _numerify from "./numerify";
-import { escapeHtml } from "@opentiny/vue-renderless/common/string";
-import { xss } from "@opentiny/vue-renderless/common";
-import { setObj, getObj, isEqual } from "@opentiny/vue-renderless/common/object";
-import { typeOf, isObject as isObject2 } from "@opentiny/vue-renderless/common/type";
+import { escapeHtml } from "../../common/string";
+import { xss } from "../../common";
+import { setObj, getObj, isEqual } from "../../common/object";
+import { typeOf, isObject as isObject2 } from "../../common/type";
 const debounce = (callback, delay) => _debounce(delay, false, callback);
@@ -15,0 +15,0 @@ const camelToKebab = (str) => str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();

chart-core/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 import { DEFAULT_COLORS, DEFAULT_THEME, STATIC_PROPS, ECHARTS_SETTINGS, SAAS_DEFAULT_COLORS_10, SAAS_DEFAULT_COLORS_18, DEFAULT_CONFIG } from "./deps/constants";
@@ -233,3 +233,3 @@ import { getType, debounce, isObject, cloneDeep, isEqual, htmlHandler } from "./deps/utils";
   const themeName = props.themeName || props.theme || DEFAULT_THEME;
-  state.echarts = markRaw(echartsLib.init(refs.canvas, themeName, __spreadValues(__spreadValues({}, themeName), ictThemeName), props.initOptions));
+  state.echarts = markRaw(echartsLib.init(refs.canvas, __spreadValues(__spreadValues({}, themeName), ictThemeName), props.initOptions));
   if (props.data) {
@@ -236,0 +236,0 @@ api.changeHandler();

chart-funnel/index.js

 import "../chunk-PKUHTIDK.js";
-import { getFormated } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const getFunnelTooltip = (dataType, digit) => {
@@ -6,0 +6,0 @@ function formatter(item) {

chart-gauge/index.js

 import "../chunk-PKUHTIDK.js";
-import { getFormated, isObject } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated, isObject } from "../chart-core/deps/utils";
+import { isNull } from "../common/type";
+import { itemLabel, itemContent } from "../chart-core/deps/constants";
 const getTooltip = (args) => {
@@ -6,0 +6,0 @@ const { dataType, digit, tooltipFormatter } = args;

chart-graph/index.js

 import "../chunk-PKUHTIDK.js";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getTooltip = () => ({
@@ -4,0 +4,0 @@ trigger: "item",

chart-heatmap/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, getBmap, getAmap, getMapJSON } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { HEAT_MAP_COLOR, itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated, getBmap, getAmap, getMapJSON } from "../chart-core/deps/utils";
+import { HEAT_MAP_COLOR, itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getAxisList = (rows, label) => {
@@ -7,0 +7,0 @@ const result = [];

chart-line/index.js

@@ -5,5 +5,5 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, getStackMap, getLegend, hexToRgb, set } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { itemPoint, itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated, getStackMap, getLegend, hexToRgb, set } from "../chart-core/deps/utils";
+import { isNull } from "../common/type";
+import { itemPoint, itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";
 const getLineXAxis = (args) => {
@@ -10,0 +10,0 @@ const { xAxisType, dimension, rows, xAxisName, axisVisible } = args;

chart-liquidfill/index.js

 import "../chunk-PKUHTIDK.js";
-import { getFormated, isObject } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated, isObject } from "../chart-core/deps/utils";
+import { itemLabel, itemContent } from "../chart-core/deps/constants";
 const isArr = Array.isArray;
@@ -5,0 +5,0 @@ const getTooltip = (args) => {

chart-map/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, getMapJSON, getLegend as getLegendMap } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated, getMapJSON, getLegend as getLegendMap } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const getTooltip = ({ dataType, digit, dataStore, metrics, color, labelMap }) => {
@@ -8,0 +8,0 @@ function formatter(item) {

chart-pie/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, setArrayValue, cloneDeep } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated, setArrayValue, cloneDeep } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const pieRadius = 100;
@@ -8,0 +8,0 @@ const ringRadius = [90, 100];

chart-radar/index.js

 import "../chunk-PKUHTIDK.js";
-import { getFormated } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const getRadarLegend = (rows, dimension, legendName) => {
@@ -6,0 +6,0 @@ let legendData = rows.map((row) => row[dimension]);

chart-sankey/index.js

@@ -5,5 +5,5 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { getFormated } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { isNull } from "../common/type";
 const getTooltip = (args) => {
@@ -10,0 +10,0 @@ const { digit, itemDataType, linksDataType } = args;

chart-scatter/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getFormated, hexToRgb } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
-import { line } from "@opentiny/vue-renderless/chart-line";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { getFormated, hexToRgb } from "../chart-core/deps/utils";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
+import { line } from "../chart-line";
+import { isNull } from "../common/type";
 const getScatterLegend = (dataLabels, legendName) => {
@@ -9,0 +9,0 @@ function formatter(name) {

chart-sunburst/index.js

 import "../chunk-PKUHTIDK.js";
-import { itemPoint, itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getTooltip = () => ({
@@ -4,0 +4,0 @@ trigger: "item",

chart-tree/index.js

 import "../chunk-PKUHTIDK.js";
-import { isObject } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { isObject } from "../chart-core/deps/utils";
+import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";
 const getTreeLegend = (args) => {
@@ -5,0 +5,0 @@ const { dimension, rows } = args;

chart-waterfall/index.js

@@ -5,5 +5,5 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { getFormated } from "@opentiny/vue-renderless/chart-core/deps/utils";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { getFormated } from "../chart-core/deps/utils";
+import { isNull } from "../common/type";
+import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";
 const getWaterfallTooltip = (dataType, digit) => {
@@ -10,0 +10,0 @@ let trigger = "axis";

chart-wordcloud/index.js

 import "../chunk-PKUHTIDK.js";
-import { random } from "@opentiny/vue-renderless/common/string";
-import { itemLabel, itemContent } from "@opentiny/vue-renderless/chart-core/deps/constants";
+import { random } from "../common/string";
+import { itemLabel, itemContent } from "../chart-core/deps/constants";
 const isArr = Array.isArray;
@@ -5,0 +5,0 @@ const getSeries = (args) => {

checkbox-button/vue.js

@@ -13,3 +13,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled } from "@opentiny/vue-renderless/checkbox";
+import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled } from "../checkbox";
 const api = ["state", "handleChange"];
@@ -16,0 +16,0 @@ const initState = ({ reactive, computed, api: api2 }) => {

checkbox/index.js

@@ -80,2 +80,19 @@ import "../chunk-PKUHTIDK.js";
 };
+const dispatchDisplayedValue = ({ state, api, dispatch }) => () => {
+  if (state.isDisplayOnly) {
+    dispatch("FormItem", "displayed-value-changed", {
+      type: "checkbox",
+      val: api.getDisplayedValue()
+    });
+  }
+};
+const getDisplayedValue = ({ vm, state, props }) => () => {
+  if (state.isChecked) {
+    return vm.$refs.label && vm.$refs.label.innerText || props.text || props.label;
+  } else {
+    return "";
+  }
+};
+const computedIsDisplayOnly = ({ state, props }) => () => props.displayOnly || state.formDisplayOnly;
+const computedIsGroupDisplayOnly = ({ state }) => () => state.isGroup && (state.checkboxGroup.displayOnly || state.formDisplayOnly);
 export {
@@ -89,5 +106,9 @@ addToStore,
   computedIsDisabled,
+  computedIsDisplayOnly,
   computedIsGroup,
+  computedIsGroupDisplayOnly,
   computedIsLimitDisabled,
   computedStore,
+  dispatchDisplayedValue,
+  getDisplayedValue,
   handleChange,
@@ -94,0 +115,0 @@ mounted,

checkbox/vue.js

@@ -18,6 +18,10 @@ import {
   mounted,
-  toggleEvent
+  toggleEvent,
+  dispatchDisplayedValue,
+  getDisplayedValue,
+  computedIsDisplayOnly,
+  computedIsGroupDisplayOnly
 } from "./index";
 const api = ["state", "handleChange"];
-const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject }, { parent, emit, constants, nextTick, dispatch }) => {
+const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject }, { vm, parent, emit, constants, nextTick, dispatch }) => {
   parent.tinyForm = parent.tinyForm || inject("form", null);
@@ -33,2 +37,5 @@ const api2 = { dispatch };
     formDisabled: computed(() => (parent.tinyForm || {}).disabled),
+    formDisplayOnly: computed(() => (parent.tinyForm || {}).displayOnly),
+    isDisplayOnly: computed(() => api2.computedIsDisplayOnly()),
+    isGroupDisplayOnly: computed(() => api2.computedIsGroupDisplayOnly()),
     model: computed({ get: () => api2.computedGetModelGet(), set: (value) => api2.computedGetModelSet(value) })
@@ -44,2 +51,4 @@ }));
     computedIsDisabled: computedIsDisabled({ state, props }),
+    computedIsDisplayOnly: computedIsDisplayOnly({ state, props }),
+    computedIsGroupDisplayOnly: computedIsGroupDisplayOnly({ state }),
     computedGetModelGet: computedGetModelGet({ state, props }),
@@ -53,3 +62,5 @@ computedIsGroup: computedIsGroup({ state, parent, constants }),
     mounted: mounted({ emit, props, api: api2, parent }),
-    handleChange: handleChange({ state, props, emit, nextTick, dispatch: api2.dispatch, constants })
+    handleChange: handleChange({ state, props, emit, nextTick, dispatch: api2.dispatch, constants }),
+    dispatchDisplayedValue: dispatchDisplayedValue({ state, api: api2, dispatch }),
+    getDisplayedValue: getDisplayedValue({ state, props, vm })
   });
@@ -60,2 +71,3 @@ watch(
   );
+  watch(() => state.isDisplayOnly, api2.dispatchDisplayedValue);
   onBeforeUnmount(() => {
@@ -67,2 +79,3 @@ toggleEvent({ parent, props, type: "remove" });
     toggleEvent({ parent, props, type: "add" });
+    api2.dispatchDisplayedValue();
     api2.mounted();
@@ -69,0 +82,0 @@ });

collapse-item/vue.js

 import "../chunk-PKUHTIDK.js";
 import { handleFocus, handleEnterClick, handleHeaderClick } from "./index";
-import { guid } from "@opentiny/vue-renderless/common/string";
+import { guid } from "../common/string";
 const api = ["state", "isActive", "handleFocus", "handleEnterClick", "handleHeaderClick"];
@@ -5,0 +5,0 @@ const renderless = (props, { computed, reactive }, { parent, constants, dispatch }) => {

common/array.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { SORT } from "@opentiny/vue-renderless/common";
-import { isSame } from "@opentiny/vue-renderless/common/type";
-import { getObj } from "@opentiny/vue-renderless/common/object";
+import { SORT } from "./index";
+import { isSame } from "./type";
+import { getObj } from "./object";
 const indexOf = (arr, data, predicate = isSame) => {
@@ -8,0 +8,0 @@ if (Array.isArray(arr) && typeof predicate === "function") {

common/bigInt.js

 import "../chunk-PKUHTIDK.js";
-import { fillChar } from "@opentiny/vue-renderless/common/string";
+import { fillChar } from "./string";
 const BigInt = window.BigInt;
@@ -119,3 +119,6 @@ function supportBigInt() {
     const f = Function;
-    const convertBigInt = (str) => f(`return BigInt(${str})`)();
+    const convertBigInt = (str) => {
+      const validStr = str.replace(/^0+/, "") || "0";
+      return f(`return BigInt(${validStr})`)();
+    };
     if (validateNumber(mergedValue)) {
@@ -122,0 +125,0 @@ const trimRet = trimNumber(mergedValue);

common/dataset/index.js

@@ -5,5 +5,5 @@ import {
 } from "../../chunk-PKUHTIDK.js";
-import { format } from "@opentiny/vue-renderless/common/string";
-import { isObject } from "@opentiny/vue-renderless/common/type";
-import { transformTreeData } from "@opentiny/vue-renderless/common/array";
+import { format } from "../string";
+import { isObject } from "../type";
+import { transformTreeData } from "../array";
 const getFilterStr = (filters) => {
@@ -10,0 +10,0 @@ const filterArr = {};

common/date.js

 import "../chunk-PKUHTIDK.js";
-import { isDate, isNumber, isNumeric } from "@opentiny/vue-renderless/common/type";
-import { fillChar } from "@opentiny/vue-renderless/common/string";
+import { isDate, isNumber, isNumeric } from "./type";
+import { fillChar } from "./string";
 const daysInMonths = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
@@ -5,0 +5,0 @@ const yyyymmddReg = new RegExp(

common/deps/clickoutside.js

 import "../../chunk-PKUHTIDK.js";
-import { on } from "@opentiny/vue-renderless/common/deps/dom";
+import { on } from "./dom";
 const isServer = typeof window === "undefined";
@@ -4,0 +4,0 @@ const nodeList = [];

common/deps/date-util.js

 import "../../chunk-PKUHTIDK.js";
-import fecha from "@opentiny/vue-renderless/common/deps/date";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { isLeapYear } from "@opentiny/vue-renderless/common/date";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import fecha from "./date";
+import { isNull } from "../type";
+import { isLeapYear } from "../date";
+import { DATEPICKER } from "../index";
 const weeks = DATEPICKER.Weeks;
@@ -7,0 +7,0 @@ const months = DATEPICKER.MonhtList;

common/deps/date.js

 import "../../chunk-PKUHTIDK.js";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
-import { isNull, isDate } from "@opentiny/vue-renderless/common/type";
+import { DATEPICKER } from "../index";
+import { isNull, isDate } from "../type";
 const fecha = {};
@@ -5,0 +5,0 @@ const digitsReg = ["\\d\\d?", "\\d{3}", "\\d{4}"];

common/deps/debounce.js

 import "../../chunk-PKUHTIDK.js";
-import throttle from "@opentiny/vue-renderless/common/deps/throttle";
+import throttle from "./throttle";
 function debounce_default(delay, atBegin, callback) {
@@ -4,0 +4,0 @@ return callback === void 0 ? throttle(delay, atBegin, false) : throttle(delay, callback, atBegin !== false);

common/deps/dom.js

 import "../../chunk-PKUHTIDK.js";
-import { hasOwn, isObject, isNull } from "@opentiny/vue-renderless/common/type";
+import { hasOwn, isObject, isNull } from "../type";
 const isServer = typeof window === "undefined";
@@ -4,0 +4,0 @@ const SPECIAL_CHARS_REGEXP = /([:\-_]+(.))/g;

common/deps/fullscreen/apis.js

 import "../../../chunk-PKUHTIDK.js";
-import { extend } from "@opentiny/vue-renderless/common/object";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import screenfull from "@opentiny/vue-renderless/common/deps/fullscreen/screenfull";
+import { extend } from "../../object";
+import { on, off } from "../dom";
+import screenfull from "./screenfull";
 const defaults = {
@@ -6,0 +6,0 @@ callback: () => void 0,

common/deps/fullscreen/screenfull.js

 import "../../../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../dom";
 const fullscreenApi = ["fullscreenElement", "fullscreenEnabled", "requestFullscreen", "exitFullscreen", "fullscreenchange", "fullscreenerror"];
@@ -4,0 +4,0 @@ const fullscreenApiMoz = [

common/deps/letter-only.js

 import "../../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "./dom";
 const checkValue = (event) => {
@@ -4,0 +4,0 @@ if (event.charCode >= 48 && event.charCode <= 57) {

common/deps/number-only.js

 import "../../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "./dom";
 const checkValue = (event) => {
@@ -4,0 +4,0 @@ event.target.value = event.target.value.replace(/[^0-9]/g, "");

common/deps/popper.js

 import {
   __spreadValues
 } from "../../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import { typeOf } from "@opentiny/vue-renderless/common/type";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { on, off } from "./dom";
+import PopupManager from "./popup-manager";
+import { typeOf } from "../type";
+import { xss } from "../xss";
 const win = window;
@@ -131,4 +131,4 @@ const positions = ["left", "right", "top", "bottom"];
 };
-const getScrollTopValue = (el) => el == document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : el.scrollTop;
-const getScrollLeftValue = (el) => el == document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : el.scrollLeft;
+const getScrollTopValue = (el) => el === document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : el.scrollTop;
+const getScrollLeftValue = (el) => el === document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : el.scrollLeft;
 const getMaxWH = (body, html) => {
@@ -139,13 +139,2 @@ const height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
 };
-const adjustArrowStyle = (arrowStyle, side, arrowRect, popperRect, popperOptions) => {
-  let params = popperOptions.placement.split("-");
-  if (popperOptions.adjustArrow && ~["top", "bottom"].indexOf(params[0]) && side === "left") {
-    if (params[1] === "start") {
-      arrowStyle.left = 8;
-    } else if (!params[1]) {
-      arrowStyle.left = (popperRect.width - arrowRect.width) / 2;
-    }
-  }
-  return arrowStyle;
-};
 const getOuterSizes = (el) => {
@@ -599,3 +588,3 @@ let _display = el.style.display;
   let isVertical = ~["left", "right"].indexOf(placement);
-  let len = isVertical ? "height" : "width";
+  let calcProp = isVertical ? "height" : "width";
   let opSide = isVertical ? "bottom" : "right";
@@ -606,3 +595,3 @@ let altSide = isVertical ? "left" : "top";
   let arrowRect = getOuterSizes(arrow);
-  let arrowSize = arrowRect[len];
+  let arrowSize = arrowRect[calcProp];
   if (reference[opSide] - arrowSize < popper[side]) {
@@ -614,8 +603,17 @@ data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowSize);
   }
-  let center = reference[side] + (arrowOffset || reference[len] / 2 - arrowSize / 2);
+  let center = reference[side] + (arrowOffset || reference[calcProp] / 2 - arrowSize / 2);
   let sideValue = center - popper[side];
-  sideValue = Math.max(Math.min(popper[len] - arrowSize - 8, sideValue), 8);
+  sideValue = Math.max(Math.min(popper[calcProp] - arrowSize - 8, sideValue), 8);
   arrowStyle[side] = sideValue;
   arrowStyle[altSide] = "";
-  data.offsets.arrow = adjustArrowStyle(arrowStyle, side, arrowRect, popperRect, this._options);
+  const popperOptions = this._options;
+  const params = popperOptions.placement.split("-");
+  if (popperOptions.adjustArrow && ~["top", "bottom"].indexOf(params[0]) && side === "left") {
+    if (params[1] === "start") {
+      arrowStyle.left = 8;
+    } else if (!params[1]) {
+      arrowStyle.left = (popperRect.width - arrowRect.width) / 2;
+    }
+  }
+  data.offsets.arrow = arrowStyle;
   data.arrowElement = arrow;
@@ -622,0 +620,0 @@ return data;

common/deps/popup-manager.js

 import "../../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { addClass, removeClass, on } from "@opentiny/vue-renderless/common/deps/dom";
+import { KEY_CODE } from "../index";
+import { addClass, removeClass, on } from "./dom";
 let hasModal = false;
@@ -5,0 +5,0 @@ const isServer = typeof window === "undefined";

common/deps/repeat-click.js

 import "../../chunk-PKUHTIDK.js";
-import { on, once } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, once } from "./dom";
 var repeat_click_default = (el, binding) => {
@@ -4,0 +4,0 @@ let interval = null;

common/deps/resize-event.js

 import "../../chunk-PKUHTIDK.js";
-import ResizeObserver from "@opentiny/vue-renderless/common/deps/ResizeObserver";
+import ResizeObserver from "./ResizeObserver";
 const isServer = typeof window === "undefined";
@@ -4,0 +4,0 @@ const cacheKey = "__resizeListeners__";

common/deps/ResizeObserver.js

 import "../../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "./dom";
 const MapShim = function() {
@@ -4,0 +4,0 @@ if (typeof Map !== "undefined") {

common/deps/tree-model/node.js

 import "../../../chunk-PKUHTIDK.js";
-import { merge } from "@opentiny/vue-renderless/common/object";
-import { markNodeData, NODE_KEY } from "@opentiny/vue-renderless/common/deps/tree-model/util";
-import { indexOf } from "@opentiny/vue-renderless/common/array";
-import { hasOwn, typeOf } from "@opentiny/vue-renderless/common/type";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
+import { merge } from "../../object";
+import { markNodeData, NODE_KEY } from "./util";
+import { indexOf } from "../../array";
+import { hasOwn, typeOf } from "../../type";
+import debounce from "../debounce";
 const defaultChildrenKey = "children";
@@ -8,0 +8,0 @@ const getPropertyFromData = (node, prop) => {

common/deps/tree-model/tree-store.js

 import "../../../chunk-PKUHTIDK.js";
-import { hasOwn, isNull } from "@opentiny/vue-renderless/common/type";
-import { getNodeKey } from "@opentiny/vue-renderless/common/deps/tree-model/util";
-import Node from "@opentiny/vue-renderless/common/deps/tree-model/node";
+import { hasOwn, isNull } from "../../type";
+import { getNodeKey } from "./util";
+import Node from "./node";
 class TreeStore {
@@ -6,0 +6,0 @@ constructor(options) {

common/deps/upload-ajax.js

 import "../../chunk-PKUHTIDK.js";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { hasOwn } from "../type";
+import { xss } from "../xss";
 const getBody = (xhr) => {
@@ -5,0 +5,0 @@ const text = xhr.responseText || xhr.response;

common/deps/vue-popper.js

 import {
   __spreadValues
 } from "../../chunk-PKUHTIDK.js";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import PopperJS from "@opentiny/vue-renderless/common/deps/popper";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import PopupManager from "./popup-manager";
+import PopperJS from "./popper";
+import { on, off } from "./dom";
 const stop = (e) => {
@@ -31,3 +31,3 @@ e.stopPropagation();
     max = z > max ? z : max;
-  } while (reference !== document.body && ((_a = reference == null ? void 0 : reference.parentNode) == null ? void 0 : _a.nodeType) !== 11);
+  } while (reference !== document.body && ((_a = reference == null ? void 0 : reference.parentNode) == null ? void 0 : _a.nodeType) !== 11 && reference.parentNode);
   return `${max + 1}`;
@@ -34,0 +34,0 @@ };

common/deps/vue-popup.js

 import {
   __spreadValues
 } from "../../chunk-PKUHTIDK.js";
-import { merge } from "@opentiny/vue-renderless/common/object";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import getScrollBarWidth from "@opentiny/vue-renderless/common/deps/scrollbar-width";
-import { getStyle, addClass, removeClass, hasClass } from "@opentiny/vue-renderless/common/deps/dom";
+import { merge } from "../object";
+import PopupManager from "./popup-manager";
+import getScrollBarWidth from "./scrollbar-width";
+import { getStyle, addClass, removeClass, hasClass } from "./dom";
 let idSeed = 1;
@@ -9,0 +9,0 @@ let scrollBarWidth;

common/index.js

 import "../chunk-PKUHTIDK.js";
-import { log as uLog, xss } from "@opentiny/vue-renderless/common/xss.js";
+import { log as uLog, xss } from "./xss.js";
 const KEY_CODE = {
@@ -254,3 +254,3 @@ Backspace: 8,
 };
-const version = "3.6.6";
+const version = "3.8.0";
 const log = (data, type = "log") => {
@@ -257,0 +257,0 @@ uLog.logger[type](data);

common/object.js

 import "../chunk-PKUHTIDK.js";
-import { hasOwn, typeOf, isObject, isPlainObject, isNull } from "@opentiny/vue-renderless/common/type";
+import { hasOwn, typeOf, isObject, isPlainObject, isNull } from "./type";
 const each = (obj, handle) => {
@@ -4,0 +4,0 @@ if (typeof handle !== "function") {

common/runtime.js

 import "../chunk-PKUHTIDK.js";
-import * as array from "@opentiny/vue-renderless/common/array";
-import browser from "@opentiny/vue-renderless/common/browser";
-import * as date from "@opentiny/vue-renderless/common/date";
-import * as decimal from "@opentiny/vue-renderless/common/decimal";
-import * as object from "@opentiny/vue-renderless/common/object";
-import * as string from "@opentiny/vue-renderless/common/string";
-import * as type from "@opentiny/vue-renderless/common/type";
-import * as dataset from "@opentiny/vue-renderless/common/dataset";
-import afterLeave from "@opentiny/vue-renderless/common/deps/after-leave";
-import clickoutside from "@opentiny/vue-renderless/common/deps/clickoutside";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import * as dom from "@opentiny/vue-renderless/common/deps/dom";
-import popper from "@opentiny/vue-renderless/common/deps/popper";
-import popupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import * as resizeEvent from "@opentiny/vue-renderless/common/deps/resize-event";
-import * as scrollbarWidth from "@opentiny/vue-renderless/common/deps/scrollbar-width";
-import throttle from "@opentiny/vue-renderless/common/deps/throttle";
-import vueEmitter from "@opentiny/vue-renderless/common/deps/vue-emitter";
-import vuePopper from "@opentiny/vue-renderless/common/deps/vue-popper";
-import vuePopup from "@opentiny/vue-renderless/common/deps/vue-popup";
-import validate from "@opentiny/vue-renderless/common/validate";
-import memorize from "@opentiny/vue-renderless/common/deps/memorize";
-import * as common from "@opentiny/vue-renderless/common";
-const version = "3.6.6";
+import * as array from "./array";
+import browser from "./browser";
+import * as date from "./date";
+import * as decimal from "./decimal";
+import * as object from "./object";
+import * as string from "./string";
+import * as type from "./type";
+import * as dataset from "./dataset";
+import afterLeave from "./deps/after-leave";
+import clickoutside from "./deps/clickoutside";
+import debounce from "./deps/debounce";
+import * as dom from "./deps/dom";
+import popper from "./deps/popper";
+import popupManager from "./deps/popup-manager";
+import * as resizeEvent from "./deps/resize-event";
+import * as scrollbarWidth from "./deps/scrollbar-width";
+import throttle from "./deps/throttle";
+import vueEmitter from "./deps/vue-emitter";
+import vuePopper from "./deps/vue-popper";
+import vuePopup from "./deps/vue-popup";
+import validate from "./validate";
+import memorize from "./deps/memorize";
+import * as common from ".";
+const version = "3.8.0";
 const Renderless = {
@@ -27,0 +27,0 @@ browser,

common/string.js

 import "../chunk-PKUHTIDK.js";
-import { isPlainObject, isNumber, isNumeric, isNull } from "@opentiny/vue-renderless/common/type";
-import { getObj, toJsonStr } from "@opentiny/vue-renderless/common/object";
-import { toFixed } from "@opentiny/vue-renderless/common/decimal";
-import { nanoid } from "@opentiny/vue-renderless/common/xss.js";
+import { isPlainObject, isNumber, isNumeric, isNull } from "./type";
+import { getObj, toJsonStr } from "./object";
+import { toFixed } from "./decimal";
+import { nanoid } from "./xss";
 const formatTypes = {
@@ -344,2 +344,20 @@ text: "text",
 const isKorean = (text) => /([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi.test(text);
+const omitText = (text, font, w) => {
+  const canvas = document.createElement("canvas");
+  const ctx = canvas.getContext("2d");
+  ctx.font = font;
+  let metric = ctx.measureText(text);
+  let t;
+  if (metric.width < w) {
+    return { t: text, o: false };
+  } else {
+    for (let i = -1; ; i--) {
+      t = text.slice(0, i) + "...";
+      metric = ctx.measureText(t);
+      if (metric.width < w) {
+        return { t, o: true };
+      }
+    }
+  }
+};
 export {
@@ -360,2 +378,3 @@ camelize,
   isNullOrEmpty,
+  omitText,
   random,
@@ -362,0 +381,0 @@ toBoolValue,

common/validate/rules/range.js

 import "../../../chunk-PKUHTIDK.js";
 import * as util from "../util";
-import { isNumber } from "@opentiny/vue-renderless/common/type";
-import { getLength } from "@opentiny/vue-renderless/common/string";
+import { isNumber } from "../../type";
+import { getLength } from "../../string";
 function getErro({ min, max, val, key, rule, errors, util: util2, options }) {
@@ -6,0 +6,0 @@ if (min && !max && val < rule.min) {

common/validate/rules/required.js

 import "../../../chunk-PKUHTIDK.js";
 import * as util from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function required_default({ rule, checkValue, source, errors, options, type }) {
@@ -5,0 +5,0 @@ if (rule.required && (!hasOwn.call(source, rule.field) || util.isEmptyValue(checkValue, type || rule.type))) {

common/validate/rules/type.js

 import "../../../chunk-PKUHTIDK.js";
 import * as util from "../util";
 import required from "./required";
-import { format } from "@opentiny/vue-renderless/common/date";
-import { isNullOrEmpty } from "@opentiny/vue-renderless/common/string";
-import { isNumber, isObject, isDate, typeOf } from "@opentiny/vue-renderless/common/type";
+import { format } from "../../date";
+import { isNullOrEmpty } from "../../string";
+import { isNumber, isObject, isDate, typeOf } from "../../type";
 const emailReg1 = '^(([^<>()\\[\\]\\\\.,;:\\s@"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@"]+)*)|(".+"))';
@@ -8,0 +8,0 @@ const emailReg = new RegExp(emailReg1 + "@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,6}))$");

common/validate/schema.js

@@ -6,3 +6,3 @@ import {
 import { format, complementError, asyncMap, warning, deepMerge, convertFieldsError } from "./util";
-import { hasOwn, isFunction } from "@opentiny/vue-renderless/common/type";
+import { hasOwn, isFunction } from "../type";
 function Schema(descriptor, translate) {
@@ -9,0 +9,0 @@ Schema.getSystemMessage = () => Schema.getDefaultMessage(translate);

common/validate/util.js

 import {
   __spreadValues
 } from "../../chunk-PKUHTIDK.js";
-import { hasOwn, isNull } from "@opentiny/vue-renderless/common/type";
+import { hasOwn, isNull } from "../type";
 const formatRegExp = /%[sdj%]/g;
@@ -6,0 +6,0 @@ let warning = () => void 0;

common/validate/validations/array.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function array_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/date.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function date_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/enum.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 const ENUM = "enum";
@@ -6,0 +6,0 @@ function enum_default(rule, checkValue, callback, source, options) {

common/validate/validations/float.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function float_default(rule, checkValue, cb, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/integer.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function integer_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/method.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function method_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const validate = rule.required || !rule.required && hasOwn.call(source, rule.field);

common/validate/validations/number.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function number_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/pattern.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function pattern_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/string.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function string_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const errors = [];

common/validate/validations/type.js

 import "../../../chunk-PKUHTIDK.js";
 import rules from "../rules/index";
 import { isEmptyValue } from "../util";
-import { hasOwn } from "@opentiny/vue-renderless/common/type";
+import { hasOwn } from "../../type";
 function type_default(rule, checkValue, callback, source, options) {
@@ -6,0 +6,0 @@ const ruleType = rule.type;

container/index.js

 import "../chunk-PKUHTIDK.js";
-import { isNumber } from "@opentiny/vue-renderless/common/type";
+import { isNumber } from "../common/type";
 const computedShowHeader = ({ constants, props }) => () => props.pattern !== constants.SIMPLE;
@@ -4,0 +4,0 @@ const computedShowFooter = ({ constants, props }) => () => props.pattern === constants.LEGEND || props.pattern === constants.CLASSIC;

crop/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { toFileSize } from "@opentiny/vue-renderless/common/string";
+import { on, off } from "../common/deps/dom";
+import { toFileSize } from "../common/string";
 const computedCropImages = ({ constants, t }) => () => t(constants.CROP_IMAGE);
@@ -5,0 +5,0 @@ const watchImageSrc = (state) => (value) => state.src = value;

currency/index.js

 import "../chunk-PKUHTIDK.js";
-import { isUndefined, isNull } from "@opentiny/vue-renderless/grid/static";
-import { log } from "@opentiny/vue-renderless/common";
+import { isUndefined, isNull } from "../grid/static";
+import { log } from "../common";
 const init = ({ state, service, api }) => () => {
@@ -5,0 +5,0 @@ const { textField, valueField } = service.fields;

date-panel/index.js

@@ -5,4 +5,4 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { getWeekData } from "@opentiny/vue-renderless/picker";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
+import { getWeekData } from "../picker";
+import debounce from "../common/deps/debounce";
 import {
@@ -24,7 +24,7 @@ isDate,
   extractTimeFormat
-} from "@opentiny/vue-renderless/common/deps/date-util";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { getDateWithNewTimezone, getLocalTimezone } from "@opentiny/vue-renderless/common/date";
-import { fillChar } from "@opentiny/vue-renderless/common/string";
+} from "../common/deps/date-util";
+import { DATEPICKER } from "../common";
+import { on, off } from "../common/deps/dom";
+import { getDateWithNewTimezone, getLocalTimezone } from "../common/date";
+import { fillChar } from "../common/string";
 const getYearLabel = ({ state, t }) => () => {
@@ -31,0 +31,0 @@ const yearTranslation = t(DATEPICKER.YearI18n);

date-panel/vue.js

@@ -47,4 +47,4 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { getWeekNumber, extractDateFormat } from "@opentiny/vue-renderless/common/deps/date-util";
-import { DATEPICKER, DATE } from "@opentiny/vue-renderless/common";
+import { getWeekNumber, extractDateFormat } from "../common/deps/date-util";
+import { DATEPICKER, DATE } from "../common";
 const api = [
@@ -105,2 +105,3 @@ "state",
     animationName: "",
+    startYear: Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 10) * 10,
     year: computed(() => state.date.getFullYear()),
@@ -107,0 +108,0 @@ month: computed(() => state.date.getMonth()),

date-range/index.js

@@ -14,3 +14,3 @@ import "../chunk-PKUHTIDK.js";
   modifyWithTimeString
-} from "@opentiny/vue-renderless/common/deps/date-util";
+} from "../common/deps/date-util";
 const calcDefaultValue = (defaultValue) => {
@@ -17,0 +17,0 @@ if (Array.isArray(defaultValue)) {

date-range/vue.js

@@ -43,3 +43,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { nextMonth, extractDateFormat, extractTimeFormat } from "@opentiny/vue-renderless/common/deps/date-util";
+import { nextMonth, extractDateFormat, extractTimeFormat } from "../common/deps/date-util";
 const api = [
@@ -46,0 +46,0 @@ "state",

date-table/index.js

 import "../chunk-PKUHTIDK.js";
-import { formatDate } from "@opentiny/vue-renderless/common/deps/date-util";
-import { getFirstDayOfMonth, getDayCountOfMonth, getWeekNumber, prevDate, nextDate, isDate, clearTime } from "@opentiny/vue-renderless/common/deps/date-util";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { formatDate } from "../common/deps/date-util";
+import { getFirstDayOfMonth, getDayCountOfMonth, getWeekNumber, prevDate, nextDate, isDate, clearTime } from "../common/deps/date-util";
+import { DATEPICKER } from "../common";
 const formatJudg = ({ day, offset, j, i, cell, count, dateCountOfLastMonth }) => {
@@ -6,0 +6,0 @@ const nodfpm = day + offset < 0 ? 7 + day + offset : day + offset;

date-table/vue.js

@@ -18,3 +18,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { getStartDateOfMonth } from "@opentiny/vue-renderless/common/deps/date-util";
+import { getStartDateOfMonth } from "../common/deps/date-util";
 const api = ["state", "getCellClasses", "isWeekActive", "handleMouseMove", "handleClick"];
@@ -21,0 +21,0 @@ const initState = ({ reactive, computed, api: api2, props }) => {

dialog-box/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off, addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { emitEvent } from "@opentiny/vue-renderless/common/event";
-import { getDomNode } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off, addClass, removeClass } from "../common/deps/dom";
+import { emitEvent } from "../common/event";
+import { getDomNode } from "../common/deps/dom";
 const computedAnimationName = ({ constants, props }) => () => props.rightSlide ? constants.DIALOG_SLIDER_RIGHT : constants.DIALOG_FADE;
@@ -9,3 +9,3 @@ const computedAddUnit = (value) => isNaN(Number(value)) ? value : value + "px";
   const style = {};
-  let { width, top, rightSlide } = props;
+  let { width, top, rightSlide, maxHeight } = props;
   if (top === void 0) {
@@ -16,5 +16,7 @@ top = rightSlide ? "0" : "15vh";
   top = computedAddUnit(top);
+  maxHeight = computedAddUnit(maxHeight);
   if (!state.isFull) {
     style.width = width;
     style.top = state.top || top;
+    style.maxHeight = maxHeight;
     if (rightSlide) {
@@ -21,0 +23,0 @@ style.right = 0;

dialog-box/vue.js

@@ -22,3 +22,3 @@ import {
 } from "./index";
-import usePopup from "@opentiny/vue-renderless/common/deps/vue-popup";
+import usePopup from "../common/deps/vue-popup";
 const api = ["afterEnter", "afterLeave", "handleClose", "handleWrapperClick", "handleCancel", "handleConfirm", "handleDrag", "state"];
@@ -25,0 +25,0 @@ const initState = ({ reactive, computed, api: api2, emitter, props }) => {

drop-times/index.js

 import "../chunk-PKUHTIDK.js";
-import { format } from "@opentiny/vue-renderless/common/date";
+import { format } from "../common/date";
 const init = ({ state, props }) => () => {
@@ -4,0 +4,0 @@ let list = [];

dropdown-item/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const getTitle = (props) => () => {
@@ -4,0 +4,0 @@ if (props.title) {

dropdown-menu/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
+import userPopper from "../common/deps/vue-popper";
 const toggleItem = (state) => (active, item) => {
@@ -116,5 +116,34 @@ if (item.disabled) {
 };
+const mounted = ({ api, parent, state }) => () => {
+  parent.$on("menuselectedIndex", (selectedIndex) => {
+    state.selectedIndex = selectedIndex;
+  });
+  parent.$on("menu-item-click", api.handleMenuItemClick);
+  parent.$on("mouseenter-tips", (showContent, label) => {
+    state.label = label;
+    state.showContent = showContent;
+  });
+  parent.$on("mouseleave-tips", (showContent, label) => {
+    state.label = label;
+    state.showContent = showContent;
+  });
+};
+const handleMenuItemClick = ({ state, dispatch }) => (itemData, instance, label, showContent) => {
+  state.label = label;
+  state.showContent = showContent;
+  dispatch("TinyDropdown", "current-item-click", [itemData, instance]);
+};
+const handleMouseenter = ({ emit }) => ($event) => {
+  emit("mouseenter", $event);
+};
+const handleMouseleave = ({ emit }) => ($event) => {
+  emit("mouseleave", $event);
+};
 export {
   clickOutside,
   getScroller,
+  handleMenuItemClick,
+  handleMouseenter,
+  handleMouseleave,
+  mounted,
   toggleItem,
@@ -121,0 +150,0 @@ updateOffset,

dropdown-menu/vue.js

 import "../chunk-PKUHTIDK.js";
-import { toggleItem, updateOffset, clickOutside, getScroller, useVuePopper } from "./index";
-const api = ["state", "toggleItem", "updateOffset", "clickOutside", "doDestroy"];
+import { toggleItem, updateOffset, clickOutside, getScroller, useVuePopper, mounted, handleMenuItemClick, handleMouseenter, handleMouseleave } from "./index";
+const api = ["state", "toggleItem", "updateOffset", "clickOutside", "doDestroy", "handleMouseenter", "handleMouseleave"];
 const renderless = (props, hooks, instance) => {
   const api2 = {};
-  const { reactive, provide } = hooks;
-  const { refs, nextTick, mode, vm } = instance;
+  const { reactive, provide, onMounted } = hooks;
+  const { nextTick, mode, vm, parent, dispatch, emit, refs } = instance;
   const state = reactive({
@@ -13,6 +13,11 @@ offset: 0,
     size: "",
-    showPopper: false
+    showPopper: false,
+    label: "",
+    showContent: false,
+    selected: false,
+    selectedIndex: -1
   });
+  provide("dropdownMenu", vm);
+  provide("multiStage", props.multiStage);
   if (mode === "mobile") {
-    provide("dropdownMenu", vm);
     nextTick(() => {
@@ -28,4 +33,9 @@ state.scroller = getScroller(refs.menu);
     clickOutside: clickOutside({ props, refs, state }),
-    updateOffset: updateOffset({ props, state, refs })
+    updateOffset: updateOffset({ props, state, refs }),
+    mounted: mounted({ api: api2, parent, state }),
+    handleMouseenter: handleMouseenter({ emit }),
+    handleMouseleave: handleMouseleave({ emit }),
+    handleMenuItemClick: handleMenuItemClick({ dispatch, state })
   });
+  onMounted(api2.mounted);
   return api2;
@@ -32,0 +42,0 @@ };

dropdown/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { addClass, removeClass, on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { KEY_CODE } from "../common";
+import { addClass, removeClass, on, off } from "../common/deps/dom";
 const watchVisible = ({ broadcast, emit, nextTick }) => (value) => {
@@ -5,0 +5,0 @@ broadcast("TinyDropdownMenu", "visible", value);

dropdown/vue.js

 import "../chunk-PKUHTIDK.js";
-import { guid } from "@opentiny/vue-renderless/common/string";
+import { guid } from "../common/string";
 import {
@@ -4,0 +4,0 @@ watchVisible,

espace/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common";
+import { xss } from "../common";
 const getUserHref = ({ api, props }) => (item) => {
@@ -4,0 +4,0 @@ const type = item.type ? String(item.type).toLocaleLowerCase() : "";

espace/vue.js

 import "../chunk-PKUHTIDK.js";
-import { init } from "@opentiny/vue-renderless/common/deps/eSpaceCtrl";
+import { init } from "../common/deps/eSpaceCtrl";
 import { getUserHref, getUserTitle, doUserAction, initEspaceLink, openEspace, testUID, soundEspace } from "./index";
@@ -4,0 +4,0 @@ const api = ["getUserHref", "getUserTitle", "doUserAction", "initEspaceLink", "openEspace", "testUID", "soundEspace"];

exception/vue.js

 import "../chunk-PKUHTIDK.js";
 import { create, getMessage } from "./index";
 const api = ["state", "create"];
-const renderless = (props, { computed, reactive }, { t, emit }) => {
+const renderless = (props, { computed, reactive }, { t, emit }, { images }) => {
   const api2 = {
@@ -10,2 +10,4 @@ create: create(emit),
   const state = reactive({
+    urlType: props.type,
+    images,
     message: computed(() => api2.getMessage({ props, t }))
@@ -12,0 +14,0 @@ });

fall-menu/index.js

 import "../chunk-PKUHTIDK.js";
-import { REFRESH_INTERVAL } from "@opentiny/vue-renderless/common";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { REFRESH_INTERVAL } from "../common";
+import { on, off } from "../common/deps/dom";
+import PopupManager from "../common/deps/popup-manager";
+import { xss } from "../common/xss.js";
 const arrowClick = (state) => (opt) => {
@@ -7,0 +7,0 @@ state.pager += opt;

file-upload/index.js

 import {
+  __spreadProps,
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { extend } from "@opentiny/vue-renderless/common/object";
-import { xss, log } from "@opentiny/vue-renderless/common/xss";
-import uploadAjax from "@opentiny/vue-renderless/common/deps/upload-ajax";
+import { extend } from "../common/object";
+import { xss, log } from "../common/xss";
+import uploadAjax from "../common/deps/upload-ajax";
+import { isObject } from "../common/type";
+import { isEmptyObject } from "../common/type";
 let initTokenPromise = null;
-const shaMap = {
-  sHA256: "SHA256"
-};
-const initService = ({ props, service }) => {
-  const noopFnCreator = (propName) => () => {
+const noopFnCreator = (fn, propName) => {
+  const noFn = () => {
     if (propName) {
       return Promise.reject(new Error(`[TINY Error][FileUpload] Prop ${propName} is not configured`));
     } else {
-      return Promise.reject(new Error("[TINY Error][FileUpload] This component depends on @opentiny/vue-service"));
+      return Promise.reject(
+        new Error(
+          "[TINY Error][FileUpload] This component depends on @opentiny/vue-service, Currently unable to generate a default gateway, please set a value for the action"
+        )
+      );
     }
   };
+  return fn || noFn;
+};
+const initService = ({ props, service }) => {
   const { network = {}, common = {} } = service || {};
   const { request, get, post, all, spread, CancelToken = {} } = network;
-  const noopFn = noopFnCreator();
+  let requestFn;
+  if (!isEmptyObject(props.hwh5)) {
+    const { HWH5 } = props.hwh5;
+    const { uploadToEDM } = HWH5();
+    requestFn = props.httpRequest || uploadToEDM;
+  } else if (request) {
+    requestFn = props.httpRequest || request;
+  } else {
+    requestFn = props.httpRequest || uploadAjax;
+  }
   return {
-    get: get || noopFn,
-    post: post || noopFn,
-    request: request || noopFn,
-    all: all || noopFn,
-    spread: spread || noopFn,
-    cancelToken: CancelToken.source || noopFn,
-    getSingleUploadUrl: common.getSingleUploadUrl || noopFn,
-    getFileUploadUrl: common.getFileUploadUrl || noopFn,
-    getFileDownloadUrl: common.getFileDownloadUrl || noopFn,
-    getSingleDownloadUrl: common.getSingleDownloadUrl || noopFn,
-    getPackageDownloadUrl: common.getPackageDownloadUrl || noopFn,
-    getLargeFileInitUrl: common.getLargeFileInitUrl || noopFn,
-    getChunkUploadUrl: common.getChunkUploadUrl || noopFn,
-    getPreviewUrl: common.getPreviewUrl || noopFn,
-    getDocumentInfoUrl: common.getDocumentInfoUrl || noopFn,
-    httpRequest: props.httpRequest || request || uploadAjax
+    get: noopFnCreator(get),
+    post: noopFnCreator(post),
+    request: noopFnCreator(request),
+    all: noopFnCreator(all),
+    spread: noopFnCreator(spread),
+    cancelToken: noopFnCreator(CancelToken.source),
+    getSingleUploadUrl: noopFnCreator(common.getSingleUploadUrl),
+    getFileUploadUrl: noopFnCreator(common.getFileUploadUrl),
+    getFileDownloadUrl: noopFnCreator(common.getFileDownloadUrl),
+    getSingleDownloadUrl: noopFnCreator(common.getSingleDownloadUrl),
+    getPackageDownloadUrl: noopFnCreator(common.getPackageDownloadUrl),
+    getLargeFileInitUrl: noopFnCreator(common.getLargeFileInitUrl),
+    getChunkUploadUrl: noopFnCreator(common.getChunkUploadUrl),
+    getPreviewUrl: noopFnCreator(common.getPreviewUrl),
+    getDocumentInfoUrl: noopFnCreator(common.getDocumentInfoUrl),
+    getPreviewUrlBatch: noopFnCreator(common.getPreviewUrlBatch),
+    httpRequest: noopFnCreator(requestFn, "httpRequest")
   };
 };
 const computedUploadDisabled = ({ props, state }) => () => props.disabled || (state.elForm || {}).disabled;
-const computedUploadingSize = (state) => () => state.uploadingFiles.reduce((total, file) => total + file.size, 0);
+const computedUploadingSize = ({ state, constants }) => () => state.uploadingFiles.reduce((total, file) => total + file.status !== constants.FILE_STATUS.FAIL ? file.size : 0, 0);
 const watchListType = ({ constants, state }) => (type) => {
-  if (type === constants.LIST_TYPE.PICTURE_CARD || type === constants.LIST_TYPE.PICTURE) {
+  if ([
+    constants.LIST_TYPE.PICTURE_CARD,
+    constants.LIST_TYPE.PICTURE,
+    constants.LIST_TYPE.PICTURE_SINGLE,
+    constants.LIST_TYPE.DRAG_SINGLE
+  ].includes(type)) {
     state.uploadFiles = state.uploadFiles.map((file) => {
@@ -50,2 +72,3 @@ if (!file.url && file.raw) {
         } catch (err) {
+          return;
         }
@@ -57,4 +80,4 @@ }
 };
-const watchFileList = ({ constants, state }) => (fileList) => {
-  state.uploadFiles = fileList && fileList.map((item) => {
+const watchFileList = ({ constants, state, props }) => (fileList) => {
+  let uploadFiles = fileList && fileList.map((item) => {
     item.uid = item.uid || Date.now() + state.tempIndex++;
@@ -64,2 +87,6 @@ item.status = item.status || constants.FILE_STATUS.SUCESS;
   });
+  if ([constants.LIST_TYPE.PICTURE_SINGLE, constants.LIST_TYPE.DRAG_SINGLE].includes(props.listType)) {
+    uploadFiles = uploadFiles.slice(0, 1);
+  }
+  state.uploadFiles = uploadFiles;
 };
@@ -76,5 +103,3 @@ const isNonFuncPropBeforeUpload = ({ flag, doUpload, file }) => !flag && doUpload(file);
         for (const p in rawFile) {
-          if (Object.prototype.hasOwnProperty.call(rawFile, p)) {
-            processedFile[p] = rawFile[p];
-          }
+          Object.prototype.hasOwnProperty.call(rawFile, p) && (processedFile[p] = rawFile[p]);
         }
@@ -96,12 +121,16 @@ file.raw = processedFile;
 };
+const getFileType = ({ file }) => file.name && file.name.split(".")[file.name.split(".").length - 1].toLowerCase();
+const remove = ({ api, file, autoRemove }) => {
+  if (autoRemove) {
+    const rawFile = file.raw;
+    if (Array.isArray(rawFile)) {
+      rawFile.forEach((raw) => api.handleRemove(null, raw));
+    } else {
+      api.handleRemove(null, rawFile);
+    }
+  }
+};
 const beforeUpload = ({ props, api, Modal, constants, t, state }) => (file, autoRemove, doUpload) => {
   if (state.isEdm && file.name.length > 255) {
-    if (autoRemove) {
-      const rawFile = file.raw;
-      if (Array.isArray(rawFile)) {
-        rawFile.forEach((raw) => api.handleRemove(null, raw));
-      } else {
-        api.handleRemove(null, rawFile);
-      }
-    }
+    remove({ api, file, autoRemove });
     return Modal.message({
@@ -112,2 +141,19 @@ message: `${t(constants.EDM.THEFILENAME)}"${file.name}"${t(constants.EDM.FILENAMEEXCEEDS)}`,
   }
+  if (file) {
+    const accept = state.isEdm ? state.accept : props.accept;
+    const fileType = getFileType({ file });
+    const isExist = accept && accept.split(",").some((type) => {
+      if (type.toLowerCase() === constants.IMAGE_TYPE) {
+        return constants.IMAGE_TYPES.includes(fileType.toLowerCase());
+      }
+      return new RegExp(type.trim(), "i").test(`.${fileType}` || file.raw.type);
+    });
+    if (accept && !isExist) {
+      remove({ api, file, autoRemove });
+      return Modal.message({
+        message: t("ui.fileUpload.notSupport"),
+        status: "warning"
+      });
+    }
+  }
   let flag = typeof props.beforeUpload === "function";
@@ -132,3 +178,7 @@ isNonFuncPropBeforeUpload({ flag, doUpload, file });
 };
-const startUpload = ({ state, constants, refs, Modal, api, t }) => (file, isList) => {
+const startUpload = ({ state, constants, vm, Modal, api, t }) => (file, isList) => {
+  if (state.isHwh5) {
+    vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file.raw);
+    return;
+  }
   if (file.size > state.docSize && file.size > state.chunkSize) {
@@ -147,3 +197,3 @@ file.isLargeFile = true;
   } else {
-    refs[constants.UPLOAD_INNER].upload(file.raw);
+    vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file.raw);
   }
@@ -164,2 +214,4 @@ };
 const properFileSize = ({ props, state, constants, Modal, t }) => (file) => {
+  if ([void 0, null].includes(file.size))
+    return true;
   let maxSize = 0;
@@ -171,8 +223,10 @@ if (Array.isArray(props.fileSize) && props.fileSize[1]) {
   }
-  if (file.size > maxSize * 1024 * 1024) {
-    Modal.message({
-      message: `${file.name} ${t(constants.EDM.EXCEED)} ${maxSize} MB`,
-      status: "warning"
-    });
-    return false;
+  if (state.isEdm || !state.isEdm && Array.isArray(props.fileSize) && props.fileSize[1]) {
+    if (file.size > maxSize * 1024 * 1024) {
+      Modal.message({
+        message: `${file.name} ${t(constants.EDM.EXCEED)} ${maxSize} MB`,
+        status: "warning"
+      });
+      return false;
+    }
   }
@@ -196,4 +250,4 @@ if (file.size <= 0) {
 };
-const addFileToList = ({ api, constants, emit, props, state, mode }) => (rawFile, updateId) => {
-  rawFile.uid = Date.now() + state.tempIndex++;
+const addFileToList = ({ api, constants, emit, props, state, mode }) => (rawFile, updateId, reUpload) => {
+  !reUpload && (rawFile.uid = Date.now() + state.tempIndex++);
   let file = { status: constants.FILE_STATUS.READY, name: rawFile.name, size: rawFile.size };
@@ -208,5 +262,14 @@ Object.assign(file, { percentage: 0, uid: rawFile.uid, raw: rawFile, response: {} });
   mode === "mobile" && calcFileForMobile(rawFile, file);
-  if (~[constants.LIST_TYPE.PICTURE_CARD, constants.LIST_TYPE.PICTURE].indexOf(props.listType)) {
+  if ([
+    constants.LIST_TYPE.PICTURE_CARD,
+    constants.LIST_TYPE.PICTURE,
+    constants.LIST_TYPE.PICTURE_SINGLE,
+    constants.LIST_TYPE.DRAG_SINGLE
+  ].includes(props.listType) && !state.isHwh5) {
     try {
-      file.url = URL.createObjectURL(rawFile);
+      if (state.isHwh5) {
+        file.url = rawFile.filePath;
+      } else {
+        file.url = URL.createObjectURL(rawFile);
+      }
     } catch (err) {
@@ -222,3 +285,6 @@ return;
     state.updateId = updateId || props.edm.updateId || "";
-    if (state.updateId) {
+    if (reUpload) {
+      const index = state.uploadFiles.findIndex((item) => item.uid === file.uid);
+      state.uploadFiles.splice(index, 1);
+    } else if (state.updateId) {
       const index = state.uploadFiles.findIndex((item) => item.docId === updateId);
@@ -230,2 +296,8 @@ state.uploadFiles.splice(index, 1, file);
   }
+  if (!state.isEdm) {
+    const proper = api.properFileSize(file);
+    if (!proper) {
+      return;
+    }
+  }
   state.uploadFiles.push(file);
@@ -235,19 +307,73 @@ state.currentUploadingFileUids.push(file.uid);
 };
-const rawfileUpload = ({ state, props, refs, constants, rawFiles, api }) => {
-  if (!state.isEdm && props.autoUpload) {
-    if (props.multiple && props.mergeService) {
-      const handler = (file) => refs[constants.UPLOAD_INNER].upload(file.raw);
-      rawFiles.length && api.beforeUpload({ raw: rawFiles }, true, handler);
+const getFileHash = ({ emit, Modal, constants, t, CryptoJS, state }) => ({ file, chunkSize, showTips }) => {
+  if (showTips) {
+    Modal.message({
+      message: `${t(constants.EDM.CALCHASH)}`,
+      status: "warning"
+    });
+  }
+  const chunks = Math.ceil(file.size / chunkSize);
+  let chunkIndex = 0;
+  let start = chunkIndex * chunkSize;
+  let end = Math.min(file.size, start + chunkSize);
+  let chunk = file.raw.slice(start, end);
+  const hasher = CryptoJS.algo.SHA256.create();
+  let calculated = 0;
+  return new Promise((resolve) => {
+    const reader = new FileReader();
+    reader.readAsArrayBuffer(chunk);
+    reader.onload = (e) => {
+      if (file.status === constants.FILE_STATUS.FAIL)
+        return;
+      chunkIndex++;
+      let wordArray = CryptoJS.lib.WordArray.create(e.target.result);
+      hasher.update(wordArray);
+      wordArray = null;
+      if (chunkIndex < chunks) {
+        start = chunkIndex * chunkSize;
+        end = Math.min(file.size, start + chunkSize);
+        calculated += end - start;
+        emit("hash-progress", Math.min(Math.floor(calculated / file.size * 100), 100));
+        chunk = file.raw.slice(start, end);
+        reader.readAsArrayBuffer(chunk);
+      } else {
+        const hash = hasher.finalize().toString();
+        file.hash = file.raw.hash = hash;
+        resolve(hash);
+        emit("hash-progress", 100);
+      }
+    };
+    reader.onerror = (err) => {
+      file.status = constants.FILE_STATUS.FAIL;
+      emit("error", err, file, state.uploadFiles);
+    };
+  });
+};
+const handleHwh5Files = (files) => {
+  return files.map((file) => {
+    if (file instanceof File)
+      return file;
+    let f = {};
+    if (isObject(file)) {
+      const { fileName, fileSize, filePath } = file;
+      f = __spreadProps(__spreadValues({}, file), {
+        name: fileName,
+        size: fileSize,
+        webkitRelativePath: filePath
+      });
     } else {
-      rawFiles.forEach((rawFile) => {
-        const file = api.getFile(rawFile);
-        const handler = (file2) => refs[constants.UPLOAD_INNER].upload(file2.raw);
-        api.beforeUpload(file, true, handler);
-      });
+      const [name, index] = file.match(/[^/]*$/);
+      const [type] = file.match(/\.[^.]*$/);
+      const filePath = file.substring(0, index);
+      f = { type, name, filePath, webkitRelativePath: filePath };
     }
+    return f;
+  });
+};
+const handleStart = ({ api, constants, props, state, vm }) => (rawFiles, updateId, reUpload = false) => {
+  if (state.isHwh5) {
+    rawFiles = handleHwh5Files(rawFiles);
   }
-};
-const handleStart = ({ api, constants, props, state, refs }) => (rawFiles, updateId) => {
   state.currentUploadingFileUids = [];
-  rawFiles.forEach((rawFile) => api.addFileToList(rawFile, updateId));
+  rawFiles.forEach((rawFile) => api.addFileToList(rawFile, updateId, reUpload));
   const { UPLOADING, READY } = constants.FILE_STATUS;
@@ -258,23 +384,20 @@ state.uploadingFiles = state.uploadFiles.filter((file) => [UPLOADING, READY].includes(file.status));
       const file = api.getFile(rawFile);
-      if (!file) {
+      if (!file)
         return;
-      }
       api.beforeUpload(file, true, (file2) => {
         typeof props.edm.upload.loading === "function" && props.edm.upload.loading(file2);
         new Promise((resolve) => {
-          if (props.edm.isCheckCode !== true) {
+          if (state.isHwh5)
             return resolve();
-          }
-          if (file2.size > state.docSize && file2.size > state.chunkSize && !state.isEntireCheckCode) {
+          let isLargeFileHash = false;
+          if (props.edm.isCheckCode !== true)
             return resolve();
+          if (file2.size > state.docSize && file2.size > state.chunkSize) {
+            if (!state.isEntireCheckCode) {
+              return resolve();
+            } else {
+              isLargeFileHash = true;
+            }
           }
-          const reader = new FileReader();
-          reader.readAsArrayBuffer(file2.raw);
-          reader.onload = (e) => {
-            const cryptoJS = props.edm.upload.plugin();
-            const wordArray = cryptoJS.lib.WordArray.create(e.target.result);
-            const hash = cryptoJS[shaMap.shaMap](wordArray).toString();
-            file2.hash = file2.raw.hash = hash;
-            resolve(hash);
-          };
+          api.getFileHash({ file: file2, chunkSize: state.chunkSize, showTips: isLargeFileHash }).then((hash) => resolve(hash));
         }).then(() => {
@@ -294,12 +417,34 @@ if (props.autoUpload) {
   }
-  rawfileUpload({ state, props, refs, constants, rawFiles, api });
+  if (!state.isEdm && props.autoUpload) {
+    if (props.multiple && props.mergeService) {
+      const handler = (file) => (vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file.raw), void 0);
+      rawFiles.length && api.beforeUpload({ raw: rawFiles }, true, handler);
+    } else {
+      rawFiles.forEach((rawFile) => {
+        const file = api.getFile(rawFile);
+        if (!file)
+          return;
+        const handler = (file2) => (vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file2.raw), void 0);
+        api.beforeUpload(file, true, handler);
+      });
+    }
+  }
 };
-const calcUploadingFilesInfo = ({ state }) => () => {
-  const totalLoadedSize = state.uploadingFiles.reduce((loadedSize, file) => {
-    const loaded = file.size * file.percentage / 100;
-    return loadedSize + loaded;
-  }, 0);
+const calcUploadingFilesInfo = ({ state, constants }) => () => {
+  let percentage;
+  if (state.isHwh5) {
+    const totalPercentage = state.uploadingFiles.reduce((total, file) => {
+      const curPercentage = file.status !== constants.FILE_STATUS.FAIL ? file.percentage / 100 : 0;
+      return total + curPercentage;
+    }, 0);
+    percentage = Math.floor(totalPercentage / state.uploadingFiles.length * 100);
+  } else {
+    const totalLoadedSize = state.uploadingFiles.reduce((loadedSize, file) => {
+      const loaded = file.status !== constants.FILE_STATUS.FAIL ? file.size * file.percentage / 100 : 0;
+      return loadedSize + loaded;
+    }, 0);
+    percentage = Math.floor(totalLoadedSize / state.uploadingSize * 100);
+  }
+  percentage = Math.min(percentage, 100);
   const uploadedFiles = state.uploadingFiles.filter((file) => file.percentage === 100);
-  let percentage = Math.floor(totalLoadedSize / state.uploadingSize * 100);
-  percentage = Math.min(percentage, 100);
   return {
@@ -326,4 +471,5 @@ percentage,
       file.status = constants.FILE_STATUS.UPLOADING;
-      if (event.lengthComputable && !file.isLargeFile) {
-        file.percentage = Math.floor(event.loaded * 100 / event.total) || 0;
+      if (state.isHwh5) {
+        const { progress } = JSON.parse(event);
+        file.percentage = progress;
         if (file.percentage >= 100) {
@@ -333,2 +479,10 @@ file.isFinished = true;
         emit("progress", file, state.uploadFiles, api.calcUploadingFilesInfo());
+      } else {
+        if (event.lengthComputable && !file.isLargeFile) {
+          file.percentage = Math.floor(event.loaded * 100 / event.total) || 0;
+          if (file.percentage >= 100) {
+            file.isFinished = true;
+          }
+          emit("progress", file, state.uploadFiles, api.calcUploadingFilesInfo());
+        }
       }
@@ -367,10 +521,13 @@ }
       file.response = res;
-      if (state.isEdm && res.data.result) {
-        file.serverName = res.data.result.serverName;
-        file.docRelativePath = res.data.result.docRelativePath;
-        file.docId = res.data.result.docId;
-        file.docVersion = res.data.result.version;
-        file.docSize = res.data.result.docSize;
+      if (state.isEdm) {
+        const result = state.isHwh5 ? res : res.data.result;
+        if (!result)
+          return;
+        file.serverName = result.serverName;
+        file.docRelativePath = result.docRelativePath;
+        file.docId = result.docId;
+        file.docVersion = result.version;
+        file.docSize = result.docSize;
         file.isLargeFile && delete file.raw;
-        Object.assign(file, res.data.result);
+        Object.assign(file, result);
       }
@@ -385,14 +542,14 @@ emit("success", res, file, currentUploadFiles);
   const file = api.getFile(rawFile);
-  if (file) {
-    file.status = constants.FILE_STATUS.FAIL;
-    file.percentage = 100;
-    if (!state.isEdm) {
-      state.uploadFiles.splice(state.uploadFiles.indexOf(file), 1);
-    }
-    api.clearUploadingFiles();
-    emit("error", err, file, state.uploadFiles);
-    emit("change", file, state.uploadFiles);
+  if (!file)
+    return;
+  file.status = constants.FILE_STATUS.FAIL;
+  file.percentage = 100;
+  if (!state.isEdm) {
+    state.uploadFiles.splice(state.uploadFiles.indexOf(file), 1);
   }
+  api.clearUploadingFiles();
+  emit("error", err, file, state.uploadFiles);
+  emit("change", file, state.uploadFiles);
 };
-const handleRemove = ({ api, emit, props, state }) => (file, raw) => {
+const handleRemove = ({ api, emit, props, state, constants }) => (file, raw) => {
   if (raw) {
@@ -402,6 +559,7 @@ file = api.getFile(raw);
   let doRemove = () => {
+    file.status = constants.FILE_STATUS.FAIL;
     api.abort(file);
     let fileList = state.uploadFiles;
     fileList.splice(fileList.indexOf(file), 1);
-    emit("remove", file, fileList);
+    emit("remove", __spreadProps(__spreadValues({}, file), { status: constants.FILE_STATUS.FAIL }), fileList);
   };
@@ -440,7 +598,50 @@ if (!props.beforeRemove) {
 };
-const abort = ({ constants, refs }) => (file) => refs[constants.UPLOAD_INNER].abort(file);
+const abort = ({ constants, vm, state }) => (file) => {
+  const { READY, UPLOADING, FAIL } = constants.FILE_STATUS;
+  if (file) {
+    state.uploadingFiles.forEach((f) => {
+      const uid = file.uid || file;
+      if (f.uid === uid && [READY, UPLOADING].includes(f.status)) {
+        f.status = FAIL;
+      }
+    });
+  } else {
+    state.uploadingFiles.forEach((f) => {
+      if ([READY, UPLOADING].includes(f.status)) {
+        f.status = FAIL;
+      }
+    });
+  }
+  vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].abort(file);
+};
+const abortDownload = ({ state }) => (file, batch = false) => {
+  const cancel = (docId) => {
+    if (!docId)
+      return;
+    const cancels = state.downloadCancelToken[docId];
+    cancels && cancels.forEach((cancel2) => cancel2());
+    delete state.downloadCancelToken[docId];
+    const clearDataFn = state.downloadCancelData[docId];
+    clearDataFn && clearDataFn(docId);
+  };
+  if (Array.isArray(file)) {
+    if (batch) {
+      cancel(
+        file.map((f) => f.docId || f).sort().join(",")
+      );
+    } else {
+      file.forEach((f) => f && cancel(file.docId || file));
+    }
+  } else if (file) {
+    cancel(file.docId || file);
+  } else {
+    Object.keys(state.downloadCancelToken).forEach((docId) => {
+      cancel(docId);
+    });
+  }
+};
 const clearFiles = (state) => () => {
   state.uploadFiles = [];
 };
-const submit = ({ api, constants, refs, state, props }) => () => {
+const submit = ({ api, constants, vm, state, props }) => () => {
   const files = state.uploadFiles.filter((file) => file.status === constants.FILE_STATUS.READY);
@@ -465,3 +666,3 @@ if (state.isEdm && state.isSuccess) {
       rawFiles.length && api.beforeUpload({ raw: rawFiles }, false, (file) => {
-        refs[constants.UPLOAD_INNER].upload(file.raw);
+        vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file.raw);
       });
@@ -471,3 +672,3 @@ } else {
         api.beforeUpload(file, false, (file2) => {
-          refs[constants.UPLOAD_INNER].upload(file2.raw);
+          vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(file2.raw);
         });
@@ -478,3 +679,3 @@ });
 };
-const handleClick = ({ constants, refs }) => () => refs[constants.UPLOAD_INNER].handleClick();
+const handleClick = ({ constants, vm }) => () => vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].handleClick();
 const getFileUploadUrl = (service) => () => service.getFileUploadUrl();
@@ -488,6 +689,6 @@ const updateUrl = ({ api, props, state }) => () => {
 };
-const getTranslateFile = ({ api, isChunk }) => (data, type, index) => {
+const getTranslateFile = ({ api, isChunk, isLessThan17G, file, state }) => (data, type, index) => {
   if (isChunk) {
     if (index === 0) {
-      api.setWriterFile({ data, index });
+      state.downloadCancelData[file.docId] = api.setWriterFile({ data, index, isLessThan17G, file });
     }
@@ -498,35 +699,40 @@ } else {
     const blob = new Blob([data.data], { type: type !== "zip" ? "application / x - xls" : "application/zip" });
-    if (window && window.navigator.msSaveOrOpenBlob) {
-      window.navigator.msSaveOrOpenBlob(blob, decodeURIComponent(name));
-      return;
-    }
-    const url = window.URL || window.webkitURL || window.moxURL;
-    const downloadHref = xss.filterUrl(url.createObjectURL(blob));
-    let downloadLink = document.createElement("a");
-    downloadLink.href = downloadHref;
-    downloadLink.download = decodeURIComponent(name);
-    downloadLink.click();
+    aLinkDownload({ blob, name });
   }
 };
-const getHandleSuccess = ({ downloadOps, file, translateFile, isChunk, state }) => (data, type, index) => {
+const aLinkDownload = ({ blob, name }) => {
+  if (window && window.navigator.msSaveOrOpenBlob) {
+    window.navigator.msSaveOrOpenBlob(blob, decodeURIComponent(name));
+    return;
+  }
+  const url = window.URL || window.webkitURL || window.moxURL;
+  const downloadHref = xss.filterUrl(url.createObjectURL(blob));
+  let downloadLink = document.createElement("a");
+  downloadLink.href = downloadHref;
+  downloadLink.download = decodeURIComponent(name);
+  downloadLink.click();
+  url.revokeObjectURL && url.revokeObjectURL(downloadHref);
+};
+const getHandleSuccess = ({ state, downloadOps, file, translateFile, isChunk, isLessThan17G }) => (data, type, index) => {
   if (isChunk) {
-    state.dowuloadChunkFile.set(index, new Uint8Array(data.data));
+    const res = isLessThan17G ? data.data : new Uint8Array(data.data);
+    let downloadChunkFile = state.downloadChunkFile[file.docId];
+    if (!downloadChunkFile) {
+      downloadChunkFile = {};
+    }
+    downloadChunkFile[index] = res;
     translateFile(data, type, index);
   } else {
-    if (data.data.type.includes("application/json")) {
-      const reader = new FileReader();
-      reader.onload = (e) => {
-        if (typeof downloadOps.fail === "function") {
-          downloadOps.fail(JSON.parse(e.target.result), file);
-        }
-      };
-      reader.readAsText(data.data);
-    } else {
-      typeof downloadOps.loading === "function" && downloadOps.loading(file);
-      translateFile(data, type);
-    }
+    typeof downloadOps.loading === "function" && downloadOps.loading(file);
+    translateFile(data, type);
   }
+  return true;
 };
 const getCalcProgress = () => (evt) => {
-  let total = Number(evt.target.getResponseHeader("Content-Size"));
+  let total;
+  if (evt.target && evt.target.getResponseHeader) {
+    total = Number(evt.target.getResponseHeader("Content-Size"));
+  } else {
+    total = Number(evt.total);
+  }
   total = Math.max(total, evt.loaded);
@@ -538,5 +744,5 @@ let progress = Math.ceil(evt.loaded / total * 100) || 0;
 };
-const modifyServiceUrlSingle = ({ file, serviceUrl, range, constants }) => {
+const modifyServiceUrlSingle = ({ constants }) => ({ file, serviceUrl, range }) => {
   if (typeof file === "object") {
-    let tempFile = __spreadValues(__spreadValues({}, file), range);
+    let tempFile = Object.assign({}, file, range);
     delete tempFile.docId;
@@ -546,8 +752,6 @@ delete tempFile.docVersion;
     for (let key in tempFile) {
-      if (Object.prototype.hasOwnProperty.call(tempFile, key)) {
-        const value = tempFile[key];
-        const dataType = typeof value;
-        if (!~["undefined", "object", "function"].indexOf(dataType)) {
-          serviceUrl += `&${key}=${value}`;
-        }
+      const value = tempFile[key];
+      const dataType = typeof value;
+      if (!~["undefined", "object", "function"].indexOf(dataType)) {
+        serviceUrl += `&${key}=${value}`;
       }
@@ -560,4 +764,4 @@ }
 };
-const getKiaScanTip = ({ data, t, Modal, constants }) => {
-  if (data.status === "12079") {
+const getKiaScanTip = ({ Modal, constants, t }) => ({ data }) => {
+  if (data.status === constants.EDM.KIASTATUS) {
     return Modal.message({
@@ -569,9 +773,52 @@ message: `${t(constants.EDM.KIASCANTIP)}`,
 };
-const getServiceUrl = ({ url, file }) => url.replace(/{docId}/, file.docId || file) + `${~url.indexOf("?") ? "&" : "?"}x-download-sign=true&docVersion=${file.docVersion || ""}`;
-const downloadFileSingle = (args) => {
-  let { file, service, constants, props, state, batchIndex, isChunk, api } = args;
-  let { calcProgress, emit, handleSuccess: handleSuccess2, t, Modal, range = {}, isBatch } = args;
+const validateDownloadStatus = ({ state, Modal }) => ({ downloadOps, file, isLessThan17G, data }) => {
+  const errorHandle = ({ state: state2, file: file2, errRes, Modal: Modal2, downloadOps: downloadOps2 }) => {
+    if (state2.currentDownloadFiles && state2.currentDownloadFiles.docId === file2.docId)
+      return;
+    if (errRes && errRes.message) {
+      Modal2.message({
+        message: errRes.message,
+        status: "warning"
+      });
+    }
+    state2.currentDownloadFiles = file2;
+    if (typeof downloadOps2.fail === "function") {
+      downloadOps2.fail(errRes, file2);
+    }
+  };
+  if (data.data && data.data.type && data.data.type.includes("application/json")) {
+    const reader = new FileReader();
+    reader.onload = (e) => {
+      const errRes = JSON.parse(e.target.result);
+      errorHandle({ state, file, errRes, Modal, downloadOps });
+    };
+    reader.readAsText(data.data);
+    return true;
+  }
+  if (!isLessThan17G && data.headers["content-type"].includes("application/json")) {
+    const errRes = JSON.parse(String.fromCharCode.apply(null, new Uint8Array(data.data)));
+    errorHandle({ state, file, errRes, Modal, downloadOps });
+    return true;
+  }
+};
+const createDownloadCancelToken = ({ state, service }) => (file) => {
+  let docId;
+  if (Array.isArray(file)) {
+    docId = file.map((f) => f.docId || f).sort().join(",");
+  } else {
+    docId = file.docId || file;
+  }
+  if (!state.downloadCancelToken[docId]) {
+    state.downloadCancelToken[docId] = [];
+  }
+  const { cancel, token } = service.cancelToken();
+  state.downloadCancelToken[docId].push(cancel);
+  return token;
+};
+const downloadFileSingle = ({ service, constants, props, state, api, emit }) => (args) => {
+  let { file, batchIndex, isChunk, calcProgress, handleSuccess: handleSuccess2, range = {}, isBatch, isLessThan17G } = args;
+  let getServiceUrl = ({ url, file: file2 }) => url.replace(/{docId}/, file2.docId || file2) + `${~url.indexOf("?") ? "&" : "?"}x-download-sign=true&docVersion=${file2.docVersion || ""}`;
   let sdResolver = (url) => {
     let serviceUrl = getServiceUrl({ url, file });
-    serviceUrl = modifyServiceUrlSingle({ file, serviceUrl, range, constants });
+    serviceUrl = api.modifyServiceUrlSingle({ file, serviceUrl, range });
     serviceUrl = xss.filterUrl(serviceUrl);
@@ -581,4 +828,5 @@ let params = {
       headers: Object.assign(props.headers, state.headers),
-      responseType: isChunk ? "arraybuffer" : "blob",
+      responseType: isChunk && !isLessThan17G ? "arraybuffer" : "blob",
       hideErr: true,
+      cancelToken: api.createDownloadCancelToken(file),
       onDownloadProgress(evt) {
@@ -595,8 +843,9 @@ let progress = calcProgress(evt, isChunk);
     service.get(serviceUrl, params).then((data) => {
-      if (getKiaScanTip({ data, t, Modal, constants })) {
+      if (api.getKiaScanTip({ data }))
         return;
-      }
+      if (api.validateDownloadStatus({ downloadOps: props.edm.download || {}, file, isLessThan17G, data }))
+        return;
+      handleSuccess2(data, "", range.index);
       const { checkcode, "content-size": fileSize } = data.headers;
-      !isChunk && emit("download", 100, { checkcode, fileSize });
-      handleSuccess2(data, "", range.index);
+      !isChunk && emit("download", 100, "", { checkcode, fileSize });
       if (typeof file === "object") {
@@ -608,7 +857,7 @@ file.percentage = 100;
     }).catch((data) => {
-      if (data.response && data.response.status === 401) {
+      if (data.response && state.errorStatusCodes.includes(data.response.status)) {
         const downloadOps = props.edm.download || {};
         const tokenParams = { token: downloadOps.token, file, type: "download" };
         api.getToken(tokenParams).then((data2) => {
-          api.afterDownload({ batchIndex, data: data2, file, range, isChunk, isBatch });
+          api.afterDownload({ batchIndex, data: data2, file, range, isChunk, isBatch, isLessThan17G });
         });
@@ -620,5 +869,4 @@ }
 };
-const downloadFileBatch = (args) => {
-  let { api, downloadOps, file, service, props, state, calcProgress, emit, handleSuccess: handleSuccess2 } = args;
-  let { t, Modal, constants, range = {} } = args;
+const downloadFileBatch = ({ api, service, props, state, emit }) => (args) => {
+  let { downloadOps, file, calcProgress, handleSuccess: handleSuccess2, range = {} } = args;
   let tokenParams = { token: downloadOps.packageToken, file, type: "download" };
@@ -630,8 +878,9 @@ api.getToken(tokenParams).then((data) => {
     const params = { downloadTOs: [], attachdownloadTOs: [], isZip: "true", transformType: "sync", type: "package" };
-    const hasWmType = file.some((item) => Boolean(item.wmType));
-    if (hasWmType) {
-      params.attachdownloadTOs = file;
-    } else {
-      params.downloadTOs = file;
-    }
+    file.forEach((item) => {
+      if (item.wmType) {
+        params.attachdownloadTOs.push(item);
+      } else {
+        params.downloadTOs.push(item);
+      }
+    });
     service.getPackageDownloadUrl().then((url) => {
@@ -647,2 +896,3 @@ url += `${~url.indexOf("?") ? "&" : "?"}x-download-sign=true`;
           responseType: "blob",
+          cancelToken: api.createDownloadCancelToken(file),
           onDownloadProgress(evt) {
@@ -656,7 +906,6 @@ let progress = calcProgress(evt);
       ).then((data2) => {
-        if (getKiaScanTip({ data: data2, t, Modal, constants })) {
+        if (api.getKiaScanTip({ data: data2 }))
           return;
-        }
-        const { "content-size": fileSize } = data2.headers;
-        emit("download", 100, { fileSize });
+        const { "content-size": fileSize, checkcode } = data2.headers;
+        emit("download", 100, "", { fileSize, checkcode });
         handleSuccess2(data2, "zip");
@@ -667,57 +916,104 @@ });
 };
-const downloadFile = ({ api, state, props }) => (file) => {
+const downloadFileSingleHwh5 = ({ state, props, emit, constants }) => ({ file }) => {
+  const { HWH5, appId } = props.hwh5;
+  const { downloadToEDM } = HWH5();
+  const options = {
+    edmAuth: {
+      edmToken: state.headers[constants.EDM.EDMTOKEN],
+      appId
+    },
+    docId: file.docId || file,
+    docVersion: file.docVersion,
+    filePath: file.filePath,
+    progress: 1,
+    onProgress: (event) => {
+      const { progress } = JSON.parse(event);
+      if (progress * 1 !== 100) {
+        emit("download", progress);
+      }
+    }
+  };
+  downloadToEDM(options).then((data) => {
+    emit("download", 100, "", { data });
+  });
+};
+const downloadFile = ({ api, state }) => (file) => {
+  state.currentDownloadFiles = "";
   if (!state.isEdm) {
     api.ordinaryDownload(file);
-    return;
+  } else {
+    const isBatch = Array.isArray(file);
+    if (state.isHwh5) {
+      let files = file;
+      if (!isBatch) {
+        files = [file];
+      }
+      files.forEach((f) => api.downloadFileSingleInner({ file: f, isBatch: false }));
+      return;
+    }
+    if (isBatch) {
+      api.downloadFileInner({ file, isBatch });
+    } else {
+      api.downloadFileSingleInner({ file, isBatch });
+    }
   }
-  const isBatch = Array.isArray(file);
-  if (isBatch) {
-    return api.downloadFileInner({ file, isBatch });
-  }
+};
+const downloadFileSingleInner = ({ props, state, api, constants }) => ({ file, isBatch }) => {
+  const { SIZE_17G } = constants.EDM;
   const downloadOps = props.edm.download || {};
   let tokenParams = { token: downloadOps.token, file, type: "download" };
   api.getToken(tokenParams).then((data) => {
-    if (!data) {
+    if (!data)
       return;
+    if (state.isHwh5) {
+      api.downloadFileSingleHwh5({ file });
+      return;
     }
-    api.getDownloadFileInfo({ docId: file.docId }).then((res) => {
-      let fileInfo;
-      if (res && res.outDocQueryList[0].verInfo[0]) {
-        fileInfo = res.outDocQueryList[0].verInfo[0].docInfo[0];
-      }
-      const { fileSize } = fileInfo;
-      const isLargeFile = fileSize > state.docSize && fileSize > state.chunkSize && fileSize > 10 * 1024 * 1024 * 1024;
-      if (isLargeFile) {
-        api.largeDocumentDownload({ file: fileInfo, isBatch });
-      } else {
-        api.downloadFileInner({ file, isBatch });
-      }
+    if (state.hasFileInfoInterface) {
+      api.getDownloadFileInfo({ docId: file.docId }).then((res) => {
+        let fileInfo;
+        if (res && res.outDocQueryList[0].verInfo[0]) {
+          fileInfo = res.outDocQueryList[0].verInfo[0].docInfo[0];
+        }
+        const { fileSize } = fileInfo;
+        const isLargeFile = fileSize > state.docSize && fileSize > state.chunkSize;
+        const isLessThan17G = fileSize < SIZE_17G * 1024;
+        if (isLargeFile) {
+          api.largeDocumentDownload({ file: fileInfo, isBatch, isLessThan17G });
+        } else {
+          api.downloadFileInner({ file, isBatch });
+        }
+      });
+    } else {
+      api.downloadFileInner({ file, isBatch });
+    }
+  });
+};
+const getDownloadFileInfo = ({ api, state, props, service }) => ({ docId }) => {
+  return service.getDocumentInfoUrl().then((url) => {
+    return new Promise((resolve, reject) => {
+      service.request({
+        method: "post",
+        url: xss.filterUrl(url),
+        withCredentials: props.withCredentials,
+        headers: Object.assign(props.headers, state.headers),
+        cancelToken: api.createDownloadCancelToken({ docId }),
+        data: { docInfoVO: { ids: [docId], docType: "", docVersion: "" } }
+      }).then((res) => {
+        if (res.data.status === 200) {
+          resolve(res.data.result);
+        } else {
+          reject(res);
+        }
+      });
     });
   });
 };
-const getDownloadFileInfo = ({ state, props, service }) => ({ docId }) => service.getDocumentInfoUrl().then(
-  (url) => new Promise((resolve, reject) => {
-    service.request({
-      method: "post",
-      url: xss.filterUrl(url),
-      withCredentials: props.withCredentials,
-      headers: Object.assign(props.headers, state.headers),
-      data: { docInfoVO: { ids: [docId], docType: "", docVersion: "" } }
-    }).then((res) => {
-      if (res.data.status === 200) {
-        resolve(res.data.result);
-      } else {
-        reject(res);
-      }
-    });
-  })
-);
-const largeDocumentDownload = ({ api, state }) => ({ file, isBatch }) => {
-  const chunkSize = Math.ceil(file.fileSize / state.chunkSize);
-  state.dowuloadChunkFile.set("chunkSize", chunkSize);
-  state.dowuloadChunkFile.set("fileSize", file.fileSize);
-  state.dowuloadChunkFile.set("docName", file.docName);
+const largeDocumentDownload = ({ api, state }) => ({ file, isBatch, isLessThan17G }) => {
+  const { fileSize, docId, docName } = file;
+  const chunkSize = Math.ceil(fileSize / state.chunkSize);
+  state.downloadChunkFile[docId] = { chunkNum: chunkSize, fileSize, docName };
   file.chunkSize = chunkSize;
   const batches = api.sliceDownloadChunk(file);
-  api.batchSegmentDownload({ batchIndex: 0, batches, docId: file.docId, isBatch });
+  api.batchSegmentDownload({ batchIndex: 0, batches, docId: file.docId, isBatch, isLessThan17G });
 };
@@ -729,5 +1025,10 @@ const sliceDownloadChunk = ({ state }) => (file) => {
   state.downloadBatchQueueListen[file.docId + "-0"] = 0;
+  let startRange = 0;
+  let endRange = -1;
   for (let i = 0; i < chunkSize; i++) {
-    const startRange = i * state.chunkSize;
-    const endRange = Math.min(file.fileSize, startRange + state.chunkSize);
+    startRange = endRange + 1;
+    endRange = Math.min(file.fileSize, startRange + state.chunkSize);
+    if (endRange < startRange) {
+      return downloadChunkArray;
+    }
     const lastIndex = downloadChunkArray.length - 1;
@@ -749,3 +1050,3 @@ if (downloadChunkArray[lastIndex].length < state.downloadChunkLimit) {
 };
-const batchSegmentDownload = ({ state, api }) => ({ batchIndex, batches, docId, isBatch }) => {
+const batchSegmentDownload = ({ state, api }) => ({ batchIndex, batches, docId, isBatch, isLessThan17G }) => {
   if (batchIndex < batches.length) {
@@ -765,3 +1066,4 @@ const batch = batches[batchIndex];
             batches,
-            isBatch
+            isBatch,
+            isLessThan17G
           });
@@ -773,22 +1075,54 @@ }
     while (batch.length - index > 0) {
-      api.downloadFileInner({ batchIndex, range: batch[index++], file: { docId }, isBatch, isChunk: true });
+      api.downloadFileInner({
+        batchIndex,
+        range: batch[index++],
+        file: { docId },
+        isBatch,
+        isChunk: true,
+        isLessThan17G
+      });
     }
   }
 };
-const downloadFileInner = ({ api, props, service, state, emit, constants, t, Modal }) => ({ batchIndex, file, range, isBatch, isChunk }) => {
+const downloadFileInner = ({ api, props, state }) => ({
+  batchIndex,
+  file,
+  range,
+  isBatch,
+  isChunk,
+  isLessThan17G
+}) => {
   const downloadOps = props.edm.download || {};
-  const translateFile = getTranslateFile({ api, isChunk });
-  const handleSuccess2 = getHandleSuccess({ downloadOps, file, translateFile, isChunk, state });
+  const translateFile = getTranslateFile({ api, isChunk, isLessThan17G, file, state });
+  const handleSuccess2 = getHandleSuccess({ downloadOps, file, translateFile, isChunk, state, isLessThan17G });
   const calcProgress = getCalcProgress();
   let { isFinished = false } = {};
   if (!isBatch) {
-    let args = { api, downloadOps, file, service, constants, props, state, t, Modal, isChunk };
-    Object.assign(args, { calcProgress, isFinished, emit, handleSuccess: handleSuccess2, range, batchIndex, isBatch });
-    downloadFileSingle(args);
+    const args = {
+      calcProgress,
+      isFinished,
+      handleSuccess: handleSuccess2,
+      range,
+      batchIndex,
+      isBatch,
+      downloadOps,
+      file,
+      isChunk,
+      isLessThan17G
+    };
+    api.downloadFileSingle(args);
     return;
   }
-  const params = { api, downloadOps, file, service, props, state, calcProgress, emit, handleSuccess: handleSuccess2, t, Modal, range };
-  isBatch && downloadFileBatch(params);
+  const params = { downloadOps, file, calcProgress, handleSuccess: handleSuccess2, range };
+  isBatch && api.downloadFileBatch(params);
 };
-const afterDownload = ({ api, state }) => ({ batchIndex, range, data, file, isBatch, isChunk }) => {
+const afterDownload = ({ api, state }) => ({
+  batchIndex,
+  range,
+  data,
+  file,
+  isBatch,
+  isChunk,
+  isLessThan17G
+}) => {
   if (data.status === 200) {
@@ -801,3 +1135,9 @@ const key = file.docId + "-" + batchIndex;
     if (countDownloadReplay && countDownloadReplay >= 2) {
-      const msgArray = ["The number of retry times exceeds the threshold! [docId:", file.docId, ", chunk:", range.index, "]"];
+      const msgArray = [
+        "The number of retry times exceeds the threshold! [docId:",
+        file.docId,
+        ", chunk:",
+        range.index,
+        "]"
+      ];
       log.logger.warn(msgArray.join(""));
@@ -809,49 +1149,74 @@ delete state.downloadReplayAtoms[file.docId + "-" + range.index];
       state.downloadReplayAtoms[file.docId + "-" + range.index] = countDownloadReplay + 1;
-      api.downloadFileInner({ batchIndex, range, file, isBatch, isChunk });
+      api.downloadFileInner({ batchIndex, range, file, isBatch, isChunk, isLessThan17G });
     }
   }
 };
-const setWriterFile = ({ state, emit, props }) => ({ data, index }) => {
-  const fileStream = props.plugin && props.plugin.createWriteStream(state.dowuloadChunkFile.get("docName"), {
-    size: data.byteLength
-  });
-  const writer = fileStream.getWriter();
-  let downloaded = 0;
-  const fileSize = state.dowuloadChunkFile.get("fileSize");
+const setWriterFile = ({ state, emit, Streamsaver }) => ({ data, index, isLessThan17G, file }) => {
+  let { fileStream, writer, fileData = [], downloaded = 0 } = {};
+  const { checkcode } = data.headers;
+  const content = data.headers["content-disposition"];
+  const name = content.match(/fileName.?=(.*)/)[1] || content.match(/fileName=(.*)/)[1];
+  let { chunkNum, fileSize, docName } = state.downloadChunkFile[file.docId];
+  docName = name || docName;
+  if (!isLessThan17G) {
+    fileStream = Streamsaver.createWriteStream(docName, { size: data.byteLength });
+    writer = fileStream.getWriter();
+  }
   const writerStreamSaver = () => {
-    let chunk = state.dowuloadChunkFile.get(index);
+    const downloadChunkFile = state.downloadChunkFile[file.docId] || {};
+    let chunk = downloadChunkFile[index];
     if (chunk) {
-      writer.write(chunk).then(() => {
-        downloaded += chunk.byteLength;
-        state.dowuloadChunkFile.delete(index);
-        if (index + 1 === state.dowuloadChunkFile.get("chunkSize")) {
-          emit("download", 100);
-          writer.close();
+      if (!isLessThan17G) {
+        writer.write(chunk).then(() => {
+          downloaded += chunk.byteLength;
+          downloadChunkFile[index] = null;
+          delete downloadChunkFile[index];
+          if (index + 1 >= chunkNum) {
+            delete state.downloadChunkFile[file.docId];
+            emit("download", 100, "", { fileSize, checkcode });
+            writer.close();
+          } else {
+            const progress = Math.ceil(downloaded / fileSize * 100) || 0;
+            progress !== 100 && emit("download", progress);
+            index++;
+            writerStreamSaver();
+          }
+        });
+      } else {
+        fileData.push(chunk);
+        downloaded += chunk.size;
+        state.downloadChunkFile[file.docId][index] = null;
+        delete state.downloadChunkFile[file.docId][index];
+        if (index + 1 >= chunkNum) {
+          delete state.downloadChunkFile[file.docId];
+          aLinkDownload({ blob: new Blob(fileData), name: docName });
+          emit("download", 100, "", { fileSize, checkcode });
         } else {
           const progress = Math.ceil(downloaded / fileSize * 100) || 0;
-          if (progress !== 100) {
-            emit("download", progress);
-          }
+          progress !== 100 && emit("download", progress);
           index++;
           writerStreamSaver();
         }
-        chunk = null;
-      });
+      }
     } else {
-      setTimeout(() => {
-        writerStreamSaver();
-      }, 1e3);
+      setTimeout(() => writerStreamSaver(), 1e3);
     }
   };
   writerStreamSaver();
+  return (docId) => {
+    const downloadChunkFile = state.downloadChunkFile[docId];
+    Object.keys(downloadChunkFile).forEach((k) => downloadChunkFile[k] = null);
+    delete state.downloadChunkFile[docId];
+    if (isLessThan17G) {
+      fileData = [];
+    } else {
+      writer && writer.close();
+    }
+  };
 };
 const getFormData = ({ constants, props, state }) => ({ formData, file, type }) => {
   if (state.isEdm && props.edm.upload) {
-    const propData = props.data || {};
-    const edmData = props.edm.upload.params || {};
-    const params = __spreadValues(__spreadValues({}, propData), edmData);
+    const params = Object.assign({}, props.data || {}, props.edm.upload.params || {});
     for (let key in params) {
-      if (Object.prototype.hasOwnProperty.call(params, key)) {
-        formData.set(key, params[key] || "");
-      }
+      formData.set(key, params[key] || "");
     }
@@ -903,4 +1268,4 @@ }
       });
-      const fileData = api.getFile(file);
-      state.uploadFiles.splice(state.uploadFiles.indexOf(fileData), 1);
+      const file2 = api.getFile(file2);
+      state.uploadFiles.splice(state.uploadFiles.indexOf(file2), 1);
     }
@@ -940,3 +1305,9 @@ }).catch((err) => {
     if (countReplay && countReplay >= 2) {
-      const msgArray = ["The number of retry times exceeds the threshold! [docId:", file.docId, ", chunk:", file.chunk, "]"];
+      const msgArray = [
+        "The number of retry times exceeds the threshold! [docId:",
+        file.docId,
+        ", chunk:",
+        file.chunk,
+        "]"
+      ];
       log.logger.warn(msgArray.join(""));
@@ -952,12 +1323,2 @@ delete state.replayAtoms[file.docId + "-" + file.chunk];
 };
-const chunkUpload = ({ state, service, postChunk }) => {
-  if (!state.chunkUploadUrl) {
-    service.getChunkUploadUrl().then((data) => {
-      state.chunkUploadUrl = data;
-      postChunk(data);
-    });
-  } else {
-    postChunk(state.chunkUploadUrl);
-  }
-};
 const segmentUploadInner = ({ api, props, service, state, emit, constants, batchIndex, file, progress }) => {
@@ -969,2 +1330,3 @@ const formData = new FormData();
       progress.file.cancelToken.push(source.cancel);
+      const { SUCESS, FAIL } = constants.FILE_STATUS;
       service.request({
@@ -984,5 +1346,3 @@ method: "post",
           event.percentage = progress.file.percentage = percentage > 100 ? 100 : percentage;
-          if (percentage >= 100) {
-            progress.file.isFinished = true;
-          }
+          percentage >= 100 && (progress.file.isFinished = true);
           emit("progress", progress.file, state.uploadFiles, api.calcUploadingFilesInfo());
@@ -992,13 +1352,11 @@ }
         afterUpload({ data, file, batchIndex, state, api, progress });
-        if (progress.file.percentage === 100) {
-          progress.file.status = constants.FILE_STATUS.SUCESS;
-        }
+        progress.file.percentage === 100 && (progress.file.status = SUCESS);
       }).catch((data) => {
-        if (data.response && data.response.status === 401) {
+        if (data.response && state.errorStatusCodes.includes(data.response.status)) {
           const tokenParams = { token: props.edm.upload.token, file, type: "upload" };
-          api.getToken(tokenParams).then((data2) => {
-            afterUpload({ data: data2, file, batchIndex, state, api, progress });
-          });
+          api.getToken(tokenParams).then((data2) => afterUpload({ data: data2, file, batchIndex, state, api, progress }));
         } else {
-          file.state = constants.FILE_STATUS.FAIL;
+          progress.file.status !== FAIL && emit("error", data, progress.file, state.uploadFiles);
+          progress.file.status = FAIL;
+          progress.file.docId = "";
         }
@@ -1008,7 +1366,29 @@ });
   };
-  chunkUpload({ state, service, postChunk });
+  if (!state.chunkUploadUrl) {
+    service.getChunkUploadUrl().then((data) => {
+      state.chunkUploadUrl = data;
+      postChunk(data);
+    });
+  } else {
+    postChunk(state.chunkUploadUrl);
+  }
 };
-const segmentUpload = ({ api, props, service, state, emit, constants }) => (batchIndex, file, progress) => {
+const segmentUpload = ({ api, props, service, state, emit, constants, CryptoJS }) => (batchIndex, file, progress) => {
   if (typeof file.then === "function") {
-    file.then((file2) => {
+    file.then(
+      (file2) => new Promise((resolve) => {
+        if (props.edm.isCheckCode !== true)
+          return resolve(file2);
+        const reader = new FileReader();
+        reader.readAsArrayBuffer(file2);
+        reader.onload = (e) => {
+          if (props.edm.isCheckCode === true) {
+            let wordArray = CryptoJS.lib.WordArray.create(e.target.result);
+            const hash = CryptoJS.SHA256(wordArray).toString();
+            file2.hash = hash;
+          }
+          resolve(file2);
+        };
+      })
+    ).then((file2) => {
       segmentUploadInner({
@@ -1040,3 +1420,8 @@ batchIndex,
 };
-const batchSegmentUpload = ({ api, constants, props, refs, state }) => ({ docId, batchIndex, batches, progress }) => {
+const batchSegmentUpload = ({ api, constants, props, vm, state }) => ({
+  docId,
+  batchIndex,
+  batches,
+  progress
+}) => {
   if (batchIndex < batches.length && progress.file.cancelToken) {
@@ -1067,6 +1452,6 @@ const key = docId + "-" + batchIndex;
     typeof props.edm.upload.closeloading === "function" && props.edm.upload.closeloading();
-    refs[constants.UPLOAD_INNER].upload(state.largeFileInfo[docId]);
+    vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].upload(state.largeFileInfo[docId]);
   }
 };
-const sliceChunk = ({ state, props }) => (file) => {
+const sliceChunk = ({ state }) => (file) => {
   const chunkSize = file.chunkSize;
@@ -1090,18 +1475,3 @@ const chunkBatchArray = [[]];
     atom.percentage = file.percentage;
-    const promise = new Promise((resolve) => {
-      if (props.edm.isCheckCode !== true) {
-        return resolve(atom);
-      }
-      const reader = new FileReader();
-      reader.readAsArrayBuffer(atom);
-      reader.onload = (e) => {
-        if (props.edm.isCheckCode === true) {
-          const cryptoJS = props.edm.upload.plugin();
-          const wordArray = cryptoJS.lib.WordArray.create(e.target.result);
-          const hash = cryptoJS[shaMap.shaMap](wordArray).toString();
-          atom.hash = hash;
-        }
-        resolve(atom);
-      };
-    });
+    const promise = Promise.resolve(atom);
     const lastIndex = chunkBatchArray.length - 1;
@@ -1119,3 +1489,9 @@ if (chunkBatchArray[lastIndex].length < state.chunkBatchLimit) {
 };
-const getToken = ({ constants, props, state, t, Modal }) => ({ token, file, isOnlinePreview = false, type = "", isinit = false }) => {
+const getToken = ({ constants, props, state, t, Modal }) => ({
+  token,
+  file,
+  isOnlinePreview = false,
+  type = "",
+  isinit = false
+}) => {
   if (props.edm.isExtranet && !isOnlinePreview) {
@@ -1150,3 +1526,3 @@ state.isSuccess = true;
         state.isSuccess = true;
-        state.accept = type === "download" || type === "preview" ? props.accept : `${whitelist},${props.accept}`;
+        state.accept = type === "download" || type === "preview" ? props.accept : `${whitelist}${props.accept ? `,${props.accept}` : ""}`;
         state.headers[constants.EDM.EDMTOKEN] = result.edmToken || "";
@@ -1165,9 +1541,28 @@ state.headers[constants.EDM.TRACEID] = result.traceId || "";
 };
-const getTokenResolver = ({ reject, api, file, state, resolve, props, constants, service }) => (data) => {
-  if (!data) {
-    const message = "[TINY Error][FileUpload] No edm token";
-    reject(new Error(message));
-    return;
-  }
+const previewFile = ({ api, props }) => (file, open = false) => {
+  return new Promise((resolve, reject) => {
+    try {
+      const tokenParams = { isOnlinePreview: true, file, type: "preview", token: props.edm.preview.token };
+      api.getToken(tokenParams).then((data) => {
+        if (!data) {
+          const message = "[TINY Error][FileUpload] No edm token";
+          reject(new Error(message));
+          return;
+        }
+        if (isObject(file) || Array.isArray(file) && file.length === 1) {
+          api.previewFileSingle({ file: Array.isArray(file) ? __spreadValues({}, file[0]) : file, resolve, open });
+        } else if (Array.isArray(file) && file.length > 1) {
+          api.previewFileBatch({ file, resolve, open });
+        }
+      }).catch((e) => reject(new Error(e)));
+    } catch (e) {
+      reject(new Error(e));
+    }
+  });
+};
+const getNewTabPreviewUrl = ({ api }) => (file) => api.previewFile(file, true);
+const previewFileSingle = ({ api, state, props, constants, service }) => ({ file, resolve, open }) => {
   const iframeUrl = api.getPreviewUrlSync(file);
+  if (open)
+    return resolve(iframeUrl);
   if (iframeUrl) {
@@ -1206,97 +1601,134 @@ state.showPreview = true;
 };
-const previewFile = ({ api, constants, props, service, state }) => (file) => new Promise((resolve, reject) => {
-  try {
-    const tokenParams = { isOnlinePreview: true, file, type: "preview", token: props.edm.preview.token };
-    const tokenCatcher = (e) => {
-      reject(new Error(e));
-    };
-    const tokenResolver = getTokenResolver({ reject, api, file, state, resolve, props, constants, service });
-    api.getToken(tokenParams).then(tokenResolver).catch(tokenCatcher);
-  } catch (e) {
-    reject(new Error(e));
-  }
-});
-const getNewTabPreviewUrl = ({ api, props }) => (file) => new Promise((resolve, reject) => {
-  api.getToken({
-    token: props.edm.preview.token,
-    file,
-    isOnlinePreview: true,
-    type: "preview"
-  }).then((data) => {
-    if (!data) {
-      reject(new Error("[TINY Error][FileUpload] No edm token"));
-      return;
-    }
-    const iframeUrl = api.getPreviewUrlSync(file);
-    if (!iframeUrl) {
-      reject(new Error(new Error("[TINY Error][FileUpload] No preview url")));
-    } else {
-      resolve(iframeUrl);
-    }
-  }).catch((e) => {
-    reject(new Error(e));
+const previewFileBatch = ({ service, props, state, api }) => ({ file, resolve, open }) => {
+  service.getPreviewUrlBatch().then((url) => {
+    const edm = props.edm || {};
+    const preview = edm.preview || {};
+    const online = preview.online || {};
+    const { jslibhtml, baseurl } = online;
+    const { text } = preview.watermark || {};
+    service.request({
+      method: "post",
+      url: xss.filterUrl(url),
+      withCredentials: props.withCredentials,
+      headers: state.headers,
+      data: {
+        documents: file,
+        asposeClient: jslibhtml,
+        asposeService: baseurl,
+        watermark: text
+      }
+    }).then(({ data }) => {
+      const iframeUrl = api.getPreviewUrlSync({ generate: data.result.generate, size: file.length }, true);
+      if (open)
+        return resolve(iframeUrl);
+      if (iframeUrl) {
+        state.showPreview = true;
+        state.iframeUrl = iframeUrl;
+        resolve(state.iframeUrl);
+      }
+    });
   });
-});
-const getPreviewUrlSync = ({ constants, props, state }) => (file) => {
+};
+const getPreviewUrlSync = ({ constants, props, state }) => (file, batch) => {
+  const { ASPOSE, WPS } = constants.EDM.FILE_PREVIEW_TYPE;
   const edm = props.edm || {};
   const preview = edm.preview || {};
-  const online = preview.online;
-  if (!online) {
-    return;
+  const { watermark, online, bar = {}, lang } = preview;
+  const { filePreviewType = ASPOSE, http = false, jslibhtml, appid, baseurl } = online;
+  const { styles } = bar;
+  bar.styles = JSON.stringify(styles);
+  let html;
+  if (filePreviewType === WPS) {
+    html = `${http ? "http:" : "https:"}${baseurl.replace(/\/$/, "")}/edm/projects/${appid}/web/preview`;
+  } else {
+    html = jslibhtml.split("?").shift();
   }
-  const html = online.jslibhtml.split("?").shift();
-  if (!html) {
-    return;
+  const params = [];
+  let paramsData;
+  const edmToken = state.headers[constants.EDM.EDMTOKEN];
+  if (batch) {
+    html = html = `${baseurl.replace(/\/$/, "")}/edm/projects/${appid}/web/batchPreview`;
+    const { generate, size } = file;
+    paramsData = { generate, "EDM-Authorization": edmToken, docIndex: 1, size };
+  } else {
+    paramsData = Object.assign(
+      {},
+      online,
+      watermark,
+      filePreviewType === WPS ? { "EDM-Authorization": edmToken } : { authToken: edmToken },
+      {
+        jslibhtml: html,
+        docId: file.docId,
+        docVersion: file.docVersion || file.version || "V1",
+        type: "doc",
+        pageNum: "1",
+        lang,
+        bar: window.btoa(JSON.stringify(bar))
+      }
+    );
   }
-  const watermark = preview.watermark || {};
-  const paramsData = __spreadValues(__spreadValues(__spreadValues({}, online), watermark), {
-    jslibhtml: html,
-    authToken: state.headers[constants.EDM.EDMTOKEN],
-    docId: file.docId,
-    docVersion: file.docVersion || file.version || "V1",
-    type: "doc",
-    pageNum: "1"
-  });
-  const params = [];
   for (let key in paramsData) {
-    if (Object.prototype.hasOwnProperty.call(paramsData, key)) {
-      params.push(`${key}=${paramsData[key]}`);
+    const val = paramsData[key];
+    if (!isObject(val)) {
+      if (key === "text") {
+        params.push(`watermark=${encodeURIComponent(val)}`);
+      }
+      params.push(`${key}=${val}`);
     }
   }
-  const iframeUrl = html + "?" + params.join("&");
-  return iframeUrl;
+  return html + "?" + params.join("&");
 };
-const previewImage = ({ api, props, service, state }) => (file) => new Promise((resolve, reject) => {
-  try {
-    api.getToken({
-      token: props.edm.preview.token,
-      file,
-      type: "preview"
-    }).then((data) => {
-      if (!data) {
-        reject(new Error("[TINY Error][FileUpload] No edm token"));
-        return;
-      }
-      service.getPreviewUrl().then((url) => {
-        const imgParam = Object.assign(file, {
-          type: "image",
-          imageType: "image"
+const previewImage = ({ api, props, service }) => (file) => {
+  return new Promise((resolve, reject) => {
+    try {
+      api.getToken({
+        token: props.edm.preview.token,
+        file,
+        type: "preview"
+      }).then((data) => {
+        if (!data) {
+          reject(new Error("[TINY Error][FileUpload] No edm token"));
+          return;
+        }
+        service.getPreviewUrl().then((url) => {
+          if (isObject(file) || Array.isArray(file) && file.length === 1) {
+            api.previewImageSingle({ url, file: Array.isArray(file) ? __spreadValues({}, file[0]) : file }).then((link) => resolve(link));
+          } else if (Array.isArray(file) && file.length > 1) {
+            api.previewImageBatch({ url, file }).then((links) => resolve(links));
+          }
         });
-        url = url.replace(/{docId}/, file.docId);
-        service.post(xss.filterUrl(url), imgParam, {
-          withCredentials: props.withCredentials,
-          headers: Object.assign(props.headers, state.headers),
-          responseType: "blob"
-        }).then((data2) => {
-          const blob = new Blob([data2.data]);
-          const URL2 = window.URL || window.webkitURL;
-          const link = URL2.createObjectURL(blob);
-          resolve(link);
-        });
       });
-    });
-  } catch (e) {
-    reject(new Error(e));
-  }
-});
+    } catch (e) {
+      reject(new Error(e));
+    }
+  });
+};
+const previewImageSingle = ({ service, state, props }) => ({ file, url }) => {
+  const edm = props.edm || {};
+  const preview = edm.preview || {};
+  let { text, textStyle } = preview.watermark || {};
+  textStyle = __spreadValues({ tile: true }, textStyle);
+  const imgParam = Object.assign(file, {
+    type: "image",
+    imageType: "image",
+    watermark: text,
+    textStyle
+  });
+  return service.post(xss.filterUrl(url.replace(/{docId}/, file.docId)), imgParam, {
+    withCredentials: props.withCredentials,
+    headers: Object.assign(props.headers, state.headers),
+    responseType: "blob"
+  }).then((data) => {
+    const blob = new Blob([data.data]);
+    const URL2 = window.URL || window.webkitURL;
+    return URL2.createObjectURL(blob);
+  });
+};
+const previewImageBatch = ({ service, api }) => ({ url, file }) => {
+  const promises = [];
+  file.forEach((f) => {
+    promises.push(api.previewImageSingle({ url, file: f }));
+  });
+  return service.all(promises);
+};
 const getDialogConfigObj = ({ props, state }) => () => {
@@ -1335,18 +1767,17 @@ const dialogConfigDefault = {
 };
-const computeDocChunkSize = ({ props, state, SIZE_2G, SIZE_20M, SIZE_8M }) => () => {
+const computeDocChunkSize = ({ props, state, constants }) => () => {
   const isDefaultChunkSize = !(props.edm && props.edm.chunkSize);
+  const { SIZE_0M, SIZE_2M, SIZE_4M, SIZE_8M, SIZE_16M, SIZE_20M, SIZE_32M, SIZE_64M, SIZE_2G } = constants.EDM;
   let { docSize = SIZE_20M, chunkSize = SIZE_8M } = props.edm || {};
   docSize = docSize < 0 ? 0 : docSize;
   docSize = docSize > SIZE_2G ? SIZE_2G : docSize;
-  if (docSize) {
+  if (docSize)
     chunkSize = chunkSize < 0 ? 0 : chunkSize;
-  }
   if (!isDefaultChunkSize) {
-    const chunkSizes = [64 * 1024, 32 * 1024, 16 * 1024, 8 * 1024, 4 * 1024, 2 * 1024, 0 * 1024];
+    const chunkSizes = [SIZE_64M, SIZE_32M, SIZE_16M, SIZE_8M, SIZE_4M, SIZE_2M, SIZE_0M];
     chunkSizes.some((size) => {
       if (chunkSize >= size) {
-        chunkSize = Math.max(size, 2 * 1024);
+        chunkSize = Math.max(size, SIZE_2M);
         return true;
       }
-      return false;
     });
@@ -1357,5 +1788,14 @@ }
 };
-const updateFile = ({ constants, refs }) => (file) => {
-  refs[constants.UPLOAD_INNER].handleUpdate(file);
+const updateFile = ({ constants, vm }) => (file) => {
+  vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].handleUpdate(file);
 };
+const handleChange = ({ vm, constants }) => (file) => {
+  if (typeof file === "object" && file !== null && file !== void 0) {
+    let files = file;
+    if (!Array.isArray(file)) {
+      files = [file];
+    }
+    vm.$refs[constants.UPLOAD_INNER].$refs[constants.UPLOAD_INNER_TEMPLATE].handleChange({ target: { files } });
+  }
+};
 const onBeforeDestroy = (state) => () => {
@@ -1368,4 +1808,12 @@ state.uploadFiles.forEach((file) => {
 };
+const handleClickFileList = ({ state, emit }) => (file) => {
+  state.selected = file;
+  emit("click-file-list", file);
+};
+const mounted = ({ vm, state }) => () => {
+  vm.$on("drag-over", (isDragover) => state.isDragover = isDragover);
+};
 export {
   abort,
+  abortDownload,
   addFileToList,
@@ -1382,13 +1830,22 @@ afterDownload,
   computedUploadingSize,
+  createDownloadCancelToken,
   downloadFile,
+  downloadFileBatch,
   downloadFileInner,
+  downloadFileSingle,
+  downloadFileSingleHwh5,
+  downloadFileSingleInner,
   getDialogConfigObj,
   getDownloadFileInfo,
   getFile,
+  getFileHash,
   getFileUploadUrl,
   getFormData,
+  getKiaScanTip,
   getNewTabPreviewUrl,
   getPreviewUrlSync,
   getToken,
+  handleChange,
   handleClick,
+  handleClickFileList,
   handleError,
@@ -1402,5 +1859,11 @@ handleProgress,
   largeDocumentUpload,
+  modifyServiceUrlSingle,
+  mounted,
   onBeforeDestroy,
   previewFile,
+  previewFileBatch,
+  previewFileSingle,
   previewImage,
+  previewImageBatch,
+  previewImageSingle,
   properFileSize,
@@ -1416,4 +1879,5 @@ segmentUpload,
   updateUrl,
+  validateDownloadStatus,
   watchFileList,
   watchListType
 };

file-upload/vue.js

 import "../chunk-PKUHTIDK.js";
-import { downloadFile as ordinaryDownload } from "@opentiny/vue-renderless/upload-list";
+import { downloadFile as ordinaryDownload } from "../upload-list";
 import {
@@ -9,2 +9,3 @@ initService,
   downloadFile,
+  downloadFileSingleInner,
   batchSegmentUpload,
@@ -50,5 +51,21 @@ segmentUpload,
   setWriterFile,
-  afterDownload
+  afterDownload,
+  getFileHash,
+  modifyServiceUrlSingle,
+  getKiaScanTip,
+  downloadFileSingle,
+  downloadFileBatch,
+  downloadFileSingleHwh5,
+  validateDownloadStatus,
+  mounted,
+  handleChange,
+  previewFileSingle,
+  previewFileBatch,
+  previewImageSingle,
+  previewImageBatch,
+  abortDownload,
+  createDownloadCancelToken,
+  handleClickFileList
 } from "./index";
-import { isEmptyObject } from "@opentiny/vue-renderless/common/type";
+import { isEmptyObject } from "../common/type";
 const api = [
@@ -72,5 +89,8 @@ "state",
   "previewImage",
-  "updateFile"
+  "updateFile",
+  "handleChange",
+  "abortDownload",
+  "handleClickFileList"
 ];
-const initState = ({ api: api2, reactive, computed, inject, ref, vm, props, httpRequest }) => {
+const initState = ({ api: api2, reactive, computed, inject, ref, vm, props, httpRequest, service }) => {
   const state = reactive({
@@ -88,3 +108,3 @@ url: "",
     chunkSize: 0,
-    chunkBatchLimit: 20,
+    chunkBatchLimit: 5,
     downloadChunkLimit: 5,
@@ -117,9 +137,19 @@ batchQueue: {},
     downloadBatchQueueListen: {},
-    dowuloadChunkFile: /* @__PURE__ */ new Map(),
-    downloadReplayAtoms: {}
+    downloadChunkFile: {},
+    downloadReplayAtoms: {},
+    errorStatusCodes: [0, 401, 429],
+    // 0：上传异常 401：没权限（token过期）429：超限
+    hasFileInfoInterface: computed(() => service.setting.services.EDM && service.setting.services.EDM.DocumentInfoUrl),
+    currentDownloadFile: "",
+    isDragover: false,
+    downloadCancelToken: {},
+    // 取消下载token
+    downloadCancelData: {},
+    // 取消下载时需要清空的缓存数据
+    isHwh5: computed(() => !isEmptyObject(props.hwh5)),
+    selected: null
   });
   return state;
 };
-const initApi = ({ api: api2, state, props, constants, refs, $service, t, Modal }) => {
-  const { SIZE_2G, SIZE_20M, SIZE_8M } = constants.EDM;
+const initApi = ({ api: api2, state, props, constants, vm, $service, t, Modal }) => {
   Object.assign(api2, {
@@ -129,35 +159,43 @@ state,
     getFormData: getFormData({ constants, props, state }),
-    abort: abort({ constants, refs }),
-    handleClick: handleClick({ constants, refs }),
+    abort: abort({ constants, vm, state }),
+    handleClick: handleClick({ constants, vm }),
     getFile: getFile(state),
     clearFiles: clearFiles(state),
-    watchFileList: watchFileList({ constants, state }),
+    watchFileList: watchFileList({ constants, state, props }),
     watchListType: watchListType({ constants, state }),
     onBeforeDestroy: onBeforeDestroy(state),
     computedUploadDisabled: computedUploadDisabled({ props, state }),
-    computedUploadingSize: computedUploadingSize(state),
+    computedUploadingSize: computedUploadingSize({ state, constants }),
     getFileUploadUrl: getFileUploadUrl($service),
     getToken: getToken({ constants, props, state, t, Modal }),
     getDialogConfigObj: getDialogConfigObj({ props, state }),
-    computeDocChunkSize: computeDocChunkSize({ props, state, SIZE_2G, SIZE_20M, SIZE_8M }),
-    updateFile: updateFile({ constants, refs }),
+    computeDocChunkSize: computeDocChunkSize({ props, state, constants }),
+    updateFile: updateFile({ constants, vm }),
     getPreviewUrlSync: getPreviewUrlSync({ constants, props, state }),
     ordinaryDownload: ordinaryDownload($service),
     clearUploadingFiles: clearUploadingFiles({ constants, state }),
-    calcUploadingFilesInfo: calcUploadingFilesInfo({ state }),
-    properFileSize: properFileSize({ props, state, constants, Modal, t })
+    calcUploadingFilesInfo: calcUploadingFilesInfo({ state, constants }),
+    properFileSize: properFileSize({ props, state, constants, Modal, t }),
+    mounted: mounted({ vm, state }),
+    previewFileSingle: previewFileSingle({ api: api2, state, props, constants, service: $service }),
+    previewFileBatch: previewFileBatch({ service: $service, props, state, api: api2 }),
+    previewImageSingle: previewImageSingle({ state, props, service: $service }),
+    previewImageBatch: previewImageBatch({ service: $service, api: api2 }),
+    abortDownload: abortDownload({ state }),
+    createDownloadCancelToken: createDownloadCancelToken({ state, service: $service })
   });
 };
-const mergeApi = ({ api: api2, props, $service, state, constants, emit, mode, Modal, t, refs }) => {
+const mergeApi = ({ api: api2, props, $service, state, constants, emit, mode, Modal, t, vm, CryptoJS, Streamsaver }) => {
   Object.assign(api2, {
     segmentUploadInit: segmentUploadInit({ api: api2, props, service: $service, state, constants }),
-    segmentUpload: segmentUpload({ api: api2, props, service: $service, state, emit, constants }),
+    segmentUpload: segmentUpload({ api: api2, props, service: $service, state, emit, constants, CryptoJS }),
     addFileToList: addFileToList({ api: api2, constants, emit, props, state, mode }),
-    downloadFile: downloadFile({ api: api2, state, props }),
-    previewImage: previewImage({ api: api2, props, service: $service, state }),
-    previewFile: previewFile({ api: api2, constants, Modal, props, service: $service, state, t }),
-    getNewTabPreviewUrl: getNewTabPreviewUrl({ api: api2, props }),
-    submit: submit({ api: api2, constants, Modal, refs, props, state, t }),
-    handleStart: handleStart({ api: api2, constants, props, state, refs }),
-    batchSegmentUpload: batchSegmentUpload({ api: api2, constants, props, refs, state }),
+    downloadFile: downloadFile({ api: api2, state }),
+    downloadFileSingleInner: downloadFileSingleInner({ props, state, api: api2, constants }),
+    previewImage: previewImage({ api: api2, props, service: $service }),
+    previewFile: previewFile({ api: api2, props }),
+    getNewTabPreviewUrl: getNewTabPreviewUrl({ api: api2 }),
+    submit: submit({ api: api2, constants, Modal, vm, props, state, t }),
+    handleStart: handleStart({ api: api2, constants, props, state, vm }),
+    batchSegmentUpload: batchSegmentUpload({ api: api2, constants, props, vm, state }),
     largeDocumentUpload: largeDocumentUpload({ api: api2, Modal, state, emit, constants, t }),
@@ -167,5 +205,5 @@ handleProgress: handleProgress({ api: api2, constants, emit, state }),
     handleError: handleError({ api: api2, constants, emit, state }),
-    handleRemove: handleRemove({ api: api2, emit, props, state }),
+    handleRemove: handleRemove({ api: api2, emit, props, state, constants }),
     updateUrl: updateUrl({ api: api2, props, service: $service, state }),
-    startUpload: startUpload({ api: api2, state, constants, refs, Modal, t }),
+    startUpload: startUpload({ api: api2, state, constants, vm, Modal, t }),
     beforeUpload: beforeUpload({ api: api2, props, Modal, constants, t, state }),
@@ -176,5 +214,14 @@ getDownloadFileInfo: getDownloadFileInfo({ api: api2, props, state, service: $service }),
     batchSegmentDownload: batchSegmentDownload({ state, api: api2 }),
-    downloadFileInner: downloadFileInner({ api: api2, props, service: $service, state, emit, constants, t, Modal }),
-    setWriterFile: setWriterFile({ state, emit, props }),
-    afterDownload: afterDownload({ api: api2, state })
+    downloadFileInner: downloadFileInner({ api: api2, props, state }),
+    setWriterFile: setWriterFile({ state, emit, Streamsaver }),
+    afterDownload: afterDownload({ api: api2, state }),
+    getFileHash: getFileHash({ emit, Modal, constants, t, CryptoJS, state }),
+    modifyServiceUrlSingle: modifyServiceUrlSingle({ constants }),
+    getKiaScanTip: getKiaScanTip({ Modal, constants, t }),
+    downloadFileSingle: downloadFileSingle({ service: $service, constants, props, state, api: api2, emit }),
+    downloadFileBatch: downloadFileBatch({ api: api2, service: $service, props, state, emit }),
+    downloadFileSingleHwh5: downloadFileSingleHwh5({ state, props, emit, constants }),
+    validateDownloadStatus: validateDownloadStatus({ state, Modal }),
+    handleChange: handleChange({ vm, constants }),
+    handleClickFileList: handleClickFileList({ state, emit })
   });
@@ -210,10 +257,13 @@ };
 };
-const renderless = (props, { computed, inject, onBeforeUnmount, provide, reactive, ref, watch }, { t, vm, refs, parent, emit, service, mode, constants }, { Modal }) => {
+let getApi = () => ({});
+const renderless = (props, { computed, inject, onBeforeUnmount, provide, reactive, ref, watch, onMounted }, { t, vm, parent, emit, service, mode, constants }, { Modal, CryptoJS, Streamsaver }) => {
   const api2 = {};
   const $service = initService({ props, service });
   const httpRequest = $service.httpRequest;
-  const state = initState({ reactive, computed, api: api2, inject, ref, vm, props, httpRequest });
-  initApi({ api: api2, state, props, constants, refs, $service, t, Modal });
-  mergeApi({ api: api2, props, $service, state, constants, emit, mode, Modal, t, refs });
+  const state = initState({ reactive, computed, api: api2, inject, ref, vm, props, httpRequest, service });
+  initApi({ api: api2, state, props, constants, vm, $service, t, Modal });
+  mergeApi({ api: api2, props, $service, state, constants, emit, mode, Modal, t, vm, CryptoJS, Streamsaver });
+  getApi = () => api2;
   provide("uploader", parent);
+  onMounted(api2.mounted);
   onBeforeUnmount(api2.onBeforeDestroy);
@@ -225,3 +275,4 @@ initWatch({ watch, state, api: api2, props, $service });
   api,
+  getApi,
   renderless
 };

floatbar/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { xss } from "../common/xss.js";
 const computeData = ({ props }) => {
@@ -4,0 +4,0 @@ if (Array.isArray(props.data) && props.data.length) {

form-item/index.js

 import "../chunk-PKUHTIDK.js";
-import { POSITION, VALIDATE_STATE } from "@opentiny/vue-renderless/common";
-import { merge } from "@opentiny/vue-renderless/common/object";
-import Validator from "@opentiny/vue-renderless/common/validate";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
+import { POSITION, VALIDATE_STATE } from "../common";
+import { omitText } from "../common/string";
+import { merge } from "../common/object";
+import Validator from "../common/validate";
+import { isNull } from "../common/type";
+import debounce from "../common/deps/debounce";
 const watchError = (state) => (value) => {
@@ -67,3 +68,3 @@ if (!isNull(value) && state.getValidateType === "tip") {
   const { FORM_NAME, FORM_ITEM_NAME } = constants;
-  let parent = instance.$parent;
+  let parent = instance.$parent.$parent;
   let parentName = parent.$options.componentName;
@@ -295,4 +296,40 @@ while (parentName !== FORM_NAME) {
 };
+const handleMouseenter = ({ state }) => (e) => {
+  if (!state.isDisplayOnly || !state.typeName || !state.form)
+    return;
+  const dom = e.target;
+  const text = dom.textContent;
+  const font = window.getComputedStyle(dom).font;
+  const rect = dom.getBoundingClientRect();
+  let res = {};
+  let overHeight = false;
+  if (["text", "password", "number"].includes(state.typeName)) {
+    res = omitText(text, font, rect.width);
+  }
+  if (state.typeName === "textarea" && dom && dom.scrollHeight > dom.offsetHeight) {
+    overHeight = true;
+  }
+  if (res.o || overHeight) {
+    state.form.showTooltip(dom, state.displayedValue);
+  }
+};
+const handleMouseleave = (state) => () => {
+  state.form && state.form.hideTooltip();
+};
+const getDisplayedValue = ({ state }) => (param) => {
+  if (!state.formInstance.displayOnly)
+    return;
+  const valueSplit = state.formInstance.valueSplit || "; ";
+  state.typeName = param.type;
+  state.isBasicComp = true;
+  state.displayedValue = state.displayedValue + (state.displayedValue && param.val ? valueSplit : "") + param.val;
+};
+const clearDisplayedValue = ({ state }) => () => {
+  state.typeName = "";
+  state.isBasicComp = false;
+  state.displayedValue = "";
+};
 export {
   addValidateEvents,
+  clearDisplayedValue,
   clearValidate,
@@ -306,2 +343,3 @@ computedContentStyle,
   computedValueStyle,
+  getDisplayedValue,
   getFilteredRule,
@@ -311,2 +349,4 @@ getPropByPath,
   getValueByPath,
+  handleMouseenter,
+  handleMouseleave,
   mounted,
@@ -313,0 +353,0 @@ onFieldBlur,

form-item/vue.js

@@ -25,3 +25,7 @@ import "../chunk-PKUHTIDK.js";
   updateTip,
-  wrapValidate
+  wrapValidate,
+  getDisplayedValue,
+  clearDisplayedValue,
+  handleMouseenter,
+  handleMouseleave
 } from "./index";
@@ -40,3 +44,6 @@ const api = [
   "removeValidateEvents",
-  "updateTip"
+  "updateTip",
+  "getDisplayedValue",
+  "handleMouseenter",
+  "handleMouseleave"
 ];
@@ -57,3 +64,8 @@ const initState = ({ reactive, computed, api: api2, mode, inject, props }) => {
     validationRequired: false,
+    validateType: "text",
     tooltip: null,
+    displayedValue: "",
+    isBasicComp: false,
+    showTooltip: false,
+    typeName: "",
     formInstance: inject("form", null),
@@ -67,4 +79,12 @@ labelFor: computed(() => props.for || props.prop),
     isRequired: computed(() => api2.computedIsRequired()),
+    formInline: computed(() => state.formInstance.inline),
     formSize: computed(() => state.formInstance.size),
     formItemSize: computed(() => props.size || state.formSize),
+    isDisplayOnly: computed(() => state.formInstance.displayOnly),
+    labelPosition: computed(() => state.formInstance.labelPosition),
+    hideRequiredAsterisk: computed(() => state.formInstance.hideRequiredAsterisk),
+    labelSuffix: computed(() => state.formInstance.labelSuffix),
+    labelWidth: computed(() => state.formInstance.labelWidth),
+    showMessage: computed(() => state.formInstance.showMessage),
+    inlineMessage: computed(() => state.formInstance.inlineMessage),
     sizeClass: computed(() => state.formItemSize),
@@ -101,3 +121,7 @@ getValidateType: computed(() => api2.computedGetValidateType())
     addValidateEvents: addValidateEvents({ api: api2, instance, props, state }),
-    validate: wrapValidate({ validateFunc: validate({ api: api2, props, state, t }), props })
+    validate: wrapValidate({ validateFunc: validate({ api: api2, props, state, t }), props }),
+    getDisplayedValue: getDisplayedValue({ state }),
+    clearDisplayedValue: clearDisplayedValue({ state }),
+    handleMouseenter: handleMouseenter({ state }),
+    handleMouseleave: handleMouseleave(state)
   });
@@ -104,0 +128,0 @@ };

form/index.js

 import "../chunk-PKUHTIDK.js";
-import { merge } from "@opentiny/vue-renderless/common/object";
+import { merge } from "../common/object";
 const watchRules = ({ api, props, state }) => (newRules = {}, oldRules = {}) => {
@@ -134,2 +134,14 @@ const newValidFields = Object.keys(newRules);
 };
+const showTooltip = ({ vm, state }) => (dom, val) => {
+  const tooltip = vm.$refs.tooltip;
+  tooltip.state.referenceElm = dom;
+  tooltip.state.popperElm && (tooltip.state.popperElm.style.display = "none");
+  tooltip.doDestroy();
+  state.tooltipVisible = true;
+  state.displayedValue = val;
+  setTimeout(tooltip.updatePopper, 20);
+};
+const hideTooltip = ({ state }) => () => {
+  state.tooltipVisible = false;
+};
 export {
@@ -142,4 +154,6 @@ bindDialogEvent,
   getLabelWidthIndex,
+  hideTooltip,
   registerLabelWidth,
   resetFields,
+  showTooltip,
   updateTip,
@@ -146,0 +160,0 @@ validate,

form/vue.js

@@ -14,3 +14,5 @@ import "../chunk-PKUHTIDK.js";
   updateTip,
-  bindDialogEvent
+  bindDialogEvent,
+  showTooltip,
+  hideTooltip
 } from "./index";
@@ -26,5 +28,7 @@ const api = [
   "deregisterLabelWidth",
-  "updateTip"
+  "updateTip",
+  "showTooltip",
+  "hideTooltip"
 ];
-const renderless = (props, { computed, inject, provide, reactive, watch }, { parent }) => {
+const renderless = (props, { computed, inject, provide, reactive, watch }, { vm, parent }) => {
   const api2 = {};
@@ -63,3 +67,5 @@ const dialog = inject("dialog", null);
     deregisterLabelWidth: deregisterLabelWidth({ api: api2, state }),
-    watchRules: watchRules({ api: api2, props, state })
+    watchRules: watchRules({ api: api2, props, state }),
+    showTooltip: showTooltip({ vm, state }),
+    hideTooltip: hideTooltip({ state })
   });
@@ -66,0 +72,0 @@ api2.created();

fullscreen/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const toggle = ({ state, api }) => (value) => {
@@ -4,0 +4,0 @@ if (value === void 0) {

fullscreen/vue.js

 import "../chunk-PKUHTIDK.js";
-import sf from "@opentiny/vue-renderless/common/deps/fullscreen/screenfull";
+import sf from "../common/deps/fullscreen/screenfull";
 import { exit, enter, toggle, request, getState, shadeClick, keypressCallback, fullScreenCallback, onChangeFullscreen, computeWrapperStyle } from "./index";
@@ -4,0 +4,0 @@ const api = ["state", "exit", "enter", "toggle", "request", "getState", "shadeClick", "keypressCallback", "fullScreenCallback", "onChangeFullscreen"];

grid/plugins/export.js

 import {
   __spreadValues
 } from "../../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
-import browser from "@opentiny/vue-renderless/common/browser";
+import { xss } from "../../common/xss.js";
+import browser from "../../common/browser";
 import { toTreeArray } from "../static";
@@ -7,0 +7,0 @@ import { getCellValue, getFuncText } from "../utils";

grid/plugins/exportExcel.js

 import "../../chunk-PKUHTIDK.js";
-import { extend } from "@opentiny/vue-renderless/common/object";
-import browser from "@opentiny/vue-renderless/common/browser";
+import { extend } from "../../common/object";
+import browser from "../../common/browser";
 const isIE = browser.name === "ie";
@@ -5,0 +5,0 @@ const rgbRegExp = /^rgba?\((\d+),\s(\d+),\s(\d+)([\s\S]*)\)$/;

grid/plugins/resize.js

 import "../../chunk-PKUHTIDK.js";
-import browser from "@opentiny/vue-renderless/common/browser";
+import browser from "../../common/browser";
 import { remove } from "../static";
@@ -4,0 +4,0 @@ let resizeTimeout;

grid/static/base/helperEqualCompare.js

 import "../../../chunk-PKUHTIDK.js";
-import { isDate, isRegExp } from "@opentiny/vue-renderless/common/type";
+import { isDate, isRegExp } from "../../../common/type";
 import isNumber from "./isNumber";
@@ -4,0 +4,0 @@ import isString from "./isString";

grid/static/base/isPlainObject.js

 import "../../../chunk-PKUHTIDK.js";
-import { isPlainObject } from "@opentiny/vue-renderless/common/type";
+import { isPlainObject } from "../../../common/type";
 var isPlainObject_default = isPlainObject;
@@ -4,0 +4,0 @@ export {

grid/utils/common.js

 import "../../chunk-PKUHTIDK.js";
-import { extend } from "@opentiny/vue-renderless/common/object";
-import { isNull } from "@opentiny/vue-renderless/common/type";
-import { find } from "@opentiny/vue-renderless/common/array";
+import { extend } from "../../common/object";
+import { isNull } from "../../common/type";
+import { find } from "../../common/array";
 import { get, isFunction, set, findTree } from "../static";
@@ -6,0 +6,0 @@ const gridSize = ["medium", "small", "mini"];

grid/utils/dom.js

 import "../../chunk-PKUHTIDK.js";
 import { getRowid } from "./common";
-import { hasClass } from "@opentiny/vue-renderless/common/deps/dom";
+import { hasClass } from "../../common/deps/dom";
 import { arrayIndexOf } from "../static";
@@ -69,3 +69,3 @@ const ATTR_NAME = "data-rowid";
     if (isLeftArrow && fixedDom) {
-      const div = fixedDom.querySelector("td.fixed__hidden");
+      const div = fixedDom.querySelector("td.fixed__column");
       const division = div ? div.getBoundingClientRect().left : fixedDom.getBoundingClientRect().right;
@@ -75,3 +75,3 @@ division > left && (offset = left - division);
     if (isRightArrow && fixedDom) {
-      const div = fixedDom.querySelector("td:not(.fixed__hidden)") || fixedDom;
+      const div = fixedDom.querySelector("td:not(.fixed__column)") || fixedDom;
       const division = div.getBoundingClientRect().left;
@@ -78,0 +78,0 @@ division < right && (offset = right - division);

grid/utils/event.js

 import "../../chunk-PKUHTIDK.js";
-import browser from "@opentiny/vue-renderless/common/browser";
+import browser from "../../common/browser";
 import { remove } from "../static";
-import { on } from "@opentiny/vue-renderless/common/deps/dom";
+import { on } from "../../common/deps/dom";
 const wheelName = browser.isDoc && /Firefox/i.test(navigator.userAgent) ? "DOMMouseScroll" : "mousewheel";
@@ -6,0 +6,0 @@ const eventStore = [];

hrapprover/index.js

 import "../chunk-PKUHTIDK.js";
-import { extend } from "@opentiny/vue-renderless/common/object";
+import { extend } from "../common/object";
 const getHrList = ({ api, props, state }) => (deptCode) => {
@@ -4,0 +4,0 @@ state.loading = true;

image-viewer/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
+import { on, off } from "../common/deps/dom";
+import { KEY_CODE } from "../common";
+import PopupManager from "../common/deps/popup-manager";
 const isFirefox = () => !!window.navigator.userAgent.match(/firefox/i);
@@ -8,0 +8,0 @@ const mousewheelEventName = isFirefox() ? "DOMMouseScroll" : "mousewheel";

image-viewer/vue.js

@@ -50,5 +50,15 @@ import "../chunk-PKUHTIDK.js";
 ];
-const initState = ({ reactive, computed, api: api2, mode, props, constants }) => {
+const initState = ({ reactive, computed, api: api2, mode, props, constants, inject }) => {
   const state = reactive({
-    index: mode == "pc" ? 0 : props.startPosition,
+    originScale: "",
+    moveable: false,
+    pageX: "",
+    pageY: "",
+    pageY2: "",
+    pageX2: "",
+    mfPreviewVisible: inject("mfPreviewVisible", null),
+    scale: 1,
+    time: null,
+    index: mode === "pc" || mode === "mobile-first" ? 0 : props.startPosition,
+    imageName: "",
     isShow: false,
@@ -58,3 +68,3 @@ infinite: true,
     transform: { scale: 1, deg: 0, offsetX: 0, offsetY: 0, objfit: "contain", enableTransition: false },
-    urlList: props.urlList,
+    urlList: inject("urlList", null) || props.urlList,
     mode: constants.MODE.CONTAIN,
@@ -125,3 +135,3 @@ previewVisible: props.previewVisible,
       api2.watchVisible(value);
-      if (props.previewVisible) {
+      if (props.previewVisible || state.mfPreviewVisible) {
         nextTick(() => {
@@ -152,5 +162,5 @@ state.urlList = props.urlList;
 };
-const renderless = (props, { computed, onMounted, onUpdated, reactive, watch }, { t, parent, nextTick, emit, constants, vm, mode }) => {
+const renderless = (props, { computed, onMounted, onUpdated, reactive, watch, inject }, { t, parent, nextTick, emit, constants, vm, mode }) => {
   const api2 = {};
-  const state = initState({ reactive, computed, api: api2, mode, props, constants });
+  const state = initState({ reactive, computed, api: api2, mode, props, constants, inject });
   initApi({ api: api2, state, props, parent, nextTick, emit, t, constants });
@@ -157,0 +167,0 @@ initWatch({ watch, state, api: api2, props, nextTick, vm });

image/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off, getScrollContainer, isInContainer } from "@opentiny/vue-renderless/common/deps/dom";
-import { typeOf } from "@opentiny/vue-renderless/common/type";
-import "@opentiny/vue-renderless/common/deps/requestAnimationFrame";
-import { rafThrottle } from "@opentiny/vue-renderless/image-viewer";
+import { on, off, getScrollContainer, isInContainer } from "../common/deps/dom";
+import { typeOf } from "../common/type";
+import "../common/deps/requestAnimationFrame";
+import { rafThrottle } from "../image-viewer";
 const isSupportObjectFit = () => document.documentElement.style.objectFit !== void 0;
@@ -37,2 +37,5 @@ const isHtmlElement = (node) => node && node.nodeType === Node.ELEMENT_NODE;
 };
+const deleteHander = (emit) => (event) => {
+  emit("delete", event);
+};
 const handleError = ({ state, emit }) => (event) => {
@@ -113,2 +116,3 @@ state.loading = false;
   computedGetPreview,
+  deleteHander,
   getImageStyle,
@@ -115,0 +119,0 @@ handleError,

image/vue.js

@@ -15,7 +15,10 @@ import "../chunk-PKUHTIDK.js";
   closeViewer,
-  mounted
+  mounted,
+  deleteHander
 } from "./index";
-const api = ["state", "src", "zIndex", "previewSrcList", "loadImage", "clickHandler", "closeViewer", "handleLoad", "handleError"];
-const initState = ({ reactive, computed, api: api2, props }) => {
+const api = ["state", "src", "zIndex", "previewSrcList", "loadImage", "clickHandler", "closeViewer", "handleLoad", "handleError", "deleteHander"];
+const initState = ({ reactive, computed, api: api2, props, images }) => {
   const state = reactive({
+    mfPreviewVisible: props.previewVisible,
+    images,
     error: false,
@@ -48,3 +51,4 @@ loading: true,
     computedGetImageStyle: computedGetImageStyle({ api: api2, props }),
-    addLazyLoadListener: addLazyLoadListener({ api: api2, props, state, vm })
+    addLazyLoadListener: addLazyLoadListener({ api: api2, props, state, vm }),
+    deleteHander: deleteHander(emit)
   });
@@ -62,5 +66,5 @@ };
 };
-const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch }, { vm, emit, constants, nextTick, attrs }) => {
+const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch, provide }, { vm, emit, constants, nextTick, attrs }, { images }) => {
   const api2 = {};
-  const state = initState({ reactive, computed, api: api2, props });
+  const state = initState({ reactive, computed, api: api2, props, images });
   initApi({ api: api2, state, emit, props, vm, constants, nextTick, attrs });
@@ -70,2 +74,4 @@ initWatch({ watch, state, api: api2, props });
   onBeforeUnmount(() => props.lazy && api2.removeLazyLoadListener());
+  provide("mfPreviewVisible", state.mfPreviewVisible);
+  provide("urlList", props.previewSrcList);
   return api2;
@@ -72,0 +78,0 @@ };

input/index.js

 import "../chunk-PKUHTIDK.js";
-import { isSame } from "@opentiny/vue-renderless/common/type";
+import { isSame } from "../common/type";
 const HIDDEN_STYLE = `
@@ -224,2 +224,31 @@ height:0 !important;visibility:hidden !important;overflow:hidden !important;
 };
+const handleEnterDisplayOnlyContent = ({ state, props }) => ($event, type) => {
+  const target = $event.target;
+  if (target && (target.scrollWidth > target.offsetWidth || type === "textarea" && target.scrollHeight > target.offsetHeight)) {
+    state.displayOnlyTooltip = props.displayOnlyContent || state.nativeInputValue;
+  }
+};
+const hiddenPassword = ({ state, props }) => () => {
+  let str = "";
+  const password = props.displayOnlyContent || state.nativeInputValue;
+  for (let i = 0; i < password.length; i++) {
+    str += "*";
+  }
+  return str;
+};
+const dispatchDisplayedValue = ({ state, props, dispatch, api }) => () => {
+  if (state.isDisplayOnly) {
+    dispatch("FormItem", "displayed-value-changed", {
+      type: props.type || "text",
+      val: api.getDisplayedValue()
+    });
+  }
+};
+const getDisplayedValue = ({ state, props }) => () => {
+  if (props.type === "password") {
+    return state.hiddenPassword || "-";
+  } else {
+    return props.displayOnlyContent || state.nativeInputValue || "-";
+  }
+};
 export {
@@ -231,3 +260,5 @@ blur,
   clear,
+  dispatchDisplayedValue,
   focus,
+  getDisplayedValue,
   getInput,
@@ -240,2 +271,3 @@ getSuffixVisible,
   handleCompositionUpdate,
+  handleEnterDisplayOnlyContent,
   handleFocus,
@@ -245,2 +277,3 @@ handleInput,
   hasSelection,
+  hiddenPassword,
   resizeTextarea,
@@ -247,0 +280,0 @@ select,

input/vue.js

@@ -29,5 +29,9 @@ import {
   handleCompositionUpdate,
-  hasSelection
+  hasSelection,
+  handleEnterDisplayOnlyContent,
+  hiddenPassword,
+  dispatchDisplayedValue,
+  getDisplayedValue
 } from "./index";
-import useStorageBox from "@opentiny/vue-renderless/tall-storage/vue-storage-box";
+import useStorageBox from "../tall-storage/vue-storage-box";
 const api = [
@@ -61,3 +65,5 @@ "blur",
   "isMemoryStorage",
-  "hasSelection"
+  "hasSelection",
+  "handleEnterDisplayOnlyContent",
+  "hiddenPassword"
 ];
@@ -93,3 +99,8 @@ const initState = ({ reactive, computed, mode, props, parent, constants }) => {
       () => (props.showWordLimit && parent.$attrs.maxlength || props.counter) && (parent.type === "text" || parent.type === "textarea") && !state.inputDisabled && !props.readonly && !props.showPassword
-    )
+    ),
+    isDisplayOnly: computed(
+      () => (props.displayOnly || (parent.tinyForm || {}).displayOnly) && ["text", "textarea", "password", "number"].includes(props.type)
+    ),
+    displayOnlyTooltip: "",
+    hiddenPassword: computed(() => api.hiddenPassword())
   });
@@ -112,3 +123,5 @@ return state;
     handleCompositionStart: handleCompositionStart(state),
-    handleCompositionUpdate: handleCompositionUpdate(state)
+    handleCompositionUpdate: handleCompositionUpdate(state),
+    dispatchDisplayedValue: dispatchDisplayedValue({ state, props, dispatch, api: api2 }),
+    getDisplayedValue: getDisplayedValue({ state, props })
   });
@@ -147,3 +160,5 @@ };
     handlePasswordVisible: handlePasswordVisible({ api: api2, nextTick, state }),
-    hasSelection: hasSelection(api2)
+    hasSelection: hasSelection(api2),
+    handleEnterDisplayOnlyContent: handleEnterDisplayOnlyContent({ state, props }),
+    hiddenPassword: hiddenPassword({ state, props })
   });
@@ -210,2 +225,3 @@ };
     api2.updateIconOffset();
+    api2.dispatchDisplayedValue();
     dispatch("Select", "input-mounted", vm.$el);
@@ -212,0 +228,0 @@ dispatch("Tooltip", "tooltip-update", vm.$el);

ip-address/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE, IPTHRESHOLD } from "@opentiny/vue-renderless/common";
+import { KEY_CODE, IPTHRESHOLD } from "../common";
 const isIP6 = (str) => /^IPv6$/i.test(str);
@@ -4,0 +4,0 @@ const isIP4 = (str) => /^IPv4$/i.test(str);

ip-address/vue.js

@@ -21,3 +21,3 @@ import {
 } from "./index";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { KEY_CODE } from "../common";
 const api = ["state", "focus", "inputEvent", "blur", "keyup", "keydown", "change", "select"];
@@ -24,0 +24,0 @@ const initState = ({ reactive, computed, handleValue, parent, props }) => {

link-menu/index.js

@@ -5,4 +5,4 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { mapTree } from "@opentiny/vue-renderless/grid/static";
-import { copyArray } from "@opentiny/vue-renderless/common/object";
+import { mapTree } from "../grid/static";
+import { copyArray } from "../common/object";
 const dialogTitle = ({ constants, props, t }) => () => props.title || t(constants.DIALOG_TITLE);
@@ -9,0 +9,0 @@ const showDialog = (state) => () => state.boxVisibility = true;

link-menu/vue.js

 import "../chunk-PKUHTIDK.js";
 import { initData, dialogTitle, disabledParentNode, filterNode, getValue, hideDialog, showDialog, sureNodevalue, disabledTreeNode, initService } from "./index";
-import { copyArray } from "@opentiny/vue-renderless/common/object";
-import { setMenuKey } from "@opentiny/vue-renderless/tree-menu";
+import { copyArray } from "../common/object";
+import { setMenuKey } from "../tree-menu";
 const api = ["state", "initData", "filterNode", "getValue", "hideDialog", "setMenuKey", "showDialog", "sureNodevalue"];
@@ -6,0 +6,0 @@ const initState = ({ reactive, computed, api: api2 }) => {

loading/index.js

 import "../chunk-PKUHTIDK.js";
-import afterLeave from "@opentiny/vue-renderless/common/deps/after-leave";
-import { removeClass } from "@opentiny/vue-renderless/common/deps/dom";
+import afterLeave from "../common/deps/after-leave";
+import { removeClass } from "../common/deps/dom";
 const handleAfterLeave = (emit) => () => {
@@ -5,0 +5,0 @@ emit("after-leave");

loading/vue.js

@@ -12,3 +12,4 @@ import "../chunk-PKUHTIDK.js";
     fullscreen: true,
-    closed: false
+    closed: false,
+    size: "small"
   });
@@ -15,0 +16,0 @@ const api2 = {

locales/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common";
+import { xss } from "../common";
 const getLocales = ({ api, service, state }) => () => {
@@ -4,0 +4,0 @@ Promise.all([service.getLocale(), service.getCurrentLocale()]).then(([locales, current]) => {

logout/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common";
+import { xss } from "../common";
 const logout = ({ service, state, props }) => () => {
@@ -4,0 +4,0 @@ let { isMock, isLocal, redirectUrl = "", getLogoutUrl, showLogin } = service;

milestone/index.js

 import "../chunk-PKUHTIDK.js";
 const hexToRgb = (hex) => {
-  hex = hex.slice(1);
+  if (hex.includes("var")) {
+    hex = hex.replace(/var\(|\)/g, "");
+    hex = getComputedStyle(document.documentElement).getPropertyValue(hex);
+  }
+  hex = hex.replace(/\s*#/g, "");
   if (hex.length == 3) {
@@ -5,0 +9,0 @@ hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];

modal/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { on, off, addClass, hasClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import { getDomNode } from "@opentiny/vue-renderless/common/deps/dom";
+import { KEY_CODE } from "../common";
+import { on, off, addClass, hasClass, removeClass } from "../common/deps/dom";
+import PopupManager from "../common/deps/popup-manager";
+import { getDomNode } from "../common/deps/dom";
 const DragClass = "is__drag";
@@ -24,8 +24,12 @@ const emitZoom = ({ params, parent, emit, event }) => {
 };
-const mounted = ({ api, parent, props }) => () => {
-  let modalBoxElem = api.getBox();
-  Object.assign(modalBoxElem.style, {
-    width: props.width ? isNaN(props.width) ? props.width : `${props.width}px` : null,
-    height: props.height ? isNaN(props.height) ? props.height : `${props.height}px` : null
-  });
+const mounted = ({ api, parent, props, isMobileFirstMode }) => () => {
+  if (!isMobileFirstMode) {
+    let modalBoxElem = api.getBox();
+    Object.assign(modalBoxElem.style, {
+      width: props.width ? isNaN(props.width) ? props.width : `${props.width}px` : null,
+      height: props.height ? isNaN(props.height) ? props.height : `${props.height}px` : null
+    });
+  } else {
+    on(window, "resize", api.resetDragStyle);
+  }
   if (props.escClosable) {
@@ -36,3 +40,4 @@ on(document, "keydown", api.handleGlobalKeydownEvent);
 };
-const beforeUnmouted = ({ api, parent }) => () => {
+const beforeUnmouted = ({ api, parent, isMobileFirstMode }) => () => {
+  isMobileFirstMode && off(window, "resize", api.resetDragStyle);
   off(document, "keydown", api.handleGlobalKeydownEvent);
@@ -52,3 +57,3 @@ api.removeMsgQueue();
 };
-const handleEvent = ({ api, emit, parent, props }) => (type, event) => {
+const handleEvent = ({ api, emit, parent, props, isMobileFirstMode }) => (type, event, options) => {
   if (~["close", "confirm", "cancel"].indexOf(type) && typeof props.beforeClose === "function" && props.beforeClose(type) === false) {
@@ -62,2 +67,5 @@ return;
   };
+  if (isMobileFirstMode && type === "confirm") {
+    params.options = options;
+  }
   emit(type, params, event);
@@ -76,3 +84,3 @@ events[type] && events[type].call(parent, params);
 };
-const open = ({ api, emit, nextTick, parent, props, state }) => () => {
+const open = ({ api, emit, nextTick, parent, props, state, isMobileFirstMode }) => () => {
   let { $listeners, events = {} } = parent;
@@ -103,8 +111,10 @@ if (!state.visible) {
       nextTick(() => {
-        let modalBoxElem = api.getBox();
-        let clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth;
-        let clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight;
-        modalBoxElem.style.left = `${clientVisibleWidth / 2 - modalBoxElem.offsetWidth / 2}px`;
-        if (modalBoxElem.offsetHeight + modalBoxElem.offsetTop + props.marginSize > clientVisibleHeight) {
-          modalBoxElem.style.top = `${props.marginSize}px`;
+        if (!isMobileFirstMode) {
+          let modalBoxElem = api.getBox();
+          let clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth;
+          let clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight;
+          modalBoxElem.style.left = `${clientVisibleWidth / 2 - modalBoxElem.offsetWidth / 2}px`;
+          if (modalBoxElem.offsetHeight + modalBoxElem.offsetTop + props.marginSize > clientVisibleHeight) {
+            modalBoxElem.style.top = `${props.marginSize}px`;
+          }
         }
@@ -168,3 +178,3 @@ if (props.fullscreen) {
 const getBox = (refs) => () => refs.modalBox;
-const maximize = ({ api, nextTick, props, state }) => () => nextTick().then(() => {
+const maximize = ({ api, nextTick, props, state, isMobileFirstMode }) => () => nextTick().then(() => {
   if (!state.zoomLocat) {
@@ -180,12 +190,14 @@ let marginSize = props.marginSize;
     };
-    Object.assign(modalBoxElement.style, {
-      width: `${visibleWidth - marginSize * 2}px`,
-      height: `${visibleHeight - marginSize * 2}px`,
-      top: `${marginSize}px`,
-      left: `${marginSize}px`
-    });
+    if (!isMobileFirstMode) {
+      Object.assign(modalBoxElement.style, {
+        width: `${visibleWidth - marginSize * 2}px`,
+        height: `${visibleHeight - marginSize * 2}px`,
+        top: `${marginSize}px`,
+        left: `${marginSize}px`
+      });
+    }
     state.emitter.emit("boxdrag");
   }
 });
-const revert = ({ api, nextTick, state }) => () => nextTick().then(() => {
+const revert = ({ api, nextTick, state, isMobileFirstMode }) => () => nextTick().then(() => {
   let zoomLocat = state.zoomLocat;
@@ -195,14 +207,17 @@ if (zoomLocat) {
     state.zoomLocat = null;
-    Object.assign(modalBoxElement.style, {
-      width: `${zoomLocat.width}px`,
-      height: `${zoomLocat.height}px`,
-      top: `${zoomLocat.top}px`,
-      left: `${zoomLocat.left}px`
-    });
+    if (!isMobileFirstMode) {
+      Object.assign(modalBoxElement.style, {
+        width: `${zoomLocat.width}px`,
+        height: `${zoomLocat.height}px`,
+        top: `${zoomLocat.top}px`,
+        left: `${zoomLocat.left}px`
+      });
+    }
     state.emitter.emit("boxdrag");
   }
 });
-const toggleZoomEvent = ({ api, emit, parent, state }) => (event) => {
+const toggleZoomEvent = ({ api, emit, parent, state, isMobileFirstMode }) => (event) => {
   let params = { type: state.zoomLocat ? "min" : "max", $modal: parent };
   const callback = state.zoomLocat ? api.revert : api.maximize;
+  isMobileFirstMode && api.resetDragStyle();
   return callback().then(() => {
@@ -229,3 +244,3 @@ emitZoom({ params, parent, emit, event });
 }
-const mousedownEvent = ({ api, nextTick, props, state, emit }) => (event) => {
+const mousedownEvent = ({ api, nextTick, props, state, emit, isMobileFirstMode }) => (event) => {
   let modalBoxElement = api.getBox();
@@ -244,8 +259,16 @@ if (!state.zoomLocat && event.button === 0 && !getEventTargetNode(event, modalBoxElement, "trigger__btn").flag) {
       let offsetHeight = modalBoxElement.offsetHeight;
-      let minX = props.marginSize;
-      let maxX = visibleWidth - offsetWidth - props.marginSize;
-      let minY = props.marginSize;
-      let maxY = visibleHeight - offsetHeight - props.marginSize;
       let left = event2.clientX - disX;
       let top = event2.clientY - disY;
+      let minX, maxX, minY, maxY;
+      if (isMobileFirstMode) {
+        minX = offsetWidth / 2 + props.marginSize;
+        maxX = visibleWidth - offsetWidth / 2 - props.marginSize;
+        minY = offsetHeight / 2 + props.marginSize;
+        maxY = visibleHeight - offsetHeight / 2 - props.marginSize;
+      } else {
+        minX = props.marginSize;
+        maxX = visibleWidth - offsetWidth - props.marginSize;
+        minY = props.marginSize;
+        maxY = visibleHeight - offsetHeight - props.marginSize;
+      }
       if (left < minX) {
@@ -503,2 +526,7 @@ left = minX;
 };
+const resetDragStyle = (api) => () => {
+  const modalBoxElement = api.getBox();
+  modalBoxElement.style.left = null;
+  modalBoxElement.style.top = null;
+};
 export {
@@ -523,2 +551,3 @@ MsgQueue,
   removeMsgQueue,
+  resetDragStyle,
   resetFormTip,
@@ -525,0 +554,0 @@ revert,

modal/vue.js

@@ -25,3 +25,4 @@ import "../chunk-PKUHTIDK.js";
   cancelEvent,
-  open
+  open,
+  resetDragStyle
 } from "./index";
@@ -44,5 +45,6 @@ const api = [
   "open",
-  "beforeUnmouted"
+  "beforeUnmouted",
+  "resetDragStyle"
 ];
-const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch }, { refs, emit, emitter, nextTick, broadcast, vm: parent }) => {
+const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch }, { refs, emit, emitter, nextTick, broadcast, vm: parent }, { isMobileFirstMode }) => {
   const api2 = {};
@@ -68,11 +70,11 @@ const state = reactive({
     created: created({ api: api2, props, state }),
-    mounted: mounted({ api: api2, parent, props }),
-    beforeUnmouted: beforeUnmouted({ api: api2, parent }),
+    mounted: mounted({ api: api2, parent, props, isMobileFirstMode }),
+    beforeUnmouted: beforeUnmouted({ api: api2, parent, isMobileFirstMode }),
     selfClickEvent: selfClickEvent({ api: api2, parent, props }),
     updateZindex: updateZindex({ state, props }),
-    handleEvent: handleEvent({ api: api2, emit, parent, props }),
+    handleEvent: handleEvent({ api: api2, emit, parent, props, isMobileFirstMode }),
     closeEvent: closeEvent(api2),
     confirmEvent: confirmEvent(api2),
     cancelEvent: cancelEvent(api2),
-    open: open({ api: api2, emit, nextTick, parent, props, state }),
+    open: open({ api: api2, emit, nextTick, parent, props, state, isMobileFirstMode }),
     addMsgQueue: addMsgQueue({ api: api2, parent }),
@@ -82,7 +84,8 @@ removeMsgQueue: removeMsgQueue({ api: api2, parent }),
     handleGlobalKeydownEvent: handleGlobalKeydownEvent(api2),
-    maximize: maximize({ api: api2, nextTick, props, state }),
-    revert: revert({ api: api2, nextTick, state }),
-    toggleZoomEvent: toggleZoomEvent({ api: api2, emit, parent, state }),
-    mousedownEvent: mousedownEvent({ api: api2, nextTick, props, state, emit }),
-    dragEvent: dragEvent({ api: api2, emit, parent, props, state })
+    maximize: maximize({ api: api2, nextTick, props, state, isMobileFirstMode }),
+    revert: revert({ api: api2, nextTick, state, isMobileFirstMode }),
+    toggleZoomEvent: toggleZoomEvent({ api: api2, emit, parent, state, isMobileFirstMode }),
+    mousedownEvent: mousedownEvent({ api: api2, nextTick, props, state, emit, isMobileFirstMode }),
+    dragEvent: dragEvent({ api: api2, emit, parent, props, state }),
+    resetDragStyle: resetDragStyle(api2)
   });
@@ -89,0 +92,0 @@ watch(() => props.modelValue, api2.watchValue);

month-range/index.js

 import "../chunk-PKUHTIDK.js";
-import { isDate, modifyWithTimeString, prevYear, nextYear, nextMonth } from "@opentiny/vue-renderless/common/deps/date-util";
+import { isDate, modifyWithTimeString, prevYear, nextYear, nextMonth } from "../common/deps/date-util";
 const calcDefaultValue = (defaultValue) => {
@@ -4,0 +4,0 @@ if (Array.isArray(defaultValue)) {

month-range/vue.js

@@ -18,3 +18,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { nextYear } from "@opentiny/vue-renderless/common/deps/date-util";
+import { nextYear } from "../common/deps/date-util";
 const api = ["state", "rightNextYear", "rightPrevYear", "handleRangePick", "handleShortcutClick", "handleChangeRange", "leftPrevYear", "leftNextYear"];
@@ -21,0 +21,0 @@ const initState = ({ reactive, computed, api: api2, t }) => {

month-table/index.js

 import "../chunk-PKUHTIDK.js";
-import { toDate } from "@opentiny/vue-renderless/common/date";
-import { hasClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { range as rangeDate, getDayCountOfMonth, nextDate } from "@opentiny/vue-renderless/common/deps/date-util";
-import { arrayFindIndex, coerceTruthyValueToArray, arrayFind } from "@opentiny/vue-renderless/date-table";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { toDate } from "../common/date";
+import { hasClass } from "../common/deps/dom";
+import { range as rangeDate, getDayCountOfMonth, nextDate } from "../common/deps/date-util";
+import { arrayFindIndex, coerceTruthyValueToArray, arrayFind } from "../date-table";
+import { DATEPICKER } from "../common";
 const datesInMonth = (year, month) => {
@@ -8,0 +8,0 @@ const numOfDays = getDayCountOfMonth(year, month);

month-table/vue.js

@@ -13,3 +13,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { DATEPICKER } from "../common";
 const api = ["state", "handleMonthTableClick", "handleMouseMove", "getCellStyle"];
@@ -16,0 +16,0 @@ const renderless = (props, { computed, reactive, watch }, { t, vm, emit }) => {

multi-select/index.js

 import "../chunk-PKUHTIDK.js";
-import { cloneDeep } from "@opentiny/vue-renderless/chart-core/deps/utils";
+import { cloneDeep } from "../chart-core/deps/utils";
 const created = ({ props, state, refs, nextTick }) => () => {
@@ -166,3 +166,6 @@ nextTick(() => {
   const len = state.dataSource.length;
-  if (!widthInfo.length || widthInfo.length === state.labelLevelsInfo.length || len >= 4) {
+  if (len >= 4) {
+    return getStyleConfig(state.labelLevelsInfo, { width: `${(1 / len * 100).toFixed(2)}%` });
+  }
+  if (!widthInfo.length || widthInfo.length === state.labelLevelsInfo.length) {
     return getStyleConfig(state.labelLevelsInfo, { maxWidth: `${(1 / len * 100).toFixed(2)}%` });
@@ -169,0 +172,0 @@ }

multi-select/vue.js

@@ -21,3 +21,3 @@ import "../chunk-PKUHTIDK.js";
 ];
-const initState = ({ computed, reactive }) => {
+const initState = (reactive) => {
   const state = reactive({
@@ -34,4 +34,3 @@ dataSource: [],
     defaultSelectedIndexs: [],
-    defaultSelectedArray: [],
-    isActive: computed(() => state.headerInfo.some((item) => item.isUP))
+    defaultSelectedArray: []
   });
@@ -66,5 +65,5 @@ return state;
 };
-const renderless = (props, { computed, onMounted, reactive, watch }, { emit, nextTick, refs }) => {
+const renderless = (props, { onMounted, reactive, watch }, { emit, nextTick, refs }) => {
   const api2 = {};
-  const state = initState({ computed, reactive });
+  const state = initState(reactive);
   initApi({ api: api2, props, state, emit, nextTick, refs });
@@ -71,0 +70,0 @@ initWatch({ watch, props, state, refs, nextTick });

nav-menu/index.js

 import "../chunk-PKUHTIDK.js";
-import { isEmptyObject, isObject } from "@opentiny/vue-renderless/common/type";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import { mapTree } from "@opentiny/vue-renderless/grid/static";
-import { transformTreeData } from "@opentiny/vue-renderless/common/array";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { isEmptyObject, isObject } from "../common/type";
+import PopupManager from "../common/deps/popup-manager";
+import { mapTree } from "../grid/static";
+import { transformTreeData } from "../common/array";
+import { on, off } from "../common/deps/dom";
+import { xss } from "../common/xss.js";
 const { nextZIndex } = PopupManager;
@@ -9,0 +9,0 @@ const computedIsShowMore = ({ props, state }) => () => !/^(retract|fixed|hidden)$/.test(props.overflow) && state.more && state.more.length;

notify/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
+import { KEY_CODE } from "../common";
+import { on, off } from "../common/deps/dom";
+import PopupManager from "../common/deps/popup-manager";
 const startTimer = ({ api, state }) => () => {
@@ -6,0 +6,0 @@ if (state.duration > 0) {

numeric/index.js

@@ -5,7 +5,7 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { formatNumber, roundFixed } from "@opentiny/vue-renderless/common/decimal";
-import { getMiniDecimal, lessEquals, equalsDecimal } from "@opentiny/vue-renderless/common/bigInt";
-import { isNumber, isNull } from "@opentiny/vue-renderless/common/type";
-import { MOUSEDELTA } from "@opentiny/vue-renderless/common";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { formatNumber, roundFixed } from "../common/decimal";
+import { getMiniDecimal, lessEquals, equalsDecimal } from "../common/bigInt";
+import { isNumber, isNull } from "../common/type";
+import { MOUSEDELTA } from "../common";
+import { on, off } from "../common/deps/dom";
 const initService = (service) => {
@@ -267,7 +267,17 @@ const { utils = {} } = service || {};
 };
+const dispatchDisplayedValue = ({ state, api, dispatch }) => () => {
+  if (state.isDisplayOnly) {
+    dispatch("FormItem", "displayed-value-changed", { type: "numeric", val: api.getDisplayedValue() });
+  }
+};
+const getDisplayedValue = ({ state, props }) => () => {
+  return state.displayValue || state.displayValue === 0 ? state.displayValue + " " + (props.unit || "") : "-";
+};
 export {
   decrease,
+  dispatchDisplayedValue,
   displayValue,
   focus,
   getDecimal,
+  getDisplayedValue,
   getNumPecision,
@@ -274,0 +284,0 @@ getPrecision,

numeric/vue.js

@@ -25,3 +25,5 @@ import "../chunk-PKUHTIDK.js";
   unmounted,
-  initService
+  initService,
+  dispatchDisplayedValue,
+  getDisplayedValue
 } from "./index";
@@ -46,3 +48,4 @@ const api = ["state", "decrease", "increase", "handleBlur", "handleFocus", "handleInput", "handleInputChange", "mouseEvent", "focus", "select"];
     controlsAtRight: computed(() => props.controls && props.controlsPosition === "right"),
-    format: computed(() => getUnitPrecision({ service: $service, props }))
+    format: computed(() => getUnitPrecision({ service: $service, props })),
+    isDisplayOnly: computed(() => props.displayOnly || (parent.tinyForm || {}).displayOnly)
   });
@@ -74,8 +77,11 @@ return state;
     watchValue: watchValue({ api: api2, state }),
-    setCurrentValue: setCurrentValue({ api: api2, constants, dispatch, emit, props, state })
+    setCurrentValue: setCurrentValue({ api: api2, constants, dispatch, emit, props, state }),
+    dispatchDisplayedValue: dispatchDisplayedValue({ api: api2, state, dispatch }),
+    getDisplayedValue: getDisplayedValue({ state, props })
   });
   api2.getDecimal(0);
 };
-const initWatch = ({ watch, props, api: api2 }) => {
+const initWatch = ({ state, watch, props, api: api2 }) => {
   watch(() => props.modelValue, api2.watchValue, { immediate: true });
+  watch(() => state.isDisplayOnly, api2.dispatchDisplayedValue);
 };
@@ -88,4 +94,7 @@ const renderless = (props, { computed, onMounted, onUpdated, onUnmounted, reactive, watch, inject }, { parent, emit, refs, constants, dispatch, service }) => {
   initApi({ api: api2, props, state, parent, refs, emit, dispatch, constants });
-  initWatch({ watch, props, api: api2 });
-  onMounted(api2.mounted);
+  initWatch({ state, watch, props, api: api2 });
+  onMounted(() => {
+    api2.dispatchDisplayedValue();
+    api2.mounted();
+  });
   onUpdated(api2.updated);
@@ -92,0 +101,0 @@ onUnmounted(api2.unmounted);

option/index.js

 import "../chunk-PKUHTIDK.js";
-import { getObj } from "@opentiny/vue-renderless/common/object";
+import { getObj } from "../common/object";
 const escapeRegexpString = (value = "") => String(value).replace(/[|\\{}()[\]^$+*?.]/g, "\\$&");
@@ -4,0 +4,0 @@ const isEqual = ({ select, state }) => (a, b) => {

package.json

 {
   "name": "@opentiny/vue-renderless",
-  "version": "3.6.8",
+  "version": "3.8.0",
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
@@ -22,2 +22,3 @@ "homepage": "https://opentiny.design/tiny-vue",
     "build": "tsup",
+    "build:fast": "npm run build && npm run release",
     "postversion": "pnpm build",
@@ -24,0 +25,0 @@ "release": "esno ./scripts/postbuild.ts && cp README.md dist"

pager-item/index.js

@@ -91,3 +91,3 @@ import "../chunk-PKUHTIDK.js";
     let params = { newPage, currentPage, callback };
-    vm.$parent.beforePagerChangeHandler(params);
+    vm.$parent.$parent.beforePagerChangeHandler(params);
   } else {
@@ -94,0 +94,0 @@ callback();

panel/index.js

 import "../chunk-PKUHTIDK.js";
-import { emitEvent } from "@opentiny/vue-renderless/common/event";
+import { emitEvent } from "../common/event";
 const toggle = ({ api, state }) => () => {
@@ -4,0 +4,0 @@ state.isShow ? api.collapse() : api.expand();

picker-column/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const computedWrapperStyle = (state) => () => {
@@ -4,0 +4,0 @@ const wrapperStyle = {

picker/index.js

@@ -5,9 +5,9 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { toDate, getDateWithNewTimezone, getStrTimezone, getLocalTimezone } from "@opentiny/vue-renderless/common/date";
-import { isNumber, isDate } from "@opentiny/vue-renderless/common/type";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
-import { formatDate, parseDate, isDateObject, getWeekNumber } from "@opentiny/vue-renderless/common/deps/date-util";
-import { extend } from "@opentiny/vue-renderless/common/object";
-import globalTimezone from "@opentiny/vue-renderless/picker/timezone";
+import { toDate, getDateWithNewTimezone, getStrTimezone, getLocalTimezone } from "../common/date";
+import { isNumber, isDate } from "../common/type";
+import userPopper from "../common/deps/vue-popper";
+import { DATEPICKER } from "../common";
+import { formatDate, parseDate, isDateObject, getWeekNumber } from "../common/deps/date-util";
+import { extend } from "../common/object";
+import globalTimezone from "../picker/timezone";
 const iso8601Reg = /^\d{4}-\d{2}-\d{2}(.)\d{2}:\d{2}:\d{2}(.+)$/;
@@ -14,0 +14,0 @@ const getPanel = ({ DatePanel, DateRangePanel, MonthRangePanel, TimePanel, TimeRangePanel, TimeSelect }) => (type) => {

picker/vue.js

@@ -55,3 +55,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { DATEPICKER } from "../common";
 const api = [
@@ -58,0 +58,0 @@ "state",

popeditor/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { find } from "@opentiny/vue-renderless/common/array";
-import { typeOf, isNull } from "@opentiny/vue-renderless/common/type";
-import { getDataset } from "@opentiny/vue-renderless/common/dataset";
-import { isNullOrEmpty } from "@opentiny/vue-renderless/common/string";
-import { isEqual } from "@opentiny/vue-renderless/common/object";
-import { eachTree } from "@opentiny/vue-renderless/grid/static";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { find } from "../common/array";
+import { typeOf, isNull } from "../common/type";
+import { getDataset } from "../common/dataset";
+import { isNullOrEmpty } from "../common/string";
+import { isEqual } from "../common/object";
+import { eachTree } from "../grid/static";
+import { on, off } from "../common/deps/dom";
 const computedGetTitle = ({ constants, props, t }) => props.title || t(constants.TITLE);
@@ -12,0 +12,0 @@ const computedModalWidth = ({ constants, props }) => {

popeditor/vue.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
+import debounce from "../common/deps/debounce";
+import userPopper from "../common/deps/vue-popper";
 import {
@@ -7,0 +7,0 @@ computedGetTitle,

popover/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off, addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { guid } from "@opentiny/vue-renderless/common/string";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { on, off, addClass, removeClass } from "../common/deps/dom";
+import { guid } from "../common/string";
+import { KEY_CODE } from "../common";
 const processTrigger = ({ api, state, props, nextTick }) => {
@@ -158,2 +158,9 @@ const { referenceElm, popperElm } = state;
 };
+const observeCallback = ({ state, vm }) => (mutationsList) => {
+  for (let mutation of mutationsList) {
+    if (mutation.type === "attributes" && mutation.attributeName === "x-placement") {
+      state.xPlacement = vm.$refs.popper.getAttribute("x-placement") || "bottom";
+    }
+  }
+};
 export {
@@ -177,3 +184,4 @@ cleanup,
   mounted,
+  observeCallback,
   wrapMounted
 };

popover/vue.js

@@ -20,5 +20,6 @@ import "../chunk-PKUHTIDK.js";
   wrapMounted,
-  handleItemClick
+  handleItemClick,
+  observeCallback
 } from "./index";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
+import userPopper from "../common/deps/vue-popper";
 const api = ["state", "handleAfterEnter", "handleAfterLeave", "handleItemClick"];
@@ -36,3 +37,3 @@ const initState = ({ reactive, computed, api: api2, popperElm, showPopper, referenceElm }) => {
 };
-const initApi = ({ api: api2, props, state, refs, emit, doDestroy, constants, nextTick }) => {
+const initApi = ({ api: api2, props, state, refs, emit, doDestroy, constants, nextTick, vm }) => {
   Object.assign(api2, {
@@ -58,6 +59,7 @@ state,
     wrapMounted: wrapMounted({ api: api2, props, refs, state }),
-    handleItemClick: handleItemClick({ emit, state })
+    handleItemClick: handleItemClick({ emit, state }),
+    observeCallback: observeCallback({ vm, state })
   });
 };
-const initWatch = ({ watch, props, state, emit }) => {
+const initWatch = ({ watch, props, state, emit, api: api2, nextTick }) => {
   watch(
@@ -73,4 +75,15 @@ () => state.showPopper,
   );
+  watch(
+    () => props.reference,
+    (val, oldVal) => {
+      if (val !== oldVal) {
+        api2.destroyed();
+        nextTick(() => {
+          api2.wrapMounted();
+        });
+      }
+    }
+  );
 };
-const renderless = (props, { reactive, computed, watch, toRefs, onBeforeUnmount, onMounted, onUnmounted, onActivated, onDeactivated }, { $prefix, emit, refs, slots, nextTick }) => {
+const renderless = (props, { reactive, computed, watch, toRefs, onBeforeUnmount, onMounted, onUnmounted, onActivated, onDeactivated }, { $prefix, emit, vm, refs, slots, nextTick }) => {
   const api2 = {};
@@ -81,3 +94,3 @@ const constants = { IDPREFIX: `${$prefix.toLowerCase()}-popover` };
   const state = initState({ reactive, computed, api: api2, popperElm, showPopper, referenceElm });
-  initApi({ api: api2, constants, props, state, refs, emit, doDestroy, nextTick });
+  initApi({ api: api2, constants, props, state, refs, emit, doDestroy, nextTick, vm });
   onDeactivated(() => {
@@ -87,7 +100,17 @@ api2.destroyed();
   });
-  onMounted(api2.wrapMounted);
+  onMounted(() => {
+    api2.wrapMounted();
+    if (props.genArrowByHtml) {
+      const config = { attributes: true, childList: false, subtree: false };
+      api2.observer = new MutationObserver(api2.observeCallback);
+      api2.observer.observe(vm.$refs.popper, config);
+    }
+  });
   onActivated(api2.mounted);
-  onUnmounted(api2.destroyed);
+  onUnmounted(() => {
+    api2.destroyed();
+    api2.observer && api2.observer.disconnect();
+  });
   onBeforeUnmount(api2.cleanup);
-  initWatch({ watch, props, state, emit });
+  initWatch({ watch, props, state, emit, api: api2, nextTick });
   return api2;
@@ -94,0 +117,0 @@ };

popup/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { touchStart, touchMove } from "@opentiny/vue-renderless/common/deps/touch";
-import { getScroller } from "@opentiny/vue-renderless/dropdown-menu";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { on, off } from "../common/deps/dom";
+import { touchStart, touchMove } from "../common/deps/touch";
+import { getScroller } from "../dropdown-menu";
+import { isNull } from "../common/type";
 const getStyle = (props) => () => {
@@ -9,0 +9,0 @@ const style = __spreadValues({}, props.popupStyle);

pull-refresh/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const initPullRefresh = ({ t, props, state }) => () => {
+  var _a, _b, _c;
   const defaultOption = {
@@ -20,2 +21,5 @@ pullingUpText: t("ui.pullRefresh.pullingUp"),
   };
+  state.loosingText = (_a = props.loosingText) != null ? _a : t("ui.pullRefresh.loosing");
+  state.successText = (_b = props.successText) != null ? _b : t("ui.pullRefresh.success");
+  state.failedText = (_c = props.failedText) != null ? _c : t("ui.pullRefresh.failed");
 };
@@ -25,9 +29,5 @@ const onTouchstart = (state) => (event) => {
 };
-const onTouchmove = ({ props, state, refs }) => (event) => {
+const onTouchmove = ({ props, state }) => (event) => {
   if (event.touches[0].clientY < state.draggposition) {
-    const scrollBottom = refs.content.scrollHeight - refs.content.clientHeight - refs.content.scrollTop;
-    if (scrollBottom > 10) {
-      return;
-    }
-    if (!state.pullUp.pullUpDisabled && state.pullUp.handler) {
+    if (!state.pullUp.pullUpDisabled) {
       if (props.hasMore) {
@@ -40,6 +40,3 @@ state.translate3d = (event.touches[0].clientY - state.draggposition) / 2;
   } else {
-    if (refs.content.scrollTop > 10) {
-      return;
-    }
-    if (!state.pullDown.pullDownDisabled && state.pullDown.handler) {
+    if (!state.pullDown.pullDownDisabled) {
       state.translate3d = (event.touches[0].clientY - state.draggposition) / 2;
@@ -46,0 +43,0 @@ state.pullDownReplaces = Math.abs(state.translate3d) > state.pullDown.headHeight ? state.loosingText : state.pullDown.pullingDownText;

pull-refresh/vue.js

 import "../chunk-PKUHTIDK.js";
 import { mountedHandler, beforeUnmountHandler, handlerModelValue, onTouchstart, onTouchmove, onTouchend, initPullRefresh, clearPullRefresh } from "./index";
 const api = ["state"];
-const renderless = (props, { watch, onMounted, computed, reactive, onBeforeUnmount }, { t, refs }) => {
+const renderless = (props, { watch, onMounted, reactive, onBeforeUnmount }, { t, refs }) => {
   const api2 = {};
@@ -14,6 +14,6 @@ const state = reactive({
     pullDownLoading: false,
-    loosingText: computed(() => props.loosingText || t("ui.pullRefresh.loosing")),
-    successText: computed(() => props.successText || t("ui.pullRefresh.success")),
-    failedText: computed(() => props.failedText || t("ui.pullRefresh.failed")),
-    noMoreText: computed(() => !props.hasMore ? t("ui.pullRefresh.noMore") : ""),
+    loosingText: "",
+    successText: "",
+    failedText: "",
+    noMoreText: "",
     pullUp: null,
@@ -27,3 +27,3 @@ pullDown: null,
     onTouchstart: onTouchstart(state),
-    onTouchmove: onTouchmove({ props, state, refs }),
+    onTouchmove: onTouchmove({ props, state }),
     onTouchend: onTouchend({ api: api2, props, state }),
@@ -40,3 +40,3 @@ mountedHandler: mountedHandler({ api: api2, refs }),
       if (!value) {
-        state.pullUpLoading = false;
+        state.noMoreText = t("ui.pullRefresh.noMore");
         api2.clearPullRefresh();
@@ -43,0 +43,0 @@ }

radio-button/index.js

@@ -32,2 +32,7 @@ import "../chunk-PKUHTIDK.js";
 };
+const keydownHandle = ({ state, props }) => () => {
+  state.value = state.isDisabled ? state.value : props.label;
+};
+const handleFocus = (state) => () => state.focus = true;
+const handleBlur = (state) => () => state.focus = false;
 export {
@@ -37,5 +42,8 @@ getGroup,
   getValue,
+  handleBlur,
   handleChange,
+  handleFocus,
+  keydownHandle,
   setValue,
   toggleEvents
 };

radio-button/vue.js

 import "../chunk-PKUHTIDK.js";
-import { handleChange, getValue, setValue, getGroup, getStyle, toggleEvents } from "./index";
+import {
+  handleChange,
+  getValue,
+  setValue,
+  getGroup,
+  getStyle,
+  toggleEvents,
+  keydownHandle,
+  handleFocus,
+  handleBlur
+} from "./index";
 const api = ["state", "handleChange"];
-const renderless = (props, { computed, reactive, onMounted, onBeforeUnmount }, { emit, parent, dispatch, constants, nextTick, refs }) => {
+const renderless = (props, { computed, reactive, onMounted, onBeforeUnmount, inject }, { emit, parent, dispatch, constants, nextTick, refs }) => {
   const api2 = {
@@ -19,3 +29,5 @@ getGroup: getGroup({ constants, parent }),
     isDisabled: computed(() => props.disabled || state.radioGroup.disabled),
-    tabIndex: computed(() => state.isDisabled || state.radioGroup && state.value !== props.label ? -1 : 0)
+    tabIndex: computed(() => state.isDisabled || state.radioGroup && state.value !== props.label ? -1 : 0),
+    showTips: inject("showTips", null),
+    tipContent: props.tipContent
   });
@@ -27,3 +39,6 @@ Object.assign(api2, {
     setValue: setValue({ emit, state }),
-    handleChange: handleChange({ constants, dispatch, nextTick, state })
+    handleChange: handleChange({ constants, dispatch, nextTick, state }),
+    keydownHandle: keydownHandle({ state, props }),
+    handleFocus: handleFocus(state),
+    handleBlur: handleBlur(state)
   });
@@ -30,0 +45,0 @@ onMounted(api2.toggleEvents);

radio-group/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { KEY_CODE } from "../common";
 const handleKeydown = ({ parent }) => (event) => {
@@ -4,0 +4,0 @@ const target = event.target;

radio-group/vue.js

 import "../chunk-PKUHTIDK.js";
 import { handleKeydown, mounted } from "./index";
 const api = ["state", "handleKeydown"];
-const renderless = (props, { computed, onMounted, reactive, watch }, { parent, dispatch }) => {
+const renderless = (props, { computed, onMounted, reactive, watch, provide }, { parent, dispatch }) => {
   const state = reactive({
     radioGroupSize: computed(() => props.size),
-    tag: "div"
+    tag: "div",
+    activeStyle: props.fill
   });
@@ -25,2 +26,4 @@ parent.$on("handleChange", (value) => {
   onMounted(api2.onMounted);
+  provide("radioVertical", props.vertical);
+  provide("showTips", props.showTips);
   return api2;
@@ -27,0 +30,0 @@ };

radio/index.js

@@ -38,3 +38,20 @@ import "../chunk-PKUHTIDK.js";
 };
+const dispatchDisplayedValue = ({ state, dispatch, api }) => () => {
+  if (state.isDisplayOnly) {
+    dispatch("FormItem", "displayed-value-changed", {
+      type: "radio",
+      val: api.getDisplayedValue()
+    });
+  }
+};
+const getDisplayedValue = ({ vm, state, props }) => () => {
+  if (state.model === props.label) {
+    return vm.$refs.label && vm.$refs.label.innerText || props.text || props.label;
+  } else {
+    return "";
+  }
+};
 export {
+  dispatchDisplayedValue,
+  getDisplayedValue,
   getModel,
@@ -41,0 +58,0 @@ handleChange,

radio/vue.js

 import "../chunk-PKUHTIDK.js";
-import { handleChange, isGroup, radioSize, isDisabled, tabIndex, getModel, setModel, toggleEvent } from "./index";
+import {
+  handleChange,
+  isGroup,
+  radioSize,
+  isDisabled,
+  tabIndex,
+  getModel,
+  setModel,
+  toggleEvent,
+  dispatchDisplayedValue,
+  getDisplayedValue
+} from "./index";
 const api = ["state", "handleChange"];
-const renderless = (props, { onMounted, onBeforeUnmount, computed, reactive, inject }, { refs, parent, emit, constants, nextTick, dispatch }) => {
+const renderless = (props, { onMounted, onBeforeUnmount, computed, reactive, inject, watch }, { refs, vm, parent, emit, constants, nextTick, dispatch }) => {
   parent.tinyForm = parent.tinyForm || inject("form", null);
@@ -28,5 +39,9 @@ const api2 = {};
     setModel: setModel({ constants, dispatch, emit, props, refs, state }),
-    handleChange: handleChange({ constants, dispatch, emit, state, nextTick })
+    handleChange: handleChange({ constants, dispatch, emit, state, nextTick }),
+    dispatchDisplayedValue: dispatchDisplayedValue({ state, api: api2, dispatch }),
+    getDisplayedValue: getDisplayedValue({ vm, state, props })
   });
+  watch(() => state.isDisplayOnly, api2.dispatchDisplayedValue);
   onMounted(() => {
+    api2.dispatchDisplayedValue();
     dispatch("Tooltip", "tooltip-update");
@@ -33,0 +48,0 @@ toggleEvent({ props, refs, type: "add" });

rate/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { KEY_CODE } from "../common";
 const computedActiveColor = (props) => (state) => {
@@ -149,3 +149,5 @@ let result = "";
     width = `${props.modelValue * 100 - Math.floor(props.modelValue) * 100 < 50 ? 0 : 100}%`;
-  } else if (props.allowHalf) {
+  }
+  if (props.allowHalf) {
+    width = "";
     const reactSize = props.size ? Math.ceil(parseInt(props.size) / 2) + "px" : "6px";
@@ -152,0 +154,0 @@ clip = `rect(0px, ${reactSize}, ${props.size || "14px"}, 0px)`;

rate/vue.js

@@ -21,3 +21,3 @@ import {
 } from "./index";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const api = ["state", "showDecimalIcon", "getIconStyle", "getTextStyle", "selectValue", "handelKey", "setCurrentValue", "resetCurrentValue"];
@@ -24,0 +24,0 @@ const useChangeValue = ({ constants, emit, props, reactive, toRefs, watch, onMounted, onUnmounted, parent }) => {

roles/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common";
+import { xss } from "../common";
 const showList = (state) => () => state.showPopover = true;
@@ -4,0 +4,0 @@ const show = (state) => () => state.showIcon = false;

scrollbar/vue-bar.js

 import "../chunk-PKUHTIDK.js";
 import { BAR_MAP, renderThumbStyle, clickThumbHandler, clickTrackHandler, startDrag, mouseMoveDocumentHandler, mouseUpDocumentHandler } from "./index";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const api = ["state", "startDrag", "renderThumbStyle", "clickTrackHandler", "clickThumbHandler", "mouseUpDocumentHandler", "mouseMoveDocumentHandler"];
@@ -5,0 +5,0 @@ const renderless = (props, { computed, onUnmounted, reactive }, { refs, parent }) => {

scrollbar/vue.js

 import "../chunk-PKUHTIDK.js";
 import { handleScroll, update } from "./index";
-import { addResizeListener, removeResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
+import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 const api = ["state", "update", "handleScroll"];
@@ -5,0 +5,0 @@ const renderless = (props, { onBeforeUnmount, onMounted, reactive }, { refs, nextTick, emit }) => {

search/index.js

 import "../chunk-PKUHTIDK.js";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import { isObject, typeOf } from "@opentiny/vue-renderless/common/type";
+import { on, off } from "../common/deps/dom";
+import PopupManager from "../common/deps/popup-manager";
+import { isObject, typeOf } from "../common/type";
 const handleChange = ({ emit, state }) => (event) => {
@@ -6,0 +6,0 @@ const value = event.target.value;

select-dropdown/vue.js

 import "../chunk-PKUHTIDK.js";
 import { mounted } from "./index";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
+import userPopper from "../common/deps/vue-popper";
 const api = ["state", "doDestroy"];
@@ -5,0 +5,0 @@ const initState = ({ reactive, computed, popper, selectVm }) => {

select/index.js

@@ -5,13 +5,13 @@ import {
 } from "../chunk-PKUHTIDK.js";
-import { find } from "@opentiny/vue-renderless/common/array";
-import { getObj, isEqual } from "@opentiny/vue-renderless/common/object";
-import { isKorean } from "@opentiny/vue-renderless/common/string";
-import scrollIntoView from "@opentiny/vue-renderless/common/deps/scroll-into-view";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import { getDataset } from "@opentiny/vue-renderless/common/dataset";
-import Memorize from "@opentiny/vue-renderless/common/deps/memorize";
-import { isEmptyObject } from "@opentiny/vue-renderless/common/type";
-import { addResizeListener, removeResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
-import { extend } from "@opentiny/vue-renderless/common/object";
+import { find } from "../common/array";
+import { getObj, isEqual } from "../common/object";
+import { isKorean } from "../common/string";
+import scrollIntoView from "../common/deps/scroll-into-view";
+import PopupManager from "../common/deps/popup-manager";
+import debounce from "../common/deps/debounce";
+import { getDataset } from "../common/dataset";
+import Memorize from "../common/deps/memorize";
+import { isEmptyObject } from "../common/type";
+import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
+import { extend } from "../common/object";
 const handleComposition = ({ api, nextTick, state }) => (event) => {
@@ -422,3 +422,4 @@ const text = event.target.value;
     const noSelected = state.selected.length === 0;
-    input.style.height = noSelected ? sizeInMap + "px" : Math.max(tags ? tags.clientHeight + (tags.clientHeight > sizeInMap ? 6 : 0) : 0, sizeInMap) + "px";
+    const borderHeight = 2;
+    input.style.height = noSelected ? sizeInMap + "px" : Math.max(tags ? tags.clientHeight + (tags.clientHeight > sizeInMap ? borderHeight : 0) : 0, sizeInMap) + "px";
     if (state.visible && state.emptyText !== false) {
@@ -759,3 +760,3 @@ state.selectEmitter.emit(constants.EVENT_NAME.updatePopper, true);
   queryWrap: (refs) => refs.scrollbar.$el.querySelector(".tiny-scrollbar__wrap.virtual"),
-  queryItems: (refs) => refs.scrollbar.$el.querySelectorAll(".tiny-select-dropdown__item.virtual"),
+  queryItems: (refs) => refs.scrollbar.$el.querySelectorAll(".tiny-option.virtual"),
   createMacro: (cb) => setTimeout(cb),
@@ -989,3 +990,5 @@ setScrollTop: ({ refs, state }) => {
   } else {
-    checked ? state.selected = state.selected.concat(selection.filter((row2) => !~props.modelValue.indexOf(row2[valueField]))) : $table.tableData.forEach((row2) => remoteItem(row2));
+    checked ? state.selected = state.selected.concat(
+      selection.filter((row2) => !~props.modelValue.indexOf(row2[valueField]))
+    ) : $table.tableData.forEach((row2) => remoteItem(row2));
   }
@@ -992,0 +995,0 @@ const keys = state.selected.map((item) => item[valueField]);

select/vue.js

@@ -79,6 +79,6 @@ import {
 } from "./index";
-import { BROWSER_NAME } from "@opentiny/vue-renderless/common";
-import browserInfo from "@opentiny/vue-renderless/common/browser";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import { isNumber, isNull } from "@opentiny/vue-renderless/common/type";
+import { BROWSER_NAME } from "../common";
+import browserInfo from "../common/browser";
+import debounce from "../common/deps/debounce";
+import { isNumber, isNull } from "../common/type";
 const api = [
@@ -178,3 +178,5 @@ "state",
   gridCheckedData: computed(() => api2.getcheckedData()),
-  isExpandAll: computed(() => props.treeOp && props.treeOp.defaultExpandAll !== void 0 ? props.treeOp.defaultExpandAll : true),
+  isExpandAll: computed(
+    () => props.treeOp && props.treeOp.defaultExpandAll !== void 0 ? props.treeOp.defaultExpandAll : true
+  ),
   searchSingleCopy: computed(() => props.allowCopy && !props.multiple && props.filterable),
@@ -205,4 +207,6 @@ filterOrSearch: computed(() => props.filterable || props.searchable)
     ),
-    optionsAllDisabled: computed(() => state.options.filter((option) => option.visible).every((option) => option.disabled)),
-    collapseTagSize: computed(() => ~["small", "mini"].indexOf(state.selectSize) ? "mini" : "small"),
+    optionsAllDisabled: computed(
+      () => state.options.filter((option) => option.visible).every((option) => option.disabled)
+    ),
+    collapseTagSize: computed(() => state.selectSize),
     showNewOption: computed(
@@ -215,3 +219,5 @@ () => props.filterable && props.allowCreate && state.query !== "" && !state.options.filter((option) => !option.created).some((option) => option.state.currentLabel === state.query)
     collapseTags: computed(() => api2.computeCollapseTags()),
-    multipleLimit: computed(() => api2.computeMultipleLimit())
+    multipleLimit: computed(() => api2.computeMultipleLimit()),
+    isSelectAll: computed(() => state.selectCls === "checked-sur"),
+    isHalfSelect: computed(() => state.selectCls === "halfselect")
   }));
@@ -218,0 +224,0 @@ return state;

slide-bar/index.js

 import "../chunk-PKUHTIDK.js";
-import { emitEvent } from "@opentiny/vue-renderless/common/event";
+import { emitEvent } from "../common/event";
 const leftClick = ({ api, props, refs, state }) => () => {
@@ -4,0 +4,0 @@ if (state.leftLength >= 0) {

slider/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { emitEvent } from "@opentiny/vue-renderless/common/event";
-import { on, off, hasClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { toNumber } from "@opentiny/vue-renderless/common/string";
+import { KEY_CODE } from "../common";
+import { emitEvent } from "../common/event";
+import { on, off, hasClass } from "../common/deps/dom";
+import { toNumber } from "../common/string";
 const bindEvent = (api) => () => {
@@ -317,2 +317,44 @@ on(window, "resize", api.bindResize);
 };
+const getPoints = ({ props, state }) => () => {
+  if (props.showSteps && props.step > 0) {
+    state.points = [];
+    const num = parseInt(props.max / props.step);
+    for (let i = 1; i < num; i++) {
+      const point = {
+        position: i / num * 100 + "%",
+        value: i / num * props.max
+      };
+      state.points.push(point);
+    }
+  }
+};
+const getLabels = ({ props, state }) => () => {
+  if (props.showLabel) {
+    state.labels = [];
+    const isFunction = props.formatLabel instanceof Function;
+    const num = parseInt(props.max / props.step);
+    for (let i = 0; i <= num; i++) {
+      const val = i / num * props.max;
+      const label = {
+        position: i / num * 100 + "%",
+        label: isFunction ? props.formatLabel(val, i) : val,
+        value: val
+      };
+      state.labels.push(label);
+    }
+  }
+};
+const inputValueChange = ({ props, state, api }) => ($event, pos) => {
+  if (props.disabled || !state.isDouble)
+    return;
+  if (!/^\d+$/.test($event.target.value)) {
+    if (pos === "left") {
+      state.inputValue.splice(0, 1, state.leftBtnValue);
+    } else {
+      state.inputValue.splice(1, 1, state.rightBtnValue);
+    }
+    return;
+  }
+  api.initSlider([Math.min(...state.inputValue), Math.max(...state.inputValue)]);
+};
 export {
@@ -334,4 +376,7 @@ autoSlider,
   getActiveButtonValue,
+  getLabels,
+  getPoints,
   hideTip,
   initSlider,
+  inputValueChange,
   setActiveButtonValue,
@@ -338,0 +383,0 @@ setBarStyle,

slider/vue.js

@@ -26,3 +26,6 @@ import "../chunk-PKUHTIDK.js";
   watchActiveValue,
-  watchModelValue
+  watchModelValue,
+  getPoints,
+  getLabels,
+  inputValueChange
 } from "./index";
@@ -52,3 +55,4 @@ const api = [
   "customBeforeAppearHook",
-  "customAfterAppearHook"
+  "customAfterAppearHook",
+  "inputValueChange"
 ];
@@ -113,7 +117,14 @@ const initState = ({ reactive, computed, props, api: api2, parent }) => {
     watchModelValue: watchModelValue({ api: api2, state }),
-    watchActiveValue: watchActiveValue({ api: api2, emit, props, state })
+    watchActiveValue: watchActiveValue({ api: api2, emit, props, state }),
+    getPoints: getPoints({ props, state }),
+    getLabels: getLabels({ props, state }),
+    inputValueChange: inputValueChange({ props, api: api2, state })
   });
   watch(() => props.modelValue, api2.watchModelValue, { immediate: true });
   watch(() => state.activeValue, api2.watchActiveValue, { immediate: true });
-  onMounted(api2.bindEvent);
+  onMounted(() => {
+    api2.bindEvent();
+    api2.getPoints();
+    api2.getLabels();
+  });
   onBeforeUnmount(api2.unBindEvent);
@@ -120,0 +131,0 @@ return api2;

split/vue.js

@@ -17,3 +17,3 @@ import {
 } from "./index";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const api = ["state", "handleMousedown", "handleCollapse"];
@@ -20,0 +20,0 @@ const useOffset = ({ nextTick, props, refs, constants, hooks }) => {

steps/vue.js

 import "../chunk-PKUHTIDK.js";
-const api = [];
-const renderless = function() {
-  return {};
+import { updateStartIndex, isVisibleHandler, computedRightNodePos } from "./index";
+const api = ["state", "isVisibleHandler"];
+const renderless = (props, { reactive, watch, computed }) => {
+  const state = reactive({
+    startIndex: 0,
+    endIndex: computed(() => state.startIndex + props.visibleNum),
+    rightNodePositions: computed(() => api2.computedRightNodePos())
+  });
+  const api2 = {
+    updateStartIndex: updateStartIndex({ state, props }),
+    isVisibleHandler: isVisibleHandler({ state, props }),
+    computedRightNodePos: computedRightNodePos({ state, props })
+  };
+  watch(() => props.active, api2.updateStartIndex, { immediate: true });
+  return Object.assign(api2, { state });
 };
@@ -6,0 +18,0 @@ export {

switch/index.js

 import "../chunk-PKUHTIDK.js";
-import { isNull } from "@opentiny/vue-renderless/common/type";
+import { isNull } from "../common/type";
 const toggle = ({ emit, props, state }) => (event) => {
@@ -4,0 +4,0 @@ event.preventDefault();

switch/vue.js

@@ -16,3 +16,4 @@ import "../chunk-PKUHTIDK.js";
     formDisabled: computed(() => (parent.tinyForm || {}).disabled),
-    disabled: computed(() => props.disabled || state.formDisabled)
+    disabled: computed(() => props.disabled || state.formDisabled),
+    isDisplayOnly: computed(() => props.displayOnly || (parent.tinyForm || {}).displayOnly)
   });
@@ -19,0 +20,0 @@ Object.assign(api2, {

tab-bar/index.js

 import "../chunk-PKUHTIDK.js";
-import { POSITION } from "@opentiny/vue-renderless/common";
-import { capitalize } from "@opentiny/vue-renderless/common/string";
+import { POSITION } from "../common";
+import { capitalize } from "../common/string";
 const computedBarStyle = (parent) => (props, state) => {
@@ -5,0 +5,0 @@ const style = {};

tab-item/index.js

 import "../chunk-PKUHTIDK.js";
 const computedIsClosable = ({ parent, props }) => () => props.withClose || parent.withClose;
-const computedActive = ({ parent, nextTick, props, state }) => () => {
-  const active = parent.state.currentName === (props.name || state.index);
+const computedActive = ({ nextTick, props, state }) => () => {
+  const active = state.rootTabs.state.currentName === (props.name || state.index);
   if (active) {
@@ -6,0 +6,0 @@ state.loaded = true;

tab-item/vue.js

@@ -20,3 +20,3 @@ import "../chunk-PKUHTIDK.js";
     state,
-    computedActive: computedActive({ parent, nextTick, props, state }),
+    computedActive: computedActive({ nextTick, props, state }),
     computedPaneName: computedPaneName({ props, state })
@@ -23,0 +23,0 @@ });

tab-nav/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE, POSITION } from "@opentiny/vue-renderless/common";
-import { capitalize } from "@opentiny/vue-renderless/common/string";
-import { addResizeListener, removeResizeListener } from "@opentiny/vue-renderless/common/deps/resize-event";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { KEY_CODE, POSITION } from "../common";
+import { capitalize } from "../common/string";
+import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
+import { on, off } from "../common/deps/dom";
 const computedNavStyle = (state) => {
@@ -78,2 +78,3 @@ const dir = ~[POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) ? "X" : "Y";
   api.scrollIntoView();
+  api.sortableEvent();
 };
@@ -212,2 +213,71 @@ const beforeUnmount = ({ api, parent }) => {
 };
+const handleTabDragStart = ({ state, vm, emit }) => (event) => {
+  state.dragging = true;
+  if ([POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) === -1) {
+    emit("tab-drag-start", event);
+    return;
+  }
+  const navContainer = vm.$refs.navScroll;
+  const nav = vm.$refs.nav;
+  const containerWidth = navContainer.offsetWidth;
+  const navWidth = nav.offsetWidth;
+  if (navWidth > containerWidth) {
+    const navHeight = nav.offsetHeight;
+    navContainer.style.height = navHeight + "px";
+    nav.style.transition = "none";
+    nav.style.transform = "";
+    nav.style.width = containerWidth + "px";
+    nav.style.overflowX = "scroll";
+    nav.scrollTo(state.navOffset, 0);
+  }
+  emit("tab-drag-start", event);
+};
+const handleTabDragEnd = ({ vm, state, nextTick }) => () => {
+  state.dragging = false;
+  if ([POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) === -1) {
+    return;
+  }
+  const nav = vm.$refs.nav;
+  if (nav.style.width) {
+    const navOffset = nav.scrollLeft;
+    const navContainer = vm.$refs.navScroll;
+    navContainer.style.height = "";
+    nav.style.width = "";
+    nav.style.overflowX = "";
+    state.navOffset = navOffset;
+    nextTick(() => {
+      nav.style.transition = "";
+    });
+  }
+};
+const sortableEvent = ({ api, props, state, vm, emit, markRaw }) => () => {
+  if (!props.dropConfig || typeof props.dropConfig.plugin !== "function") {
+    return;
+  }
+  const navSortableObj = new props.dropConfig.plugin(vm.$refs.nav, {
+    sort: true,
+    draggable: ".tiny-tabs__item",
+    onUpdate(event) {
+      emit("tab-drag-end", event);
+    },
+    onMove(event) {
+      emit("tab-drag-over", event);
+    },
+    onStart(event) {
+      api.handleTabDragStart(event);
+    },
+    onEnd(event) {
+      api.handleTabDragEnd(event);
+    }
+  });
+  state.navSortableObj = markRaw(navSortableObj);
+};
+const watchCurrentName = ({ nextTick, vm, state }) => () => {
+  nextTick(() => {
+    const tabBarVnode = vm.$refs.tabBar;
+    if (tabBarVnode) {
+      tabBarVnode.state.barStyle = tabBarVnode.computedBarStyle(tabBarVnode, state);
+    }
+  });
+};
 export {
@@ -221,2 +291,4 @@ beforeUnmount,
   expandTabShow,
+  handleTabDragEnd,
+  handleTabDragStart,
   moreTabShow,
@@ -230,6 +302,8 @@ mounted,
   setFocus,
+  sortableEvent,
   updated,
   visibilityChangeHandler,
+  watchCurrentName,
   windowBlurHandler,
   windowFocusHandler
 };

tab-nav/vue.js

@@ -21,3 +21,7 @@ import "../chunk-PKUHTIDK.js";
   setFocus,
-  removeFocus
+  removeFocus,
+  sortableEvent,
+  handleTabDragStart,
+  handleTabDragEnd,
+  watchCurrentName
 } from "./index";
@@ -39,3 +43,3 @@ const api = [
 ];
-const renderless = (props, { computed, inject, onBeforeUnmount, onMounted, onUpdated, reactive }, { parent, refs, mode: tinyMode }) => {
+const renderless = (props, { computed, inject, onBeforeUnmount, onMounted, onUpdated, reactive, markRaw }, { parent, vm, nextTick, refs, mode: tinyMode, emit }) => {
   const api2 = { mounted, beforeUnmount, computedNavStyle, computedSizeName };
@@ -73,3 +77,7 @@ const state = reactive({
     scrollIntoView: scrollIntoView({ props, parent, refs, state }),
-    computedHeaderStyle: computedHeaderStyle({ refs, state })
+    computedHeaderStyle: computedHeaderStyle({ refs, state }),
+    watchCurrentName: watchCurrentName({ nextTick, vm, state }),
+    handleTabDragStart: handleTabDragStart({ state, vm, emit }),
+    handleTabDragEnd: handleTabDragEnd({ state, vm, nextTick }),
+    sortableEvent: sortableEvent({ api: api2, props, state, vm, emit, markRaw })
   });
@@ -76,0 +84,0 @@ Object.assign(api2, { updated: updated({ api: api2, props, refs, state }), changeTab: changeTab(api2) });

tabbar-item/index.js

 import "../chunk-PKUHTIDK.js";
-import { isObject, isNull } from "@opentiny/vue-renderless/common/type";
+import { isObject, isNull } from "../common/type";
 const getRouteActive = ({ props, route }) => () => {
@@ -4,0 +4,0 @@ if (props.to && route) {

tabbar-item/vue.js

 import "../chunk-PKUHTIDK.js";
 import { getRouteActive, onClick, bindChildren, routeTab } from "./index";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
+import { xss } from "../common/xss.js";
 const api = ["state", "onClick"];
@@ -5,0 +5,0 @@ const renderless = (props, { computed, onMounted, reactive }, { parent, emit, nextTick, route, router }) => {

tabs/index.js

@@ -30,3 +30,3 @@ import "../chunk-PKUHTIDK.js";
 };
-const calcMorePanes = ({ parent, props, state }) => () => {
+const calcMorePanes = ({ parent, props, state, refs }) => () => {
   if (!props.showMoreTabs) {
@@ -37,9 +37,9 @@ return;
   const tabs = el.querySelectorAll(".tiny-tabs__item");
-  if (tabs && tabs.length) {
-    const tabsHeaderWidth = el.querySelector(".tiny-tabs__nav-scroll").clientWidth + 15;
-    let tabsAllWidth = 0;
-    for (let i = 0, length = tabs.length; i < length; i++) {
-      const width = tabs[i].offsetWidth;
-      tabsAllWidth += width;
-      if (tabsAllWidth > tabsHeaderWidth) {
+  const navRef = refs.nav.$refs;
+  const NavWidth = navRef.nav.offsetWidth || 0;
+  const tabsHeaderWidth = navRef.navScroll.offsetWidth || 0;
+  if (NavWidth > tabsHeaderWidth) {
+    for (let i = 0; i < tabs.length; i++) {
+      const isHiddenWidth = tabs[i].offsetLeft + tabs[i].offsetWidth / 2;
+      if (isHiddenWidth > tabsHeaderWidth) {
         state.showPanesCount = i;
@@ -65,3 +65,2 @@ break;
   }
-  event.stopPropagation();
   api.setCurrentName(tabName);
@@ -68,0 +67,0 @@ emit("click", pane, event);

tabs/vue.js

@@ -75,3 +75,3 @@ import "../chunk-PKUHTIDK.js";
     changeCurrentName: changeCurrentName({ emit, state }),
-    calcMorePanes: calcMorePanes({ parent, props, state }),
+    calcMorePanes: calcMorePanes({ parent, props, state, refs }),
     calcExpandPanes: calcExpandPanes({ parent, props, state }),
@@ -78,0 +78,0 @@ calcPaneInstances: calcPaneInstances({ constants, parent, state, childrenHandler }),

tag/index.js

 import "../chunk-PKUHTIDK.js";
-const handleClose = ({ emit, props }) => (event) => {
+const handleClose = ({ emit, props, state }) => (event) => {
+  if (props.disabled)
+    return;
   event.stopPropagation();
+  state.show = false;
   const close = () => emit("close", event);
   props.beforeDelete ? props.beforeDelete(close) : close();
 };
-const handleClick = ({ emit, parent }) => (event) => {
+const handleClick = ({ emit, props, parent, state }) => (event) => {
+  if (props.selectable || props.disabled)
+    return;
   parent.$parent && parent.$parent.tagSelectable && event.stopPropagation();
+  state.selected = !state.selected;
   emit("click", event);
@@ -10,0 +16,0 @@ };

tag/vue.js

 import "../chunk-PKUHTIDK.js";
 import { handleClose, handleClick } from "./index";
-const api = ["handleClose", "handleClick"];
-const renderless = (props, hooks, { emit, parent }) => ({
-  handleClose: handleClose({ emit, props }),
-  handleClick: handleClick({ emit, parent })
-});
+const api = ["state", "handleClose", "handleClick"];
+const renderless = (props, { reactive, computed }, { emit, parent }) => {
+  const state = reactive({
+    type: computed(() => props.theme || props.type),
+    show: true,
+    selected: false
+  });
+  const api2 = {
+    handleClose: handleClose({ emit, props, state }),
+    handleClick: handleClick({ emit, props, parent, state })
+  };
+  return Object.assign(api2, { state });
+};
 export {
@@ -9,0 +17,0 @@ api,

tall-storage/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { KEY_CODE } from "../common";
 const mousedown = (event) => {
@@ -4,0 +4,0 @@ if (event && event.preventDefault) {

tall-storage/vue.js

 import "../chunk-PKUHTIDK.js";
 import { mousedown, selectItem, keydown } from "./index";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
+import { on, off } from "../common/deps/dom";
 const api = ["state", "mousedown", "selectItem"];
@@ -5,0 +5,0 @@ const renderless = (props, { onUnmounted, reactive, watch }, { emit }) => {

time-line/index.js

 import "../chunk-PKUHTIDK.js";
-import { format } from "@opentiny/vue-renderless/common/date";
+import { format } from "../common/date";
 const getDate = (dateTime) => ({
@@ -12,11 +12,19 @@ date: format(dateTime, "yyyy-MM-dd"),
 const handleClick = ({ emit, state }) => ({ index, node }) => {
-  emit("click", state.isReverse ? state.nodes.length - index - 1 : index, node);
+  if (!node.disabled) {
+    emit("click", state.isReverse ? state.nodes.length - index - 1 : index, node);
+  }
 };
-const getStatusCls = ({ constants, state }) => (index) => {
-  const { PROCESS_DONE_CLS, PROCESS_CUR_CLS, PROCESS_WAIT_CLS } = constants;
+const getStatusCls = ({ constants, state }) => (index, node) => {
+  const { PROCESS_DONE_CLS, PROCESS_CUR_CLS, PROCESS_WAIT_CLS, PROCESS_DISABLED_CLS, PROCESS_ERROR_CLS } = constants;
   const cls = {};
   const reverse = state.isReverse;
-  cls[PROCESS_DONE_CLS] = reverse ? index > state.current : index < state.current;
-  cls[PROCESS_CUR_CLS] = index === state.current;
-  cls[PROCESS_WAIT_CLS] = reverse ? index < state.current : index > state.current;
+  if (node == null ? void 0 : node.disabled) {
+    cls[PROCESS_DISABLED_CLS] = true;
+  } else if (node == null ? void 0 : node.error) {
+    cls[PROCESS_ERROR_CLS] = true;
+  } else {
+    cls[PROCESS_DONE_CLS] = reverse ? index > state.current : index < state.current;
+    cls[PROCESS_CUR_CLS] = index === state.current;
+    cls[PROCESS_WAIT_CLS] = reverse ? index < state.current : index > state.current;
+  }
   return cls;
@@ -27,6 +35,19 @@ };
 const computedIsReverse = (props) => () => props.reverse && props.vertical;
+const computedStackNodes = ({ state, constants }) => () => {
+  if (state.nodes.length >= constants.STACK_NODES_MAX) {
+    state.showData = true;
+    return state.nodes.slice(0, constants.LIMITED_STACK_NODES);
+  }
+  return state.nodes;
+};
+const changeStatus = ({ state }) => () => {
+  state.showAll = !state.showAll;
+  return state.showAll;
+};
 export {
+  changeStatus,
   computedCurrent,
   computedData,
   computedIsReverse,
+  computedStackNodes,
   getDate,
@@ -33,0 +54,0 @@ getStatus,

time-line/vue.js

 import "../chunk-PKUHTIDK.js";
-import { handleClick, getStatusCls, getStatus, computedData, getDate, computedCurrent, computedIsReverse } from "./index";
-const api = ["state", "handleClick", "getStatusCls", "getStatus", "getDate"];
+import { handleClick, getStatusCls, getStatus, computedData, getDate, computedCurrent, computedIsReverse, changeStatus, computedStackNodes } from "./index";
+const api = ["state", "handleClick", "getStatusCls", "getStatus", "getDate", "changeStatus"];
 const renderless = (props, { computed, reactive }, { t, emit, constants }) => {
@@ -9,3 +9,6 @@ const api2 = {};
     current: computed(() => api2.computedCurrent()),
-    isReverse: computed(() => api2.computedIsReverse())
+    isReverse: computed(() => api2.computedIsReverse()),
+    stackNodes: computed(() => state.showAll ? state.nodes : api2.computedStackNodes()),
+    showData: false,
+    showAll: false
   });
@@ -20,3 +23,5 @@ Object.assign(api2, {
     handleClick: handleClick({ emit, state, api: api2 }),
-    getStatusCls: getStatusCls({ constants, props, state })
+    getStatusCls: getStatusCls({ constants, props, state }),
+    computedStackNodes: computedStackNodes({ state, constants }),
+    changeStatus: changeStatus({ state })
   });
@@ -23,0 +28,0 @@ return api2;

time-panel/index.js

 import "../chunk-PKUHTIDK.js";
-import scrollIntoView from "@opentiny/vue-renderless/common/deps/scroll-into-view";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import scrollIntoView from "../common/deps/scroll-into-view";
+import { DATEPICKER } from "../common";
 const parseTime = () => (time) => {
@@ -5,0 +5,0 @@ const values = (time || "").split(":");

time-panel/vue.js

@@ -19,3 +19,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { DATEPICKER } from "../common";
 const api = ["state", "handleMenuEnter", "handleClick", "handleClear", "emitDestroy"];
@@ -22,0 +22,0 @@ const initState = ({ reactive, computed, api: api2 }) => {

time-range/index.js

 import "../chunk-PKUHTIDK.js";
-import { clearMilliseconds, timeWithinRange, limitTimeRange, modifyDate } from "@opentiny/vue-renderless/common/deps/date-util";
+import { clearMilliseconds, timeWithinRange, limitTimeRange, modifyDate } from "../common/deps/date-util";
 const minTimeOfDay = ({ MIN_TIME }) => (date) => modifyDate(MIN_TIME, date.getFullYear(), date.getMonth(), date.getDate());
@@ -4,0 +4,0 @@ const maxTimeOfDay = ({ MAX_TIME }) => (date) => modifyDate(MAX_TIME, date.getFullYear(), date.getMonth(), date.getDate());

time-range/vue.js

@@ -21,3 +21,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { parseDate } from "@opentiny/vue-renderless/common/deps/date-util";
+import { parseDate } from "../common/deps/date-util";
 const api = ["state", "handleMinChange", "handleConfirm", "setMinSelectionRange", "handleCancel", "setMaxSelectionRange", "handleMaxChange"];
@@ -24,0 +24,0 @@ const initState = ({ reactive, computed, refs, api: api2 }) => {

time-spinner/index.js

 import "../chunk-PKUHTIDK.js";
-import { modifyTime } from "@opentiny/vue-renderless/common/deps/date-util";
-import { DATEPICKER } from "@opentiny/vue-renderless/common";
+import { modifyTime } from "../common/deps/date-util";
+import { DATEPICKER } from "../common";
 const getArrowHourList = (state) => () => {
@@ -5,0 +5,0 @@ const hours = state.hours;

time-spinner/vue.js

@@ -21,3 +21,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { getRangeHours, getRangeMinutes } from "@opentiny/vue-renderless/common/deps/date-util";
+import { getRangeHours, getRangeMinutes } from "../common/deps/date-util";
 const api = ["state", "emitSelectRange", "adjustCurrentSpinner", "handleClick", "decrease", "increase", "amPm", "adjustSpinners"];
@@ -24,0 +24,0 @@ const initState = ({ reactive, computed, props, api: api2 }) => {

time/index.js

 import "../chunk-PKUHTIDK.js";
-import { limitTimeRange, clearMilliseconds, timeWithinRange } from "@opentiny/vue-renderless/common/deps/date-util";
+import { limitTimeRange, clearMilliseconds, timeWithinRange } from "../common/deps/date-util";
 const watchValue = ({ api, nextTick, state }) => (value) => {
@@ -4,0 +4,0 @@ let date;

time/vue.js

@@ -14,4 +14,4 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { compuAmPmMode } from "@opentiny/vue-renderless/time-range";
-import { isDate } from "@opentiny/vue-renderless/common/deps/date-util";
+import { compuAmPmMode } from "../time-range";
+import { isDate } from "../common/deps/date-util";
 const api = ["state", "handleChange", "setSelectionRange", "handleCancel", "handleConfirm", "adjustSpinners"];
@@ -18,0 +18,0 @@ const initState = ({ reactive, props, computed, api: api2 }) => {

toggle-menu/index.js

 import "../chunk-PKUHTIDK.js";
-import { xss } from "@opentiny/vue-renderless/common/xss.js";
-import { isObject } from "@opentiny/vue-renderless/common/type";
+import { xss } from "../common/xss.js";
+import { isObject } from "../common/type";
 const filterNode = (props) => (value, data) => {
@@ -5,0 +5,0 @@ const node = data[props.props.label || "label"] || "";

toggle-menu/vue.js

@@ -19,3 +19,3 @@ import "../chunk-PKUHTIDK.js";
 } from "./index";
-import { setMenuKey } from "@opentiny/vue-renderless/tree-menu";
+import { setMenuKey } from "../tree-menu";
 const api = [
@@ -22,0 +22,0 @@ "state",

tooltip/index.js

 import "../chunk-PKUHTIDK.js";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import { on, off, addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
+import debounce from "../common/deps/debounce";
+import { on, off, addClass, removeClass } from "../common/deps/dom";
 const show = ({ api, state, props }) => () => {
@@ -115,5 +115,10 @@ if (props.visible === "auto") {
 };
-const bindPopper = ({ vm, refs, nextTick }) => (el) => {
+const bindPopper = ({ vm, refs, nextTick, popperVmRef }) => (el) => {
   nextTick(() => vm.bindEvent(el));
   if (vm.popperVM) {
+    if (!vm.$refs.popper) {
+      popperVmRef.popper = vm.popperVM.$el;
+    } else {
+      popperVmRef.popper = vm.$refs.popper;
+    }
     refs.popper || (refs.popper = vm.popperVM.$el);
@@ -127,2 +132,22 @@ nextTick(() => {
 };
+const observeCallback = ({ state, popperVmRef }) => (mutationsList) => {
+  for (let mutation of mutationsList) {
+    if (mutation.type === "attributes" && mutation.attributeName === "x-placement") {
+      state.xPlacement = popperVmRef.popper.getAttribute("x-placement") || "bottom";
+    }
+  }
+};
+const handleDocumentClick = ({ props, api, state, popperVmRef }) => (event) => {
+  if (props.manual)
+    return;
+  const reference = state.referenceElm;
+  const $el = popperVmRef.popper;
+  if (!$el || !reference || $el.contains(event.target) || reference.contains(event.target)) {
+    return;
+  }
+  if (state.showPopper) {
+    api.setExpectedState(false);
+    api.debounceClose();
+  }
+};
 export {
@@ -136,5 +161,7 @@ bindEvent,
   handleClosePopper,
+  handleDocumentClick,
   handleFocus,
   handleShowPopper,
   hide,
+  observeCallback,
   removeFocusing,
@@ -141,0 +168,0 @@ setExpectedState,

tooltip/vue.js

@@ -16,6 +16,8 @@ import "../chunk-PKUHTIDK.js";
   bindPopper,
-  focusHandler
+  focusHandler,
+  observeCallback,
+  handleDocumentClick
 } from "./index";
-import userPopper from "@opentiny/vue-renderless/common/deps/vue-popper";
-import { guid } from "@opentiny/vue-renderless/common/string";
+import userPopper from "../common/deps/vue-popper";
+import { guid } from "../common/string";
 const api = [
@@ -33,5 +35,6 @@ "state",
   "updatePopper",
-  "focusHandler"
+  "focusHandler",
+  "markRaw"
 ];
-const initState = ({ reactive, showPopper, popperElm, referenceElm, props }) => reactive({
+const initState = ({ reactive, showPopper, popperElm, referenceElm, props, markRaw, inject }) => reactive({
   showPopper,
@@ -45,12 +48,18 @@ popperElm,
   tooltipId: guid("tiny-tooltip-", 4),
-  tabindex: props.tabindex
+  tabindex: props.tabindex,
+  xPlacement: "bottom",
+  poppers: markRaw([]),
+  showContent: inject("showContent", null),
+  tipsMaxWidth: inject("tips-max-width", null)
 });
-const renderless = (props, { watch, toRefs, reactive, onBeforeUnmount, onDeactivated, onMounted, onUnmounted }, { vm, emit, refs, slots, nextTick, parent }) => {
+const renderless = (props, { watch, toRefs, reactive, onBeforeUnmount, onDeactivated, onMounted, onUnmounted, markRaw, inject }, { vm, emit, refs, slots, nextTick, parent }) => {
   const api2 = {};
   const popperParam = { emit, props, nextTick, toRefs, reactive, parent, refs };
+  const popperVmRef = {};
   Object.assign(popperParam, { slots, onBeforeUnmount, onDeactivated, watch });
   const { showPopper, updatePopper, popperElm, referenceElm, doDestroy } = userPopper(popperParam);
-  const state = initState({ reactive, showPopper, popperElm, referenceElm, props });
+  const state = initState({ reactive, showPopper, popperElm, referenceElm, props, markRaw, inject });
   Object.assign(api2, {
     state,
+    markRaw,
     doDestroy,
@@ -61,3 +70,3 @@ updatePopper,
     destroyed: destroyed({ state, api: api2 }),
-    bindPopper: bindPopper({ vm, refs, nextTick }),
+    bindPopper: bindPopper({ vm, refs, nextTick, popperVmRef }),
     watchFocusing: watchFocusing(state),
@@ -72,3 +81,5 @@ removeFocusing: removeFocusing(state),
     bindEvent: bindEvent({ api: api2, state, vm }),
-    focusHandler: focusHandler({ slots, api: api2 })
+    focusHandler: focusHandler({ slots, api: api2 }),
+    handleDocumentClick: handleDocumentClick({ props, api: api2, state, popperVmRef }),
+    observeCallback: observeCallback({ state, popperVmRef })
   });
@@ -80,5 +91,15 @@ watch(() => state.focusing, api2.watchFocusing);
   );
-  onMounted(api2.bindPopper);
+  onMounted(() => {
+    api2.bindPopper();
+    if (props.genArrowByHtml) {
+      const config = { attributes: true, childList: false, subtree: false };
+      api2.observer = new MutationObserver(api2.observeCallback);
+      api2.observer.observe(popperVmRef.popper, config);
+    }
+  });
   vm.$on("tooltip-update", api2.bindPopper);
-  onUnmounted(api2.destroyed);
+  onUnmounted(() => {
+    api2.destroyed();
+    api2.observer && api2.observer.disconnect();
+  });
   return api2;
@@ -85,0 +106,0 @@ };

top-box/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import PopupManager from "@opentiny/vue-renderless/common/deps/popup-manager";
+import { KEY_CODE } from "../common";
+import { on, off } from "../common/deps/dom";
+import PopupManager from "../common/deps/popup-manager";
 const handleAfterLeave = (api) => () => api.destroy();
@@ -6,0 +6,0 @@ const destroy = (parent) => () => {

transfer-panel/index.js

 import "../chunk-PKUHTIDK.js";
-import { copyArray } from "@opentiny/vue-renderless/common/object";
-import { getFlatData } from "@opentiny/vue-renderless/transfer";
+import { copyArray } from "../common/object";
+import { getFlatData } from "../transfer";
 const showFilterData = (data, sign) => {
@@ -5,0 +5,0 @@ const getChild = (data2, sign2) => data2.filter((node) => {

transfer/index.js

 import "../chunk-PKUHTIDK.js";
-import { copyArray } from "@opentiny/vue-renderless/common/object";
+import { copyArray } from "../common/object";
 const getObj = (props) => () => props.data.reduce((o, cur) => (o[cur[props.props.key]] = cur) && o, {});
@@ -4,0 +4,0 @@ const getSourceData = ({ props, Tree }) => () => {

tree-node/index.js

 import {
   __spreadValues
 } from "../chunk-PKUHTIDK.js";
-import { getNodeKey as getTreeNodeKey } from "@opentiny/vue-renderless/common/deps/tree-model/util";
+import { getNodeKey as getTreeNodeKey } from "../common/deps/tree-model/util";
 const watchIndeterminate = ({ api, props }) => (value) => api.handleSelectChange(props.node.checked, value);
@@ -6,0 +6,0 @@ const watchChecked = ({ api, props }) => (value) => api.handleSelectChange(value, props.node.indeterminate);

tree/index.js

 import "../chunk-PKUHTIDK.js";
-import { getNodeKey as innerGetNodekey } from "@opentiny/vue-renderless/common/deps/tree-model/util";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
-import TreeStore from "@opentiny/vue-renderless/common/deps/tree-model/tree-store";
-import { addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { on, off } from "@opentiny/vue-renderless/common/deps/dom";
-import { getDataset } from "@opentiny/vue-renderless/common/dataset";
+import { getNodeKey as innerGetNodekey } from "../common/deps/tree-model/util";
+import { KEY_CODE } from "../common";
+import TreeStore from "../common/deps/tree-model/tree-store";
+import { addClass, removeClass } from "../common/deps/dom";
+import { on, off } from "../common/deps/dom";
+import { getDataset } from "../common/dataset";
 const setChildren = (props) => (data) => props.data = data;
@@ -9,0 +9,0 @@ const getChildren = () => (props) => props.data;

tree/vue.js

 import "../chunk-PKUHTIDK.js";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
+import debounce from "../common/deps/debounce";
 import {
@@ -4,0 +4,0 @@ computedShowEmptyText,

upload-dragger/index.js

@@ -36,5 +36,9 @@ import "../chunk-PKUHTIDK.js";
 };
+const watchDragover = ({ state, constants }) => () => {
+  state.uploader.$refs[constants.FILE_UPLOAD_INNER].$emit("drag-over", state.dragover);
+};
 export {
   onDragOver,
-  onDrop
+  onDrop,
+  watchDragover
 };

upload-dragger/vue.js

 import "../chunk-PKUHTIDK.js";
-import { onDragOver, onDrop } from "./index";
+import { onDragOver, onDrop, watchDragover } from "./index";
 const api = ["state", "onDragOver", "onDrop"];
-const renderless = (props, { inject, reactive, ref }, { emit }) => {
+const renderless = (props, { inject, reactive, ref, watch }, { emit }) => {
   const state = reactive({
@@ -9,7 +9,13 @@ dragover: false,
   });
+  const constants = state.uploader.$constants || {};
   const api2 = {
     state,
     onDragOver: onDragOver({ props, state }),
-    onDrop: onDrop({ emit, props, state })
+    onDrop: onDrop({ emit, props, state }),
+    watchDragover: watchDragover({ state, constants })
   };
+  watch(
+    () => state.dragover,
+    () => api2.watchDragover()
+  );
   return api2;
@@ -16,0 +22,0 @@ };

upload-list/index.js

 import "../chunk-PKUHTIDK.js";
+import { xss } from "../common/xss";
+import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 const parsePercentage = () => (val) => parseInt(val, 10);
 const handleClick = ({ props, api, parent }) => (file) => {
   if (parent.state.isEdm) {
-    props.openDownloadFile && api.edmDownloadFile(file);
+    const { downloadFile: downloadFile2 } = api.getApi();
+    props.openDownloadFile && downloadFile2 && downloadFile2(file);
   } else {
@@ -17,3 +20,3 @@ props.openDownloadFile && api.downloadFile(file);
   } else if (data && typeof data === "object") {
-    for (let key of Object.keys(data)) {
+    for (let key in data) {
       responseFile = data[key];
@@ -24,10 +27,9 @@ break;
   if (responseFile) {
-    const getFileDownloadUrl = service && service.common && service.common.getFileDownloadUrl;
-    getFileDownloadUrl && getFileDownloadUrl().then((url) => {
-      window.open(url + "&id=" + responseFile.attachmentId + "&type=AttachmentDemo").opener = null;
+    service.getFileDownloadUrl().then((url) => {
+      window.open(xss.filterUrl(url + "&id=" + responseFile.attachmentId + "&type=AttachmentDemo")).opener = null;
     });
   } else if (file.url) {
-    window.open(file.url).opener = null;
+    window.open(xss.filterUrl(file.url)).opener = null;
   } else {
-    throw new Error("[tiny Error][FileUpload]file.url must not be empty");
+    throw new Error("[TINY Error][FileUpload]file.url must not be empty");
   }
@@ -42,8 +44,156 @@ };
 };
+const showOperatePanel = ({ state }) => ({ file }) => {
+  state.currentFile = file;
+  state.showPanel = true;
+};
+const reUpload = ({ emit, props, parent }) => (file) => {
+  parent.state.isEdm ? emit("start", [file && file.raw], "", true) : props.handleReUpload && props.handleReUpload(file);
+};
+const addPlayEventListener = ({ type, el }, fn) => el && el.addEventListener(type, fn);
+const removePlayEventListener = ({ type, el }, fn) => el && el.removeEventListener(type, fn);
+const play = ({ vm, api }) => ({ file, index, type }) => {
+  const videoOrAudioEle = vm.$refs[type + (file.uid || index)] && vm.$refs[type + (file.uid || index)][index];
+  if (file.isPlay)
+    return api.pause({ file, index, type });
+  if (videoOrAudioEle && videoOrAudioEle.play) {
+    file.playEvent = () => {
+      if (file) {
+        file.isPlay = false;
+        removePlayEventListener({ type: "ended", el: videoOrAudioEle }, file.playEvent);
+      }
+    };
+    file.el = videoOrAudioEle;
+    removePlayEventListener({ type: "ended", el: videoOrAudioEle }, file.playEvent);
+    addPlayEventListener({ type: "ended", el: videoOrAudioEle }, file.playEvent);
+    vm.$set(file, "isPlay", true);
+    videoOrAudioEle.play();
+  }
+};
+const pause = ({ vm }) => ({ file, index, type }) => {
+  const videoOrAudioEle = vm.$refs[type + (file.uid || index)] && vm.$refs[type + (file.uid || index)][index];
+  if (videoOrAudioEle && videoOrAudioEle.pause) {
+    removePlayEventListener({ type: "ended", el: videoOrAudioEle }, file.playEvent);
+    file.isPlay = false;
+    videoOrAudioEle.pause();
+  }
+};
+const handleLoadedmetadata = ({ vm }) => ({ e, file }) => {
+  vm.$set(file, "totalSecond", parseInt(e.target.duration));
+  vm.$set(file, "currentSecond", parseInt(e.target.currentTime));
+};
+const handleTimeupdate = () => ({ e, file }) => {
+  file.currentSecond = parseInt(e.target.currentTime);
+};
+const getFileType = () => ({ file }) => file.name && file.name.split(".")[file.name.split(".").length - 1].toLowerCase();
+const getFileIcon = () => ({ type }) => {
+  let iconTypes = {
+    "xls/xlsx": {
+      name: "icon-excel-type",
+      color: "#00A2B5"
+    },
+    file: {
+      name: "icon-file-type",
+      color: "#71C14C"
+    },
+    pdf: {
+      name: "icon-pdf-type",
+      color: "#FC916E"
+    },
+    "png/jpg/jpeg/gif/svg/webp/bmp/tif/pjp/apng/xbm/jxl/svgz/ico/tiff/jfif/pjpeg/avif": {
+      name: "icon-picture-type",
+      color: "#2E94FF"
+    },
+    "ppt/pptx": {
+      name: "icon-ppt-type",
+      color: "#F46087"
+    },
+    txt: {
+      name: "icon-text-type",
+      color: "#9185F0"
+    },
+    "doc/docx": {
+      name: "icon-word-type",
+      color: "#2070F3"
+    },
+    "zip/rar/arj/z/jar/lzh": {
+      name: "icon-zip-type",
+      color: "#FDC000"
+    },
+    "mp4/ogg/webm": {
+      name: "icon-video-type",
+      color: "#2E94FF"
+    },
+    "mp3/ogg/wav": {
+      name: "icon-audio",
+      color: "#2E94FF"
+    },
+    default: {
+      name: "icon-other-type",
+      color: "#9185F0"
+    }
+  };
+  for (const typeName in iconTypes) {
+    if (Object.hasOwnProperty.call(iconTypes, typeName)) {
+      const typeValue = iconTypes[typeName];
+      delete iconTypes[typeName];
+      typeName.split("/").forEach((type2) => iconTypes[type2] = typeValue);
+    }
+  }
+  return iconTypes[type] || iconTypes["default"];
+};
+const remove = ({ emit }) => ({ file }) => emit("remove", file);
+const calcUploadListLiWidth = ({ vm, nextTick, props, constants }) => () => {
+  const { listType } = props, { LIST_TYPE } = constants;
+  nextTick(() => {
+    const uploadListEle = vm.$refs["upload-list"];
+    const uploadListLiEle = vm.$refs["upload-list-li"];
+    if (!uploadListEle || !(uploadListLiEle && uploadListLiEle[0]))
+      return;
+    if (listType === LIST_TYPE.TEXT) {
+      const { minWidth } = window.getComputedStyle(uploadListLiEle && uploadListLiEle[0]);
+      const marginRight = 8;
+      const num = Math.floor(uploadListEle.offsetWidth / (parseFloat(minWidth) + marginRight));
+      Array.from(uploadListLiEle).forEach((li, index) => {
+        if (!((index + 1) % num) || num === 1) {
+          li.style.marginRight = 0;
+          li.style.width = `${100 / num}%`;
+        } else {
+          li.style.marginRight = `${marginRight}px`;
+          li.style.width = `calc(${100 / num}% - ${marginRight}px)`;
+        }
+      });
+    }
+  });
+};
+const mounted = ({ api, vm }) => () => {
+  const el = vm.$refs["upload-list"];
+  el && addResizeListener(el, api.calcUploadListLiWidth);
+};
+const destroyed = ({ api, props, vm }) => () => {
+  removeResizeListener(vm.$refs["upload-list"], api.calcUploadListLiWidth);
+  props.files.forEach((file) => {
+    removePlayEventListener({ type: "ended", el: file.el }, file.playEvent);
+    delete file.playEvent;
+    delete file.isPlay;
+    delete file.el;
+  });
+};
 export {
+  calcUploadListLiWidth,
+  destroyed,
   downloadFile,
   getDeleteData,
+  getFileIcon,
+  getFileType,
   handleClick,
+  handleLoadedmetadata,
+  handleTimeupdate,
+  mounted,
   parsePercentage,
-  picturefilePreview
+  pause,
+  picturefilePreview,
+  play,
+  reUpload,
+  remove,
+  showOperatePanel
 };

upload-list/vue.js

 import "../chunk-PKUHTIDK.js";
-import { parsePercentage, handleClick, picturefilePreview, getDeleteData, downloadFile } from "./index";
-import { downloadFile as edmDownloadFile, getToken } from "@opentiny/vue-renderless/file-upload";
-const api = ["t", "state", "parsePercentage", "handleClick", "handlePreview", "picturefilePreview", "getDeleteData", "downloadFile"];
-const renderless = (props, { reactive }, { t, parent, mode: tinyMode, emit, service }, { Modal }) => {
-  const mode = props._mode || parent.$mode || (tinyMode ? tinyMode.value ? tinyMode.value : "pc" : "pc");
+import {
+  parsePercentage,
+  handleClick,
+  picturefilePreview,
+  getDeleteData,
+  downloadFile,
+  play,
+  pause,
+  handleLoadedmetadata,
+  handleTimeupdate,
+  destroyed,
+  showOperatePanel,
+  getFileType,
+  getFileIcon,
+  mounted,
+  calcUploadListLiWidth,
+  reUpload,
+  remove
+} from "./index";
+import { getToken, initService } from "../file-upload";
+import { getApi } from "../file-upload/vue";
+const api = [
+  "t",
+  "state",
+  "parsePercentage",
+  "handleClick",
+  "handlePreview",
+  "picturefilePreview",
+  "getDeleteData",
+  "downloadFile",
+  "play",
+  "pause",
+  "handleLoadedmetadata",
+  "handleTimeupdate",
+  "showOperatePanel",
+  "getFileType",
+  "getFileIcon",
+  "reUpload",
+  "remove"
+];
+const renderless = (props, { reactive, onMounted, onUnmounted, watch }, { t, parent, mode, emit, service, vm, nextTick }, { Modal }) => {
+  const api2 = { getApi };
+  parent = parent.$parent;
+  const constants = parent.$constants;
+  const $service = initService({ props, service });
   const state = reactive({
@@ -11,28 +51,40 @@ focusing: false,
     startPostion: 0,
-    screenType: mode !== "pc"
+    screenType: mode === "mobile" ? true : false,
+    showPanel: false
   });
-  parent.getToken = getToken({
-    constants: parent.$constants,
-    props: parent,
-    state: parent.state,
-    t,
-    Modal
-  });
-  const api2 = {
+  parent.getToken = getToken({ constants, props: parent, state: parent.state, t, Modal });
+  Object.assign(api2, {
     state,
     getDeleteData: getDeleteData(emit),
     parsePercentage: parsePercentage(),
-    downloadFile: downloadFile(service),
+    downloadFile: downloadFile($service),
     picturefilePreview: picturefilePreview(state),
-    edmDownloadFile: edmDownloadFile({
-      api: parent,
-      constants: parent.$constants,
-      props: parent,
-      service,
-      state: parent.state
-    })
-  };
-  Object.assign(api2, {
-    handleClick: handleClick({ props, api: api2, parent })
+    handleClick: handleClick({ props, api: api2, parent }),
+    play: play({ vm, api: api2 }),
+    pause: pause({ vm }),
+    handleLoadedmetadata: handleLoadedmetadata({ vm }),
+    handleTimeupdate: handleTimeupdate(),
+    destroyed: destroyed({ api: api2, props, vm }),
+    showOperatePanel: showOperatePanel({ state }),
+    getFileType: getFileType(),
+    getFileIcon: getFileIcon(),
+    mounted: mounted({ api: api2, vm }),
+    calcUploadListLiWidth: calcUploadListLiWidth({ vm, nextTick, props, constants }),
+    reUpload: reUpload({ emit, props, parent }),
+    remove: remove({ emit })
   });
+  props.listType === constants.LIST_TYPE.DRAG_SINGLE && watch(
+    () => props.files && props.files[0],
+    (file) => {
+      if (file && file.status === constants.FILE_STATUS.FAIL) {
+        setTimeout(() => {
+          api2.remove({ file });
+        }, 2e3);
+      }
+    },
+    { immediate: true, deep: true }
+  );
+  watch(() => props.files, api2.calcUploadListLiWidth);
+  onMounted(api2.mounted);
+  onUnmounted(api2.destroyed);
   return api2;
@@ -39,0 +91,0 @@ };

upload/index.js

 import "../chunk-PKUHTIDK.js";
-import { KEY_CODE } from "@opentiny/vue-renderless/common";
+import { KEY_CODE } from "../common";
 const isImage = (str) => str.includes("image");
@@ -4,0 +4,0 @@ const handleChange = (api) => (event) => {

upload/vue.js

@@ -25,4 +25,4 @@ import "../chunk-PKUHTIDK.js";
     accecpt: "",
-    isEdm: computed(() => parent.state.isEdm),
-    openEdmDownload: computed(() => parent.edm.download),
+    isEdm: computed(() => state.uploader.$refs[constants.FILE_UPLOAD_INNER].state.isEdm),
+    openEdmDownload: computed(() => state.uploader.$refs[constants.FILE_UPLOAD_INNER].edm.download),
     headers: computed(() => {
@@ -29,0 +29,0 @@ if (state.isEdm) {

user-account/vue.js

 import "../chunk-PKUHTIDK.js";
-import { initService } from "@opentiny/vue-renderless/user";
+import { initService } from "../user";
 import { init } from "./index";
@@ -4,0 +4,0 @@ const api = ["state"];

user-contact/index.js

 import "../chunk-PKUHTIDK.js";
-const getUserHref = ({ props }) => () => {
+import { xss } from "../common/xss";
+const getUserHref = ({ api, props }) => () => {
   let href = "javascript:;";
   if (!props.isNewImMode) {
-    href = "javascript:;";
+    const data = props.data;
+    const roleNumber = data.roleNumber ? data.roleNumber.toLocaleLowerCase() : "";
+    if (roleNumber && api.testUID(roleNumber)) {
+      href = `im:${roleNumber}`;
+      return xss.filterUrl(href);
+    }
   }
   return href;
 };
+const doUserAction = ({ api, props, state, eSpaceCtrl }) => () => {
+  if (props.isNewImMode) {
+    if (eSpaceCtrl) {
+      if (state.initialized) {
+        api.openEspace();
+      } else {
+        api.initEspaceLink();
+      }
+    }
+  }
+};
+const initEspaceLink = ({ api, props, state, eSpaceCtrl, eSpaceCtrlDisabled }) => () => {
+  const flag = localStorage.getItem("eSpaceCtrl_initialized");
+  if (Number(flag)) {
+    state.initialized = true;
+    api.openEspace();
+  } else if (!eSpaceCtrlDisabled) {
+    const timeout = props.timeout || 3e3;
+    const pollingInterval = props.pollingInterval || 1e3;
+    const options = { timeout, pollingInterval };
+    eSpaceCtrl.init && eSpaceCtrl.init(options);
+    eSpaceCtrl.ready && eSpaceCtrl.ready(() => {
+      state.initialized = true;
+      api.openEspace();
+    });
+    eSpaceCtrl.error && eSpaceCtrl.error(() => {
+      state.initialized = false;
+    });
+  }
+};
+const openEspace = ({ api, props, eSpaceCtrl }) => () => {
+  const data = props.data;
+  const roleNumber = data.roleNumber ? data.roleNumber.toLocaleLowerCase() : "";
+  if (roleNumber && api.testUID(roleNumber)) {
+    eSpaceCtrl.showImDialog(roleNumber);
+  }
+};
 export {
-  getUserHref
+  doUserAction,
+  getUserHref,
+  initEspaceLink,
+  openEspace
 };

user-contact/vue.js

 import "../chunk-PKUHTIDK.js";
-import { getUserHref } from "./index";
-const api = ["show", "getUserHref"];
-const renderless = (props, { reactive, ref }) => {
+import { init } from "../common/deps/eSpaceCtrl";
+import { getUserHref, doUserAction, initEspaceLink, openEspace } from "./index";
+import { testUID } from "../espace";
+const api = ["show", "getUserHref", "doUserAction", "initEspaceLink", "openEspace", "testUID"];
+const renderless = (props, { reactive, ref }, { service }) => {
+  const api2 = {};
+  const { setting = {} } = service || {};
+  const { widgets = {} } = setting;
+  const eSpaceCtrlDisabled = widgets.ESpaceCtrl && !widgets.ESpaceCtrl.autoLink;
+  const eSpaceCtrl = eSpaceCtrlDisabled ? {} : init();
   const state = reactive({
     initialized: false
   });
-  const api2 = {
+  Object.assign(api2, {
     state,
-    show: ref(false)
-  };
-  Object.assign(api2, {
-    getUserHref: getUserHref({ api: api2, props })
+    testUID,
+    show: ref(false),
+    getUserHref: getUserHref({ api: api2, props }),
+    initEspaceLink: initEspaceLink({ api: api2, props, state, eSpaceCtrl, eSpaceCtrlDisabled }),
+    doUserAction: doUserAction({ api: api2, props, state, eSpaceCtrl }),
+    openEspace: openEspace({ api: api2, props, eSpaceCtrl })
   });
@@ -15,0 +24,0 @@ return api2;

user-link/index.js

@@ -8,4 +8,8 @@ import "../chunk-PKUHTIDK.js";
   api.getUsers(value).then((info) => {
-    info.sort((a, b) => value.indexOf(String(a[props.valueField])) > value.indexOf(String(b[props.valueField])) ? 1 : -1);
-    const list = info.map((user) => user[props.valueField]);
+    info.sort((a, b) => {
+      return value.indexOf(a[state.valueField] + "") > value.indexOf(b[state.valueField] + "") ? 1 : -1;
+    });
+    const list = info.map((user) => {
+      return user[state.valueField];
+    });
     state.options = info;
@@ -30,3 +34,7 @@ state.user = props.multiple ? list : list[0];
 };
+const computedTextField = ({ service, props }) => () => props.textField || service.textField || "userCN";
+const computedValueField = ({ service, props }) => () => props.valueField || service.valueField || "userId";
 export {
+  computedTextField,
+  computedValueField,
   initUser,
@@ -33,0 +41,0 @@ showCard,

user-link/vue.js

 import "../chunk-PKUHTIDK.js";
-import { getUsers, cacheUser, saveCache, initService } from "@opentiny/vue-renderless/user";
-import { initUser, showCard, showDetail } from "./index";
+import { getUsers, cacheUser, saveCache, initService, syncCacheIds } from "../user";
+import { initUser, showCard, showDetail, computedTextField, computedValueField } from "./index";
 const api = ["state", "showCard", "showDetail"];
-const renderless = (props, { reactive, watch }, { service }) => {
+const renderless = (props, { reactive, watch, computed }, { service }) => {
   service = initService({ props, service });
@@ -17,3 +17,5 @@ const api2 = {};
     imgUrl: "",
-    batch: props.batch === false ? false : props.batch || service.batch
+    batch: props.batch === false ? false : props.batch || service.batch,
+    textField: computed(() => api2.computedTextField()),
+    valueField: computed(() => api2.computedValueField())
   });
@@ -24,3 +26,4 @@ Object.assign(api2, {
     saveCache: saveCache({ props }),
-    cacheUser: cacheUser({ api: api2, props, service }),
+    syncCacheIds: syncCacheIds({ props, state }),
+    cacheUser: cacheUser({ api: api2, props, service, state }),
     initUser: initUser({ api: api2, props, state }),
@@ -31,3 +34,5 @@ getUsers: getUsers({ api: api2, props, state }),
     fetchW3Accounts: service.fetchW3Accounts,
-    fetchUserByUserId: service.fetchUserByUserId
+    fetchUserByUserId: service.fetchUserByUserId,
+    computedTextField: computedTextField({ service, props }),
+    computedValueField: computedValueField({ service, props })
   });
@@ -34,0 +39,0 @@ watch(() => props.modelValue, api2.initUser, { immediate: true });

user/index.js

 import "../chunk-PKUHTIDK.js";
-import debounce from "@opentiny/vue-renderless/common/deps/debounce";
-import { toDateStr } from "@opentiny/vue-renderless/common/date";
-import { toJsonStr } from "@opentiny/vue-renderless/common/object";
-import { toJson } from "@opentiny/vue-renderless/common/string";
-import { log } from "@opentiny/vue-renderless/common";
+import debounce from "../common/deps/debounce";
+import { toDateStr } from "../common/date";
+import { toJsonStr } from "../common/object";
+import { toJson } from "../common/string";
+import { log } from "../common/xss";
 const request = {
@@ -20,5 +20,4 @@ timmer: null,
     queryIds.forEach((id) => {
-      if (!~this.group[valueField].indexOf(id)) {
+      if (!~this.group[valueField].indexOf(id))
         !this.group[valueField].push(id);
-      }
     });
@@ -40,16 +39,14 @@ },
     for (let key in this.group) {
-      if (Object.prototype.hasOwnProperty.call(this.group, key)) {
-        const all = this.group[key];
-        const items = this.splitArr(all, this.batch);
-        if (key === "userId") {
-          args.push(...items.map((item) => item.join(",")));
-        } else {
-          args.push(
-            ...items.map((item) => ({
-              valueField: key,
-              valueSplit: item.valueSplit,
-              [key]: item.join(",")
-            }))
-          );
-        }
+      const all = this.group[key];
+      const items = this.splitArr(all, this.batch);
+      if (key === "userId") {
+        args.push(...items.map((item) => item.join(",")));
+      } else {
+        args.push(
+          ...items.map((item) => ({
+            valueField: key,
+            valueSplit: item.valueSplit,
+            [key]: item.join(",")
+          }))
+        );
       }
@@ -66,8 +63,5 @@ }
       for (let key in this.group) {
-        if (Object.prototype.hasOwnProperty.call(this.group, key)) {
-          if (!me.cache[key]) {
-            me.cache[key] = {};
-          }
-          me.cache[key][item[key]] = item;
-        }
+        if (!me.cache[key])
+          me.cache[key] = {};
+        me.cache[key][item[key]] = item;
       }
@@ -90,3 +84,3 @@ });
     let reqLen = reqParamsSeq.length;
-    reqParamsSeq.forEach((params) => {
+    reqParamsSeq.map((params) => {
       api.fetchW3Accounts(params).then((data) => {
@@ -119,3 +113,3 @@ me.setCache(data);
           });
-          errors.length && log(`user [${errors.join(",")}] not found`, "warn");
+          errors.length && log.logger.warn(`user [${errors.join(",")}] not found`);
           this.clearRequest();
@@ -157,13 +151,16 @@ }
 };
-const suggestUser = (api) => (query) => new Promise((resolve, reject) => {
-  api.fetchSuggestUser(query).then((users) => {
-    if (users.length) {
-      resolve(users);
-    } else {
-      resolve({ invalid: query });
-    }
-  }).catch(reject);
-});
+const suggestUser = (api) => (query) => {
+  return new Promise((resolve, reject) => {
+    api.fetchSuggestUser(query).then((users) => {
+      if (users.length) {
+        resolve(users);
+      } else {
+        resolve({ invalid: query });
+      }
+    }).catch(reject);
+  });
+};
 const updateOptions = ({ props, state, nextTick }) => (usersList) => {
-  const { valueField, textField, noDataText } = props;
+  const { noDataText } = props;
+  const { valueField, textField } = state;
   const values = [].concat(state.user || []);
@@ -203,3 +200,3 @@ const options = [].concat(state.selected);
     if (list.length === 1) {
-      const value = list[0][props.valueField];
+      const value = list[0][state.valueField];
       !~values.indexOf(value) && values.push(value);
@@ -242,5 +239,4 @@ if (props.autoClose) {
       });
-      if (failList.length) {
+      if (failList.length)
         emit("error", failList);
-      }
       api.updateOptions(usersList).then(() => {
@@ -256,4 +252,6 @@ api.autoSelect(usersList).then(() => {
 const setSelected = ({ api, props, state }) => (value) => {
-  const values = Array.isArray(value) ? value.map((v) => String(v).toLocaleLowerCase()) : String(value).toLocaleLowerCase().split(props.valueSplit);
-  state.selected = state.options.filter((user) => ~values.indexOf(String(user[props.valueField]).toLocaleLowerCase()));
+  const values = Array.isArray(value) ? value.map((v) => (v + "").toLocaleLowerCase()) : (value + "").toLocaleLowerCase().split(props.valueSplit);
+  state.selected = state.options.filter((user) => {
+    return ~values.indexOf((user[state.valueField] + "").toLocaleLowerCase());
+  });
   props.cache && api.cacheUser(state.selected);
@@ -263,3 +261,3 @@ };
   const { multiple } = props;
-  let newVal = multiple && Array.isArray(value) ? value.join(props.valueSplit) : String(value || "");
+  let newVal = multiple && Array.isArray(value) ? value.join(props.valueSplit) : (value || "") + "";
   api.setSelected(newVal);
@@ -272,4 +270,5 @@ if (typeof state.lastValue === "string" && state.lastValue !== null && state.lastValue.toLocaleLowerCase() !== newVal.toLocaleLowerCase()) {
 };
-const syncCacheIds = (ids, props, queryIds, cacheData) => {
-  const { valueField, cacheFields, cacheKey } = props;
+const syncCacheIds = ({ props, state }) => (ids, queryIds, cacheData) => {
+  const { cacheFields, cacheKey } = props;
+  const { valueField } = state;
   const cacheUsers = toJson(window.localStorage.getItem(cacheKey)) || {};
@@ -279,3 +278,3 @@ ids.forEach((id) => {
       const cacheUser2 = cacheUsers[id];
-      const textField = props.textField === "userCN" || props.textField === "userId" || props.textField === "dept" ? "" : props.textField;
+      const textField = state.textField === "userCN" || state.textField === "userId" || state.textField === "dept" ? "" : state.textField;
       if (textField !== "" && !cacheUser2.a) {
@@ -306,3 +305,4 @@ window.localStorage.removeItem(cacheKey);
 const getUsers = ({ api, props, state }) => (value) => {
-  const { valueField, cache } = props;
+  const { cache } = props;
+  const { valueField } = state;
   const ids = Array.isArray(value) ? value : value.split(props.valueSplit);
@@ -312,3 +312,3 @@ const cacheData = [];
   if (cache) {
-    syncCacheIds(ids, props, queryIds, cacheData);
+    api.syncCacheIds(ids, queryIds, cacheData);
     request.setCache(cacheData, valueField);
@@ -325,3 +325,4 @@ if (!queryIds.length) {
       } else {
-        resolve(data.concat(cacheData));
+        const filterData = cacheData.filter((cache2) => !~data.findIndex((d) => d[valueField] === cache2[valueField]));
+        resolve(data.concat(filterData));
       }
@@ -353,4 +354,5 @@ };
 };
-const cacheUser = ({ api, props, service }) => (users) => {
-  const { valueField, cacheKey } = props;
+const cacheUser = ({ api, props, service, state }) => (users) => {
+  const { cacheKey } = props;
+  const { valueField } = state;
   const cacheUser2 = toJson(window.localStorage.getItem(cacheKey)) || {};
@@ -373,3 +375,3 @@ const cacheFields = service.userCache;
         e: u[cacheFields.eno],
-        a: ~["userCN", "userId", "dept"].indexOf(props.textField) ? null : u[props.textField],
+        a: ~["userCN", "userId", "dept"].indexOf(state.textField) ? null : u[state.textField],
         r: 0
@@ -386,9 +388,9 @@ };
   } catch (e) {
-    const sortUsers = Object.keys(cacheUser2).sort((a, b) => cacheUser2[a].r < cacheUser2[b].r ? 1 : -1);
+    const sortUsers = Object.keys(cacheUser2).sort((a, b) => {
+      return cacheUser2[a].r < cacheUser2[b].r ? 1 : -1;
+    });
     const cutUser = sortUsers.splice(0, sortUsers.length / 2);
     const newCache = {};
     for (let i in cutUser) {
-      if (Object.prototype.hasOwnProperty.call(cutUser, i)) {
-        newCache[cutUser[i]] = cacheUser2[cutUser[i]];
-      }
+      newCache[cutUser[i]] = cacheUser2[cutUser[i]];
     }
@@ -398,6 +400,6 @@ api.saveCache(newCache);
 };
-const useSortable = ({ api, props, state, refs }) => () => {
-  const selectDom = refs.select.$el;
+const useSortable = ({ api, props, state, vm }) => () => {
+  const selectDom = vm.$refs.select.$el;
   if (props.sortable && props.multiple && !state.sortable) {
-    const tagsDom = selectDom.querySelector(".tiny-select__tags>span");
+    const tagsDom = selectDom.querySelector(".tiny-select__tags>span>span");
     state.sortable = props.sortable.create(tagsDom, {
@@ -427,3 +429,3 @@ handle: ".tiny-tag",
   if (typeof value === "number") {
-    value = String(value);
+    value += "";
   }
@@ -437,6 +439,8 @@ if (!value) {
   value && api.getUsers(value).then((info) => {
-    info.sort((a, b) => value.indexOf(String(a[props.valueField])) > value.indexOf(String(b[props.valueField])) ? 1 : -1);
+    info.sort((a, b) => {
+      return value.indexOf(a[state.valueField] + "") > value.indexOf(b[state.valueField] + "") ? 1 : -1;
+    });
     const list = info.map((user) => {
       user._show = true;
-      return user[props.valueField];
+      return user[state.valueField];
     });
@@ -456,3 +460,3 @@ state.options = info;
     } else {
-      return Promise.reject(new Error("[TINY Error][User]] This component depends on @opentiny/vue-service"));
+      return Promise.reject(new Error("[TINY Error][User]] This component depends on @opentiny/service"));
     }
@@ -464,3 +468,6 @@ };
   const { options = {} } = setting;
-  const { UserCache = { uuid: "uuid", userId: "userId", userCN: "userCN", dept: "dept", eno: "employeeNumber" }, User = { batch: 50 } } = options;
+  const {
+    UserCache = { uuid: "uuid", userId: "userId", userCN: "userCN", dept: "dept", eno: "employeeNumber" },
+    User = { batch: 50, textField: "", valueField: "" }
+  } = options;
   return {
@@ -475,3 +482,5 @@ fetchUser: props.fetchUser || fetchUser || noopFnCreator("fetchUser"),
     userCache: props.UserCache || UserCache,
-    batch: User.batch
+    batch: User.batch,
+    textField: User.textField,
+    valueField: User.valueField
   };
@@ -482,11 +491,17 @@ };
     const selectedUsers = state.user.map((value) => typeof value === "string" ? value.toLocaleLowerCase() : value);
-    return state.options.filter(
-      (user) => !~selectedUsers.indexOf(typeof user[props.valueField] === "string" ? user[props.valueField].toLocaleLowerCase() : user[props.valueField])
-    );
+    return state.options.filter((user) => {
+      return !~selectedUsers.indexOf(
+        typeof user[state.valueField] === "string" ? user[state.valueField].toLocaleLowerCase() : user[state.textField]
+      );
+    });
   }
   return state.options;
 };
+const computedTextField = ({ service, props }) => () => props.textField || service.textField || "userCN";
+const computedValueField = ({ service, props }) => () => props.valueField || service.valueField || "userId";
 export {
   autoSelect,
   cacheUser,
+  computedTextField,
+  computedValueField,
   filter,
@@ -501,2 +516,3 @@ getUsers,
   suggestUser,
+  syncCacheIds,
   updateCache,
@@ -503,0 +519,0 @@ updateOptions,

user/vue.js

@@ -18,6 +18,9 @@ import "../chunk-PKUHTIDK.js";
   initService,
-  filter
+  filter,
+  computedTextField,
+  computedValueField,
+  syncCacheIds
 } from "./index";
 const api = ["state", "handleBlur", "searchMethod", "userChange", "visibleChange", "useSortable", "filter"];
-const renderless = (props, { reactive, watch }, { emit, nextTick, refs, service, constants, dispatch }) => {
+const renderless = (props, { reactive, watch, computed, provide }, { emit, nextTick, vm, service, constants, dispatch }) => {
   const api2 = {};
@@ -37,3 +40,5 @@ const $service = initService({ props, service });
     addevnet: false,
-    batch: props.batch === false ? false : props.batch || $service.batch
+    batch: props.batch === false ? false : props.batch || $service.batch,
+    textField: computed(() => api2.computedTextField()),
+    valueField: computed(() => api2.computedValueField())
   });
@@ -53,3 +58,3 @@ Object.assign(api2, {
     suggestUser: suggestUser(api2),
-    cacheUser: cacheUser({ api: api2, props, service: $service }),
+    cacheUser: cacheUser({ api: api2, props, service: $service, state }),
     initUser: initUser({ api: api2, props, state }),
@@ -60,6 +65,11 @@ getUsers: getUsers({ api: api2, props, state }),
     userChange: userChange({ api: api2, emit, props, state }),
-    useSortable: useSortable({ api: api2, props, state, refs })
+    useSortable: useSortable({ api: api2, props, state, vm }),
+    computedTextField: computedTextField({ service: $service, props }),
+    computedValueField: computedValueField({ service: $service, props }),
+    syncCacheIds: syncCacheIds({ props, state })
   });
   props.cache && api2.updateCache();
   watch(() => props.modelValue, api2.initUser, { immediate: true });
+  provide("showContent", props.showTips);
+  provide("tips-max-width", props.maxWidth);
   return api2;
@@ -66,0 +76,0 @@ };

wheel/index.js

 import "../chunk-PKUHTIDK.js";
-import { cloneDeep } from "@opentiny/vue-renderless/chart-core/deps/utils";
+import { cloneDeep } from "../chart-core/deps/utils";
 const created = (api) => () => {
@@ -4,0 +4,0 @@ api.loadPickerData();

wizard/index.js

 import "../chunk-PKUHTIDK.js";
-import { format } from "@opentiny/vue-renderless/common/date";
-import { copyArray, extend } from "@opentiny/vue-renderless/common/object";
-import { isObject } from "@opentiny/vue-renderless/common/type";
+import { format } from "../common/date";
+import { copyArray, extend } from "../common/object";
+import { isObject } from "../common/type";
 const lastStepHandle = ({ state, emit }) => () => {
@@ -6,0 +6,0 @@ for (let i = 0; i < state.datas.length; i++) {

year-table/index.js

 import "../chunk-PKUHTIDK.js";
-import { toDate } from "@opentiny/vue-renderless/common/date";
-import { hasClass } from "@opentiny/vue-renderless/common/deps/dom";
-import { range, nextDate, getDayCountOfYear } from "@opentiny/vue-renderless/common/deps/date-util";
-import { arrayFindIndex, coerceTruthyValueToArray } from "@opentiny/vue-renderless/date-table";
+import { toDate } from "../common/date";
+import { hasClass } from "../common/deps/dom";
+import { range, nextDate, getDayCountOfYear } from "../common/deps/date-util";
+import { arrayFindIndex, coerceTruthyValueToArray, arrayFind } from "../date-table";
+import { DATEPICKER } from "../common";
 const datesInYear = (year) => {
@@ -11,3 +12,5 @@ const numOfDays = getDayCountOfYear(year);
 };
-const getCellStyle = ({ props }) => (year) => {
+const getCellStyle = ({ props }) => (cell) => {
+  const { defaultValue } = props;
+  const year = cell.text;
   const style = {};
@@ -19,18 +22,179 @@ const today = /* @__PURE__ */ new Date();
   style.today = today.getFullYear() === year;
-  style.default = props.defaultValue && props.defaultValue.getFullYear() === year;
+  style.default = Array.isArray(defaultValue) ? defaultValue.some((v) => v && v.getFullYear() === year) : defaultValue && defaultValue.getFullYear() === year;
+  if (cell.inRange) {
+    style[DATEPICKER.InRange] = true;
+  }
+  if (cell.start) {
+    style[DATEPICKER.StartDate] = true;
+  }
+  if (cell.end) {
+    style[DATEPICKER.EndDate] = true;
+  }
   return style;
 };
-const handleYearTableClick = ({ emit }) => (event) => {
+const clearDate = (date) => {
+  return new Date(date.getFullYear(), date.getMonth());
+};
+const getMonthTimestamp = (time) => {
+  if (typeof time === "number" || typeof time === "string") {
+    return clearDate(new Date(time)).getTime();
+  }
+  if (time instanceof Date) {
+    return clearDate(time).getTime();
+  }
+  return NaN;
+};
+const getRows = ({ props, state, vm }) => () => {
+  const { tableRows } = state;
+  const { minDate, maxDate, disabledDate, startYear, selectionMode } = props;
+  const selectedDate = [];
+  const now = (/* @__PURE__ */ new Date()).getFullYear();
+  for (let i = 0; i < 3; i++) {
+    const row = tableRows[i];
+    for (let j = 0; j < 4; j++) {
+      let cell = row[j];
+      if (!cell) {
+        cell = {
+          type: DATEPICKER.Normal,
+          row: i,
+          column: j,
+          inRange: false,
+          start: false,
+          end: false
+        };
+      }
+      const year = startYear + (cell.row * 4 + cell.column);
+      const isToday = year === now;
+      cell.text = year;
+      cell.type = isToday ? DATEPICKER.Today : DATEPICKER.Normal;
+      cell.disabled = typeof disabledDate === "function" && disabledDate(new Date(year, 0, 1));
+      if (selectionMode === DATEPICKER.YearRange) {
+        const minYear = typeof minDate === "object" && minDate ? minDate.getFullYear() : minDate;
+        const maxYear = typeof maxDate === "object" && maxDate ? maxDate.getFullYear() : maxDate;
+        cell.start = minYear === year;
+        cell.end = maxYear === year;
+        cell.inRange = year > minYear && year < maxYear || [minYear, maxYear].includes(year);
+        cell.selected = arrayFind(
+          selectedDate,
+          (item) => (typeof item === "object" ? item.getFullYear() : item) === year
+        );
+      }
+      vm.$set(row, j, cell);
+    }
+  }
+  return tableRows;
+};
+const markRange = ({ props, state }) => (min, max) => {
+  const rows = state.rows;
+  const [minDate, maxDate] = [min, max].sort((a, b) => a && a < b ? -1 : 1);
+  const minYear = typeof minDate === "object" && minDate ? minDate.getFullYear() : minDate;
+  const maxYear = typeof maxDate === "object" && maxDate ? maxDate.getFullYear() : maxDate;
+  if (props.selectionMode === DATEPICKER.YearRange) {
+    for (let i = 0, len = rows.length; i < len; i++) {
+      const row = rows[i];
+      for (let j = 0, l = row.length; j < l; j++) {
+        const cell = row[j];
+        const year = cell.text;
+        cell.start = minYear && minYear === year;
+        cell.end = maxYear && maxYear === year;
+        cell.inRange = year > minYear && year < maxYear || cell.start || cell.end;
+        cell.selected = cell.inRange;
+      }
+    }
+  }
+};
+const watchDate = ({ api, props }) => (value, oldvalue) => {
+  if (value !== oldvalue) {
+    api.markRange(props.minDate, props.maxDate);
+  }
+};
+const handleYearTableClick = ({ emit, props }) => (event) => {
   const target = event.target;
+  const { selectionMode } = props;
   if (target.tagName === "A") {
-    if (hasClass(target.parentNode, "disabled")) {
+    if (hasClass(target.parentNode.parentNode, "disabled")) {
       return;
     }
-    const year = target.textContent || target.innerText;
-    emit("pick", Number(year));
+    const year = Number(target.textContent || target.innerText);
+    if (selectionMode === DATEPICKER.Years) {
+      const years = Array.isArray(props.value) ? props.value.map((v) => v.getFullYear()) : [];
+      const index = years.indexOf(year);
+      if (index === -1) {
+        years.push(year);
+      } else {
+        years.splice(index, 1);
+      }
+      emit("pick", years.slice());
+    } else if (selectionMode === DATEPICKER.YearRange) {
+      let { minDate, maxDate } = props;
+      if (props.rangeState.selecting) {
+        props.rangeState.selecting = false;
+        if (year < minDate) {
+          maxDate = minDate;
+          minDate = year;
+        } else {
+          maxDate = year;
+        }
+      } else {
+        props.rangeState.selecting = true;
+        minDate = year;
+        maxDate = null;
+      }
+      emit("pick", { minDate, maxDate });
+    } else {
+      emit("pick", year);
+    }
   }
 };
+const getTarget = (evt) => {
+  let target = evt.target;
+  const tagName = target.tagName;
+  if (tagName === "A") {
+    target = target.parentNode.parentNode;
+  }
+  if (tagName === "DIV") {
+    target = target.parentNode;
+  }
+  if (tagName !== "TD") {
+    return;
+  }
+  return target;
+};
+const handleMouseMove = ({ emit, props, state }) => (event) => {
+  const { selectionMode, startYear, rangeState, minDate, maxDate } = props;
+  if (selectionMode !== DATEPICKER.YearRange || !rangeState.selecting) {
+    return;
+  }
+  const target = getTarget(event);
+  if (!target) {
+    return;
+  }
+  const row = target.parentNode.rowIndex;
+  const column = target.cellIndex;
+  if (state.rows[row][column].disabled || minDate === maxDate) {
+    return;
+  }
+  if (row !== state.lastRow || column !== state.lastColumn) {
+    state.lastColumn = column;
+    state.lastRow = row;
+    const year = startYear + row * 4 + column;
+    emit("changerange", {
+      minDate,
+      maxDate,
+      rangeState: {
+        selecting: true,
+        endDate: year
+      }
+    });
+  }
+};
 export {
+  clearDate,
   getCellStyle,
-  handleYearTableClick
+  getMonthTimestamp,
+  getRows,
+  handleMouseMove,
+  handleYearTableClick,
+  markRange,
+  watchDate
 };

year-table/vue.js

 import "../chunk-PKUHTIDK.js";
-import { getCellStyle, handleYearTableClick } from "./index";
-const api = ["state", "handleYearTableClick", "getCellStyle"];
-const renderless = (props, { computed, reactive }, { emit }) => {
+import { getRows, getCellStyle, handleYearTableClick, watchDate, markRange, handleMouseMove } from "./index";
+const api = ["state", "handleYearTableClick", "getCellStyle", "handleMouseMove"];
+const renderless = (props, { computed, reactive, watch }, { emit, vm }) => {
   const api2 = {};
   const state = reactive({
-    startYear: computed(() => Math.floor(props.date.getFullYear() / 10) * 10)
+    tableRows: [[], [], []],
+    rows: computed(() => api2.getRows())
   });
@@ -12,4 +13,15 @@ Object.assign(api2, {
     getCellStyle: getCellStyle({ props }),
-    handleYearTableClick: handleYearTableClick({ emit })
+    handleYearTableClick: handleYearTableClick({ emit, props, state }),
+    markRange: markRange({ props, state }),
+    watchDate: watchDate({ api: api2, props }),
+    getRows: getRows({ props, state, vm }),
+    handleMouseMove: handleMouseMove({ api: api2, emit, props, state })
   });
+  watch(
+    () => props.rangeState,
+    (value, oldValue) => value !== oldValue && api2.markRange(props.minDate, value.endDate),
+    { deep: true }
+  );
+  watch(() => props.minDate, api2.watchDate);
+  watch(() => props.maxDate, api2.watchDate);
   return api2;
@@ -16,0 +28,0 @@ };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1728887

increased by20.43%

Number of package files

547

increased by15.4%

Lines of code

54141

increased by20.27%

No dependency changes