1
1
'use client' ;
2
2
import * as React from 'react' ;
3
3
import PropTypes from 'prop-types' ;
4
- import { useComponentRenderer } from '../utils/useComponentRenderer' ;
5
- import type { BaseUIComponentProps } from '../utils/types' ;
6
- import { useToggleButton } from './useToggleButton ' ;
4
+ import { useComponentRenderer } from '../../ utils/useComponentRenderer' ;
5
+ import type { BaseUIComponentProps } from '../../ utils/types' ;
6
+ import { useToggleButtonRoot } from './useToggleButtonRoot ' ;
7
7
8
8
const customStyleHookMapping = {
9
9
disabled : ( ) => null ,
@@ -17,10 +17,10 @@ const customStyleHookMapping = {
17
17
*
18
18
* API:
19
19
*
20
- * - [ToggleButton API](https://base-ui.netlify.app/components/react-toggle-button/#api-reference-ToggleButton )
20
+ * - [ToggleButtonRoot API](https://base-ui.netlify.app/components/react-toggle-button/#api-reference-ToggleButtonRoot )
21
21
*/
22
- const ToggleButton = React . forwardRef ( function ToggleButton (
23
- props : ToggleButton . Props ,
22
+ const ToggleButtonRoot = React . forwardRef ( function ToggleButtonRoot (
23
+ props : ToggleButtonRoot . Props ,
24
24
forwardedRef : React . ForwardedRef < HTMLButtonElement > ,
25
25
) {
26
26
const {
@@ -33,15 +33,15 @@ const ToggleButton = React.forwardRef(function ToggleButton(
33
33
...otherProps
34
34
} = props ;
35
35
36
- const { disabled, pressed, getRootProps } = useToggleButton ( {
36
+ const { disabled, pressed, getRootProps } = useToggleButtonRoot ( {
37
37
pressed : pressedProp ,
38
38
defaultPressed : defaultPressedProp ,
39
39
disabled : disabledProp ,
40
40
onPressedChange,
41
41
buttonRef : forwardedRef ,
42
42
} ) ;
43
43
44
- const ownerState : ToggleButton . OwnerState = React . useMemo (
44
+ const ownerState : ToggleButtonRoot . OwnerState = React . useMemo (
45
45
( ) => ( {
46
46
disabled,
47
47
pressed,
@@ -56,15 +56,38 @@ const ToggleButton = React.forwardRef(function ToggleButton(
56
56
ownerState,
57
57
className,
58
58
customStyleHookMapping,
59
- extraProps : {
60
- ...otherProps ,
61
- } ,
59
+ extraProps : otherProps ,
62
60
} ) ;
63
61
64
62
return renderElement ( ) ;
65
63
} ) ;
66
64
67
- ToggleButton . propTypes /* remove-proptypes */ = {
65
+ export { ToggleButtonRoot } ;
66
+
67
+ export namespace ToggleButtonRoot {
68
+ export interface OwnerState {
69
+ pressed : boolean ;
70
+ disabled : boolean ;
71
+ }
72
+
73
+ export interface Props
74
+ extends Pick <
75
+ useToggleButtonRoot . Parameters ,
76
+ 'pressed' | 'defaultPressed' | 'disabled' | 'onPressedChange'
77
+ > ,
78
+ BaseUIComponentProps < 'button' , OwnerState > {
79
+ /**
80
+ * The label for the ToggleButton.
81
+ */
82
+ 'aria-label' ?: React . AriaAttributes [ 'aria-label' ] ;
83
+ /**
84
+ * An id or space-separated list of ids of elements that label the ToggleButton.
85
+ */
86
+ 'aria-labelledby' ?: React . AriaAttributes [ 'aria-labelledby' ] ;
87
+ }
88
+ }
89
+
90
+ ToggleButtonRoot . propTypes /* remove-proptypes */ = {
68
91
// ┌────────────────────────────── Warning ──────────────────────────────┐
69
92
// │ These PropTypes are generated from the TypeScript type definitions. │
70
93
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
@@ -115,28 +138,3 @@ ToggleButton.propTypes /* remove-proptypes */ = {
115
138
*/
116
139
render : PropTypes . oneOfType ( [ PropTypes . element , PropTypes . func ] ) ,
117
140
} as any ;
118
-
119
- export { ToggleButton } ;
120
-
121
- export namespace ToggleButton {
122
- export interface OwnerState {
123
- pressed : boolean ;
124
- disabled : boolean ;
125
- }
126
-
127
- export interface Props
128
- extends Pick <
129
- useToggleButton . Parameters ,
130
- 'pressed' | 'defaultPressed' | 'disabled' | 'onPressedChange'
131
- > ,
132
- BaseUIComponentProps < 'button' , OwnerState > {
133
- /**
134
- * The label for the ToggleButton.
135
- */
136
- 'aria-label' ?: React . AriaAttributes [ 'aria-label' ] ;
137
- /**
138
- * An id or space-separated list of ids of elements that label the ToggleButton.
139
- */
140
- 'aria-labelledby' ?: React . AriaAttributes [ 'aria-labelledby' ] ;
141
- }
142
- }
0 commit comments