@opentiny/vue-renderless 3.14.1 → 3.15.1

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2022 - present TinyVue Authors.
+Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/action-menu/index.js

@@ -1,4 +1,44 @@
 import "../chunk-G2ADBYYC.js";
+const computedMaxShowNum = ({ props, state }) => () => {
+  if (props.maxShowNum !== void 0) {
+    return props.maxShowNum;
+  }
+  if (state.isCardMode) {
+    return 3;
+  } else {
+    return 2;
+  }
+};
+const computedSpacing = ({ props, state }) => () => {
+  if (props.spacing !== void 0) {
+    return String(props.spacing).includes("px") ? props.spacing : props.spacing + "px";
+  }
+  if (state.isCardMode) {
+    return "10px";
+  } else {
+    return "5px";
+  }
+};
+const computedMoreText = ({ props, state, t }) => () => {
+  if (props.moreText !== void 0) {
+    return props.moreText;
+  }
+  if (state.isCardMode) {
+    return "";
+  } else {
+    return t("ui.actionMenu.moreText");
+  }
+};
+const computedSuffixIcon = ({ props, state }) => () => {
+  if (props.suffixIcon) {
+    return props.suffixIcon;
+  }
+  if (state.isCardMode) {
+    return "tiny-icon-ellipsis";
+  } else {
+    return "";
+  }
+};
 const handleMoreClick = (emit) => () => {
   emit("more-click");
 };
@@ -9,6 +49,10 @@ const visibleChange = (emit) => (status) => {
   emit("visible-change", status);
 };
 export {
+  computedMaxShowNum,
+  computedMoreText,
+  computedSpacing,
+  computedSuffixIcon,
   handleItemClick,
   handleMoreClick,
   visibleChange

package/action-menu/vue.js

@@ -1,18 +1,35 @@
 import "../chunk-G2ADBYYC.js";
-import { handleMoreClick, handleItemClick, visibleChange } from "./index";
+import {
+  handleMoreClick,
+  handleItemClick,
+  visibleChange,
+  computedMaxShowNum,
+  computedSpacing,
+  computedMoreText,
+  computedSuffixIcon
+} from "./index";
 const api = ["state", "handleMoreClick", "handleItemClick", "visibleChange"];
-const renderless = (props, { computed, reactive }, { emit }) => {
+const renderless = (props, { computed, reactive }, { emit, t }) => {
+  const api2 = {};
   const state = reactive({
-    visibleOptions: computed(() => props.options.slice(0, props.maxShowNum)),
-    moreOptions: computed(() => props.options.slice(props.maxShowNum)),
-    spacing: computed(() => String(props.spacing).includes("px") ? props.spacing : props.spacing + "px")
+    visibleOptions: computed(() => props.options.slice(0, state.maxShowNum)),
+    isCardMode: computed(() => props.mode === "card"),
+    moreOptions: computed(() => props.options.slice(state.maxShowNum)),
+    spacing: computed(() => api2.computedSpacing()),
+    maxShowNum: computed(() => api2.computedMaxShowNum()),
+    moreText: computed(() => api2.computedMoreText()),
+    suffixIcon: computed(() => api2.computedSuffixIcon())
   });
-  const api2 = {
+  Object.assign(api2, {
+    state,
     handleMoreClick: handleMoreClick(emit),
     handleItemClick: handleItemClick(emit),
     visibleChange: visibleChange(emit),
-    state
-  };
+    computedMaxShowNum: computedMaxShowNum({ props, state }),
+    computedSpacing: computedSpacing({ props, state }),
+    computedMoreText: computedMoreText({ props, state, t }),
+    computedSuffixIcon: computedSuffixIcon({ props, state })
+  });
   return api2;
 };
 export {

package/calendar-view/index.js

@@ -125,23 +125,30 @@ const handleEvents = ({ props, state }) => () => {
     props.events.forEach((prop) => {
       const item = __spreadValues({}, prop);
       const {
-        year,
-        month,
+        year: startYear,
+        month: startMonth,
         day: startDay,
         hours: startHours,
         minutes: startMinutes,
         seconds: startSeconds
       } = parseDate(item.start);
-      const { day: endDay, hours: endHours, minutes: endMinutes, seconds: endSeconds } = parseDate(item.end);
-      if ([lastYear, +state.activeYear, nextYear].includes(year) && [lastMon, +state.activeMonth, nextMon].includes(month)) {
+      const {
+        year: endYear,
+        month: endMonth,
+        day: endDay,
+        hours: endHours,
+        minutes: endMinutes,
+        seconds: endSeconds
+      } = parseDate(item.end);
+      if ([lastYear, +state.activeYear, nextYear].includes(startYear) && [lastMon, +state.activeMonth, nextMon].includes(startMonth) || [lastYear, +state.activeYear, nextYear].includes(endYear) && [lastMon, +state.activeMonth, nextMon].includes(endMonth)) {
         item.start = getTime(item.start);
         item.end = getTime(item.end);
         item.startTime = makeUpZero(startHours) + ":" + makeUpZero(startMinutes) + ":" + makeUpZero(startSeconds);
         item.endTime = makeUpZero(endHours) + ":" + makeUpZero(endMinutes) + ":" + makeUpZero(endSeconds);
-        item.startDay = year + "-" + month + "-" + startDay;
-        item.endDay = year + "-" + month + "-" + endDay;
-        const startTimestamp = getTime(year + "-" + month + "-" + startDay);
-        const endTimestamp = getTime(year + "-" + month + "-" + endDay);
+        item.startDay = startYear + "-" + startMonth + "-" + startDay;
+        item.endDay = endYear + "-" + endMonth + "-" + endDay;
+        const startTimestamp = getTime(startYear + "-" + startMonth + "-" + startDay);
+        const endTimestamp = getTime(endYear + "-" + endMonth + "-" + endDay);
         const days = Math.abs(endTimestamp - startTimestamp) / dayMillisecond;
         item.dayNumber = days >= 1 ? days + 1 : 1;
         if (props.modes.includes("timeline")) {
@@ -158,19 +165,20 @@ const handleEvents = ({ props, state }) => () => {
 function splitEvent(props, event) {
   const result = [];
   const startDay = new Date(event.startDay);
-  const day = startDay.getDate();
+  const dayMillisecond = 24 * 60 * 60 * 1e3;
   if (event.dayNumber > 1) {
     for (let i = 0; i < event.dayNumber; i++) {
       let copyObj = JSON.parse(JSON.stringify(event));
+      let dayStartTimeStamp = new Date(startDay.getTime() + i * dayMillisecond);
       if (i === 0) {
         copyObj.realStart = copyObj.start;
-        copyObj.realEnd = new Date(startDay.setDate(day + i)).setHours(props.dayTimes[1]);
+        copyObj.realEnd = new Date(dayStartTimeStamp).setHours(props.dayTimes[1]);
       } else if (i === event.dayNumber - 1) {
-        copyObj.realStart = new Date(startDay.setDate(day + i)).setHours(props.dayTimes[0]);
+        copyObj.realStart = new Date(dayStartTimeStamp).setHours(props.dayTimes[0]);
         copyObj.realEnd = copyObj.end;
       } else {
-        copyObj.realStart = new Date(startDay.setDate(day + i)).setHours(props.dayTimes[0]);
-        copyObj.realEnd = new Date(startDay.setDate(day + i)).setHours(props.dayTimes[1]);
+        copyObj.realStart = new Date(dayStartTimeStamp).setHours(props.dayTimes[0]);
+        copyObj.realEnd = new Date(dayStartTimeStamp).setHours(props.dayTimes[1]);
       }
       result.push(copyObj);
     }

package/calendar-view/vue.js

@@ -149,9 +149,12 @@ const initWatch = ({ watch, props, state, emit, api: api2, nextTick }) => {
     { immediate: true, deep: true }
   );
   watch(
-    () => props.mode,
-    () => {
-      state.mode = props.mode;
+    () => state.mode,
+    (val) => {
+      emit("mode-change", val);
+      if (val === "timeline") {
+        api2.getCurWeekEvent();
+      }
     }
   );
   watch(

package/cascader/index.js

@@ -217,7 +217,7 @@ const handleExpandChange = ({ constants, dispatch, emit, nextTick, state, update
     dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.FormBlur, [
       state.multiple ? state.presentText : state.inputValue
     ]);
-    updatePopper(state.panel.$parent.$el);
+    updatePopper();
   });
   emit("expand-change", value);
   emit("active-item-change", value);

package/cascader-select/index.js

@@ -29,6 +29,10 @@ const confirm = ({ api, emit, defaultValues, selectedOptions, isDisabled, vm })
   emit("update:modelValue", defaultValues.value.slice());
   api.close();
 };
+const clear = ({ api, emit }) => (value) => {
+  emit("update:modelValue", value);
+  api.close();
+};
 const columnStyle = ({ props, computed }) => computed(() => {
   return {
     height: `${+props.visibleOptionNum * +props.optionHeight}px`,
@@ -36,6 +40,7 @@ const columnStyle = ({ props, computed }) => computed(() => {
   };
 });
 export {
+  clear,
   close,
   columnStyle,
   confirm,

package/cascader-select/vue.js

@@ -1,10 +1,11 @@
 import "../chunk-G2ADBYYC.js";
-import { watchActionSheetVisible, close, confirm, columnStyle } from "./index";
+import { watchActionSheetVisible, close, confirm, columnStyle, clear } from "./index";
 import { usePicker } from "./usePicker";
 const api = [
   "state",
   "close",
   "confirm",
+  "clear",
   "columnsType",
   "columnsList",
   "columnFieldNames",
@@ -34,6 +35,7 @@ const renderless = (props, { reactive, computed, watch, ref, toRefs }, { emit, v
   };
   Object.assign(api2, {
     close: close(state),
+    clear: clear({ api: api2, emit }),
     confirm: confirm({ api: api2, emit, props, state, defaultValues, selectedOptions, isDisabled, vm }),
     watchActionSheetVisible: watchActionSheetVisible({ emit, api: api2, props }),
     columnsType,

package/common/deps/vue-popper.js

@@ -14,6 +14,23 @@ const getReference = ({ state, props, vm, slots }) => {
   }
   return reference;
 };
+const getReferMaxZIndex = (reference) => {
+  if (!reference || !reference.nodeType)
+    return;
+  let getZIndex = (dom) => parseInt(window.getComputedStyle(dom).zIndex, 10) || 0;
+  let max = getZIndex(reference);
+  let z;
+  do {
+    reference = reference.parentNode;
+    if (reference) {
+      z = getZIndex(reference);
+    } else {
+      break;
+    }
+    max = z > max ? z : max;
+  } while (reference !== document.body);
+  return max + 1 + "";
+};
 var vue_popper_default = (options) => {
   const {
     parent,
@@ -55,6 +72,9 @@ var vue_popper_default = (options) => {
       popper.style.display = "none";
     }
   };
+  const nextZIndex = (reference) => {
+    return props.zIndex === "relative" ? getReferMaxZIndex(reference) : PopupManager.nextZIndex();
+  };
   const createPopper = (dom) => {
     if (isServer) {
       return;
@@ -89,7 +109,7 @@ var vue_popper_default = (options) => {
     if (typeof options2.onUpdate === "function") {
       state.popperJS.onUpdate(options2.onUpdate);
     }
-    state.popperJS._popper.style.zIndex = PopupManager.nextZIndex().toString();
+    state.popperJS._popper.style.zIndex = nextZIndex(state.popperJS._reference);
     followHide(state.popperJS);
     on(state.popperElm, "click", stop);
   };
@@ -101,7 +121,7 @@ var vue_popper_default = (options) => {
     if (popperJS) {
       popperJS.update();
       if (popperJS._popper && popperElmOrTrue !== true) {
-        popperJS._popper.style.zIndex = PopupManager.nextZIndex().toString();
+        popperJS._popper.style.zIndex = nextZIndex(popperJS._reference);
         followHide(state.popperJS);
       }
     } else {

package/common/index.js

@@ -109,7 +109,7 @@ const DATE = {
   Time: "hh:mm",
   YearMonth: "yyyy-MM"
 };
-const TriggerTypes = "date,datetime,time,time-select,week,month,year,years,yearrange,daterange,monthrange,timerange,datetimerange,dates";
+const TriggerTypes = "date,datetime,time,time-select,week,month,year,years,yearrange,daterange,monthrange,timerange,datetimerange,dates,quarter";
 const DATEPICKER = {
   Day: "day",
   Date: "date",
@@ -147,6 +147,18 @@ const DATEPICKER = {
     center: "bottom",
     right: "bottom-end"
   },
+  QuarterMap: {
+    0: 0,
+    1: 3,
+    2: 6,
+    3: 9
+  },
+  MonthQuarterMap: {
+    0: 1,
+    3: 2,
+    6: 3,
+    9: 4
+  },
   TriggerTypes: TriggerTypes.split(","),
   DateFormats: {
     year: "yyyy",
@@ -164,6 +176,7 @@ const DATEPICKER = {
   },
   Time: "time",
   TimeRange: "timerange",
+  Quarter: "quarter",
   IconTime: "icon-time",
   IconDate: "icon-Calendar",
   DateRange: "daterange",
@@ -224,7 +237,7 @@ const CASCADER = {
   PropsHover: "hoverThreshold",
   MenuConnector: "cascader-menu-"
 };
-const version = "3.14.0";
+const version = "3.15.1";
 const log = (data, type = "log") => {
   uLog.logger[type](data);
 };

package/common/runtime.js

@@ -22,7 +22,7 @@ import vuePopup from "./deps/vue-popup";
 import validate from "./validate";
 import memorize from "./deps/memorize";
 import * as common from ".";
-const version = "3.14.0";
+const version = "3.15.1";
 const Renderless = {
   browser,
   array,

package/dept/index.js

@@ -93,6 +93,7 @@ const getDeptList = ({ api, state, deptState }) => ({ level, value, auto }) => {
 const selectChange = ({ emit, api, state, deptState }) => ({ level, value }) => {
   api.resetDeptState(deptState.slice(level + 1, 9));
   api.setSelectData();
+  state.selectChanged = true;
   const current = formatJudgCofim(deptState);
   const { hrapprover } = state;
   if (hrapprover) {
@@ -145,7 +146,13 @@ const confirm = ({ api, props, state }) => () => {
     }
   }
 };
-const closeDialog = (emit) => () => emit("close");
+const closeDialog = ({ emit, state, deptState }) => (type) => {
+  if (state.selectChanged) {
+    state.labels = state.lastLabels;
+    deptState.forEach((item, i) => Object.assign(item, state.lastDeptState[i]));
+  }
+  emit("close", type);
+};
 const cancel = ({ emit, state, deptState }) => () => {
   state.labels = state.lastLabels;
   deptState.forEach((item, i) => Object.assign(item, state.lastDeptState[i]));

package/dept/vue.js

@@ -38,6 +38,7 @@ const initState = ({ reactive, computed, parent, props, inject, lastDeptState })
     display: "",
     open: false,
     loading: false,
+    selectChanged: false,
     searchValue: "",
     searchOptions: [],
     current: "",
@@ -52,7 +53,7 @@ const initApi = ({ api: api2, state, deptState, emit, $service, props }) => {
   Object.assign(api2, {
     state,
     deptState,
-    closeDialog: closeDialog(emit),
+    closeDialog: closeDialog({ emit, state, deptState }),
     resetDeptState: resetDeptState(deptState),
     fetchDept: $service.fetchDept,
     fetchDeptList: $service.fetchDeptList,
@@ -82,6 +83,14 @@ const renderless = (props, { onBeforeUnmount, reactive, watch, inject, computed
   const state = initState({ reactive, computed, parent, props, inject, lastDeptState });
   initApi({ api: api2, state, deptState, emit, $service, props });
   watch(() => props.modelValue, api2.getDisplay, { immediate: true });
+  watch(
+    () => state.open,
+    (val) => {
+      if (!val) {
+        state.selectChanged = false;
+      }
+    }
+  );
   onBeforeUnmount(() => {
     state.open = false;
   });

package/dialog-box/index.js

@@ -141,25 +141,25 @@ const handleClose = ({
   if (!emitEvent(emit, "before-close", api.hide)) {
     return;
   }
-  api.hide();
+  api.hide(type);
 };
 const hide = ({ api, emit, state, props }) => (cancel) => {
   if (cancel !== false) {
     state.emitter.emit("boxclose", props.isFormReset);
     emit("update:visible", false);
     emit("change", false);
-    emit("close");
+    emit("close", cancel);
     state.closed = true;
     api.hideScrollbar();
   }
 };
 const handleConfirm = ({ api, emit }) => () => {
   emit("confirm");
-  api.handleClose();
+  api.handleClose("confirm");
 };
 const handleCancel = ({ api, emit }) => () => {
   emit("cancel");
-  api.handleClose();
+  api.handleClose("cancel");
 };
 const updatePopper = ({ api, constants }) => () => {
   api.broadcast(constants.SELECT_DROPDOWN, "updatePopper");
@@ -193,11 +193,17 @@ const closeAllPopover = (parent) => {
     component.state.visible = false;
   });
 };
-const handleDrag = ({ parent, props, state, emit }) => (event) => {
+const handleDrag = ({
+  parent,
+  props,
+  state,
+  emit,
+  vm
+}) => (event) => {
   if (!props.draggable) {
     return;
   }
-  let modalBoxElem = parent.$el.querySelector(".tiny-dialog-box");
+  let modalBoxElem = vm.$refs.dialog;
   event.preventDefault();
   let demMousemove = document.onmousemove;
   let demMouseup = document.onmouseup;

package/dialog-box/vue.js

@@ -119,7 +119,7 @@ const initApi = ({
     afterLeave: afterLeave(emit),
     hideScrollbar: hideScrollbar(lockScrollClass),
     showScrollbar: showScrollbar(lockScrollClass),
-    handleDrag: handleDrag({ parent, props, state, emit })
+    handleDrag: handleDrag({ parent, props, state, emit, vm })
   });
 };
 const initWatch = ({ watch, state, api: api2, props }) => {

package/dropdown-item/mf.js

@@ -43,7 +43,7 @@ const renderless = (props, { reactive, inject }, { dispatch, vm }) => {
     dataStore2.showContent = false;
     dispatch("TinyDropdownMenu", "mouseleave-tips", [dataStore2.showContent, dataStore2.itemLabel]);
   };
-  const mouseEnter = ({ vm: vm2, dataStore: dataStore2 }) => (e) => {
+  const mouseEnter = ({ vm: vm2, dataStore: dataStore2, props: props2 }) => (e) => {
     const dom = e.target;
     const text = dom.textContent;
     const font = window.getComputedStyle(dom).font;
@@ -54,7 +54,7 @@ const renderless = (props, { reactive, inject }, { dispatch, vm }) => {
       tooltip.state.referenceElm = dom;
       tooltip.state.popperElm && (tooltip.state.popperElm.style.display = "none");
       tooltip.doDestroy();
-      dataStore2.itemLabel = text;
+      dataStore2.itemLabel = props2.tooltipContent || text;
       if (vm2.$refs.level.scrollWidth > vm2.$refs.level.offsetWidth) {
         dataStore2.showContent = true;
       }

package/file-upload/index.js

@@ -88,7 +88,6 @@ const watchFileList = ({ constants, state, props, api }) => (fileList) => {
   let uploadFiles = fileList && fileList.map((file) => {
     file.uid = file.uid || Date.now() + state.tempIndex++;
     file.status = file.status || constants.FILE_STATUS.SUCESS;
-    file.type = api.getFileSourceType({ file });
     return file;
   });
   if ([constants.LIST_TYPE.PICTURE_SINGLE, constants.LIST_TYPE.DRAG_SINGLE].includes(props.listType)) {

package/grid/utils/dom.js

@@ -47,17 +47,34 @@ function getFixedLeft($table, from, column, body, offset) {
   }
   return scrollLeft;
 }
+function computeScrollLeft($table, td) {
+  const { tableBody } = $table.$refs;
+  const { visibleColumn } = $table;
+  const { scrollLeft: bodyLeft, clientWidth: bodyWidth } = tableBody.$el;
+  let leftWidth = 0;
+  let rightWidth = 0;
+  visibleColumn.forEach((column) => {
+    if (column.fixed === "left") {
+      leftWidth += column.renderWidth;
+    } else if (column.fixed === "right") {
+      rightWidth += column.renderWidth;
+    }
+  });
+  const tdLeft = td._accumulateRenderWidth || td.offsetLeft + (td.offsetParent ? td.offsetParent.offsetLeft : 0);
+  const tdWidth = td._renderWidth || td.clientWidth;
+  let scrollLeft;
+  if (tdLeft < bodyLeft + leftWidth) {
+    scrollLeft = tdLeft - leftWidth;
+  } else if (tdLeft + tdWidth > bodyLeft + bodyWidth - rightWidth) {
+    scrollLeft = tdLeft + tdWidth - bodyWidth + rightWidth;
+  } else {
+    scrollLeft = bodyLeft;
+  }
+  return scrollLeft;
+}
 function setBodyLeft(body, td, $table, column, move) {
   const { isLeftArrow, isRightArrow, from } = move || {};
-  const bodyWidth = body.clientWidth;
-  const bodySrcollLeft = body.scrollLeft;
-  const tdOffsetLeft = td.offsetLeft + (td.offsetParent ? td.offsetParent.offsetLeft : 0);
-  const tdWidth = td.clientWidth;
-  if (tdOffsetLeft < bodySrcollLeft || tdOffsetLeft > bodySrcollLeft + bodyWidth) {
-    from !== column && (body.scrollLeft = tdOffsetLeft);
-  } else if (tdOffsetLeft + tdWidth >= bodyWidth + bodySrcollLeft) {
-    body.scrollLeft = bodySrcollLeft + tdWidth;
-  }
+  body.scrollLeft = computeScrollLeft($table, td);
   if (from) {
     const direction = isLeftArrow ? "left" : isRightArrow ? "right" : null;
     const fixedDom = $table.elemStore[`${direction}-body-list`];
@@ -92,7 +109,10 @@ const colToVisible = ($table, column, move) => {
         }
         scrollLeft += visibleColumn[index].renderWidth;
       }
-      gridbodyEl.scrollLeft = scrollLeft;
+      gridbodyEl.scrollLeft = computeScrollLeft($table, {
+        _accumulateRenderWidth: scrollLeft,
+        _renderWidth: column.renderWidth
+      });
     }
   });
 };

package/image/index.js

@@ -42,6 +42,9 @@ const handleError = ({ state, emit }) => (event) => {
   state.error = true;
   emit("error", event);
 };
+const handleSwitch = ({ emit }) => (index) => {
+  emit("change-index", index);
+};
 const handleLazyLoad = ({ state, api, vm, nextTick }) => () => {
   if (isInContainer(vm.$el, state._scrollContainer)) {
     nextTick(() => state.show = true);
@@ -125,6 +128,7 @@ export {
   handleError,
   handleLazyLoad,
   handleLoad,
+  handleSwitch,
   loadImage,
   mounted,
   removeLazyLoadListener

package/image/vue.js

@@ -14,7 +14,8 @@ import {
   closeViewer,
   mounted,
   deleteHander,
-  filterImageUrl
+  filterImageUrl,
+  handleSwitch
 } from "./index";
 const api = [
   "state",
@@ -26,7 +27,8 @@ const api = [
   "closeViewer",
   "handleLoad",
   "handleError",
-  "deleteHander"
+  "deleteHander",
+  "handleSwitch"
 ];
 const initState = ({
   reactive,
@@ -78,7 +80,8 @@ const initApi = ({
     computedGetImageStyle: computedGetImageStyle({ api: api2, props }),
     addLazyLoadListener: addLazyLoadListener({ api: api2, props, state, vm }),
     deleteHander: deleteHander(emit),
-    filterImageUrl: filterImageUrl(props)
+    filterImageUrl: filterImageUrl(props),
+    handleSwitch: handleSwitch({ emit })
   });
 };
 const initWatch = ({ watch, state, api: api2, props }) => {

package/image-viewer/vue.js

@@ -164,7 +164,9 @@ const initWatch = ({ watch, state, api: api2, props, nextTick, vm }) => {
   watch(
     () => state.index,
     (value) => {
-      api2.reset();
+      if (!props.keepStyle) {
+        api2.reset();
+      }
       props.onSwitch(value);
     },
     { immediate: true }

package/input/index.js

@@ -55,7 +55,9 @@ const calcTextareaHeight = ({
   api,
   hiddenTextarea,
   props,
-  state
+  state,
+  mode,
+  constants
 }) => (targetElement, minRows = 1, maxRows = null) => {
   if (!targetElement) {
     return {
@@ -72,6 +74,9 @@ const calcTextareaHeight = ({
   hiddenTextarea.value = targetElement.value || targetElement.placeholder || "";
   let height = hiddenTextarea.scrollHeight;
   const textareaStyle = {};
+  if (mode === "mobile") {
+    height = Math.max(hiddenTextarea.scrollHeight, constants.TEXTAREA_HEIGHT_MOBILE);
+  }
   if (boxSizing === STYLE.ContentBox) {
     height = height - paddingSize;
   }