@keyblade/pro-components 1.0.0 → 1.0.2

package/es/components.d.ts

@@ -2,10 +2,11 @@ declare module 'vue' {
     interface GlobalComponents {
         KbProBreadcrumb: typeof import('./index')['ProBreadcrumb'];
         KbProDrawerForm: typeof import('./index')['ProDrawerForm'];
+        KbProKeepAliveRouterView: typeof import('./index')['ProKeepAliveRouterView'];
         KbProLayout: typeof import('./index')['ProLayout'];
         KbProMenu: typeof import('./index')['ProMenu'];
         KbProModalForm: typeof import('./index')['ProModalForm'];
-        KbProPageWrapper: typeof import('./index')['ProPageWrapper'];
+        KbProPageContainer: typeof import('./index')['ProPageContainer'];
         KbProReuseTabs: typeof import('./index')['ProReuseTabs'];
     }
 }

package/es/index.d.ts

@@ -5,11 +5,12 @@ declare const _default: {
 export default _default;
 export { default as ProBreadcrumb } from './pro-breadcrumb';
 export { default as ProDrawerForm } from './pro-drawer-form';
+export { default as ProKeepAliveRouterView } from './pro-keep-alive-router-view';
 export { default as ProLayout } from './pro-layout';
 export { default as ProMenu } from './pro-menu';
 export type { IProMenuItem } from './pro-menu';
 export { default as ProModalForm } from './pro-modal-form';
-export { default as ProPageWrapper } from './pro-page-wrapper';
+export { default as ProPageContainer } from './pro-page-container';
 export { default as ProReuseTabs } from './pro-reuse-tabs';
 export type { IProTab } from './pro-reuse-tabs';
 export type {} from './components';

package/es/index.js

@@ -2,34 +2,38 @@ import { ProBreadcrumb } from "./pro-breadcrumb/index.js";
 import { default as default2 } from "./pro-breadcrumb/index.js";
 import { ProDrawerForm } from "./pro-drawer-form/index.js";
 import { default as default3 } from "./pro-drawer-form/index.js";
+import { ProKeepAliveRouterView } from "./pro-keep-alive-router-view/index.js";
+import { default as default4 } from "./pro-keep-alive-router-view/index.js";
 import { ProLayout } from "./pro-layout/index.js";
-import { default as default4 } from "./pro-layout/index.js";
+import { default as default5 } from "./pro-layout/index.js";
 import { ProMenu } from "./pro-menu/index.js";
-import { default as default5 } from "./pro-menu/index.js";
+import { default as default6 } from "./pro-menu/index.js";
 import { ProModalForm } from "./pro-modal-form/index.js";
-import { default as default6 } from "./pro-modal-form/index.js";
-import { ProPageWrapper } from "./pro-page-wrapper/index.js";
-import { default as default7 } from "./pro-page-wrapper/index.js";
+import { default as default7 } from "./pro-modal-form/index.js";
+import { ProPageContainer } from "./pro-page-container/index.js";
+import { default as default8 } from "./pro-page-container/index.js";
 import { ProReuseTabs } from "./pro-reuse-tabs/index.js";
-import { default as default8 } from "./pro-reuse-tabs/index.js";
+import { default as default9 } from "./pro-reuse-tabs/index.js";
 const index = {
   install(app) {
     app.use(ProBreadcrumb);
     app.use(ProDrawerForm);
+    app.use(ProKeepAliveRouterView);
     app.use(ProLayout);
     app.use(ProMenu);
     app.use(ProModalForm);
-    app.use(ProPageWrapper);
+    app.use(ProPageContainer);
     app.use(ProReuseTabs);
   }
 };
 export {
   default2 as ProBreadcrumb,
   default3 as ProDrawerForm,
-  default4 as ProLayout,
-  default5 as ProMenu,
-  default6 as ProModalForm,
-  default7 as ProPageWrapper,
-  default8 as ProReuseTabs,
+  default4 as ProKeepAliveRouterView,
+  default5 as ProLayout,
+  default6 as ProMenu,
+  default7 as ProModalForm,
+  default8 as ProPageContainer,
+  default9 as ProReuseTabs,
   index as default
 };

package/es/pro-breadcrumb/index.js

@@ -1,4 +1,5 @@
 import _sfc_main from "./pro-breadcrumb.vue.js";
+import "./pro-breadcrumb.vue2.js";
 import { Breadcrumb } from "@arco-design/web-vue";
 const ProBreadcrumb = Object.assign(_sfc_main, {
   install: (app) => {

package/es/pro-breadcrumb/pro-breadcrumb.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, inject, resolveComponent, unref, openBlock, createBlock, normalizeClass, withCtx, createVNode, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { defineComponent, inject, computed, resolveComponent, unref, openBlock, createBlock, normalizeClass, withCtx, createVNode, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, createCommentVNode } from "vue";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "pro-breadcrumb",
   props: {
@@ -11,23 +11,31 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const prefixClsName = "keyblade-pro-breadcrumb";
-    const injectValue = inject("ProBreadcrumbItems", []);
+    const proBreadcrumbItems = inject("ProBreadcrumbItems", []);
+    const breadcrumbItems = computed(() => {
+      if (props.items instanceof Array && props.items.length === 0 || !props.items) {
+        return proBreadcrumbItems.value;
+      }
+      return props.items || [];
+    });
     return (_ctx, _cache) => {
       const _component_icon_apps = resolveComponent("icon-apps");
       const _component_a_breadcrumb_item = resolveComponent("a-breadcrumb-item");
       const _component_a_breadcrumb = resolveComponent("a-breadcrumb");
-      return (props.items.length > 0 ? props.items : unref(injectValue)).length > 0 ? (openBlock(), createBlock(_component_a_breadcrumb, {
+      return unref(breadcrumbItems) ? (openBlock(), createBlock(_component_a_breadcrumb, {
         key: 0,
         class: normalizeClass(prefixClsName)
       }, {
         default: withCtx(() => [
-          createVNode(_component_a_breadcrumb_item, null, {
+          createVNode(_component_a_breadcrumb_item, {
+            class: normalizeClass(`${prefixClsName}-icon-item`)
+          }, {
             default: withCtx(() => [
               createVNode(_component_icon_apps)
             ]),
             _: 1
-          }),
-          (openBlock(true), createElementBlock(Fragment, null, renderList(props.items.length > 0 ? props.items : unref(injectValue), (item, index) => {
+          }, 8, ["class"]),
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(breadcrumbItems), (item, index) => {
             return openBlock(), createBlock(_component_a_breadcrumb_item, {
               key: `${item}-${index}`
             }, {

package/es/pro-breadcrumb/pro-breadcrumb.vue2.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./pro-breadcrumb.vue.js";
+const proBreadcrumb_vue_vue_type_style_index_0_lang = "";
 export {
-  _sfc_main as default
+  proBreadcrumb_vue_vue_type_style_index_0_lang as default
 };

package/es/pro-breadcrumb/pro-breadcrumb.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./pro-breadcrumb.vue.js";
+import "./pro-breadcrumb.vue2.js";
+export {
+  _sfc_main as default
+};

package/es/pro-keep-alive-router-view/index.d.ts

@@ -0,0 +1,124 @@
+import type { ComponentInternalInstance, ExtractPropTypes, PropType, VNodeProps, AllowedComponentProps, ComponentCustomProps, Slot, ComponentPublicInstance, ComponentOptionsBase, ComponentOptionsMixin, DebuggerEvent, nextTick, WatchOptions, WatchStopHandle, ShallowUnwrapRef, ComponentCustomProperties, App } from 'vue';
+declare const ProKeepAliveRouterView: {
+    new (...args: any[]): {
+        $: ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            keepAliveInclude: string[];
+            keepAliveExclude: string[];
+            keepAliveMax: number;
+        }> & Omit<Readonly<ExtractPropTypes<{
+            keepAliveInclude: {
+                type: PropType<string[]>;
+                required: false;
+                default: () => never[];
+            };
+            keepAliveExclude: {
+                type: PropType<string[]>;
+                required: false;
+                default: () => never[];
+            };
+            keepAliveMax: {
+                type: PropType<number>;
+                required: false;
+                default: number;
+            };
+        }>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, "keepAliveInclude" | "keepAliveExclude" | "keepAliveMax">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: Slot | undefined;
+        }>;
+        $root: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
+        $parent: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
+        $emit: (event: string, ...args: any[]) => void;
+        $el: any;
+        $options: ComponentOptionsBase<Readonly<ExtractPropTypes<{
+            keepAliveInclude: {
+                type: PropType<string[]>;
+                required: false;
+                default: () => never[];
+            };
+            keepAliveExclude: {
+                type: PropType<string[]>;
+                required: false;
+                default: () => never[];
+            };
+            keepAliveMax: {
+                type: PropType<number>;
+                required: false;
+                default: number;
+            };
+        }>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
+            keepAliveInclude: string[];
+            keepAliveExclude: string[];
+            keepAliveMax: number;
+        }, {}, string> & {
+            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+            created?: ((() => void) | (() => void)[]) | undefined;
+            beforeMount?: ((() => void) | (() => void)[]) | undefined;
+            mounted?: ((() => void) | (() => void)[]) | undefined;
+            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+            updated?: ((() => void) | (() => void)[]) | undefined;
+            activated?: ((() => void) | (() => void)[]) | undefined;
+            deactivated?: ((() => void) | (() => void)[]) | undefined;
+            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+            destroyed?: ((() => void) | (() => void)[]) | undefined;
+            unmounted?: ((() => void) | (() => void)[]) | undefined;
+            renderTracked?: (((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[]) | undefined;
+            renderTriggered?: (((e: DebuggerEvent) => void) | ((e: DebuggerEvent) => void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void)[]) | undefined;
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: WatchOptions<boolean> | undefined): WatchStopHandle;
+    } & Readonly<ExtractPropTypes<{
+        keepAliveInclude: {
+            type: PropType<string[]>;
+            required: false;
+            default: () => never[];
+        };
+        keepAliveExclude: {
+            type: PropType<string[]>;
+            required: false;
+            default: () => never[];
+        };
+        keepAliveMax: {
+            type: PropType<number>;
+            required: false;
+            default: number;
+        };
+    }>> & ShallowUnwrapRef<{}> & {} & ComponentCustomProperties & {};
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & ComponentOptionsBase<Readonly<ExtractPropTypes<{
+    keepAliveInclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    keepAliveExclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    keepAliveMax: {
+        type: PropType<number>;
+        required: false;
+        default: number;
+    };
+}>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
+    keepAliveInclude: string[];
+    keepAliveExclude: string[];
+    keepAliveMax: number;
+}, {}, string> & VNodeProps & AllowedComponentProps & ComponentCustomProps & {
+    install: (app: App) => void;
+};
+export { ProKeepAliveRouterView };
+export default ProKeepAliveRouterView;

package/es/pro-keep-alive-router-view/index.js

@@ -0,0 +1,11 @@
+import _sfc_main from "./pro-keep-alive-router-view.vue.js";
+const ProKeepAliveRouterView = Object.assign(_sfc_main, {
+  install: (app) => {
+    app.component("KbProKeepAliveRouterView", _sfc_main);
+  }
+});
+const ProKeepAliveRouterView$1 = ProKeepAliveRouterView;
+export {
+  ProKeepAliveRouterView,
+  ProKeepAliveRouterView$1 as default
+};

package/es/pro-keep-alive-router-view/pro-keep-alive-router-view.vue.d.ts

@@ -0,0 +1,45 @@
+import type { DefineComponent, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, type PropType } from 'vue';
+declare const _sfc_main: DefineComponent<{
+    /** 包含 */
+    keepAliveInclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    /** 排除（ProLayout里一般不会用） */
+    keepAliveExclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    /** 最大数（ProLayout里一般不会用） */
+    keepAliveMax: {
+        type: PropType<number>;
+        required: false;
+        default: number;
+    };
+}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    /** 包含 */
+    keepAliveInclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    /** 排除（ProLayout里一般不会用） */
+    keepAliveExclude: {
+        type: PropType<string[]>;
+        required: false;
+        default: () => never[];
+    };
+    /** 最大数（ProLayout里一般不会用） */
+    keepAliveMax: {
+        type: PropType<number>;
+        required: false;
+        default: number;
+    };
+}>>, {
+    keepAliveInclude: string[];
+    keepAliveExclude: string[];
+    keepAliveMax: number;
+}>;
+export default _sfc_main;

package/es/pro-keep-alive-router-view/pro-keep-alive-router-view.vue.js

@@ -0,0 +1,57 @@
+import { defineComponent, inject, computed, resolveComponent, openBlock, createBlock, withCtx, KeepAlive, unref, resolveDynamicComponent } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "pro-keep-alive-router-view",
+  props: {
+    /** 包含 */
+    keepAliveInclude: {
+      type: Array,
+      required: false,
+      default: () => []
+    },
+    /** 排除（ProLayout里一般不会用） */
+    keepAliveExclude: {
+      type: Array,
+      required: false,
+      default: () => []
+    },
+    /** 最大数（ProLayout里一般不会用） */
+    keepAliveMax: {
+      type: Number,
+      required: false,
+      default: 9999
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const proKeepAliveInclude = inject("ProKeepAliveInclude", []);
+    const include = computed(() => {
+      if (props.keepAliveInclude instanceof Array && props.keepAliveInclude.length === 0 || !props.keepAliveInclude) {
+        return proKeepAliveInclude.value;
+      }
+      return props.keepAliveInclude || [];
+    });
+    const exclude = computed(() => {
+      return props.keepAliveExclude || [];
+    });
+    return (_ctx, _cache) => {
+      const _component_router_view = resolveComponent("router-view");
+      return openBlock(), createBlock(_component_router_view, null, {
+        default: withCtx(({ Component, route }) => [
+          (openBlock(), createBlock(KeepAlive, {
+            include: unref(include),
+            exclude: unref(exclude),
+            max: __props.keepAliveMax
+          }, [
+            (openBlock(), createBlock(resolveDynamicComponent(Component), {
+              key: route.fullPath
+            }))
+          ], 1032, ["include", "exclude", "max"]))
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/pro-keep-alive-router-view/pro-keep-alive-router-view.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./pro-keep-alive-router-view.vue.js";
+export {
+  _sfc_main as default
+};

package/es/pro-layout/hooks.d.ts

@@ -1,10 +1,9 @@
 import { type Ref } from 'vue';
 import type { IProMenuItem } from '../pro-menu';
 export declare function useHooks(menuItems: Ref<IProMenuItem[]>, options: {
-    tabsMode: boolean;
+    showTabs: boolean;
 }): {
     menuSelectedKeys: Ref<string[]>;
-    onMenuItemClick: (key: string) => void;
     activeMenuItem: Ref<IProMenuItem | undefined>;
     menuItemMap: Ref<Record<string, IProMenuItem>>;
     breadcrumbItems: Ref<string[]>;
@@ -15,6 +14,8 @@ export declare function useHooks(menuItems: Ref<IProMenuItem[]>, options: {
         fullPath: string;
         active: boolean;
     }[]>;
+    keepAliveInclude: Ref<string[]>;
+    onMenuItemClick: (key: string) => void;
     onTabClick: (key: string) => void;
     onTabDelete: (key: string) => void;
 };

package/es/pro-layout/hooks.js

@@ -12,6 +12,7 @@ function useHooks(menuItems, options) {
   const menuItemMap = ref({});
   const breadcrumbItems = ref([]);
   const tabs = ref([]);
+  const keepAliveInclude = ref([]);
   const setActiveMenuItemPaths = () => {
     const paths = [];
     const recursion = (_menuItems) => {
@@ -43,16 +44,13 @@ function useHooks(menuItems, options) {
     breadcrumbItems.value = ((_a = activeMenuItem.value) == null ? void 0 : _a.breadcrumbs) ? (_b = activeMenuItem.value) == null ? void 0 : _b.breadcrumbs : activeMenuItemTitles.length !== 0 ? activeMenuItemTitles : [];
   };
   function setTabs() {
-    if (!activeMenuItem.value) {
+    if (!activeMenuItem.value || activeMenuItem.value.noAffix) {
       tabs.value.forEach((tab) => {
         tab.active = false;
       });
       return;
     }
-    const { name: menuItemName, title: menuItemTitle, noAffix } = activeMenuItem.value;
-    if (noAffix) {
-      return;
-    }
+    const { name: menuItemName, title: menuItemTitle } = activeMenuItem.value;
     let findIndex = -1;
     tabs.value.forEach((v, i) => {
       v.active = false;
@@ -108,7 +106,37 @@ function useHooks(menuItems, options) {
       tab.active = true;
       router.push(tab.fullPath);
     }
-    tabs.value.splice(findTabIndex, 1);
+    const deleteTab = tabs.value.splice(findTabIndex, 1);
+    removeKeepAliveInclude(deleteTab[0]);
+  };
+  const addKeepAliveInclude = () => {
+    var _a;
+    if ((_a = route == null ? void 0 : route.meta) == null ? void 0 : _a.ignoreCache) {
+      return;
+    }
+    const keys = new Set(keepAliveInclude.value);
+    activeMenuItemPaths.value.forEach((item) => {
+      if (item.name) {
+        keys.add(item.name);
+      }
+    });
+    keepAliveInclude.value = Array.from(keys.values());
+  };
+  const removeKeepAliveInclude = (tab) => {
+    const keys = new Set(keepAliveInclude.value);
+    tab.parentNames.forEach((name) => {
+      keys.delete(name);
+    });
+    tabs.value.forEach((tab2) => {
+      tab2.parentNames.forEach((name) => {
+        const menuItem = menuItemMap.value[name];
+        if (menuItem == null ? void 0 : menuItem.ignoreCache) {
+          return;
+        }
+        keys.add(menuItem.name);
+      });
+    });
+    keepAliveInclude.value = Array.from(keys.values());
   };
   watch(menuItems, () => {
     const _menuItemMap = {};
@@ -130,17 +158,19 @@ function useHooks(menuItems, options) {
     menuSelectedKeys.value = (activeMenuItem == null ? void 0 : activeMenuItem.value) ? [activeMenuItem.value.name] : [];
     setActiveMenuItemPaths();
     setBreadcrumbItems();
-    if (options.tabsMode) {
+    if (options.showTabs) {
       setTabs();
     }
+    addKeepAliveInclude();
   }, { immediate: true });
   return {
     menuSelectedKeys,
-    onMenuItemClick,
     activeMenuItem,
     menuItemMap,
     breadcrumbItems,
     tabs,
+    keepAliveInclude,
+    onMenuItemClick,
     onTabClick,
     onTabDelete
   };

package/es/pro-layout/index.d.ts

@@ -10,7 +10,7 @@ declare const ProLayout: {
             headerLogo: string;
             theme: "light" | "dark";
             footerTitle: string;
-            tabsMode: boolean;
+            showTabs: boolean;
             siderBreakpoint: "xxl" | "xl" | "lg" | "md" | "sm" | "xs";
         }> & Omit<Readonly<ExtractPropTypes<{
             menuItems: {
@@ -38,7 +38,7 @@ declare const ProLayout: {
                 required: false;
                 default: string;
             };
-            tabsMode: {
+            showTabs: {
                 type: PropType<boolean>;
                 required: false;
                 default: boolean;
@@ -50,7 +50,8 @@ declare const ProLayout: {
             };
         }>> & {
             onCollapse?: ((collapsed: boolean) => any) | undefined;
-        } & VNodeProps & AllowedComponentProps & ComponentCustomProps, "menuItems" | "headerTitle" | "headerLogo" | "theme" | "footerTitle" | "tabsMode" | "siderBreakpoint">;
+            onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
+        } & VNodeProps & AllowedComponentProps & ComponentCustomProps, "menuItems" | "headerTitle" | "headerLogo" | "theme" | "footerTitle" | "showTabs" | "siderBreakpoint">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -62,7 +63,7 @@ declare const ProLayout: {
         }>;
         $root: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
         $parent: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $emit: (event: "collapse", collapsed: boolean) => void;
+        $emit: ((event: "collapse", collapsed: boolean) => void) & ((event: "keepAliveIncludeChange", keepAliveInclude: string[]) => void);
         $el: any;
         $options: ComponentOptionsBase<Readonly<ExtractPropTypes<{
             menuItems: {
@@ -90,7 +91,7 @@ declare const ProLayout: {
                 required: false;
                 default: string;
             };
-            tabsMode: {
+            showTabs: {
                 type: PropType<boolean>;
                 required: false;
                 default: boolean;
@@ -102,15 +103,17 @@ declare const ProLayout: {
             };
         }>> & {
             onCollapse?: ((collapsed: boolean) => any) | undefined;
+            onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
         }, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
             collapse: (collapsed: boolean) => true;
+            keepAliveIncludeChange: (keepAliveInclude: string[]) => true;
         }, string, {
             menuItems: IProMenuItem[];
             headerTitle: string;
             headerLogo: string;
             theme: "light" | "dark";
             footerTitle: string;
-            tabsMode: boolean;
+            showTabs: boolean;
             siderBreakpoint: "xxl" | "xl" | "lg" | "md" | "sm" | "xs";
         }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -158,7 +161,7 @@ declare const ProLayout: {
             required: false;
             default: string;
         };
-        tabsMode: {
+        showTabs: {
             type: PropType<boolean>;
             required: false;
             default: boolean;
@@ -170,6 +173,7 @@ declare const ProLayout: {
         };
     }>> & {
         onCollapse?: ((collapsed: boolean) => any) | undefined;
+        onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
     } & ShallowUnwrapRef<{}> & {} & ComponentCustomProperties & {};
     __isFragment?: undefined;
     __isTeleport?: undefined;
@@ -200,7 +204,7 @@ declare const ProLayout: {
         required: false;
         default: string;
     };
-    tabsMode: {
+    showTabs: {
         type: PropType<boolean>;
         required: false;
         default: boolean;
@@ -212,15 +216,17 @@ declare const ProLayout: {
     };
 }>> & {
     onCollapse?: ((collapsed: boolean) => any) | undefined;
+    onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
 }, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
     collapse: (collapsed: boolean) => true;
+    keepAliveIncludeChange: (keepAliveInclude: string[]) => true;
 }, string, {
     menuItems: IProMenuItem[];
     headerTitle: string;
     headerLogo: string;
     theme: "light" | "dark";
     footerTitle: string;
-    tabsMode: boolean;
+    showTabs: boolean;
     siderBreakpoint: "xxl" | "xl" | "lg" | "md" | "sm" | "xs";
 }, {}, string> & VNodeProps & AllowedComponentProps & ComponentCustomProps & {
     install: (app: App) => void;

package/es/pro-layout/index.js

@@ -1,22 +1,19 @@
 import _sfc_main from "./pro-layout.vue.js";
 import "./pro-layout.vue2.js";
-import { Layout, Space, Typography, Tooltip, Button, Dropdown, Avatar, Affix } from "@arco-design/web-vue";
+import { Layout, Space, Typography, Button, Affix } from "@arco-design/web-vue";
+import { ProKeepAliveRouterView } from "../pro-keep-alive-router-view/index.js";
 import { ProMenu } from "../pro-menu/index.js";
 import { ProReuseTabs } from "../pro-reuse-tabs/index.js";
-import { ProPageWrapper } from "../pro-page-wrapper/index.js";
 const ProLayout = Object.assign(_sfc_main, {
   install: (app) => {
     app.use(Layout);
     app.use(Space);
     app.use(Typography);
-    app.use(Tooltip);
     app.use(Button);
-    app.use(Dropdown);
-    app.use(Avatar);
     app.use(Affix);
+    app.use(ProKeepAliveRouterView);
     app.use(ProMenu);
     app.use(ProReuseTabs);
-    app.use(ProPageWrapper);
     app.component("KbProLayout", _sfc_main);
   }
 });