7
7
CFormSwitch ,
8
8
CFormTextarea ,
9
9
CSpinner ,
10
+ CTooltip ,
10
11
} from '@coreui/react'
11
12
import Select from 'react-select'
12
13
import AsyncSelect from 'react-select/async'
@@ -75,9 +76,14 @@ RFFCFormCheck.propTypes = {
75
76
...sharedPropTypes ,
76
77
}
77
78
79
+ function ConditionWrapper ( { condition, wrapper, children } ) {
80
+ return condition ? wrapper ( children ) : children
81
+ }
82
+
78
83
export const RFFCFormSwitch = ( {
79
84
name,
80
85
label,
86
+ helpText,
81
87
sublabel,
82
88
className = 'mb-3' ,
83
89
validate,
@@ -86,26 +92,36 @@ export const RFFCFormSwitch = ({
86
92
return (
87
93
< Field name = { name } type = "checkbox" validate = { validate } >
88
94
{ ( { meta, input } ) => (
89
- < div className = { className } >
90
- < CFormSwitch
91
- { ...input }
92
- // @todo revisit this, only shows green when checked
93
- valid = { ! meta . error && meta . touched && validate }
94
- invalid = { meta . error && meta . touched && validate }
95
- disabled = { disabled }
96
- id = { name }
97
- label = { label }
98
- />
99
- { input . value && < RFFCFormFeedback meta = { meta } /> }
100
- < sub > { sublabel } </ sub >
101
- </ div >
95
+ < ConditionWrapper
96
+ condition = { helpText }
97
+ wrapper = { ( children ) => (
98
+ < CTooltip placement = "left" content = { helpText } >
99
+ { children }
100
+ </ CTooltip >
101
+ ) }
102
+ >
103
+ < div className = { className } >
104
+ < CFormSwitch
105
+ { ...input }
106
+ // @todo revisit this, only shows green when checked
107
+ valid = { ! meta . error && meta . touched && validate }
108
+ invalid = { meta . error && meta . touched && validate }
109
+ disabled = { disabled }
110
+ id = { name }
111
+ label = { label }
112
+ />
113
+ { input . value && < RFFCFormFeedback meta = { meta } /> }
114
+ < sub > { sublabel } </ sub >
115
+ </ div >
116
+ </ ConditionWrapper >
102
117
) }
103
118
</ Field >
104
119
)
105
120
}
106
121
107
122
RFFCFormSwitch . propTypes = {
108
123
...sharedPropTypes ,
124
+ helpText : PropTypes . string ,
109
125
}
110
126
111
127
export const RFFCFormInput = ( {
0 commit comments