78 lines
1.2 KiB
React
78 lines
1.2 KiB
React
import ReactSelect from 'react-select';
|
|
|
|
const { __ } = wp.i18n;
|
|
|
|
const {
|
|
Component,
|
|
} = wp.element;
|
|
|
|
const {
|
|
BaseControl,
|
|
} = wp.components;
|
|
|
|
/**
|
|
* Component
|
|
*/
|
|
export default class ReactSelectControl extends Component {
|
|
constructor() {
|
|
super(...arguments);
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
val,
|
|
label,
|
|
isMulti,
|
|
onChange,
|
|
options,
|
|
} = this.props;
|
|
|
|
return (
|
|
<BaseControl
|
|
label={ label || false }
|
|
>
|
|
<ReactSelect
|
|
label={ label }
|
|
isMulti={ isMulti }
|
|
options={ options }
|
|
value={ ( () => {
|
|
var list = val;
|
|
|
|
if ( ! Array.isArray( val ) ) {
|
|
list = [];
|
|
}
|
|
|
|
const result = list.map( ( val ) => {
|
|
const el = options.find(function(el){
|
|
if ( val === el['value'] ) {
|
|
return true;
|
|
}
|
|
})
|
|
|
|
if ( el ) {
|
|
return {
|
|
value: val,
|
|
label: el['label'],
|
|
};
|
|
}
|
|
} );
|
|
|
|
return result;
|
|
} )() }
|
|
onChange={ ( val ) => {
|
|
if ( val ) {
|
|
const result = val.map( ( opt ) => {
|
|
return opt.value;
|
|
} );
|
|
|
|
onChange( result );
|
|
} else {
|
|
onChange( [] );
|
|
}
|
|
} }
|
|
/>
|
|
</BaseControl>
|
|
);
|
|
}
|
|
}
|