@opentiny/vue-renderless 3.10.7 → 3.11.0

package/tabbar/vue.js

@@ -1,28 +1,53 @@
-import "../chunk-PKUHTIDK.js";
-import { setActiveItem, onChange, getChildrens } from "./index";
+import "../chunk-G2ADBYYC.js";
+import { setActiveItem, onChange, getChildrens, getItems, beforeDestroy, initPage } from "./index";
+import { on } from "../common/deps/dom";
 const api = ["state", "onChange", "getChildrens"];
-const renderless = (props, { computed, onMounted, reactive, watch }, { refs, emit, nextTick, childrenHandler }) => {
+const renderless = (props, { computed, onMounted, reactive, watch, onBeforeUnmount }, { vm, emit, nextTick, childrenHandler }) => {
+  const api2 = {};
   const state = reactive({
     height: null,
     children: [],
-    fit: computed(() => props.safeAreaInsetBottom !== null ? props.safeAreaInsetBottom : props.fixed)
+    fit: computed(() => props.safeAreaInsetBottom ? props.safeAreaInsetBottom : props.fixed),
+    activeItem: false,
+    showIndex: 0,
+    showNumber: computed(() => props.showNumber > 0 ? props.showNumber : -1),
+    tabbarWidth: null
   });
-  const api2 = {
+  Object.assign(api2, {
     state,
     onChange: onChange({ emit, props }),
     parent: computed(() => api2.getParent()),
     setActiveItem: setActiveItem({ props, state }),
-    getChildrens: getChildrens({ childrenHandler })
-  };
+    getChildrens: getChildrens({ childrenHandler, api: api2 }),
+    getItems: getItems(state),
+    beforeDestroy: beforeDestroy(api2),
+    initPage: initPage({ state, vm })
+  });
   onMounted(() => {
+    on(window, "resize", api2.initPage);
+    state.tabbarWidth = vm.$refs && vm.$refs.tabbar.offsetWidth;
     if (props.placeholder && props.fixed) {
       nextTick(() => {
-        state.height = refs.tabbar.getBoundingClientRect().height;
+        state.height = vm.$refs.tabbar.getBoundingClientRect().height;
       });
     }
   });
-  watch(() => props.modelValue, api2.setActiveItem, { immediate: true });
+  vm.$on("updateItems", api2.getItems);
+  vm.$on("activeItem", api2.onChange);
+  vm.$on("showIndex", () => {
+    state.showIndex++;
+  });
+  watch(
+    () => props.modelValue,
+    () => {
+      setTimeout(() => {
+        api2.setActiveItem();
+      }, 100);
+    },
+    { immediate: true }
+  );
   watch(() => state.children, api2.setActiveItem, { immediate: true });
+  onBeforeUnmount(api2.beforeDestroy);
   return api2;
 };
 export {

package/tabbar-item/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { isObject, isNull } from "../common/type";
 const getRouteActive = ({ props, route }) => () => {
   if (props.to && route) {
@@ -8,16 +8,17 @@ const getRouteActive = ({ props, route }) => () => {
     return pathMatched || nameMatched;
   }
 };
-const onClick = ({ api, emit, parent, props, router, state }) => () => {
-  parent.onChange(props.name || parent.index || state.index);
+const onClick = ({ api, emit, parent, props, router, state, dispatch }) => (event) => {
+  dispatch("Tabbar", "activeItem", props.name || parent.index || state.index);
   emit("click", event);
   api.routeTab(router);
 };
-const bindChildren = (parent) => () => {
-  if (!parent) {
+const bindChildren = ({ parent, vm, dispatch }) => () => {
+  if (!parent.$parent) {
     return;
   }
-  parent.state.children = parent.getChildrens();
+  dispatch("Tabbar", "updateItems", vm);
+  dispatch("Tabbar", "showIndex");
 };
 const routeTab = (props, state) => (router) => {
   const { to, replace } = props;
@@ -35,9 +36,13 @@ const routeTab = (props, state) => (router) => {
     replace ? location.replace(url) : location.href = url;
   }
 };
+const getTabbarItemsWidth = (state) => (tabbarWidth, tabbarNumber) => {
+  state.itemWidth = tabbarWidth / tabbarNumber + "px";
+};
 export {
   bindChildren,
   getRouteActive,
+  getTabbarItemsWidth,
   onClick,
   routeTab
 };

package/tabbar-item/vue.js

@@ -1,23 +1,28 @@
-import "../chunk-PKUHTIDK.js";
-import { getRouteActive, onClick, bindChildren, routeTab } from "./index";
-import { xss } from "../common/xss.js";
-const api = ["state", "onClick"];
-const renderless = (props, { computed, onMounted, reactive }, { parent, emit, nextTick, route, router }) => {
+import "../chunk-G2ADBYYC.js";
+import { getRouteActive, onClick, bindChildren, routeTab, getTabbarItemsWidth } from "./index";
+import { xss } from "../common";
+const api = ["state", "onClick", "getTabbarItemsWidth"];
+const renderless = (props, { computed, onMounted, reactive }, { parent, emit, nextTick, route, router, dispatch, vm }) => {
   const api2 = {};
   const state = reactive({
+    index: -1,
     active: false,
     info: computed(() => props.dot ? "" : !props.dot && props.badge),
     url: computed(() => xss.filterUrl(props.url)),
     routeActive: computed(() => api2.getRouteActive()),
     renderActive: computed(() => parent.$parent.route ? state.routeActive : state.active),
-    renderColor: computed(() => parent.$parent[state.active ? "activeColor" : "inactiveColor"])
+    renderColor: computed(() => parent.$parent[state.active ? "activeColor" : "inactiveColor"]),
+    showVm: true,
+    itemWidth: null,
+    childrenNumber: 0
   });
   Object.assign(api2, {
     state,
-    bindChildren: bindChildren(parent),
+    bindChildren: bindChildren({ parent, dispatch, vm }),
     routeTab: routeTab(props, state),
     getRouteActive: getRouteActive({ props, route }),
-    onClick: onClick({ api: api2, emit, parent, props, router, state })
+    onClick: onClick({ api: api2, emit, parent, props, router, state, dispatch }),
+    getTabbarItemsWidth: getTabbarItemsWidth(state)
   });
   onMounted(() => nextTick(api2.bindChildren));
   return api2;

package/table/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const computedCheckableData = ({ props }) => () => props.data.filter((item) => !item.disabled);
 const computedSelectedKeys = ({ props, state }) => () => {
   const keys = [];

package/table/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   computedCheckableData,
   computedSelectedKeys,

package/tabs/index.js

@@ -1,5 +1,10 @@
-import "../chunk-PKUHTIDK.js";
-const calcPaneInstances = ({ constants, parent, state, childrenHandler }) => (isForceUpdate = false) => {
+import "../chunk-G2ADBYYC.js";
+const calcPaneInstances = ({
+  constants,
+  parent,
+  state,
+  childrenHandler
+}) => (isForceUpdate = false) => {
   const tabItemVNodes = parent.$slots.default;
   if (tabItemVNodes) {
     const currentPanes = [];
@@ -27,7 +32,13 @@ const calcPaneInstances = ({ constants, parent, state, childrenHandler }) => (is
     state.panes = [];
   }
 };
-const calcMorePanes = ({ parent, props, state, refs, nextTick }) => () => {
+const calcMorePanes = ({
+  parent,
+  props,
+  state,
+  refs,
+  nextTick
+}) => () => {
   if (!props.showMoreTabs) {
     return;
   }
@@ -39,11 +50,13 @@ const calcMorePanes = ({ parent, props, state, refs, nextTick }) => () => {
       nextTick(() => {
         let tabsAllWidth = 0;
         for (let i = 0; i < tabs.length; i++) {
-          tabsAllWidth = tabs[i].offsetLeft + tabs[i].offsetWidth / 2;
+          const tabItem = tabs[i];
+          tabsAllWidth = tabItem.offsetLeft + tabItem.offsetWidth / 2;
           const tabsHeaderWidth = tabNavRefs.navScroll.offsetWidth;
-          if (tabsAllWidth > tabsHeaderWidth) {
-            if (state.currentName >= i + 1) {
-              state.showPanesCount = state.currentName - 0;
+          const currentName = Number(state.currentName);
+          if (tabsAllWidth > tabsHeaderWidth && currentName >= 0) {
+            if (currentName >= i + 1) {
+              state.showPanesCount = currentName - 0;
             } else {
               state.showPanesCount = i;
             }
@@ -111,7 +124,8 @@ const created = ({ api, parent, state }) => () => {
   parent.$on("tab-nav-update", api.calcPaneInstances.bind(null, true));
 };
 const changeDirection = ({ props, state }) => (currentName) => {
-  state.panes.forEach((item, index) => {
+  const panes = state.panes;
+  panes.forEach((item, index) => {
     if (item.state.paneName === currentName && state.currentIndex !== index) {
       const isTopOrBottom = ~["top", "bottom"].indexOf(props.position);
       const isPrev = state.currentIndex < index;

package/tabs/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   calcMorePanes,
   calcExpandPanes,
@@ -40,7 +40,14 @@ const initState = ({ reactive, props }) => reactive({
   direction: "",
   expandPanesWidth: ""
 });
-const initWatcher = ({ watch, props, api: api2, state, nextTick, refs }) => {
+const initWatcher = ({
+  watch,
+  props,
+  api: api2,
+  state,
+  nextTick,
+  refs
+}) => {
   watch(() => props.modelValue, api2.setCurrentName);
   watch(() => props.activeName, api2.setCurrentName);
   watch(

package/tabs-mf/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { random } from "../common/string";
 import debounce from "../common/deps/debounce";
 const setActive = ({ emit, state, props }) => (name) => {

package/tabs-mf/vue-bar.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 import { wheelListener, getBoundRect, handleClickDropdownItem, key, emitAdd } from "./index";
 import { getAddWheelListener } from "./wheel";

package/tabs-mf/vue-nav-item.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { handleNavItemClick, getBoundRectNV, handleNavItemClose } from "./index";
 const api = ["state", "handleNavItemClick", "getBoundRect", "handleNavItemClose"];
 const renderless = (props, { inject, markRaw, reactive, computed }, { vm }) => {

package/tabs-mf/vue-nav.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const api = ["state"];
 const renderless = (props, { reactive, inject, computed }) => {
   const tabs = inject("tabs", null);

package/tabs-mf/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { random } from "../common/string";
 import { setActive, addItem, addNav, scrollTo, clickMore, removeItem } from "./index";
 const api = ["state", "setActive", "addItem", "addNav", "scrollTo", "clickMore", "removeItem"];

package/tabs-mf/wheel.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const getAddWheelListener = (window, document) => {
   const { addApiName, removeApiName, prefix } = detectEventModel(window);
   const support = detectAvailableWheelEvent(document);

package/tag/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const handleClose = ({ emit, props, state }) => (event) => {
   if (props.disabled)
     return;
@@ -8,7 +8,7 @@ const handleClose = ({ emit, props, state }) => (event) => {
   props.beforeDelete ? props.beforeDelete(close) : close();
 };
 const handleClick = ({ emit, props, parent, state }) => (event) => {
-  if (props.selectable || props.disabled)
+  if (!props.selectable || props.disabled)
     return;
   parent.$parent && parent.$parent.tagSelectable && event.stopPropagation();
   state.selected = !state.selected;

package/tag/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { handleClose, handleClick } from "./index";
 const api = ["state", "handleClose", "handleClick"];
 const renderless = (props, { reactive, computed }, { emit, parent }) => {

package/tag-group/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 const handelItemClick = ({ emit }) => (item, index, $event) => {
   emit("item-click", item, index, $event);
 };

package/tag-group/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 import debounce from "../common/deps/debounce";
 import { getHiddenTags, handelItemClick } from "./index";

package/tall-storage/index.js

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

package/tall-storage/vue-storage-box.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { addMemory, searchMemory, selectedMemory } from "./index";
 var vue_storage_box_default = ({ api, props, reactive, toRefs }) => {
   const state = reactive({

package/tall-storage/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { mousedown, selectItem, keydown } from "./index";
 import { on, off } from "../common/deps/dom";
 const api = ["state", "mousedown", "selectItem"];

package/text-popup/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const computedWidth = ({ props }) => () => {
   if (typeof props.width === "number" || !Number.isNaN(Number(props.width))) {
     return props.width + "px";

package/text-popup/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { computedWidth, watchValue, mounted, onFocus, onBlur, onInput, separteText, jointText } from "./index";
 const api = ["state", "onFocus", "onBlur", "onInput"];
 const renderless = (props, { computed, onMounted, reactive, watch, inject }, { emit, nextTick, refs }) => {

package/time/index.js

@@ -1,11 +1,11 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { limitTimeRange, clearMilliseconds, timeWithinRange } from "../common/deps/date-util";
 const watchValue = ({ api, nextTick, state }) => (value) => {
   let date;
   if (value instanceof Date) {
     date = limitTimeRange(value, state.selectableRange, state.format);
   } else if (!value) {
-    date = state.defaultValue ? new Date(state.defaultValue) : new Date();
+    date = state.defaultValue ? new Date(state.defaultValue) : /* @__PURE__ */ new Date();
   }
   state.date = date;
   if (state.visible && state.needInitAdjust) {

package/time/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   changeSelectionRange,
   adjustSpinners,
@@ -20,8 +20,8 @@ const initState = ({ reactive, props, computed, api: api2 }) => {
     format: "HH:mm:ss",
     value: "",
     defaultValue: null,
-    date: props.value || new Date(),
-    oldValue: new Date(),
+    date: props.value || /* @__PURE__ */ new Date(),
+    oldValue: /* @__PURE__ */ new Date(),
     selectableRange: [],
     selectionRange: [0, 2],
     disabled: false,
@@ -67,7 +67,7 @@ const renderless = (props, { computed, onMounted, reactive, watch, nextTick }, {
   );
   watch(
     () => state.defaultValue,
-    (value) => !isDate(state.value) && (state.date = value ? new Date(value) : new Date())
+    (value) => !isDate(state.value) && (state.date = value ? new Date(value) : /* @__PURE__ */ new Date())
   );
   onMounted(() => {
     api2.handleConfirm(true, true);

package/time-line/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { format } from "../common/date";
 const getDate = (dateTime) => ({
   date: format(dateTime, "yyyy-MM-dd"),
@@ -11,7 +11,7 @@ const getStatus = ({ state, t }) => (value) => {
   const status = state.current - value;
   return status > 0 ? t("ui.steps.done") : status === 0 ? t("ui.steps.doing") : t("ui.steps.wait");
 };
-const computedSpace = ({ props }) => {
+const computedSpace = ({ props }) => () => {
   const { space } = props;
   if (/^\d+$/.test(space)) {
     return `${space}px`;

package/time-line/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   handleClick,
   getStatusCls,
@@ -21,7 +21,7 @@ const renderless = (props, { computed, reactive, provide, watch }, { t, emit, co
     current: computed(() => api2.computedCurrent()),
     isReverse: computed(() => api2.computedIsReverse()),
     stackNodes: computed(() => state.showAll ? state.nodes : api2.computedStackNodes()),
-    computedSpace: computed(() => computedSpace({ props })),
+    computedSpace: computed(() => api2.computedSpace()),
     showData: false,
     showAll: false,
     computedWrapperClass: computed(() => api2.computedWrapperClass())
@@ -32,9 +32,10 @@ const renderless = (props, { computed, reactive, provide, watch }, { t, emit, co
     computedData: computedData({ props, state }),
     computedCurrent: computedCurrent({ props, state }),
     computedIsReverse: computedIsReverse(props),
+    computedSpace: computedSpace({ props }),
     getStatus: getStatus({ state, t }),
-    handleClick: handleClick({ emit, state, api: api2 }),
-    getStatusCls: getStatusCls({ constants, props, state }),
+    handleClick: handleClick({ emit, state }),
+    getStatusCls: getStatusCls({ constants, state }),
     computedStackNodes: computedStackNodes({ state, constants }),
     changeStatus: changeStatus({ state }),
     computedWrapperClass: computedWrapperClass({ props })

package/time-panel/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import scrollIntoView from "../common/deps/scroll-into-view";
 import { DATEPICKER } from "../common";
 const parseTime = () => (time) => {

package/time-panel/scrollIntoView.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 var scrollIntoView_default = (container, selected) => {
   if (!selected) {
     container.scrollTop = 0;

package/time-panel/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   handleKeydown,
   isValidValue,

package/time-picker-mobile/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const optionMethod = (value) => {
   const val = ("0" + value).slice(-2);
   return { id: val, label: val };

package/time-picker-mobile/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { optionMethod, watchModelValue, watchVisible, confirm, updateVisible } from "./index";
 const api = ["state", "confirm", "updateVisible"];
 const renderless = (props, { reactive, watch }, { emit }) => {

package/time-range/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { clearMilliseconds, timeWithinRange, limitTimeRange, modifyDate } from "../common/deps/date-util";
 const minTimeOfDay = ({ MIN_TIME }) => (date) => modifyDate(MIN_TIME, date.getFullYear(), date.getMonth(), date.getDate());
 const maxTimeOfDay = ({ MAX_TIME }) => (date) => modifyDate(MAX_TIME, date.getFullYear(), date.getMonth(), date.getDate());
@@ -17,12 +17,12 @@ const watchValue = ({ api, state }) => (value) => {
     if (value[0]) {
       state.minDate = new Date(value[0]);
     } else {
-      state.minDate = value[1] ? new Date(api.minTimeOfDay(new Date(value[1])).getTime()) : new Date();
+      state.minDate = value[1] ? new Date(api.minTimeOfDay(new Date(value[1])).getTime()) : /* @__PURE__ */ new Date();
     }
     if (value[1]) {
       state.maxDate = new Date(value[1]);
     } else {
-      state.maxDate = value[0] ? api.advanceTime(new Date(value[0]), 60 * 60 * 1e3) : api.advanceTime(new Date(), 60 * 60 * 1e3);
+      state.maxDate = value[0] ? api.advanceTime(new Date(value[0]), 60 * 60 * 1e3) : api.advanceTime(/* @__PURE__ */ new Date(), 60 * 60 * 1e3);
     }
   } else {
     if (Array.isArray(state.defaultValue)) {
@@ -32,8 +32,8 @@ const watchValue = ({ api, state }) => (value) => {
       state.minDate = new Date(state.defaultValue);
       state.maxDate = api.advanceTime(new Date(state.defaultValue), 60 * 60 * 1e3);
     } else {
-      state.minDate = new Date();
-      state.maxDate = api.advanceTime(new Date(), 60 * 60 * 1e3);
+      state.minDate = /* @__PURE__ */ new Date();
+      state.maxDate = api.advanceTime(/* @__PURE__ */ new Date(), 60 * 60 * 1e3);
     }
   }
 };

package/time-range/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   handleKeydown,
   isValidValue,
@@ -36,11 +36,11 @@ const initState = ({ reactive, computed, vm, api: api2 }) => {
     format: "HH:mm:ss",
     visible: false,
     value: [],
-    oldValue: [new Date(), new Date()],
+    oldValue: [/* @__PURE__ */ new Date(), /* @__PURE__ */ new Date()],
     selectionRange: [0, 2],
     arrowControl: false,
-    maxDate: new Date(),
-    minDate: new Date(),
+    maxDate: /* @__PURE__ */ new Date(),
+    minDate: /* @__PURE__ */ new Date(),
     showSeconds: computed(() => (state.format || "").includes("ss")),
     offset: computed(() => state.showSeconds ? 11 : 8),
     spinner: computed(() => state.selectionRange[0] < state.offset ? vm.$refs.minSpinner : vm.$refs.maxSpinner),

package/time-spinner/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { modifyTime } from "../common/deps/date-util";
 import { DATEPICKER } from "../common";
 const getArrowHourList = (state) => () => {

package/time-spinner/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   getArrowHourList,
   getArrowMinuteList,
@@ -76,8 +76,8 @@ const renderless = (props, { computed, onMounted, reactive, watch, nextTick }, {
     bindScrollEvent: bindScrollEvent({ api: api2, vm }),
     adjustSpinners: adjustSpinners({ api: api2, state }),
     adjustSpinner: adjustSpinner({ api: api2, props, vm, state }),
-    increase: increase(api2, state),
-    decrease: decrease(api2, state),
+    increase: increase({ api: api2, state }),
+    decrease: decrease({ api: api2, state }),
     handleClick: handleClick(api2),
     scrollDown: scrollDown({ api: api2, state }),
     handleScroll: handleScroll({ api: api2, vm, state }),

package/timeline-item/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { format } from "../common/date";
 const getDate = (dateTime) => ({
   date: format(dateTime, "yyyy-MM-dd"),
@@ -8,12 +8,8 @@ const getStatus = ({ state, t }) => (value) => {
   const status = state.current - value;
   return status > 0 ? t("ui.steps.done") : status === 0 ? t("ui.steps.doing") : t("ui.steps.wait");
 };
-const computedSpace = ({ props, api }) => () => {
-  const space = props.space || api.rootProps.space;
-  if (/^\d+$/.test(space)) {
-    return `${space}px`;
-  }
-  return space;
+const computedWidth = () => (width) => {
+  return /^\d+$/.test(width) ? `${width}px` : width;
 };
 const handleClick = ({ emit, state }) => (node) => {
   const { index } = node || {};
@@ -22,7 +18,7 @@ const handleClick = ({ emit, state }) => (node) => {
   }
 };
 const getStatusCls = ({ constants, state }) => (node) => {
-  const { index } = node || {};
+  const { 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;
@@ -39,7 +35,7 @@ const getStatusCls = ({ constants, state }) => (node) => {
 };
 const computedCurrent = ({ state, api }) => () => state.isReverse ? state.nodesLength - api.rootProps.active - 1 : api.rootProps.active;
 const computedIsReverse = (api) => () => api.rootProps.reverse && api.rootProps.vertical;
-const computedItemCls = ({ props, api }) => () => {
+const computedItemCls = ({ props, api, state }) => () => {
   const itemClass = [];
   if (api.rootProps.vertical) {
     itemClass.push("timeline");
@@ -47,29 +43,32 @@ const computedItemCls = ({ props, api }) => () => {
     itemClass.push("normal");
   }
   itemClass.push(api.getStatusCls(props.node));
+  if (state.computedLineWidth) {
+    itemClass.push("no-flex");
+  }
   return itemClass;
 };
 const computedItemStyle = ({ props, state, api }) => () => {
   const { index } = props.node;
-  const { computedSpace: computedSpace2, nodesLength } = state;
+  const { computedSpace, nodesLength } = state;
   const { textPosition, vertical } = api.rootProps;
   if (vertical) {
-    return { height: index === nodesLength - 1 ? "" : computedSpace2 || "88px" };
+    return { height: index === nodesLength - 1 ? "" : computedSpace || "88px" };
   }
   if (textPosition === "right") {
-    if (computedSpace2) {
-      return { flex: `0 0 ${computedSpace2}` };
+    if (computedSpace && !state.computedLineWidth) {
+      return { flex: `0 0 ${computedSpace}` };
     }
     return null;
   }
-  return { width: computedSpace2 || 100 / nodesLength + "%" };
+  return { width: computedSpace || 100 / nodesLength + "%" };
 };
 export {
   computedCurrent,
   computedIsReverse,
   computedItemCls,
   computedItemStyle,
-  computedSpace,
+  computedWidth,
   getDate,
   getStatus,
   getStatusCls,