zova-module-a-routertabs 5.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2016-present Zova
+
+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/dist/index.js

@@ -0,0 +1,429 @@
+import { BeanInfo, BeanScopeBase, Use, deepEqual, deepExtend, prepareComponentOptions, useComputed, useController } from "zova";
+import { mutate } from "mutate-on-copy";
+import { BeanModelBase, Model } from "zova-module-a-model";
+import { Controller, Scope } from "zova-module-a-bean";
+import { BeanRouterViewBase } from "zova-module-a-router";
+import { defineComponent } from "vue";
+//#region src/model/tabs.ts
+var _dec$2, _dec2$2, _class$2;
+var ModelTabs$1 = (_dec$2 = Model({
+	enableSelector: true,
+	max: -1,
+	maxItems: -1,
+	cache: false
+}), _dec2$2 = BeanInfo({ module: "a-routertabs" }), _dec$2(_class$2 = _dec2$2(_class$2 = class ModelTabs extends BeanModelBase {
+	constructor(...args) {
+		super(...args);
+		this.tabsOptions = void 0;
+		this.tabs = void 0;
+		this.componentKeyCurrent = void 0;
+		this.tabKeyCurrent = void 0;
+		this.tabCurrentIndex = void 0;
+		this.tabCurrent = void 0;
+		this.keepAliveInclude = void 0;
+		this._eventSsrHmrReload = void 0;
+	}
+	async __init__(scene, options) {
+		await super.__init__(scene);
+		this.bean._setBean("$$modelTabs", this);
+		this.tabsOptions = deepExtend({}, this.$onionOptions, options);
+		this.tabCurrentIndex = useComputed(() => {
+			const [index] = this.findTab(this.tabKeyCurrent);
+			return index;
+		});
+		this.tabCurrent = useComputed(() => {
+			const [, tab] = this.findTab(this.tabKeyCurrent);
+			return tab;
+		});
+		this.keepAliveInclude = useComputed(() => {
+			return this._getKeepAliveInclude();
+		});
+		this.componentKeyCurrent = this.$useStateMem({ queryKey: ["componentKeyCurrent"] });
+		this.tabKeyCurrent = this.$useStateMem({ queryKey: ["tabKeyCurrent"] });
+		const queryOptionsTabs = {
+			queryKey: ["tabs"],
+			meta: { defaultData: this._getInitialTabs() }
+		};
+		if (this.tabsOptions.cache) this.tabs = this.$useStateDb(queryOptionsTabs);
+		else this.tabs = this.$useStateMem(queryOptionsTabs);
+		if (this.tabsOptions.cache) await this.$loadStateDb(this.tabs);
+		if (this.$currentRoute) this.forwardRoute(this.$currentRoute);
+		if (process.env.CLIENT && this.sys.env.SSR_HMR === "true") this._eventSsrHmrReload = this.sys.meta.event.on("a-ssrhmr:reload", async (_data, next) => {
+			this.updateAllTabInfos();
+			return next();
+		});
+		this.$watch(() => {
+			return this.app.meta.locale.current;
+		}, () => {
+			this.updateAllTabInfos();
+		});
+	}
+	__dispose__() {
+		if (this._eventSsrHmrReload) this._eventSsrHmrReload();
+	}
+	get cache() {
+		return this.tabsOptions.cache;
+	}
+	addTab(tab, affix) {
+		const res = this._addTab(tab, affix);
+		this.tabKeyCurrent = res ? tab.tabKey : void 0;
+		this.componentKeyCurrent = res ? tab.componentKey : void 0;
+		return res;
+	}
+	_addTab(tab, affix) {
+		const tabKey = tab.tabKey;
+		if (!tabKey) return false;
+		const [index, tabOld] = this.findTab(tabKey);
+		const tabInfo = this.tabsOptions.getTabInfo?.(tabKey) ?? tabOld?.info;
+		if (!tabInfo) return false;
+		if (index === -1) {
+			const tabNew = {
+				tabKey,
+				affix,
+				items: tab.componentKey ? [{
+					componentKey: tab.componentKey,
+					fullPath: tab.fullPath,
+					keepAlive: tab.keepAlive,
+					updatedAt: Date.now()
+				}] : [],
+				updatedAt: Date.now(),
+				info: tabInfo
+			};
+			if (this.tabCurrentIndex === -1) this.tabs = mutate(this.tabs, (copyState) => {
+				copyState.push(tabNew);
+			});
+			else this.tabs = mutate(this.tabs, (copyState) => {
+				copyState.splice(this.tabCurrentIndex + 1, 0, tabNew);
+			});
+			this.pruneTabs();
+		} else {
+			if (!deepEqual(tabInfo, tabOld?.info)) this.updateTabInfo(tabKey);
+			if (!this._checkIfTabNeedUpdate(tabOld, tab)) return true;
+			this.updateTab(tab);
+			this.pruneTabItems(tabKey);
+		}
+		return true;
+	}
+	updateAllTabInfos(tabInitials) {
+		for (const tab of this.tabs) {
+			const tabInitial = tabInitials?.find((item) => item.tabKey === tab.tabKey);
+			this.updateTabInfo(tab.tabKey, tabInitial);
+		}
+	}
+	updateTabInfo(tabKey, tabInitial) {
+		if (!tabKey) return;
+		const [index, tabOld] = this.findTab(tabKey);
+		if (index === -1) return;
+		const tabInfo = this.tabsOptions.getTabInfo ? this.tabsOptions.getTabInfo(tabKey) : tabInitial?.info ?? tabOld?.info;
+		if (!tabInfo) return;
+		const tabNew = {
+			...tabOld,
+			info: tabInfo
+		};
+		this.updateTab(tabNew);
+	}
+	updateTabItemPageMeta(tabKey, componentKey, pageMeta) {
+		if (!tabKey || !componentKey) return false;
+		const [index, tab] = this.findTab(tabKey);
+		if (index === -1 || !tab) return false;
+		if (!tab.items) return false;
+		const indexItem = tab.items.findIndex((item) => item.componentKey === componentKey);
+		if (indexItem === -1) return false;
+		const tabItem = tab.items[indexItem];
+		const pageMetaNew = {
+			...tabItem.pageMeta,
+			...pageMeta
+		};
+		const tabItemNew = {
+			...tabItem,
+			pageMeta: pageMetaNew
+		};
+		const items = mutate(tab.items, (copyState) => {
+			copyState.splice(indexItem, 1, tabItemNew);
+		});
+		const tabNew = {
+			...tab,
+			items
+		};
+		this.tabs = mutate(this.tabs, (copyState) => {
+			copyState.splice(index, 1, tabNew);
+		});
+		return true;
+	}
+	async deleteTab(tabKey, noActiveNext) {
+		if (!tabKey) return;
+		const [index] = this.findTab(tabKey);
+		if (index === -1) return;
+		let tabKeyActiveNext;
+		if (!noActiveNext && index === this.tabCurrentIndex) {
+			const tabCurrentIndex = index - 1 > -1 ? index - 1 : index + 1 < this.tabs.length ? index + 1 : -1;
+			if (tabCurrentIndex > -1) tabKeyActiveNext = this.tabs[tabCurrentIndex]?.tabKey;
+		}
+		this.tabs = mutate(this.tabs, (copyState) => {
+			copyState.splice(index, 1);
+		});
+		if (tabKeyActiveNext) await this.activeTab(tabKeyActiveNext);
+	}
+	async deleteTabItem(tabKey, componentKey, noActiveNext) {
+		if (!tabKey || !componentKey) return false;
+		if (tabKey === componentKey) return false;
+		const [index, tab] = this.findTab(tabKey);
+		if (index === -1 || !tab) return false;
+		if (!tab.items) return false;
+		const indexItem = tab.items.findIndex((item) => item.componentKey === componentKey);
+		if (indexItem === -1) return false;
+		if (tab.items.length === 1 && !tab.affix) await this.deleteTab(tabKey, noActiveNext);
+		else {
+			const items = mutate(tab.items, (copyState) => {
+				copyState.splice(indexItem, 1);
+			});
+			const tabNew = {
+				...tab,
+				items
+			};
+			this.tabs = mutate(this.tabs, (copyState) => {
+				copyState.splice(index, 1, tabNew);
+			});
+		}
+		return true;
+	}
+	findTabItemByFullPath(fullPath) {
+		for (const tab of this.tabs) {
+			if (!tab.items) continue;
+			for (const item of tab.items) if (item.fullPath === fullPath) return [tab.tabKey, item.componentKey];
+		}
+		return [];
+	}
+	updateTab(tab) {
+		const tabKey = tab.tabKey;
+		const [index, tabOld] = this.findTab(tabKey);
+		if (index === -1 || !tabOld) return;
+		const items = tabOld.items ? [].concat(tabOld.items) : [];
+		if (tab.componentKey) {
+			const tabItem = {
+				componentKey: tab.componentKey,
+				fullPath: tab.fullPath,
+				keepAlive: tab.keepAlive,
+				updatedAt: Date.now()
+			};
+			const index = items.findIndex((item) => item.componentKey === tab.componentKey);
+			if (index === -1) items.push(tabItem);
+			else {
+				const tabItemNew = {
+					...items[index],
+					...tabItem
+				};
+				items.splice(index, 1, tabItemNew);
+			}
+			items.sort((a, b) => (a.componentKey === tabKey ? 0 : 1) - (b.componentKey === tabKey ? 0 : 1));
+		}
+		const tabNew = {
+			...tabOld,
+			...tab,
+			tabKey,
+			items,
+			updatedAt: Date.now()
+		};
+		this.tabs = mutate(this.tabs, (copyState) => {
+			copyState.splice(index, 1, tabNew);
+		});
+	}
+	async activeTab(tabKey) {
+		if (!tabKey) return;
+		const [_, tab] = this.findTab(tabKey);
+		if (!tab) return;
+		const tabItemFirst = tab.items?.[0];
+		const path = tabItemFirst?.componentKey === tabKey ? tabItemFirst.fullPath : tabKey;
+		await this.$router.push(path);
+	}
+	async activeTabItem(tabKey, componentKey) {
+		if (!tabKey || !componentKey) return;
+		const [_, tab] = this.findTab(tabKey);
+		if (!tab) return;
+		const tabItem = tab.items?.find((item) => item.componentKey === componentKey);
+		if (!tabItem) return;
+		const path = tabItem.fullPath;
+		await this.$router.push(path);
+	}
+	findTab(tabKey) {
+		if (!tabKey) return [-1, void 0];
+		const index = this.tabs.findIndex((item) => item.tabKey === tabKey);
+		if (index === -1) return [index, void 0];
+		return [index, this.tabs[index]];
+	}
+	async pruneTabs() {
+		let max = this.tabsOptions.max;
+		if (max === void 0 || max === -1) return;
+		if (max < 1) max = 1;
+		while (true) {
+			const affixCount = this.tabs.filter((item) => item.affix).length;
+			if (this.tabs.length - affixCount <= max) break;
+			let tabKey;
+			let updatedAt = Date.now();
+			for (const tab of this.tabs) if (!tab.affix && tab.updatedAt < updatedAt) {
+				tabKey = tab.tabKey;
+				updatedAt = tab.updatedAt;
+			}
+			if (!tabKey) break;
+			await this.deleteTab(tabKey, true);
+		}
+	}
+	async pruneTabItems(tabKey) {
+		if (!tabKey) return;
+		let maxItems = this.tabsOptions.maxItems;
+		if (maxItems === void 0 || maxItems === -1) return;
+		if (maxItems < 1) maxItems = 1;
+		while (true) {
+			const [_, tab] = this.findTab(tabKey);
+			if (!tab || !tab.items) break;
+			const ignoreCount = tab.items.filter((item) => item.componentKey === tabKey).length;
+			if (tab.items.length - ignoreCount <= maxItems) break;
+			let componentKey;
+			let updatedAt = Date.now();
+			for (const tabItem of tab.items) if (tabItem.componentKey !== tabKey && tabItem.updatedAt < updatedAt) {
+				componentKey = tabItem.componentKey;
+				updatedAt = tabItem.updatedAt;
+			}
+			if (!componentKey) break;
+			await this.deleteTabItem(tabKey, componentKey, true);
+		}
+	}
+	_checkIfTabNeedUpdate(tabOld, tabNew) {
+		for (const key in tabNew) {
+			if ([
+				"fullPath",
+				"keepAlive",
+				"updatedAt"
+			].includes(key)) continue;
+			if (["componentKey"].includes(key)) {
+				if (!tabOld.items) return true;
+				const tabItemOld = tabOld.items.find((item) => item[key] === tabNew[key]);
+				if (!tabItemOld) return true;
+				for (const key2 of ["fullPath", "keepAlive"]) if (tabItemOld[key2] !== tabNew[key2]) return true;
+				if (tabOld.items.findIndex((item) => item[key] !== tabItemOld[key] && (item.updatedAt ?? 0) >= (tabItemOld.updatedAt ?? 0)) > -1) return true;
+			} else if (tabNew[key] !== tabOld[key]) return true;
+		}
+		if (this.tabs.findIndex((item) => item.tabKey !== tabOld.tabKey && (item.updatedAt ?? 0) >= (tabOld.updatedAt ?? 0)) > -1) return true;
+		return false;
+	}
+	_getKeepAliveInclude() {
+		const include = [];
+		for (const tab of this.tabs) {
+			if (!tab.items) continue;
+			for (const item of tab.items) if (item.keepAlive !== false && item.componentKey) {
+				if (!include.includes(item.componentKey)) include.push(item.componentKey);
+			}
+		}
+		return include;
+	}
+	_getInitialTabs() {
+		const tabs = this.tabsOptions.getInitialTabs?.() ?? [];
+		if (!this.tabsOptions.getTabInfo) return tabs;
+		return tabs.map((tab) => {
+			return {
+				...tab,
+				info: this.tabsOptions.getTabInfo?.(tab.tabKey) ?? tab.info
+			};
+		});
+	}
+	backRoute(route) {
+		const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);
+		this.deleteTabItem(tabKey, componentKey, true);
+	}
+	forwardRoute(route) {
+		const routeMeta = this.prepareRouteMeta(route);
+		this.addTab(routeMeta);
+	}
+	setPageMeta(route, pageMeta) {
+		const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);
+		this.updateTabItemPageMeta(tabKey, componentKey, pageMeta);
+	}
+	prepareRouteMeta(route) {
+		const fullPath = route.fullPath;
+		const componentKey = this.__handleRoutePropComponentKey(route);
+		return {
+			tabKey: this._handleRouteProp(route, "tabKey") || componentKey,
+			componentKey,
+			fullPath,
+			keepAlive: this._handleRouteProp(route, "keepAlive")
+		};
+	}
+	_handleRouteProp(route, prop) {
+		let value = route.meta[prop];
+		if (typeof value === "function") value = value.call(this.app, route);
+		return value;
+	}
+	__handleRoutePropComponentKey(route) {
+		const componentKey = this._handleRouteProp(route, "componentKey");
+		if (componentKey) return componentKey;
+		const name = this.$router.getRealRouteName(route.name);
+		if (!name) return route.path;
+		if (route.meta.componentKeyMode === "nameOnly") return name;
+		return route.path;
+	}
+}) || _class$2) || _class$2);
+//#endregion
+//#region src/component/routerViewTabs/controller.tsx
+var _dec$1, _dec2$1, _dec3, _dec4, _class$1, _class2, _descriptor, _ControllerRouterViewTabs;
+function _initializerDefineProperty(e, i, r, l) {
+	r && Object.defineProperty(e, i, {
+		enumerable: r.enumerable,
+		configurable: r.configurable,
+		writable: r.writable,
+		value: r.initializer ? r.initializer.call(l) : void 0
+	});
+}
+function _applyDecoratedDescriptor(i, e, r, n, l) {
+	var a = {};
+	return Object.keys(n).forEach(function(i) {
+		a[i] = n[i];
+	}), a.enumerable = !!a.enumerable, a.configurable = !!a.configurable, ("value" in a || a.initializer) && (a.writable = !0), a = r.slice().reverse().reduce(function(r, n) {
+		return n(i, e, r) || r;
+	}, a), l && void 0 !== a.initializer && (a.value = a.initializer ? a.initializer.call(l) : void 0, a.initializer = void 0), void 0 === a.initializer ? (Object.defineProperty(i, e, a), null) : a;
+}
+var ControllerRouterViewTabs = (_dec$1 = Controller(), _dec2$1 = BeanInfo({ module: "a-routertabs" }), _dec3 = Use({ injectionScope: "skipSelf" }), _dec4 = Reflect.metadata("design:type", typeof ModelTabs === "undefined" ? Object : ModelTabs), _dec$1(_class$1 = _dec2$1(_class$1 = (_class2 = (_ControllerRouterViewTabs = class ControllerRouterViewTabs extends BeanRouterViewBase {
+	constructor(...args) {
+		super(...args);
+		_initializerDefineProperty(this, "$$modelTabs", _descriptor, this);
+	}
+	backRoute(route) {
+		this.$$modelTabs.backRoute(route);
+		return true;
+	}
+	forwardRoute(route) {
+		this.$$modelTabs.forwardRoute(route);
+		return true;
+	}
+	setPageMeta(route, pageMeta) {
+		this.$$modelTabs.setPageMeta(route, pageMeta);
+	}
+	prepareRouteMeta(route) {
+		return this.$$modelTabs.prepareRouteMeta(route);
+	}
+	getKeepAliveInclude() {
+		return this.$$modelTabs.keepAliveInclude;
+	}
+}, _ControllerRouterViewTabs.$propsDefault = {}, _ControllerRouterViewTabs), _descriptor = _applyDecoratedDescriptor(_class2.prototype, "$$modelTabs", [_dec3, _dec4], {
+	configurable: true,
+	enumerable: true,
+	writable: true,
+	initializer: null
+}), _class2)) || _class$1) || _class$1);
+//#endregion
+//#region src/.metadata/component/routerViewTabs.ts
+var ZRouterViewTabs = defineComponent((_props) => {
+	useController(ControllerRouterViewTabs, void 0, void 0);
+	return () => {};
+}, prepareComponentOptions());
+//#endregion
+//#region src/.metadata/index.ts
+/** components: end */
+/** scope: begin */
+var _dec, _dec2, _class;
+var components = { "routerViewTabs": ZRouterViewTabs };
+var ScopeModuleARoutertabs = (_dec = Scope(), _dec2 = BeanInfo({ module: "a-routertabs" }), _dec(_class = _dec2(_class = class ScopeModuleARoutertabs extends BeanScopeBase {}) || _class) || _class);
+/** scope: end */
+//#endregion
+export { ControllerRouterViewTabs, ModelTabs$1 as ModelTabs, ScopeModuleARoutertabs, ZRouterViewTabs, components };
+
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Use","Controller","BeanRouterViewBase","ControllerRouterViewTabs","_dec","_dec2","__z_BeanInfo","module","_dec3","injectionScope","_dec4","Reflect","metadata","ModelTabs","Object","_class","_class2","_ControllerRouterViewTabs","constructor","args","_initializerDefineProperty","_descriptor","backRoute","route","$$modelTabs","forwardRoute","setPageMeta","pageMeta","prepareRouteMeta","getKeepAliveInclude","keepAliveInclude","$propsDefault","_applyDecoratedDescriptor","prototype","configurable","enumerable","writable","initializer"],"sources":["../src/model/tabs.ts","../src/component/routerViewTabs/controller.tsx","../src/.metadata/component/routerViewTabs.ts","../src/.metadata/index.ts"],"sourcesContent":["import type { IDecoratorModelOptions, UseQueryOptions } from 'zova-module-a-model';\n\nimport { RouteLocationNormalizedLoaded, RouteLocationNormalizedLoadedGeneric } from '@cabloy/vue-router';\nimport { mutate } from 'mutate-on-copy';\nimport { deepEqual, deepExtend, TypeEventOff, useComputed } from 'zova';\nimport { BeanModelBase, Model } from 'zova-module-a-model';\nimport { IPageMeta, IRouteViewRouteItem, IRouteViewRouteMeta } from 'zova-module-a-router';\n\nimport { ModelTabsOptions, ModelTabsOptionsBase, RouteTab, RouteTabInitial, RouteTabTransient } from '../types/tabs.js';\n\nexport interface IModelOptionsTabs extends IDecoratorModelOptions, ModelTabsOptionsBase {}\n\n@Model<IModelOptionsTabs>({\n  enableSelector: true,\n  max: -1,\n  maxItems: -1,\n  cache: false,\n})\nexport class ModelTabs extends BeanModelBase {\n  tabsOptions: ModelTabsOptions;\n  tabs: RouteTab[];\n  componentKeyCurrent?: string;\n  tabKeyCurrent?: string;\n  tabCurrentIndex: number;\n  tabCurrent?: RouteTab;\n  keepAliveInclude: string[];\n  private _eventSsrHmrReload: TypeEventOff;\n\n  protected async __init__(scene: string, options?: ModelTabsOptions) {\n    await super.__init__(scene);\n    this.bean._setBean('$$modelTabs', this);\n    // options\n    this.tabsOptions = deepExtend({}, this.$onionOptions, options);\n    // computed\n    this.tabCurrentIndex = useComputed(() => {\n      const [index] = this.findTab(this.tabKeyCurrent);\n      return index;\n    });\n    this.tabCurrent = useComputed(() => {\n      const [, tab] = this.findTab(this.tabKeyCurrent);\n      return tab;\n    });\n    this.keepAliveInclude = useComputed(() => {\n      return this._getKeepAliveInclude();\n    });\n    // componentKeyCurrent\n    const queryOptionsComponentKeyCurrent: UseQueryOptions<string> = {\n      queryKey: ['componentKeyCurrent'],\n    };\n    this.componentKeyCurrent = this.$useStateMem(queryOptionsComponentKeyCurrent);\n    // tabKeyCurrent\n    const queryOptionsTabKeyCurrent: UseQueryOptions<string> = {\n      queryKey: ['tabKeyCurrent'],\n    };\n    this.tabKeyCurrent = this.$useStateMem(queryOptionsTabKeyCurrent);\n    // if (this.tabsOptions.cache) {\n    //   this.tabKeyCurrent = this.$useStateDb(queryOptionsTabKeyCurrent);\n    // } else {\n    //   this.tabKeyCurrent = this.$useStateMem(queryOptionsTabKeyCurrent);\n    // }\n    // tabs\n    const queryOptionsTabs: UseQueryOptions<RouteTab[]> = {\n      queryKey: ['tabs'],\n      meta: {\n        defaultData: this._getInitialTabs(),\n      },\n    };\n    if (this.tabsOptions.cache) {\n      this.tabs = this.$useStateDb(queryOptionsTabs);\n    } else {\n      this.tabs = this.$useStateMem(queryOptionsTabs);\n    }\n    // load cache\n    if (this.tabsOptions.cache) {\n      // await this.$loadStateDb(this.tabKeyCurrent);\n      await this.$loadStateDb(this.tabs);\n    }\n    // first route\n    if (this.$currentRoute) {\n      this.forwardRoute(this.$currentRoute);\n    }\n    // event\n    if (process.env.CLIENT && this.sys.env.SSR_HMR === 'true') {\n      this._eventSsrHmrReload = this.sys.meta.event.on('a-ssrhmr:reload', async (_data, next) => {\n        this.updateAllTabInfos();\n        return next();\n      });\n    }\n    // locale\n    this.$watch(\n      () => {\n        return this.app.meta.locale.current;\n      },\n      () => {\n        this.updateAllTabInfos();\n      },\n    );\n  }\n\n  protected __dispose__() {\n    if (this._eventSsrHmrReload) {\n      this._eventSsrHmrReload();\n    }\n  }\n\n  get cache() {\n    return this.tabsOptions.cache;\n  }\n\n  // need not async\n  addTab(tab: RouteTabTransient, affix?: boolean): boolean {\n    const res = this._addTab(tab, affix);\n    // current\n    this.tabKeyCurrent = res ? tab.tabKey : undefined;\n    this.componentKeyCurrent = res ? tab.componentKey : undefined;\n    return res;\n  }\n\n  // need not async\n  _addTab(tab: Partial<RouteTabTransient>, affix?: boolean): boolean {\n    const tabKey = tab.tabKey;\n    if (!tabKey) return false;\n    // tab\n    const [index, tabOld] = this.findTab(tabKey);\n    // tabInfo\n    const tabInfo = this.tabsOptions.getTabInfo?.(tabKey) ?? tabOld?.info;\n    if (!tabInfo) return false;\n    // tabs\n    if (index === -1) {\n      // new\n      const items: IRouteViewRouteItem[] = tab.componentKey\n        ? [\n            {\n              componentKey: tab.componentKey!,\n              fullPath: tab.fullPath!,\n              keepAlive: tab.keepAlive,\n              updatedAt: Date.now(),\n            },\n          ]\n        : [];\n      const tabNew: RouteTab = {\n        tabKey,\n        affix,\n        items,\n        updatedAt: Date.now(),\n        info: tabInfo,\n      };\n      if (this.tabCurrentIndex === -1) {\n        this.tabs = mutate(this.tabs, copyState => {\n          copyState.push(tabNew);\n        });\n      } else {\n        this.tabs = mutate(this.tabs, copyState => {\n          copyState.splice(this.tabCurrentIndex + 1, 0, tabNew);\n        });\n      }\n      // need not await\n      this.pruneTabs();\n    } else {\n      // update tabInfo\n      if (!deepEqual(tabInfo, tabOld?.info)) {\n        this.updateTabInfo(tabKey);\n      }\n      // update\n      if (!this._checkIfTabNeedUpdate(tabOld!, tab)) {\n        return true;\n      }\n      this.updateTab(tab);\n      // need not await\n      this.pruneTabItems(tabKey);\n    }\n    return true;\n  }\n\n  updateAllTabInfos(tabInitials?: RouteTabInitial[]) {\n    for (const tab of this.tabs) {\n      const tabInitial = tabInitials?.find(item => item.tabKey === tab.tabKey);\n      this.updateTabInfo(tab.tabKey, tabInitial);\n    }\n  }\n\n  updateTabInfo(tabKey?: string, tabInitial?: RouteTabInitial) {\n    if (!tabKey) return;\n    // tabs\n    const [index, tabOld] = this.findTab(tabKey);\n    if (index === -1) return;\n    // tabInfo\n    const tabInfo = this.tabsOptions.getTabInfo ? this.tabsOptions.getTabInfo(tabKey) : (tabInitial?.info ?? tabOld?.info);\n    if (!tabInfo) return;\n    // update\n    const tabNew = { ...tabOld, info: tabInfo };\n    this.updateTab(tabNew);\n  }\n\n  updateTabItemPageMeta(tabKey?: string, componentKey?: string, pageMeta?: IPageMeta) {\n    if (!tabKey || !componentKey) return false;\n    // tab\n    const [index, tab] = this.findTab(tabKey);\n    if (index === -1 || !tab) return false;\n    // tabItem\n    if (!tab.items) return false;\n    const indexItem = tab.items.findIndex(item => item.componentKey === componentKey);\n    if (indexItem === -1) return false;\n    const tabItem = tab.items[indexItem];\n    // change tab item\n    const pageMetaNew: IPageMeta = { ...tabItem.pageMeta, ...pageMeta };\n    const tabItemNew: IRouteViewRouteItem = { ...tabItem, pageMeta: pageMetaNew };\n    const items = mutate(tab.items, copyState => {\n      copyState.splice(indexItem, 1, tabItemNew);\n    });\n    const tabNew: RouteTab = { ...tab, items };\n    this.tabs = mutate(this.tabs, copyState => {\n      copyState.splice(index, 1, tabNew);\n    });\n    return true;\n  }\n\n  async deleteTab(tabKey?: string, noActiveNext?: boolean) {\n    if (!tabKey) return;\n    // tabs\n    const [index] = this.findTab(tabKey);\n    if (index === -1) return;\n    // current\n    let tabKeyActiveNext;\n    if (!noActiveNext && index === this.tabCurrentIndex) {\n      // prev/next\n      const tabCurrentIndex = index - 1 > -1 ? index - 1 : index + 1 < this.tabs.length ? index + 1 : -1;\n      if (tabCurrentIndex > -1) {\n        tabKeyActiveNext = this.tabs[tabCurrentIndex]?.tabKey;\n      }\n    }\n    // tabs\n    this.tabs = mutate(this.tabs, copyState => {\n      copyState.splice(index, 1);\n    });\n    // active next\n    if (tabKeyActiveNext) {\n      await this.activeTab(tabKeyActiveNext);\n    }\n  }\n\n  async deleteTabItem(tabKey?: string, componentKey?: string, noActiveNext?: boolean) {\n    if (!tabKey || !componentKey) return false;\n    if (tabKey === componentKey) return false; // not delete first tabItem\n    // tab\n    const [index, tab] = this.findTab(tabKey);\n    if (index === -1 || !tab) return false;\n    // indexItem\n    if (!tab.items) return false;\n    const indexItem = tab.items.findIndex(item => item.componentKey === componentKey);\n    if (indexItem === -1) return false;\n    if (tab.items.length === 1 && !tab.affix) {\n      // delete tab\n      await this.deleteTab(tabKey, noActiveNext);\n    } else {\n      // delete tab item\n      const items = mutate(tab.items, copyState => {\n        copyState.splice(indexItem, 1);\n      });\n      const tabNew: RouteTab = { ...tab, items };\n      this.tabs = mutate(this.tabs, copyState => {\n        copyState.splice(index, 1, tabNew);\n      });\n    }\n    return true;\n  }\n\n  findTabItemByFullPath(fullPath: string) {\n    for (const tab of this.tabs) {\n      if (!tab.items) continue;\n      for (const item of tab.items) {\n        if (item.fullPath === fullPath) {\n          return [tab.tabKey, item.componentKey];\n        }\n      }\n    }\n    return [];\n  }\n\n  updateTab(tab: Partial<RouteTabTransient>) {\n    const tabKey = tab.tabKey!;\n    const [index, tabOld] = this.findTab(tabKey);\n    if (index === -1 || !tabOld) return;\n    const items: IRouteViewRouteItem[] = tabOld.items ? ([] as IRouteViewRouteItem[]).concat(tabOld.items) : [];\n    if (tab.componentKey) {\n      const tabItem: IRouteViewRouteItem = {\n        componentKey: tab.componentKey,\n        fullPath: tab.fullPath!,\n        keepAlive: tab.keepAlive,\n        updatedAt: Date.now(),\n      };\n      const index = items.findIndex(item => item.componentKey === tab.componentKey);\n      if (index === -1) {\n        items.push(tabItem);\n      } else {\n        const tabItemNew: IRouteViewRouteItem = { ...items[index], ...tabItem };\n        items.splice(index, 1, tabItemNew);\n      }\n      // not use fullPath, because fullPath has query string\n      items.sort((a, b) => (a.componentKey === tabKey ? 0 : 1) - (b.componentKey === tabKey ? 0 : 1));\n    }\n    const tabNew: RouteTab = {\n      ...tabOld,\n      ...tab,\n      tabKey,\n      items,\n      updatedAt: Date.now(),\n    };\n    this.tabs = mutate(this.tabs, copyState => {\n      copyState.splice(index, 1, tabNew);\n    });\n  }\n\n  async activeTab(tabKey?: string) {\n    if (!tabKey) return;\n    const [_, tab] = this.findTab(tabKey);\n    if (!tab) return;\n    // should not updateTab here\n    // this.updateTab({ tabKey });\n    // this.tabKeyCurrent = tabKey;\n    // first check tab.items?.[0]?.fullPath, because fullPath maybe has query string\n    const tabItemFirst = tab.items?.[0];\n    const path = tabItemFirst?.componentKey === tabKey ? tabItemFirst.fullPath : tabKey;\n    await this.$router.push(path);\n  }\n\n  async activeTabItem(tabKey?: string, componentKey?: string) {\n    if (!tabKey || !componentKey) return;\n    const [_, tab] = this.findTab(tabKey);\n    if (!tab) return;\n    const tabItem = tab.items?.find(item => item.componentKey === componentKey);\n    if (!tabItem) return;\n    //\n    const path = tabItem.fullPath;\n    await this.$router.push(path);\n  }\n\n  findTab(tabKey?: string): [number, RouteTab | undefined] {\n    if (!tabKey) return [-1, undefined];\n    const index = this.tabs.findIndex(item => item.tabKey === tabKey);\n    if (index === -1) return [index, undefined];\n    return [index, this.tabs[index]];\n  }\n\n  async pruneTabs() {\n    let max = this.tabsOptions.max;\n    if (max === undefined || max === -1) return;\n    if (max < 1) max = 1;\n    while (true) {\n      const affixCount = this.tabs.filter(item => item.affix).length;\n      if (this.tabs.length - affixCount <= max) break;\n      let tabKey: string | undefined;\n      let updatedAt = Date.now();\n      for (const tab of this.tabs) {\n        if (!tab.affix && tab.updatedAt < updatedAt) {\n          tabKey = tab.tabKey;\n          updatedAt = tab.updatedAt;\n        }\n      }\n      if (!tabKey) break;\n      await this.deleteTab(tabKey, true);\n    }\n  }\n\n  async pruneTabItems(tabKey?: string) {\n    if (!tabKey) return;\n    let maxItems = this.tabsOptions.maxItems;\n    if (maxItems === undefined || maxItems === -1) return;\n    if (maxItems < 1) maxItems = 1;\n    while (true) {\n      const [_, tab] = this.findTab(tabKey);\n      if (!tab || !tab.items) break;\n      const ignoreCount = tab.items.filter(item => item.componentKey === tabKey).length;\n      if (tab.items.length - ignoreCount <= maxItems) break;\n      let componentKey: string | undefined;\n      let updatedAt = Date.now();\n      for (const tabItem of tab.items) {\n        if (tabItem.componentKey !== tabKey && tabItem.updatedAt < updatedAt) {\n          componentKey = tabItem.componentKey;\n          updatedAt = tabItem.updatedAt;\n        }\n      }\n      if (!componentKey) break;\n      await this.deleteTabItem(tabKey, componentKey, true);\n    }\n  }\n\n  // special for _addTab\n  private _checkIfTabNeedUpdate(tabOld: RouteTab, tabNew: Partial<RouteTabTransient>) {\n    for (const key in tabNew) {\n      if (['fullPath', 'keepAlive', 'updatedAt'].includes(key)) continue;\n      if (['componentKey'].includes(key)) {\n        if (!tabOld.items) return true;\n        const tabItemOld = tabOld.items.find(item => item[key] === tabNew[key]);\n        if (!tabItemOld) return true;\n        for (const key2 of ['fullPath', 'keepAlive']) {\n          if (tabItemOld[key2] !== tabNew[key2]) return true;\n        }\n        const recentItemIndex = tabOld.items.findIndex(item => item[key] !== tabItemOld[key] && (item.updatedAt ?? 0) >= (tabItemOld.updatedAt ?? 0));\n        if (recentItemIndex > -1) return true;\n      } else if (tabNew[key] !== tabOld[key]) {\n        return true;\n      }\n    }\n    const recentTabIndex = this.tabs.findIndex(item => item.tabKey !== tabOld.tabKey && (item.updatedAt ?? 0) >= (tabOld.updatedAt ?? 0));\n    if (recentTabIndex > -1) return true;\n    return false;\n  }\n\n  private _getKeepAliveInclude() {\n    const include: string[] = [];\n    for (const tab of this.tabs) {\n      if (!tab.items) continue;\n      for (const item of tab.items) {\n        if (item.keepAlive !== false && item.componentKey) {\n          if (!include.includes(item.componentKey)) {\n            include.push(item.componentKey);\n          }\n        }\n      }\n    }\n    return include;\n  }\n\n  private _getInitialTabs() {\n    const tabs = this.tabsOptions.getInitialTabs?.() ?? [];\n    if (!this.tabsOptions.getTabInfo) return tabs;\n    return tabs.map(tab => {\n      return {\n        ...tab,\n        info: this.tabsOptions.getTabInfo?.(tab.tabKey) ?? tab.info,\n      };\n    });\n  }\n\n  backRoute(route: RouteLocationNormalizedLoadedGeneric) {\n    const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);\n    this.deleteTabItem(tabKey, componentKey, true);\n  }\n\n  forwardRoute(route: RouteLocationNormalizedLoadedGeneric) {\n    const routeMeta = this.prepareRouteMeta(route);\n    this.addTab(routeMeta);\n  }\n\n  public setPageMeta(route: RouteLocationNormalizedLoadedGeneric, pageMeta: IPageMeta) {\n    const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);\n    this.updateTabItemPageMeta(tabKey, componentKey, pageMeta);\n  }\n\n  prepareRouteMeta(route: RouteLocationNormalizedLoadedGeneric): IRouteViewRouteMeta {\n    // fullPath\n    const fullPath = route.fullPath;\n    // componentKey\n    const componentKey = this.__handleRoutePropComponentKey(route);\n    // tabKey\n    const tabKey = this._handleRouteProp(route, 'tabKey') || componentKey;\n    // keepAlive\n    const keepAlive = this._handleRouteProp(route, 'keepAlive');\n    // tab\n    return { tabKey, componentKey, fullPath, keepAlive };\n  }\n\n  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop: 'componentKey' | 'tabKey'): string;\n  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop: 'keepAlive'): boolean;\n  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop) {\n    let value = route.meta[prop];\n    if (typeof value === 'function') {\n      value = value.call(this.app, route);\n    }\n    return value;\n  }\n\n  private __handleRoutePropComponentKey(route: RouteLocationNormalizedLoaded) {\n    const componentKey = this._handleRouteProp(route, 'componentKey');\n    if (componentKey) return componentKey;\n    // name\n    const name = this.$router.getRealRouteName(route.name);\n    // path\n    if (!name) return route.path;\n    // name: nameOnly\n    if (route.meta.componentKeyMode === 'nameOnly') return name;\n    // name: withParams\n    return route.path;\n  }\n}\n","import { RouteLocationNormalizedLoadedGeneric } from '@cabloy/vue-router';\nimport { Use } from 'zova';\nimport { Controller } from 'zova-module-a-bean';\nimport { BeanRouterViewBase, IPageMeta, IRouterViewPropsBase, IRouteViewRouteMeta } from 'zova-module-a-router';\n\nimport type { ModelTabs } from '../../model/tabs.js';\n\nexport interface ControllerRouterViewTabsProps extends IRouterViewPropsBase {}\n\n@Controller()\nexport class ControllerRouterViewTabs extends BeanRouterViewBase {\n  static $propsDefault = {};\n\n  @Use({ injectionScope: 'skipSelf' })\n  $$modelTabs: ModelTabs;\n\n  public backRoute(route: RouteLocationNormalizedLoadedGeneric) {\n    this.$$modelTabs.backRoute(route);\n    return true;\n  }\n\n  public forwardRoute(route: RouteLocationNormalizedLoadedGeneric) {\n    this.$$modelTabs.forwardRoute(route);\n    return true;\n  }\n\n  public setPageMeta(route: RouteLocationNormalizedLoadedGeneric, pageMeta: IPageMeta) {\n    this.$$modelTabs.setPageMeta(route, pageMeta);\n  }\n\n  protected prepareRouteMeta(route: RouteLocationNormalizedLoadedGeneric): IRouteViewRouteMeta {\n    return this.$$modelTabs.prepareRouteMeta(route);\n  }\n\n  protected getKeepAliveInclude(): string[] | undefined {\n    return this.$$modelTabs.keepAliveInclude;\n  }\n}\n","import type { TypeControllerInnerProps } from 'zova';\n\nimport { defineComponent } from 'vue';\nimport { prepareComponentOptions, useController } from 'zova';\n\nimport type { ControllerRouterViewTabsProps } from '../../component/routerViewTabs/controller.jsx';\n\nimport { ControllerRouterViewTabs } from '../../component/routerViewTabs/controller.jsx';\nexport type TypeControllerRouterViewTabsPublicProps = {\n  controllerRef?: (ref: ControllerRouterViewTabs) => void;\n} & ControllerRouterViewTabsProps;\n\ntype ControllerInnerProps = TypeControllerInnerProps<ControllerRouterViewTabsProps, keyof typeof ControllerRouterViewTabs.$propsDefault>;\ndeclare module 'zova-module-a-routertabs' {\n  export interface ControllerRouterViewTabs {\n    $props: ControllerInnerProps;\n  }\n}\n\nexport const ZRouterViewTabs = defineComponent((_props: TypeControllerRouterViewTabsPublicProps) => {\n  useController(ControllerRouterViewTabs, undefined, undefined);\n  return () => {};\n}, prepareComponentOptions());\n","// eslint-disable\n/** model: begin */\nexport * from '../model/tabs.js';\nimport { IModelOptionsTabs } from '../model/tabs.js';\nimport 'zova-module-a-model';\ndeclare module 'zova-module-a-model' {\n  \n    export interface IModelRecord {\n      'a-routertabs:tabs': IModelOptionsTabs;\n    }\n\n  \n}\ndeclare module 'zova-module-a-routertabs' {\n  \n        export interface ModelTabs {\n          /** @internal */\n          get scope(): ScopeModuleARoutertabs;\n        }\n\n        export interface ModelTabs {\n          get $beanFullName(): 'a-routertabs.model.tabs';\n          get $onionName(): 'a-routertabs:tabs';\n          get $onionOptions(): IModelOptionsTabs;\n        } \n}\n/** model: end */\n/** model: begin */\nimport { ModelTabs } from '../model/tabs.js';\nimport 'zova';\ndeclare module 'zova' {\n  export interface IBeanRecordGeneral {\n    'a-routertabs.model.tabs': ModelTabs;\n  }\n}\n/** model: end */\n/** controller: begin */\nexport * from '../component/routerViewTabs/controller.jsx';\n\nimport 'zova';\ndeclare module 'zova' {\n  \n  \n}\ndeclare module 'zova-module-a-routertabs' {\n  \n        export interface ControllerRouterViewTabs {\n          /** @internal */\n          get scope(): ScopeModuleARoutertabs;\n        } \n}\n/** controller: end */\n/** controller: begin */\nimport { ControllerRouterViewTabs } from '../component/routerViewTabs/controller.jsx';\nimport 'zova';\ndeclare module 'zova' {\n  export interface IBeanRecordLocal {\n    'a-routertabs.controller.routerViewTabs': ControllerRouterViewTabs;\n  }\n}\n/** controller: end */\n\n/** components: begin */\nexport * from './component/routerViewTabs.js';\nimport { ZRouterViewTabs } from './component/routerViewTabs.js';\nexport const components = {\n  'routerViewTabs': ZRouterViewTabs,\n};\nimport 'zova';\ndeclare module 'zova' {\nexport interface IComponentRecord {\n  'a-routertabs:routerViewTabs': ControllerRouterViewTabs;\n}\nexport interface IZovaComponentRecord {\n  'a-routertabs:routerViewTabs': typeof ZRouterViewTabs;\n}\n}\n/** components: end */\n/** scope: begin */\nimport { BeanScopeBase, type BeanScopeUtil } from 'zova';\nimport { Scope } from 'zova-module-a-bean';\n\n@Scope()\nexport class ScopeModuleARoutertabs extends BeanScopeBase {}\n\nexport interface ScopeModuleARoutertabs {\n  util: BeanScopeUtil;\n}\n\nimport 'zova';\ndeclare module 'zova' {\n  export interface IBeanScopeRecord {\n    'a-routertabs': ScopeModuleARoutertabs;\n  }\n  \n  \n\n  \n\n  \n}\n  \n/** scope: end */\n"],"mappings":"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"}

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "zova-module-a-routertabs",
+  "version": "5.1.0",
+  "gitHead": "bf1ceb4582381c74ba41ccf11b89d3b9e7b73628",
+  "description": "routertabs",
+  "keywords": [
+    "Zova Module"
+  ],
+  "author": "zhennann",
+  "files": [
+    "dist",
+    "mock",
+    "rest",
+    "src",
+    "icons",
+    "assets"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": [
+        "./src/index.ts",
+        "./dist/index.d.ts"
+      ],
+      "default": "./dist/index.js"
+    },
+    "./*": "./*"
+  },
+  "scripts": {
+    "clean": "rimraf dist tsconfig.build.tsbuildinfo",
+    "tsc:publish": "npm run clean && zova :bin:buildModule --sourcemap",
+    "prepublishOnly": "npm run tsc:publish",
+    "prepack": "clean-package",
+    "postpack": "clean-package restore && npm run clean"
+  },
+  "title": "a-routertabs"
+}

package/rest/component/routerViewTabs.ts

@@ -0,0 +1,8 @@
+import type { TypeRenderComponentJsxPropsPublic } from 'zova-jsx';
+
+import type { ControllerRouterViewTabsProps } from '../../src/component/routerViewTabs/controller.jsx';
+
+type TypeControllerRouterViewTabsPublicProps = TypeRenderComponentJsxPropsPublic & ControllerRouterViewTabsProps;
+export function ZZRoutertabsRouterViewTabs(_props: TypeControllerRouterViewTabsPublicProps) {
+  return 'a-routertabs:routerViewTabs';
+}

package/rest/components.ts

@@ -0,0 +1 @@
+export * from './component/routerViewTabs.js';

package/rest/index.ts

@@ -0,0 +1 @@
+export * from './components.js';

package/src/.metadata/component/routerViewTabs.ts

@@ -0,0 +1,23 @@
+import type { TypeControllerInnerProps } from 'zova';
+
+import { defineComponent } from 'vue';
+import { prepareComponentOptions, useController } from 'zova';
+
+import type { ControllerRouterViewTabsProps } from '../../component/routerViewTabs/controller.jsx';
+
+import { ControllerRouterViewTabs } from '../../component/routerViewTabs/controller.jsx';
+export type TypeControllerRouterViewTabsPublicProps = {
+  controllerRef?: (ref: ControllerRouterViewTabs) => void;
+} & ControllerRouterViewTabsProps;
+
+type ControllerInnerProps = TypeControllerInnerProps<ControllerRouterViewTabsProps, keyof typeof ControllerRouterViewTabs.$propsDefault>;
+declare module 'zova-module-a-routertabs' {
+  export interface ControllerRouterViewTabs {
+    $props: ControllerInnerProps;
+  }
+}
+
+export const ZRouterViewTabs = defineComponent((_props: TypeControllerRouterViewTabsPublicProps) => {
+  useController(ControllerRouterViewTabs, undefined, undefined);
+  return () => {};
+}, prepareComponentOptions());

package/src/.metadata/index.ts

@@ -0,0 +1,103 @@
+// eslint-disable
+/** model: begin */
+export * from '../model/tabs.js';
+import { IModelOptionsTabs } from '../model/tabs.js';
+import 'zova-module-a-model';
+declare module 'zova-module-a-model' {
+  
+    export interface IModelRecord {
+      'a-routertabs:tabs': IModelOptionsTabs;
+    }
+
+  
+}
+declare module 'zova-module-a-routertabs' {
+  
+        export interface ModelTabs {
+          /** @internal */
+          get scope(): ScopeModuleARoutertabs;
+        }
+
+        export interface ModelTabs {
+          get $beanFullName(): 'a-routertabs.model.tabs';
+          get $onionName(): 'a-routertabs:tabs';
+          get $onionOptions(): IModelOptionsTabs;
+        } 
+}
+/** model: end */
+/** model: begin */
+import { ModelTabs } from '../model/tabs.js';
+import 'zova';
+declare module 'zova' {
+  export interface IBeanRecordGeneral {
+    'a-routertabs.model.tabs': ModelTabs;
+  }
+}
+/** model: end */
+/** controller: begin */
+export * from '../component/routerViewTabs/controller.jsx';
+
+import 'zova';
+declare module 'zova' {
+  
+  
+}
+declare module 'zova-module-a-routertabs' {
+  
+        export interface ControllerRouterViewTabs {
+          /** @internal */
+          get scope(): ScopeModuleARoutertabs;
+        } 
+}
+/** controller: end */
+/** controller: begin */
+import { ControllerRouterViewTabs } from '../component/routerViewTabs/controller.jsx';
+import 'zova';
+declare module 'zova' {
+  export interface IBeanRecordLocal {
+    'a-routertabs.controller.routerViewTabs': ControllerRouterViewTabs;
+  }
+}
+/** controller: end */
+
+/** components: begin */
+export * from './component/routerViewTabs.js';
+import { ZRouterViewTabs } from './component/routerViewTabs.js';
+export const components = {
+  'routerViewTabs': ZRouterViewTabs,
+};
+import 'zova';
+declare module 'zova' {
+export interface IComponentRecord {
+  'a-routertabs:routerViewTabs': ControllerRouterViewTabs;
+}
+export interface IZovaComponentRecord {
+  'a-routertabs:routerViewTabs': typeof ZRouterViewTabs;
+}
+}
+/** components: end */
+/** scope: begin */
+import { BeanScopeBase, type BeanScopeUtil } from 'zova';
+import { Scope } from 'zova-module-a-bean';
+
+@Scope()
+export class ScopeModuleARoutertabs extends BeanScopeBase {}
+
+export interface ScopeModuleARoutertabs {
+  util: BeanScopeUtil;
+}
+
+import 'zova';
+declare module 'zova' {
+  export interface IBeanScopeRecord {
+    'a-routertabs': ScopeModuleARoutertabs;
+  }
+  
+  
+
+  
+
+  
+}
+  
+/** scope: end */

package/src/.metadata/this.ts

@@ -0,0 +1,2 @@
+export const __ThisModule__ = 'a-routertabs';
+export { ScopeModuleARoutertabs as ScopeModule } from './index.js';

package/src/component/routerViewTabs/controller.tsx

@@ -0,0 +1,38 @@
+import { RouteLocationNormalizedLoadedGeneric } from '@cabloy/vue-router';
+import { Use } from 'zova';
+import { Controller } from 'zova-module-a-bean';
+import { BeanRouterViewBase, IPageMeta, IRouterViewPropsBase, IRouteViewRouteMeta } from 'zova-module-a-router';
+
+import type { ModelTabs } from '../../model/tabs.js';
+
+export interface ControllerRouterViewTabsProps extends IRouterViewPropsBase {}
+
+@Controller()
+export class ControllerRouterViewTabs extends BeanRouterViewBase {
+  static $propsDefault = {};
+
+  @Use({ injectionScope: 'skipSelf' })
+  $$modelTabs: ModelTabs;
+
+  public backRoute(route: RouteLocationNormalizedLoadedGeneric) {
+    this.$$modelTabs.backRoute(route);
+    return true;
+  }
+
+  public forwardRoute(route: RouteLocationNormalizedLoadedGeneric) {
+    this.$$modelTabs.forwardRoute(route);
+    return true;
+  }
+
+  public setPageMeta(route: RouteLocationNormalizedLoadedGeneric, pageMeta: IPageMeta) {
+    this.$$modelTabs.setPageMeta(route, pageMeta);
+  }
+
+  protected prepareRouteMeta(route: RouteLocationNormalizedLoadedGeneric): IRouteViewRouteMeta {
+    return this.$$modelTabs.prepareRouteMeta(route);
+  }
+
+  protected getKeepAliveInclude(): string[] | undefined {
+    return this.$$modelTabs.keepAliveInclude;
+  }
+}

package/src/index.ts

@@ -0,0 +1,2 @@
+export * from './.metadata/index.js';
+export * from './types/index.js';

package/src/model/tabs.ts

@@ -0,0 +1,486 @@
+import type { IDecoratorModelOptions, UseQueryOptions } from 'zova-module-a-model';
+
+import { RouteLocationNormalizedLoaded, RouteLocationNormalizedLoadedGeneric } from '@cabloy/vue-router';
+import { mutate } from 'mutate-on-copy';
+import { deepEqual, deepExtend, TypeEventOff, useComputed } from 'zova';
+import { BeanModelBase, Model } from 'zova-module-a-model';
+import { IPageMeta, IRouteViewRouteItem, IRouteViewRouteMeta } from 'zova-module-a-router';
+
+import { ModelTabsOptions, ModelTabsOptionsBase, RouteTab, RouteTabInitial, RouteTabTransient } from '../types/tabs.js';
+
+export interface IModelOptionsTabs extends IDecoratorModelOptions, ModelTabsOptionsBase {}
+
+@Model<IModelOptionsTabs>({
+  enableSelector: true,
+  max: -1,
+  maxItems: -1,
+  cache: false,
+})
+export class ModelTabs extends BeanModelBase {
+  tabsOptions: ModelTabsOptions;
+  tabs: RouteTab[];
+  componentKeyCurrent?: string;
+  tabKeyCurrent?: string;
+  tabCurrentIndex: number;
+  tabCurrent?: RouteTab;
+  keepAliveInclude: string[];
+  private _eventSsrHmrReload: TypeEventOff;
+
+  protected async __init__(scene: string, options?: ModelTabsOptions) {
+    await super.__init__(scene);
+    this.bean._setBean('$$modelTabs', this);
+    // options
+    this.tabsOptions = deepExtend({}, this.$onionOptions, options);
+    // computed
+    this.tabCurrentIndex = useComputed(() => {
+      const [index] = this.findTab(this.tabKeyCurrent);
+      return index;
+    });
+    this.tabCurrent = useComputed(() => {
+      const [, tab] = this.findTab(this.tabKeyCurrent);
+      return tab;
+    });
+    this.keepAliveInclude = useComputed(() => {
+      return this._getKeepAliveInclude();
+    });
+    // componentKeyCurrent
+    const queryOptionsComponentKeyCurrent: UseQueryOptions<string> = {
+      queryKey: ['componentKeyCurrent'],
+    };
+    this.componentKeyCurrent = this.$useStateMem(queryOptionsComponentKeyCurrent);
+    // tabKeyCurrent
+    const queryOptionsTabKeyCurrent: UseQueryOptions<string> = {
+      queryKey: ['tabKeyCurrent'],
+    };
+    this.tabKeyCurrent = this.$useStateMem(queryOptionsTabKeyCurrent);
+    // if (this.tabsOptions.cache) {
+    //   this.tabKeyCurrent = this.$useStateDb(queryOptionsTabKeyCurrent);
+    // } else {
+    //   this.tabKeyCurrent = this.$useStateMem(queryOptionsTabKeyCurrent);
+    // }
+    // tabs
+    const queryOptionsTabs: UseQueryOptions<RouteTab[]> = {
+      queryKey: ['tabs'],
+      meta: {
+        defaultData: this._getInitialTabs(),
+      },
+    };
+    if (this.tabsOptions.cache) {
+      this.tabs = this.$useStateDb(queryOptionsTabs);
+    } else {
+      this.tabs = this.$useStateMem(queryOptionsTabs);
+    }
+    // load cache
+    if (this.tabsOptions.cache) {
+      // await this.$loadStateDb(this.tabKeyCurrent);
+      await this.$loadStateDb(this.tabs);
+    }
+    // first route
+    if (this.$currentRoute) {
+      this.forwardRoute(this.$currentRoute);
+    }
+    // event
+    if (process.env.CLIENT && this.sys.env.SSR_HMR === 'true') {
+      this._eventSsrHmrReload = this.sys.meta.event.on('a-ssrhmr:reload', async (_data, next) => {
+        this.updateAllTabInfos();
+        return next();
+      });
+    }
+    // locale
+    this.$watch(
+      () => {
+        return this.app.meta.locale.current;
+      },
+      () => {
+        this.updateAllTabInfos();
+      },
+    );
+  }
+
+  protected __dispose__() {
+    if (this._eventSsrHmrReload) {
+      this._eventSsrHmrReload();
+    }
+  }
+
+  get cache() {
+    return this.tabsOptions.cache;
+  }
+
+  // need not async
+  addTab(tab: RouteTabTransient, affix?: boolean): boolean {
+    const res = this._addTab(tab, affix);
+    // current
+    this.tabKeyCurrent = res ? tab.tabKey : undefined;
+    this.componentKeyCurrent = res ? tab.componentKey : undefined;
+    return res;
+  }
+
+  // need not async
+  _addTab(tab: Partial<RouteTabTransient>, affix?: boolean): boolean {
+    const tabKey = tab.tabKey;
+    if (!tabKey) return false;
+    // tab
+    const [index, tabOld] = this.findTab(tabKey);
+    // tabInfo
+    const tabInfo = this.tabsOptions.getTabInfo?.(tabKey) ?? tabOld?.info;
+    if (!tabInfo) return false;
+    // tabs
+    if (index === -1) {
+      // new
+      const items: IRouteViewRouteItem[] = tab.componentKey
+        ? [
+            {
+              componentKey: tab.componentKey!,
+              fullPath: tab.fullPath!,
+              keepAlive: tab.keepAlive,
+              updatedAt: Date.now(),
+            },
+          ]
+        : [];
+      const tabNew: RouteTab = {
+        tabKey,
+        affix,
+        items,
+        updatedAt: Date.now(),
+        info: tabInfo,
+      };
+      if (this.tabCurrentIndex === -1) {
+        this.tabs = mutate(this.tabs, copyState => {
+          copyState.push(tabNew);
+        });
+      } else {
+        this.tabs = mutate(this.tabs, copyState => {
+          copyState.splice(this.tabCurrentIndex + 1, 0, tabNew);
+        });
+      }
+      // need not await
+      this.pruneTabs();
+    } else {
+      // update tabInfo
+      if (!deepEqual(tabInfo, tabOld?.info)) {
+        this.updateTabInfo(tabKey);
+      }
+      // update
+      if (!this._checkIfTabNeedUpdate(tabOld!, tab)) {
+        return true;
+      }
+      this.updateTab(tab);
+      // need not await
+      this.pruneTabItems(tabKey);
+    }
+    return true;
+  }
+
+  updateAllTabInfos(tabInitials?: RouteTabInitial[]) {
+    for (const tab of this.tabs) {
+      const tabInitial = tabInitials?.find(item => item.tabKey === tab.tabKey);
+      this.updateTabInfo(tab.tabKey, tabInitial);
+    }
+  }
+
+  updateTabInfo(tabKey?: string, tabInitial?: RouteTabInitial) {
+    if (!tabKey) return;
+    // tabs
+    const [index, tabOld] = this.findTab(tabKey);
+    if (index === -1) return;
+    // tabInfo
+    const tabInfo = this.tabsOptions.getTabInfo ? this.tabsOptions.getTabInfo(tabKey) : (tabInitial?.info ?? tabOld?.info);
+    if (!tabInfo) return;
+    // update
+    const tabNew = { ...tabOld, info: tabInfo };
+    this.updateTab(tabNew);
+  }
+
+  updateTabItemPageMeta(tabKey?: string, componentKey?: string, pageMeta?: IPageMeta) {
+    if (!tabKey || !componentKey) return false;
+    // tab
+    const [index, tab] = this.findTab(tabKey);
+    if (index === -1 || !tab) return false;
+    // tabItem
+    if (!tab.items) return false;
+    const indexItem = tab.items.findIndex(item => item.componentKey === componentKey);
+    if (indexItem === -1) return false;
+    const tabItem = tab.items[indexItem];
+    // change tab item
+    const pageMetaNew: IPageMeta = { ...tabItem.pageMeta, ...pageMeta };
+    const tabItemNew: IRouteViewRouteItem = { ...tabItem, pageMeta: pageMetaNew };
+    const items = mutate(tab.items, copyState => {
+      copyState.splice(indexItem, 1, tabItemNew);
+    });
+    const tabNew: RouteTab = { ...tab, items };
+    this.tabs = mutate(this.tabs, copyState => {
+      copyState.splice(index, 1, tabNew);
+    });
+    return true;
+  }
+
+  async deleteTab(tabKey?: string, noActiveNext?: boolean) {
+    if (!tabKey) return;
+    // tabs
+    const [index] = this.findTab(tabKey);
+    if (index === -1) return;
+    // current
+    let tabKeyActiveNext;
+    if (!noActiveNext && index === this.tabCurrentIndex) {
+      // prev/next
+      const tabCurrentIndex = index - 1 > -1 ? index - 1 : index + 1 < this.tabs.length ? index + 1 : -1;
+      if (tabCurrentIndex > -1) {
+        tabKeyActiveNext = this.tabs[tabCurrentIndex]?.tabKey;
+      }
+    }
+    // tabs
+    this.tabs = mutate(this.tabs, copyState => {
+      copyState.splice(index, 1);
+    });
+    // active next
+    if (tabKeyActiveNext) {
+      await this.activeTab(tabKeyActiveNext);
+    }
+  }
+
+  async deleteTabItem(tabKey?: string, componentKey?: string, noActiveNext?: boolean) {
+    if (!tabKey || !componentKey) return false;
+    if (tabKey === componentKey) return false; // not delete first tabItem
+    // tab
+    const [index, tab] = this.findTab(tabKey);
+    if (index === -1 || !tab) return false;
+    // indexItem
+    if (!tab.items) return false;
+    const indexItem = tab.items.findIndex(item => item.componentKey === componentKey);
+    if (indexItem === -1) return false;
+    if (tab.items.length === 1 && !tab.affix) {
+      // delete tab
+      await this.deleteTab(tabKey, noActiveNext);
+    } else {
+      // delete tab item
+      const items = mutate(tab.items, copyState => {
+        copyState.splice(indexItem, 1);
+      });
+      const tabNew: RouteTab = { ...tab, items };
+      this.tabs = mutate(this.tabs, copyState => {
+        copyState.splice(index, 1, tabNew);
+      });
+    }
+    return true;
+  }
+
+  findTabItemByFullPath(fullPath: string) {
+    for (const tab of this.tabs) {
+      if (!tab.items) continue;
+      for (const item of tab.items) {
+        if (item.fullPath === fullPath) {
+          return [tab.tabKey, item.componentKey];
+        }
+      }
+    }
+    return [];
+  }
+
+  updateTab(tab: Partial<RouteTabTransient>) {
+    const tabKey = tab.tabKey!;
+    const [index, tabOld] = this.findTab(tabKey);
+    if (index === -1 || !tabOld) return;
+    const items: IRouteViewRouteItem[] = tabOld.items ? ([] as IRouteViewRouteItem[]).concat(tabOld.items) : [];
+    if (tab.componentKey) {
+      const tabItem: IRouteViewRouteItem = {
+        componentKey: tab.componentKey,
+        fullPath: tab.fullPath!,
+        keepAlive: tab.keepAlive,
+        updatedAt: Date.now(),
+      };
+      const index = items.findIndex(item => item.componentKey === tab.componentKey);
+      if (index === -1) {
+        items.push(tabItem);
+      } else {
+        const tabItemNew: IRouteViewRouteItem = { ...items[index], ...tabItem };
+        items.splice(index, 1, tabItemNew);
+      }
+      // not use fullPath, because fullPath has query string
+      items.sort((a, b) => (a.componentKey === tabKey ? 0 : 1) - (b.componentKey === tabKey ? 0 : 1));
+    }
+    const tabNew: RouteTab = {
+      ...tabOld,
+      ...tab,
+      tabKey,
+      items,
+      updatedAt: Date.now(),
+    };
+    this.tabs = mutate(this.tabs, copyState => {
+      copyState.splice(index, 1, tabNew);
+    });
+  }
+
+  async activeTab(tabKey?: string) {
+    if (!tabKey) return;
+    const [_, tab] = this.findTab(tabKey);
+    if (!tab) return;
+    // should not updateTab here
+    // this.updateTab({ tabKey });
+    // this.tabKeyCurrent = tabKey;
+    // first check tab.items?.[0]?.fullPath, because fullPath maybe has query string
+    const tabItemFirst = tab.items?.[0];
+    const path = tabItemFirst?.componentKey === tabKey ? tabItemFirst.fullPath : tabKey;
+    await this.$router.push(path);
+  }
+
+  async activeTabItem(tabKey?: string, componentKey?: string) {
+    if (!tabKey || !componentKey) return;
+    const [_, tab] = this.findTab(tabKey);
+    if (!tab) return;
+    const tabItem = tab.items?.find(item => item.componentKey === componentKey);
+    if (!tabItem) return;
+    //
+    const path = tabItem.fullPath;
+    await this.$router.push(path);
+  }
+
+  findTab(tabKey?: string): [number, RouteTab | undefined] {
+    if (!tabKey) return [-1, undefined];
+    const index = this.tabs.findIndex(item => item.tabKey === tabKey);
+    if (index === -1) return [index, undefined];
+    return [index, this.tabs[index]];
+  }
+
+  async pruneTabs() {
+    let max = this.tabsOptions.max;
+    if (max === undefined || max === -1) return;
+    if (max < 1) max = 1;
+    while (true) {
+      const affixCount = this.tabs.filter(item => item.affix).length;
+      if (this.tabs.length - affixCount <= max) break;
+      let tabKey: string | undefined;
+      let updatedAt = Date.now();
+      for (const tab of this.tabs) {
+        if (!tab.affix && tab.updatedAt < updatedAt) {
+          tabKey = tab.tabKey;
+          updatedAt = tab.updatedAt;
+        }
+      }
+      if (!tabKey) break;
+      await this.deleteTab(tabKey, true);
+    }
+  }
+
+  async pruneTabItems(tabKey?: string) {
+    if (!tabKey) return;
+    let maxItems = this.tabsOptions.maxItems;
+    if (maxItems === undefined || maxItems === -1) return;
+    if (maxItems < 1) maxItems = 1;
+    while (true) {
+      const [_, tab] = this.findTab(tabKey);
+      if (!tab || !tab.items) break;
+      const ignoreCount = tab.items.filter(item => item.componentKey === tabKey).length;
+      if (tab.items.length - ignoreCount <= maxItems) break;
+      let componentKey: string | undefined;
+      let updatedAt = Date.now();
+      for (const tabItem of tab.items) {
+        if (tabItem.componentKey !== tabKey && tabItem.updatedAt < updatedAt) {
+          componentKey = tabItem.componentKey;
+          updatedAt = tabItem.updatedAt;
+        }
+      }
+      if (!componentKey) break;
+      await this.deleteTabItem(tabKey, componentKey, true);
+    }
+  }
+
+  // special for _addTab
+  private _checkIfTabNeedUpdate(tabOld: RouteTab, tabNew: Partial<RouteTabTransient>) {
+    for (const key in tabNew) {
+      if (['fullPath', 'keepAlive', 'updatedAt'].includes(key)) continue;
+      if (['componentKey'].includes(key)) {
+        if (!tabOld.items) return true;
+        const tabItemOld = tabOld.items.find(item => item[key] === tabNew[key]);
+        if (!tabItemOld) return true;
+        for (const key2 of ['fullPath', 'keepAlive']) {
+          if (tabItemOld[key2] !== tabNew[key2]) return true;
+        }
+        const recentItemIndex = tabOld.items.findIndex(item => item[key] !== tabItemOld[key] && (item.updatedAt ?? 0) >= (tabItemOld.updatedAt ?? 0));
+        if (recentItemIndex > -1) return true;
+      } else if (tabNew[key] !== tabOld[key]) {
+        return true;
+      }
+    }
+    const recentTabIndex = this.tabs.findIndex(item => item.tabKey !== tabOld.tabKey && (item.updatedAt ?? 0) >= (tabOld.updatedAt ?? 0));
+    if (recentTabIndex > -1) return true;
+    return false;
+  }
+
+  private _getKeepAliveInclude() {
+    const include: string[] = [];
+    for (const tab of this.tabs) {
+      if (!tab.items) continue;
+      for (const item of tab.items) {
+        if (item.keepAlive !== false && item.componentKey) {
+          if (!include.includes(item.componentKey)) {
+            include.push(item.componentKey);
+          }
+        }
+      }
+    }
+    return include;
+  }
+
+  private _getInitialTabs() {
+    const tabs = this.tabsOptions.getInitialTabs?.() ?? [];
+    if (!this.tabsOptions.getTabInfo) return tabs;
+    return tabs.map(tab => {
+      return {
+        ...tab,
+        info: this.tabsOptions.getTabInfo?.(tab.tabKey) ?? tab.info,
+      };
+    });
+  }
+
+  backRoute(route: RouteLocationNormalizedLoadedGeneric) {
+    const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);
+    this.deleteTabItem(tabKey, componentKey, true);
+  }
+
+  forwardRoute(route: RouteLocationNormalizedLoadedGeneric) {
+    const routeMeta = this.prepareRouteMeta(route);
+    this.addTab(routeMeta);
+  }
+
+  public setPageMeta(route: RouteLocationNormalizedLoadedGeneric, pageMeta: IPageMeta) {
+    const [tabKey, componentKey] = this.findTabItemByFullPath(route.fullPath);
+    this.updateTabItemPageMeta(tabKey, componentKey, pageMeta);
+  }
+
+  prepareRouteMeta(route: RouteLocationNormalizedLoadedGeneric): IRouteViewRouteMeta {
+    // fullPath
+    const fullPath = route.fullPath;
+    // componentKey
+    const componentKey = this.__handleRoutePropComponentKey(route);
+    // tabKey
+    const tabKey = this._handleRouteProp(route, 'tabKey') || componentKey;
+    // keepAlive
+    const keepAlive = this._handleRouteProp(route, 'keepAlive');
+    // tab
+    return { tabKey, componentKey, fullPath, keepAlive };
+  }
+
+  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop: 'componentKey' | 'tabKey'): string;
+  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop: 'keepAlive'): boolean;
+  private _handleRouteProp(route: RouteLocationNormalizedLoaded, prop) {
+    let value = route.meta[prop];
+    if (typeof value === 'function') {
+      value = value.call(this.app, route);
+    }
+    return value;
+  }
+
+  private __handleRoutePropComponentKey(route: RouteLocationNormalizedLoaded) {
+    const componentKey = this._handleRouteProp(route, 'componentKey');
+    if (componentKey) return componentKey;
+    // name
+    const name = this.$router.getRealRouteName(route.name);
+    // path
+    if (!name) return route.path;
+    // name: nameOnly
+    if (route.meta.componentKeyMode === 'nameOnly') return name;
+    // name: withParams
+    return route.path;
+  }
+}

package/src/types/index.ts

@@ -0,0 +1 @@
+export * from './tabs.js';

package/src/types/tabs.ts

@@ -0,0 +1,40 @@
+import type { IRouteViewRouteItem, IRouteViewRouteMeta } from 'zova-module-a-router';
+
+export interface RouteTabInfo {
+  title?: string;
+  icon?: string;
+  link?: string;
+  external?: boolean;
+  target?: string;
+  folder?: boolean;
+  children?: RouteTabInfo[];
+}
+
+export interface RouteTabBase {
+  tabKey: string;
+  affix?: boolean;
+}
+
+export interface RouteTabInitial extends RouteTabBase {
+  info?: RouteTabInfo;
+}
+
+export interface RouteTabTransient extends IRouteViewRouteMeta {}
+
+export interface RouteTab extends RouteTabBase {
+  items?: IRouteViewRouteItem[];
+  updatedAt: number;
+  info: RouteTabInfo;
+}
+
+export interface ModelTabsOptionsBase {
+  /** -1: infinite 0: Affix Only  */
+  max?: number;
+  maxItems?: number;
+  cache?: boolean;
+}
+
+export interface ModelTabsOptions extends ModelTabsOptionsBase {
+  getInitialTabs?: () => RouteTabInitial[] | undefined;
+  getTabInfo?: (tabKey: string) => RouteTabInfo | undefined;
+}