@gx-design-vue/pro-layout 0.1.0-beta.8 → 0.1.0-beta.81

package/dist/props.d.ts

@@ -1,32 +1,66 @@
-import type { PropType, CSSProperties } from 'vue';
-import type { BaseLayoutDesignToken } from '@gx-design-vue/pro-provider';
-import type { AppRouteModule } from './route';
-import type { BreadcrumbProps } from './Context';
-import type { FooterRender, CopyrightRender } from './RenderTypings';
+import type { CSSProperties, PropType } from 'vue';
+import type { DeepPartial, ProAliasToken } from '@gx-design-vue/pro-provider';
+import type { BreadcrumbProps } from './typings';
+import type { AppRouteModule } from './RouteTypings';
+import type { PageContainerPropsType } from './Context';
+import type { DefaultRender, FooterRender } from './SlotsTypings';
 import type { Links } from './components/GlobalFooter';
+export type ShortcutKeyProps = {
+    search?: {
+        keys?: string;
+        disabeld?: boolean;
+    };
+    lock?: {
+        keys?: string;
+        disabeld?: boolean;
+    };
+};
+export declare const darkThemeProps: {
+    dark: {
+        type: PropType<boolean | "system">;
+        default: undefined;
+    };
+    onDarkChange: PropType<(value?: boolean | "system") => void>;
+    'onUpdate:dark': PropType<(value?: boolean | "system") => void>;
+};
 export declare const basicLayoutProps: {
+    contentWidth: {
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["contentWidth"]>;
+        default: () => undefined;
+    };
+    pageContainerProps: {
+        type: PropType<PageContainerPropsType>;
+    };
     pure: BooleanConstructor;
-    token: PropType<BaseLayoutDesignToken>;
+    token: PropType<DeepPartial<ProAliasToken>>;
+    menuData: {
+        type: PropType<AppRouteModule[]>;
+        default: () => AppRouteModule[];
+    };
+    levelMenuData: {
+        type: PropType<AppRouteModule[]>;
+        default: () => undefined;
+    };
     waterMark: {
         type: PropType<boolean>;
         default: boolean;
     };
+    pageLockRender: {
+        type: PropType<DefaultRender>;
+        default: undefined;
+    };
     /**
      * 是否禁用移动端模式，有的管理系统不需要移动端模式，此属性设置为true即可
      */
     disableMobile: {
-        type: BooleanConstructor;
+        type: PropType<boolean>;
         required: boolean;
     };
     contentStyle: {
         type: PropType<CSSProperties>;
         default: () => null;
     };
-    breadcrumb: {
-        type: PropType<BreadcrumbProps>;
-        default: () => null;
-    };
-    disableContentMargin: import("vue-types").VueTypeValidableDef<boolean>;
+    breadcrumb: PropType<BreadcrumbProps>;
     isChildrenLayout: import("vue-types").VueTypeValidableDef<boolean>;
     loading: import("vue-types").VueTypeValidableDef<boolean>;
     footerLinks: {
@@ -38,115 +72,76 @@ export declare const basicLayoutProps: {
             blankTarget: boolean;
         } | {
             key: string;
-            title: JSX.Element;
+            title: import("vue/jsx-runtime").JSX.Element;
             href: string;
             blankTarget: boolean;
         })[];
     };
+    tabsVisible: PropType<boolean>;
+    tabsRouteItemRender: {
+        type: PropType<import("./SlotsTypings").TabsRouteItemRender>;
+        default: () => undefined;
+    };
     copyrightRender: {
-        type: PropType<CopyrightRender>;
+        type: PropType<DefaultRender>;
         default: () => undefined;
     };
     footerRender: {
         type: PropType<FooterRender>;
         default: () => undefined;
     };
-    menuData: {
-        type: PropType<AppRouteModule[]>;
-        default: () => AppRouteModule[];
-    };
-    collapsed: import("vue-types").VueTypeValidableDef<boolean>;
-    pageHeaderRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<() => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
-        default: () => undefined;
-    };
-    contentRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<() => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
-        default: () => undefined;
-    };
-    breadcrumbRender: {
-        type: PropType<import("./RenderTypings").PageHeaderRender>;
-        default: () => undefined;
+    onTabsChange: {
+        type: PropType<(list: AppRouteModule[]) => void>;
     };
-    pageContentStyle: import("vue-types").VueTypeValidableDef<CSSProperties>;
-    usePageCard: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
+    onReloadPage: {
+        type: PropType<() => void>;
     };
-    pageCardProps: PropType<{
-        loading: boolean;
-        bodyStyle: CSSProperties;
-    }>;
-    isMobile: import("vue-types").VueTypeValidableDef<boolean>;
-    siderWidth: import("vue-types").VueTypeValidableDef<number> & {
-        default: number;
-    } & {
-        default: number;
+    'onUpdate:tabs': {
+        type: PropType<(list: AppRouteModule[]) => void>;
     };
+    hasSiderMenu: PropType<boolean>;
     collapsedWidth: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
     } & {
         default: number;
     };
-    isFixedMultiTab: {
-        type: PropType<boolean>;
-        default: boolean;
-    };
-    onReloadPage: {
-        type: PropType<() => void>;
-    };
-    onChangeTabs: {
-        type: PropType<(list: AppRouteModule[]) => void>;
-    };
-    'onUpdate:tabs': {
-        type: PropType<(list: AppRouteModule[]) => void>;
+    siderWidth: {
+        type: PropType<number>;
+        default: undefined;
     };
-    headerTitleRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(props: any, defaultDom: import("@gx-design-vue/pro-utils/dist").CustomRender) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
-        default: () => undefined;
+    menuLoading: PropType<boolean>;
+    autoHideHeader: PropType<boolean>;
+    isMobile: PropType<boolean>;
+    headerMainWidth: {
+        type: PropType<number | string>;
+        default: undefined;
     };
     headerRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(props: any, defaultDom: import("@gx-design-vue/pro-utils/dist").CustomRender) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
+        type: PropType<import("./SlotsTypings").HeaderRender>;
         default: () => undefined;
     };
     headerContentRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(props: any) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
+        type: PropType<import("./SlotsTypings").HeaderContentRender>;
         default: () => undefined;
     };
-    hasSiderMenu: PropType<boolean>;
-    logo: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").CustomRender>;
-        default: () => undefined;
-    };
-    logoStyle: {
-        type: PropType<CSSProperties>;
-        default: () => undefined;
-    };
-    logoDirection: {
-        type: PropType<"horizontal" | "vertical">;
-        default: string;
-    };
-    menuLoading: PropType<boolean>;
-    autoHideHeader: PropType<boolean>;
-    headerTheme: {
-        type: PropType<import("@gx-design-vue/pro-provider").ThemeType>;
-        default: string;
-    };
     menuRender: {
         type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(props: any, defaultDom: import("@gx-design-vue/pro-utils/dist").CustomRender) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
         default: () => undefined;
     };
+    appLogoListRender: {
+        type: PropType<DefaultRender>;
+        default: () => undefined;
+    };
     extraRightDropdownRender: {
-        type: PropType<import("./RenderTypings").ExtraRightDropdownRender>;
+        type: PropType<DefaultRender>;
         default: () => undefined;
     };
     rightContentRender: {
-        type: PropType<import("./RenderTypings").RightContentRender>;
+        type: PropType<import("./SlotsTypings").RightContentRender>;
         default: () => undefined;
     };
     collapsedButtonRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(collapsed?: boolean | undefined) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
+        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(collapsed: boolean, dom?: import("@gx-design-vue/pro-utils/dist").CustomRender) => import("@gx-design-vue/pro-utils/dist").CustomRender>>;
         default: () => undefined;
     };
     matchMenuKeys: {
@@ -157,137 +152,152 @@ export declare const basicLayoutProps: {
         type: PropType<(collapsed: boolean) => void>;
     };
     onOpenKeys: {
-        type: PropType<(openKeys: import("@gx-design-vue/pro-utils/dist").WithFalse<string[]>) => void>;
+        type: PropType<(openKeys: string[]) => void>;
     };
-    onMenuHeaderClick: PropType<Function>;
     onSelect: {
-        type: PropType<(selectedKeys: import("@gx-design-vue/pro-utils/dist").WithFalse<string[]>) => void>;
+        type: PropType<(selectedKeys: string[]) => void>;
+    };
+    logo: {
+        type: PropType<import("@gx-design-vue/pro-utils/dist").CustomRender>;
+        default: () => undefined;
     };
+    logoStyle: {
+        type: PropType<CSSProperties>;
+        default: () => undefined;
+    };
+    logoContentRender: {
+        type: PropType<import("./SlotsTypings").HeaderLogoRender>;
+        default: () => undefined;
+    };
+    onLogoClick: PropType<Function>;
+    mode: {
+        type: PropType<import("ant-design-vue/es/menu/src/interface").MenuMode>;
+        default: string;
+    };
+    collapsed: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    openKeys: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    selectedKeys: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    menuProps: {
+        type: PropType<Record<string, any>>;
+        default: () => null;
+    };
+    menuItemRender: {
+        type: PropType<import("./components/SiderMenu/BaseMenu").CustomMenuRender["menuItemRender"]>;
+        default: () => undefined;
+    };
+    subMenuItemRender: {
+        type: PropType<import("./components/SiderMenu/BaseMenu").CustomMenuRender["subMenuItemRender"]>;
+        default: () => undefined;
+    };
+    onClick: PropType<(info: import("ant-design-vue/es/menu/src/interface").MenuInfo) => void>;
     theme: {
-        type: PropType<import("@gx-design-vue/pro-provider").ThemeType | undefined>;
-        default: import("@gx-design-vue/pro-provider").ThemeType | undefined;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["theme"]>;
+        default: string;
     };
     layout: {
-        type: PropType<"side" | "mix" | "simple" | "wide">;
-        default: "side" | "mix" | "simple" | "wide";
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["layout"]>;
+        default: import("@gx-design-vue/pro-provider/dist").ProLayoutType;
     };
     wideWidth: {
-        type: PropType<number | undefined>;
-        default: number | undefined;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["wideWidth"]>;
+        default: string | number | undefined;
     };
     splitMenus: {
-        type: PropType<boolean>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["splitMenus"]>;
         default: boolean;
     };
-    fixedMultiTab: {
-        type: PropType<boolean>;
+    fixedTabsBar: {
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["fixedTabsBar"]>;
         default: boolean;
     };
     showProgressBar: {
-        type: PropType<boolean>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["showProgressBar"]>;
         default: boolean;
     };
     fixedHeader: {
-        type: PropType<boolean>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["fixedHeader"]>;
         default: boolean;
     };
     fixSiderbar: {
-        type: PropType<boolean>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["fixSiderbar"]>;
         default: boolean;
     };
     showTabsBar: {
-        type: PropType<boolean>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["showTabsBar"]>;
         default: boolean;
     };
-    showFullScreen: {
-        type: PropType<boolean | undefined>;
-        default: boolean | undefined;
+    storageTabsBar: {
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["storageTabsBar"]>;
+        default: boolean;
     };
     headerHeight: {
-        type: PropType<number | undefined>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["headerHeight"]>;
         default: number | undefined;
     };
     title: {
-        type: PropType<string>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["title"]>;
         default: string;
     };
     iconfontUrl: {
-        type: PropType<string | undefined>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["iconfontUrl"]>;
         default: string | undefined;
     };
     animate: {
-        type: PropType<{
-            disabled?: boolean | undefined;
-            name: string;
-            direction: string;
-        } | undefined>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["animate"]>;
         default: {
-            disabled?: boolean | undefined;
+            disabled?: boolean;
             name: string;
             direction: string;
         } | undefined;
     };
     primaryColor: {
-        type: PropType<string>;
+        type: PropType<import("@gx-design-vue/pro-provider/dist").ProLayoutConfig["primaryColor"]>;
         default: string;
     };
-    links: {
-        type: PropType<import("./RenderTypings").LinksRender>;
+    suppressSiderWhenMenuEmpty: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    breakpoint: {
+        type: PropType<import("./components/SiderMenu/typings").SiderProps["breakpoint"] | false>;
+        default: () => boolean;
+    };
+    siderActionsRender: {
+        type: PropType<DefaultRender>;
         default: () => undefined;
     };
-    menuHeaderRender: {
-        type: PropType<import("./RenderTypings").HeaderLogoRender>;
+    menuLinksRender: {
+        type: PropType<DefaultRender>;
         default: () => undefined;
     };
     menuFooterRender: {
-        type: PropType<import("./RenderTypings").MenuFooterRender>;
-        default: () => boolean;
+        type: PropType<import("./SlotsTypings").MenuFooterRender>;
+        default: () => undefined;
     };
     menuContentRender: {
-        type: PropType<import("./RenderTypings").MenuContentRender>;
-        default: () => boolean;
-    };
-    menuExtraRender: {
-        type: PropType<import("./RenderTypings").MenuExtraRender>;
-        default: () => boolean;
+        type: PropType<import("./SlotsTypings").MenuContentRender>;
+        default: () => undefined;
     };
-    breakpoint: {
-        type: PropType<false | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | undefined>;
-        default: () => boolean;
+    menuHeaderRender: {
+        type: PropType<import("./SlotsTypings").MenuHeaderRender>;
+        default: () => undefined;
     };
     onMenuClick: import("vue-types").VueTypeValidableDef<(...args: any[]) => any> & {
         default: (...args: any[]) => any;
     };
-    mode: {
-        type: PropType<import("ant-design-vue").MenuMode>;
-        default: string;
-    };
-    openKeys: {
-        type: PropType<boolean | string[]>;
-        default: () => never[];
-    };
-    selectedKeys: {
-        type: PropType<string[]>;
-        default: () => never[];
-    };
-    menuProps: {
-        type: PropType<Record<string, any>>;
-        default: () => null;
-    };
-    menuItemRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(args: {
-            item: AppRouteModule;
-            title?: JSX.Element | undefined;
-            icon?: JSX.Element | undefined;
-        }) => import("@gx-design-vue/pro-utils/dist").CustomRender> | undefined>;
-        default: () => boolean;
-    };
-    subMenuItemRender: {
-        type: PropType<import("@gx-design-vue/pro-utils/dist").WithFalse<(args: {
-            item: AppRouteModule;
-            children?: import("@gx-design-vue/pro-utils/dist").CustomRender[] | undefined;
-        }) => import("@gx-design-vue/pro-utils/dist").CustomRender> | undefined>;
-        default: () => boolean;
+    dark: {
+        type: PropType<boolean | "system">;
+        default: undefined;
     };
-    onClick: PropType<(...args: any) => void>;
+    onDarkChange: PropType<(value?: boolean | "system") => void>;
+    'onUpdate:dark': PropType<(value?: boolean | "system") => void>;
 };

package/dist/style/index.d.ts

@@ -3,12 +3,5 @@ import type { ProAliasToken } from '@gx-design-vue/pro-provider';
 export interface ProLayoutToken extends ProAliasToken {
     componentCls: string;
 }
-/**
- * 主要区别：
- * 需要手动引入 import 'antd/dist/antd.css';
- * 需要重置 menu 的样式
- * @param token
- * @returns
- */
 export declare const compatibleStyle: GenerateStyle<ProLayoutToken>;
 export declare const genProLayoutStyle: GenerateStyle<ProLayoutToken>;

package/dist/typings.d.ts

@@ -1 +1,19 @@
-export type ProProps = Record<never, never>;
+import type { CustomRender } from '@gx-design-vue/pro-utils';
+export interface AntRoute {
+    path: string;
+    breadcrumbName: string;
+    children?: Omit<AntRoute, 'children'>[];
+}
+export interface BreadcrumbProps {
+    prefixCls?: string;
+    routes?: AntRoute[];
+    params?: any;
+    separator?: CustomRender;
+    itemRender?: (opts: {
+        route: AntRoute;
+        params: any;
+        routes: Array<AntRoute>;
+        paths: Array<string>;
+    }) => CustomRender;
+}
+export type BreadcrumbListReturn = Pick<BreadcrumbProps, Extract<keyof BreadcrumbProps, 'routes' | 'itemRender'>>;

package/dist/utils/coverToNewToken.d.ts

@@ -1,4 +1,9 @@
-import type { ProAliasToken, ThemeConfig } from '@gx-design-vue/pro-provider';
-export declare function coverToNewToken(staticToken: Record<string, string | number | undefined>, token: Partial<ProAliasToken>, theme: ThemeConfig['theme'], type: 'sider' | 'header'): {
-    [x: string]: string | number | undefined;
+import type { ProAliasToken } from '@gx-design-vue/pro-provider';
+export declare function coverToNewToken({ type, token, dark, staticToken }: {
+    staticToken: Record<string, string | number | undefined>;
+    token: ProAliasToken;
+    dark: boolean;
+    type: 'sider' | 'header';
+}): Record<string, string | number | undefined> & {
+    [k: string]: unknown;
 };

package/dist/utils/index.d.ts

@@ -1,41 +1,29 @@
-import type { AppRouteModule } from '../route';
-import type { ThemeConfig } from '@gx-design-vue/pro-provider';
-export { default as isUrl } from './isUrl';
-export { default as isImg } from './isImg';
-export * from './coverToNewToken';
+import type { ProLayoutConfig } from '@gx-design-vue/pro-provider';
+export * from './menu';
 export * from './animate';
-export declare function clearMenuItem(menusData: AppRouteModule[]): AppRouteModule[];
-export declare function flatMap(menusData: AppRouteModule[]): AppRouteModule[];
-export declare function getMenuFirstChildren(menus: AppRouteModule[], key?: string): AppRouteModule[];
-export declare function getMenuFirstLastChildPath(data: AppRouteModule[]): string;
-export declare function handleThemeConfig(config: ThemeConfig): {
-    theme: import("@gx-design-vue/pro-provider").ThemeType | undefined;
-    layout: "side" | "mix" | "simple" | "wide";
+export * from './coverToNewToken';
+export declare function handleThemeConfig(config: ProLayoutConfig): {
+    title: string;
+    theme: import("@gx-design-vue/pro-provider/dist").BaseMenuTheme;
+    layout: import("@gx-design-vue/pro-provider/dist").ProLayoutType;
     splitMenus: boolean;
-    fixedMultiTab: boolean;
     fixedHeader: boolean;
     fixSiderbar: boolean;
     showProgressBar: boolean;
     showTabsBar: boolean;
-    showFullScreen?: boolean | undefined;
-    headerHeight?: number | undefined;
-    wideWidth?: number | undefined;
-    autoHideHeader: boolean;
-    title: string;
-    colorWeak?: boolean | undefined;
-    iconfontUrl?: string | undefined;
+    fixedTabsBar: boolean;
+    storageTabsBar: boolean;
+    headerHeight?: number;
+    wideWidth?: number | string;
+    contentWidth?: number | string;
+    colorWeak?: boolean;
+    iconfontUrl?: string;
     animate?: {
-        disabled?: boolean | undefined;
+        disabled?: boolean;
         name: string;
         direction: string;
-    } | undefined;
+    };
     primaryColor: string;
 };
-export declare function checkThemeStatus(config: Partial<ThemeConfig>): ThemeConfig;
-export type StringKeyOf<T> = Extract<keyof T, string>;
-/**
- * Creates an object composed of the picked object properties.
- * @param obj The source object
- * @param paths The property paths to pick
- */
-export declare function pick<T, K extends keyof T>(obj: T, paths: K[]): Pick<T, K>;
+export declare function checkThemeStatus(config: Partial<ProLayoutConfig>): ProLayoutConfig;
+export declare function removeDuplicatesByName<T>(array: T[], key: keyof T): T[];

package/dist/utils/menu.d.ts

@@ -0,0 +1,22 @@
+import type { RecordType } from '@gx-design-vue/pro-utils';
+import type { AppRouteModule } from '../RouteTypings';
+export type MenuData = {
+    menuData: AppRouteModule[];
+    breadcrumb: RecordType;
+    getLevel: () => AppRouteModule[];
+};
+export declare function hanlePathKey(record: AppRouteModule): string;
+export declare const getMenuData: (routes: AppRouteModule[]) => MenuData;
+export declare function clearMenuItem(menusData: AppRouteModule[]): AppRouteModule[];
+export declare function flatMap(menusData: AppRouteModule[]): AppRouteModule[];
+export declare function getMenuFirstChildren(menus: AppRouteModule[], key?: string): AppRouteModule[];
+export declare function getLastPath(data: AppRouteModule[]): string;
+export declare function findLastKey(tree: AppRouteModule[], targetKey: string): string | undefined;
+export declare function getMatchedList({ menuData, levelMenuData }: {
+    menuData: AppRouteModule[];
+    levelMenuData: AppRouteModule[];
+}, { path, name }: {
+    path: string;
+    name: AppRouteModule['name'];
+}): AppRouteModule[];
+export declare function filterTree(tree: AppRouteModule[], filterFn: (node: AppRouteModule) => boolean): AppRouteModule[];

package/dist/utils/style.d.ts

@@ -0,0 +1 @@
+export declare const layout = "::view-transition-new(root),::view-transition-old(root) {\n  animation: none;\n  mix-blend-mode: normal;\n}\n\n::view-transition-old(root) {\n  z-index: 1;\n}\n\n::view-transition-new(root) {\n  z-index: 2147483646;\n}\n\nhtml[data-theme=\"dark\"]::view-transition-old(root) {\n  z-index: 2147483646;\n}\n\nhtml[data-theme=\"dark\"]::view-transition-new(root) {\n  z-index: 1;\n}";

package/dist/utils/util.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 根据指定字段对对象数组进行去重
+ * @param arr 要去重的对象数组
+ * @param key 去重依据的字段名
+ * @returns 去重后的对象数组
+ */
+export declare function uniqueByField<T>(arr: T[], key: keyof T): T[];