fix: render props check

README.md

@@ -101,8 +101,8 @@ const layoutConf = reactive({
 | loading | layout loading status | boolean | - |
 | layout | layout menu mode, sidemenu: right navigation, topmenu: top navigation | 'side' \| 'top' \| 'mix' | `'side'` |
 | contentWidth | content mode of layout, Fluid: adaptive, Fixed:  fixed width 1200px | 'Fixed' \| 'Fluid' | `Fluid` |
-| theme | Navigation menu theme | 'light' \| 'dark' | `'light'` |
-| navTheme | Navigation Bar theme | 'light' \|'dark' | `'light'` |
+| navTheme | Navigation theme | 'light' \|'dark' | `'light'` |
+| headerTheme | Header Bar theme | 'light' \|'dark' | `'light'` |
 | menuData | Vue-router `routes` prop | Object | `[{}]` |
 | collapsed | control menu's collapse and expansion | boolean | true |
 | selectedKeys | menu selected keys | string[] | `[]` |

package.json

 {
   "name": "@ant-design-vue/pro-layout",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "license": "MIT",
   "files": [
     "dist"

src/FooterToolbar/index.tsx

-import './index.less'
+import './index.less';
 
-import {
-  computed,
-  defineComponent,
-  onBeforeUnmount,
-  onMounted,
-  unref,
-  PropType,
-} from 'vue'
-import { RouteContextProps, useRouteContext } from '../RouteContext'
-import { getPropsSlotfn } from '../utils'
-import type { CustomRender } from '../typings'
+import { computed, defineComponent, onBeforeUnmount, onMounted, unref, PropType } from 'vue';
+import { RouteContextProps, useRouteContext } from '../RouteContext';
+import { getPropsSlotfn } from '../utils';
+import type { CustomRender } from '../typings';
 export interface FooterToolbarProps {
-  extra?: CustomRender | JSX.Element
+  extra?: CustomRender | JSX.Element;
   renderContent?: (
     props: FooterToolbarProps & RouteContextProps & { leftWidth?: string },
-    dom: CustomRender | JSX.Element
-  ) => CustomRender | JSX.Element
-  getContainer?: (triggerNode: HTMLElement) => HTMLElement | null
-  prefixCls?: string
+    dom: CustomRender | JSX.Element,
+  ) => CustomRender | JSX.Element;
+  getContainer?: (triggerNode: HTMLElement) => HTMLElement | null;
+  prefixCls?: string;
 }
 
 const footerToolbarProps = {
   extra: {
-    type: Object as PropType<FooterToolbarProps['extra']>,
+    type: [Function, Object, Boolean] as PropType<FooterToolbarProps['extra']>,
   },
   renderContent: {
-    type: [Function, Object] as PropType<FooterToolbarProps['renderContent']>,
+    type: [Function, Object, Boolean] as PropType<FooterToolbarProps['renderContent']>,
   },
   getContainer: {
     type: [Function, Object] as PropType<FooterToolbarProps['getContainer']>,
   },
   prefixCls: { type: String as PropType<string> },
-}
+};
 
 const FooterToolbar = defineComponent({
   name: 'FooterToolbar',
   props: footerToolbarProps,
   setup(props, { slots }) {
-    const context = useRouteContext()
-    const baseClassName = props.prefixCls || context.getPrefixCls('footer-bar')
+    const context = useRouteContext();
+    const baseClassName = props.prefixCls || context.getPrefixCls('footer-bar');
 
     const hasFlatMenu = computed(() => {
-      return unref(context.flatMenuData).length > 0
-    })
+      return unref(context.flatMenuData).length > 0;
+    });
     const width = computed(() => {
-      const { isMobile, hasSide, siderWidth, layout } = context
+      const { isMobile, hasSide, siderWidth, layout } = context;
       if (!siderWidth || layout === 'top') {
-        return '100%'
+        return '100%';
       }
       console.log(
         'x',
@@ -55,24 +48,24 @@ const FooterToolbar = defineComponent({
         'hasFlatMenu',
         unref(hasFlatMenu),
         'hasSide',
-        unref(context.hasSide)
-      )
+        unref(context.hasSide),
+      );
       if (!hasFlatMenu.value && !unref(hasSide)) {
-        return '100%'
+        return '100%';
       }
-      console.log('x2', unref(context.hasSide))
-      return isMobile ? '100%' : `calc(100% - ${siderWidth}px)`
-    })
+      console.log('x2', unref(context.hasSide));
+      return isMobile ? '100%' : `calc(100% - ${siderWidth}px)`;
+    });
 
     onMounted(() => {
-      context.setHasFooterToolbar && context.setHasFooterToolbar(true)
-    })
+      context.setHasFooterToolbar && context.setHasFooterToolbar(true);
+    });
     onBeforeUnmount(() => {
-      context.setHasFooterToolbar && context.setHasFooterToolbar(false)
-    })
+      context.setHasFooterToolbar && context.setHasFooterToolbar(false);
+    });
 
     return () => {
-      const extra = getPropsSlotfn(slots, props, 'extra')
+      const extra = getPropsSlotfn(slots, props, 'extra');
       const dom = () => {
         return (
           <>
@@ -81,8 +74,8 @@ const FooterToolbar = defineComponent({
             </div>
             <div class={`${baseClassName}-right`}>{slots.default?.()}</div>
           </>
-        )
-      }
+        );
+      };
       return (
         <div class={baseClassName} style={{ width: width.value }}>
           {props.renderContent
@@ -92,13 +85,13 @@ const FooterToolbar = defineComponent({
                   ...context,
                   leftWidth: width.value,
                 },
-                dom()
+                dom(),
               )
             : dom()}
         </div>
-      )
-    }
+      );
+    };
   },
-})
+});
 
-export default FooterToolbar
+export default FooterToolbar;

src/GlobalHeader/headerProps.ts

@@ -21,7 +21,7 @@ export default {
   },
   splitMenus: siderMenuProps.splitMenus,
   menuRender: {
-    type: [Object, Function] as PropType<
+    type: [Object, Function, Boolean] as PropType<
       WithFalse<(props: any /* HeaderViewProps */, defaultDom: CustomRender) => CustomRender>
     >,
     default: () => undefined,
@@ -30,7 +30,7 @@ export default {
   menuItemRender: siderMenuProps.menuItemRender,
   subMenuItemRender: siderMenuProps.subMenuItemRender,
   rightContentRender: {
-    type: [Object, Function] as PropType<WithFalse<(props: any) => CustomRender>>,
+    type: [Object, Function, Boolean] as PropType<WithFalse<(props: any) => CustomRender>>,
     default: () => undefined,
   },
   collapsedButtonRender: siderMenuProps.collapsedButtonRender,

src/Header.tsx

@@ -18,19 +18,19 @@ const { Header } = Layout;
 export const headerViewProps = {
   ...globalHeaderProps,
   headerRender: {
-    type: [Object, Function] as PropType<
+    type: [Object, Function, Boolean] as PropType<
       WithFalse<(props: any, defaultDom: CustomRender) => CustomRender>
     >,
     default: () => undefined,
   },
   headerTitleRender: {
-    type: [Object, Function] as PropType<
+    type: [Object, Function, Boolean] as PropType<
       WithFalse<(props: any, defaultDom: CustomRender) => CustomRender>
     >,
     default: () => undefined,
   },
   headerContentRender: {
-    type: [Object, Function] as PropType<WithFalse<(props: any) => CustomRender>>,
+    type: [Object, Function, Boolean] as PropType<WithFalse<(props: any) => CustomRender>>,
     default: () => undefined,
   },
   hasSiderMenu: PropTypes.looseBool,

src/PageContainer/index.tsx

@@ -12,7 +12,7 @@ import {
 import omit from 'omit.js';
 import { withInstall } from 'ant-design-vue/es/_util/type';
 import PageHeader, { pageHeaderProps } from 'ant-design-vue/es/page-header';
-import { Tabs, Affix, Spin, } from 'ant-design-vue';
+import { Tabs, Affix, Spin } from 'ant-design-vue';
 import { TabPaneProps } from './interfaces/TabPane';
 import { TabBarExtraContent, TabsProps } from './interfaces/Tabs';
 import { AffixProps } from './interfaces/Affix';
@@ -50,7 +50,7 @@ export const pageHeaderTabConfig = {
    * @name tab 上多余的区域
    */
   tabBarExtraContent: {
-    type: [Object, Function] as PropType<TabBarExtraContent>,
+    type: [Object, Function, Boolean] as PropType<TabBarExtraContent>,
     default: () => undefined,
   },
   /**
@@ -206,9 +206,9 @@ const defaultPageHeaderRender = (
   if (!title && title !== false) {
     pageHeaderTitle = value.title;
   }
-  const unrefBreadcrumb = unref(value.breadcrumb || {})
+  const unrefBreadcrumb = unref(value.breadcrumb || {});
   const breadcrumb = restProps.breadcrumb || {
-    ...(unrefBreadcrumb),
+    ...unrefBreadcrumb,
     routes: unrefBreadcrumb.routes,
     itemRender: unrefBreadcrumb.itemRender,
   };