1
1
import classNames from 'classnames' ;
2
2
import useMergedState from 'rc-util/lib/hooks/useMergedState' ;
3
- import warning from 'rc-util/lib/warning' ;
4
3
import React from 'react' ;
5
4
import useItems from './hooks/useItems' ;
6
5
import type { CollapseProps } from './interface' ;
@@ -23,7 +22,6 @@ const Collapse = React.forwardRef<HTMLDivElement, CollapseProps>((props, ref) =>
23
22
style,
24
23
accordion,
25
24
className,
26
- children,
27
25
collapsible,
28
26
openMotion,
29
27
expandIcon,
@@ -74,6 +72,57 @@ const Collapse = React.forwardRef<HTMLDivElement, CollapseProps>((props, ref) =>
74
72
activeKey,
75
73
} ) ;
76
74
75
+ // eslint-disable-next-line @typescript-eslint/no-shadow
76
+ const convertItemsToNodes = ( items : ItemType [ ] ) =>
77
+ items . map ( ( item , index ) => {
78
+ const {
79
+ children,
80
+ key : rawKey ,
81
+ collapsible : rawCollapsible ,
82
+ onItemClick : rawOnItemClick ,
83
+ destroyInactivePanel : rawDestroyInactivePanel ,
84
+ expandIcon : rawExpandIcon = expandIcon ,
85
+ ...restProps
86
+ } = item ;
87
+
88
+ // You may be puzzled why you want to convert them all into strings, me too.
89
+ // Maybe: https://github.com/react-component/collapse/blob/aac303a8b6ff30e35060b4f8fecde6f4556fcbe2/src/Collapse.tsx#L15
90
+ const key = String ( rawKey ?? index ) ;
91
+ const mergeCollapsible = rawCollapsible ?? collapsible ;
92
+ const mergeDestroyInactivePanel = rawDestroyInactivePanel ?? destroyInactivePanel ;
93
+
94
+ const handleItemClick = ( value : React . Key ) => {
95
+ if ( mergeCollapsible === 'disabled' ) return ;
96
+ onClickItem ( value ) ;
97
+ rawOnItemClick ?.( value ) ;
98
+ } ;
99
+
100
+ let isActive = false ;
101
+ if ( accordion ) {
102
+ isActive = activeKey [ 0 ] === key ;
103
+ } else {
104
+ isActive = activeKey . indexOf ( key ) > - 1 ;
105
+ }
106
+
107
+ return (
108
+ < CollapsePanel
109
+ prefixCls = { prefixCls }
110
+ key = { key }
111
+ panelKey = { key }
112
+ isActive = { isActive }
113
+ accordion = { accordion }
114
+ openMotion = { openMotion }
115
+ collapsible = { mergeCollapsible }
116
+ onItemClick = { handleItemClick }
117
+ destroyInactivePanel = { mergeDestroyInactivePanel }
118
+ expandIcon = { rawExpandIcon }
119
+ { ...restProps }
120
+ >
121
+ { children }
122
+ </ CollapsePanel >
123
+ ) ;
124
+ } ) ;
125
+
77
126
// ======================== Render ========================
78
127
return (
79
128
< div
@@ -87,9 +136,4 @@ const Collapse = React.forwardRef<HTMLDivElement, CollapseProps>((props, ref) =>
87
136
) ;
88
137
} ) ;
89
138
90
- export default Object . assign ( Collapse , {
91
- /**
92
- * @deprecated use `items` instead, will be removed in `v4.0.0`
93
- */
94
- Panel : CollapsePanel ,
95
- } ) ;
139
+ export default Collapse ;
0 commit comments