@@ -5,43 +5,51 @@ import hoistStatics from './hoistInternalStatics';
5
5
import useTheme from './useTheme' ;
6
6
import RefHolder from './RefHolder' ;
7
7
8
- // Provide the theme object as a property to the input component.
9
- // It's an alternative API to useTheme().
10
- // We encourage the usage of useTheme() where possible.
11
- const withTheme = Component => {
12
- if ( process . env . NODE_ENV !== 'production' && Component === undefined ) {
13
- throw new Error (
14
- [
15
- 'You are calling withTheme(Component) with an undefined component.' ,
16
- 'You may have forgotten to import it.' ,
17
- ] . join ( '\n' ) ,
18
- ) ;
19
- }
20
-
21
- const WithTheme = React . forwardRef ( function WithTheme ( props , ref ) {
22
- const { innerRef, ...other } = props ;
23
- const theme = useTheme ( ) ;
24
- return (
25
- < RefHolder ref = { ref } >
26
- < Component theme = { theme } ref = { innerRef } { ...other } />
27
- </ RefHolder >
28
- ) ;
29
- } ) ;
30
-
31
- WithTheme . propTypes = {
32
- /**
33
- * Use that property to pass a ref callback to the decorated component.
34
- */
35
- innerRef : PropTypes . oneOfType ( [ PropTypes . func , PropTypes . object ] ) ,
36
- } ;
8
+ export function withThemeCreator ( options = { } ) {
9
+ const { useTheme : useThemeOption = useTheme } = options ;
10
+
11
+ const withTheme = Component => {
12
+ if ( process . env . NODE_ENV !== 'production' && Component === undefined ) {
13
+ throw new Error (
14
+ [
15
+ 'You are calling withTheme(Component) with an undefined component.' ,
16
+ 'You may have forgotten to import it.' ,
17
+ ] . join ( '\n' ) ,
18
+ ) ;
19
+ }
20
+
21
+ const WithTheme = React . forwardRef ( function WithTheme ( props , ref ) {
22
+ const { innerRef, ...other } = props ;
23
+ const theme = useThemeOption ( ) ;
24
+ return (
25
+ < RefHolder ref = { ref } >
26
+ < Component theme = { theme } ref = { innerRef } { ...other } />
27
+ </ RefHolder >
28
+ ) ;
29
+ } ) ;
30
+
31
+ WithTheme . propTypes = {
32
+ /**
33
+ * Use that property to pass a ref callback to the decorated component.
34
+ */
35
+ innerRef : PropTypes . oneOfType ( [ PropTypes . func , PropTypes . object ] ) ,
36
+ } ;
37
37
38
- if ( process . env . NODE_ENV !== 'production' ) {
39
- WithTheme . displayName = `WithTheme(${ getDisplayName ( Component ) } )` ;
40
- }
38
+ if ( process . env . NODE_ENV !== 'production' ) {
39
+ WithTheme . displayName = `WithTheme(${ getDisplayName ( Component ) } )` ;
40
+ }
41
41
42
- hoistStatics ( WithTheme , Component ) ;
42
+ hoistStatics ( WithTheme , Component ) ;
43
43
44
- return WithTheme ;
45
- } ;
44
+ return WithTheme ;
45
+ } ;
46
+
47
+ return withTheme ;
48
+ }
49
+
50
+ // Provide the theme object as a property to the input component.
51
+ // It's an alternative API to useTheme().
52
+ // We encourage the usage of useTheme() where possible.
53
+ const withTheme = withThemeCreator ( ) ;
46
54
47
55
export default withTheme ;
0 commit comments