fix: remove NavItem.children props (#2711)

* fix: remove NavItem.children props

* fix: remove NavItem.children props

* fix: remove NavItem.children props

* fix: remove NavItem.children props

* fix: remove NavItem.children props

* fix: fix TypeError when item.props is undefined

---------

Co-authored-by: pointhalo <[email protected]>
Co-authored-by: zhangyumei.0319 <[email protected]>

packages/semi-foundation/navigation/foundation.ts

@@ -80,6 +80,11 @@ export default class NavigationFoundation<P = Record<string, any>, S = Record<st
                     }
                     if (itemKey) {
                         keysMap[itemKey] = [...parentKeys];
+                        // Children is not a recommended usage and may cause some bug-like performance, but some users have already used it, so here we only delete the ts definition instead of deleting the actual code
+                        // children 并不是我们推荐的用法，可能会导致一些像 bug的表现，但是有些用户已经用了，所以此处仅作删除 ts 定义而非删除实际代码的操作
+                        // refer https://github.com/DouyinFE/semi-design/issues/2710
+                        // @ts-ignore  
+                        const itemChildren = item.props?.children;
 
                         if (Array.isArray(item.items) && item.items.length) {
                             NavigationFoundation.buildItemKeysMap(
@@ -87,11 +92,11 @@ export default class NavigationFoundation<P = Record<string, any>, S = Record<st
                                 keysMap,
                                 [...parentKeys, itemKey],
                                 keyPropName
-                            );
-                        } else if (item.props && item.props.children) {
-                            const children = Array.isArray(item.props.children)
-                                ? item.props.children
-                                : [item.props.children];
+                            );  
+                        } else if (itemChildren) { 
+                            const children = Array.isArray(itemChildren) 
+                                ? itemChildren
+                                : [itemChildren];
                             NavigationFoundation.buildItemKeysMap(
                                 children,
                                 keysMap,

packages/semi-foundation/navigation/itemFoundation.ts

@@ -13,8 +13,7 @@ export interface ItemProps {
     isSubNav?: boolean;
     link?: string;
     linkOptions?: Record<string, any>;
-    disabled?: boolean;
-    children?: any
+    disabled?: boolean
 }
 
 export type ItemKey = string | number;

packages/semi-ui/navigation/Item.tsx

@@ -19,8 +19,7 @@ import NavContext, { NavContextType } from './nav-context';
 import Dropdown from '../dropdown';
 
 const clsPrefix = `${cssClasses.PREFIX}-item`;
-interface NavItemProps extends ItemProps, BaseProps {
-    children?: React.ReactNode;
+interface NavItemProps extends ItemProps, Omit<BaseProps, 'children'> {
     disabled?: boolean;
     forwardRef?: (ele: HTMLLIElement) => void;
     icon?: React.ReactNode;
@@ -57,7 +56,6 @@ export default class NavItem extends BaseComponent<NavItemProps, NavItemState> {
         onClick: PropTypes.func,
         onMouseEnter: PropTypes.func,
         onMouseLeave: PropTypes.func,
-        children: PropTypes.node,
         icon: PropTypes.oneOfType([PropTypes.node]),
         className: PropTypes.string,
         toggleIcon: PropTypes.string,
@@ -180,7 +178,6 @@ export default class NavItem extends BaseComponent<NavItemProps, NavItemState> {
     render() {
         const {
             text,
-            children,
             icon,
             toggleIcon,
             className,
@@ -204,6 +201,11 @@ export default class NavItem extends BaseComponent<NavItemProps, NavItemState> {
 
 
         let itemChildren = null;
+        // Children is not a recommended usage and may cause some bug-like performance, but some users have already used it, so here we only delete the ts definition instead of deleting the actual code
+        // children 并不是我们推荐的用法，可能会导致一些像 bug的表现，但是有些用户已经用了，所以此处仅作删除 ts 定义而非删除实际代码的操作
+        // refer https://github.com/DouyinFE/semi-design/issues/2710
+        // @ts-ignore
+        const children = this.props?.children;
         if (!isNullOrUndefined(children)) {
             itemChildren = children;
         } else {

packages/semi-ui/navigation/SubNav.tsx

@@ -359,6 +359,10 @@ export default class SubNav extends BaseComponent<SubNavProps, SubNavState> {
         }
 
         return (
+            // Children is not a recommended usage and may cause some bug-like performance, but some users have already used it, so here we only delete the ts definition instead of deleting the actual code
+            // children 并不是我们推荐的用法，可能会导致一些像 bug的表现，但是有些用户已经用了，所以此处仅作删除 ts 定义而非删除实际代码的操作
+            // refer https://github.com/DouyinFE/semi-design/issues/2710
+            // @ts-ignore    
             <NavItem
                 style={style}
                 isSubNav={true}
@@ -370,7 +374,7 @@ export default class SubNav extends BaseComponent<SubNavProps, SubNavState> {
                 onMouseLeave={onMouseLeave}
                 disabled={disabled}
                 text={text}
-            >
+            >   
                 <NavContext.Provider value={{ ...this.context, isInSubNav: true }}>
                     {titleDiv}
                     {subUl}