1
1
// Accessibility https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Tab_Role
2
2
import classNames from 'classnames' ;
3
- import useMergedState from '@rc-component/util/lib/hooks/useMergedState ' ;
3
+ import useControlledState from '@rc-component/util/lib/hooks/useControlledState ' ;
4
4
import isMobile from '@rc-component/util/lib/isMobile' ;
5
5
import * as React from 'react' ;
6
6
import { useEffect , useState } from 'react' ;
@@ -123,10 +123,10 @@ const Tabs = React.forwardRef<HTMLDivElement, TabsProps>((props, ref) => {
123
123
} , [ ] ) ;
124
124
125
125
// ====================== Active Key ======================
126
- const [ mergedActiveKey , setMergedActiveKey ] = useMergedState < string > ( ( ) => tabs [ 0 ] ?. key , {
127
- value : activeKey ,
128
- defaultValue : defaultActiveKey ,
129
- } ) ;
126
+ const [ mergedActiveKey , setMergedActiveKey ] = useControlledState < string > (
127
+ defaultActiveKey ?? tabs [ 0 ] ?. key ,
128
+ activeKey ,
129
+ ) ;
130
130
const [ activeIndex , setActiveIndex ] = useState ( ( ) =>
131
131
tabs . findIndex ( tab => tab . key === mergedActiveKey ) ,
132
132
) ;
@@ -142,9 +142,7 @@ const Tabs = React.forwardRef<HTMLDivElement, TabsProps>((props, ref) => {
142
142
} , [ tabs . map ( tab => tab . key ) . join ( '_' ) , mergedActiveKey , activeIndex ] ) ;
143
143
144
144
// ===================== Accessibility ====================
145
- const [ mergedId , setMergedId ] = useMergedState ( null , {
146
- value : id ,
147
- } ) ;
145
+ const [ mergedId , setMergedId ] = useControlledState ( null , id ) ;
148
146
149
147
// Async generate id to avoid ssr mapping failed
150
148
useEffect ( ( ) => {
0 commit comments