jetformbuilder
/
assets
/
src
/
package
/
action-fields-map
/
components
/
WrapperRequiredControl.js
ActionFieldsMap.js
2 years ago
DynamicPropertySelect.js
2 years ago
WrapperRequiredControl.js
2 years ago
WrapperRequiredControl.js
50 lines
| 1 | import ActionFieldsMapContext from '../context/ActionFieldsMapContext'; |
| 2 | |
| 3 | const { RawHTML, useContext } = wp.element; |
| 4 | |
| 5 | export default function WrapperRequiredControl( { |
| 6 | children, |
| 7 | labelKey = 'label', |
| 8 | requiredKey = 'required', |
| 9 | helpKey = 'help', |
| 10 | field = [], |
| 11 | } ) { |
| 12 | |
| 13 | let { name, data } = useContext( ActionFieldsMapContext ); |
| 14 | |
| 15 | if ( field.length ) { |
| 16 | [ name, data ] = field; |
| 17 | } |
| 18 | |
| 19 | return ( |
| 20 | <div |
| 21 | className="jet-user-meta__row" |
| 22 | key={ 'user_meta_' + name } |
| 23 | > |
| 24 | <div className="jet-field-map__row-label"> |
| 25 | |
| 26 | <span className={ 'fields-map__label' }> |
| 27 | { ( |
| 28 | data.hasOwnProperty( labelKey ) && data[ labelKey ] |
| 29 | ) && data[ labelKey ] } |
| 30 | { ( |
| 31 | !data.hasOwnProperty( labelKey ) |
| 32 | ) && data } |
| 33 | </span> |
| 34 | { ( |
| 35 | data.hasOwnProperty( requiredKey ) && data[ requiredKey ] |
| 36 | ) && |
| 37 | <span className={ 'fields-map__required' }> *</span> } |
| 38 | { data[ helpKey ] && <p |
| 39 | className={ 'components-base-control__help' } |
| 40 | style={ { |
| 41 | color: 'rgb(117, 117, 117)', |
| 42 | margin: '1em 0 0 0', |
| 43 | } }> |
| 44 | <RawHTML>{ data[ helpKey ] }</RawHTML> |
| 45 | </p> } |
| 46 | </div> |
| 47 | { children } |
| 48 | </div> |
| 49 | ); |
| 50 | } |