@eeacms/react-chart-editor/lib/components/widgets/Dropdown.js

plotly.js chart editor react component UI

"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactSelect=_interopRequireDefault(require("react-select"));var _creatable=_interopRequireDefault(require("react-select/creatable"));var _classnames=_interopRequireDefault(require("classnames"));var _isNil=_interopRequireDefault(require("lodash/isNil"));function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}(function(){var enterModule=typeof reactHotLoaderGlobal!=="undefined"?reactHotLoaderGlobal.enterModule:undefined;enterModule&&enterModule(module)})();var __signature__=typeof reactHotLoaderGlobal!=="undefined"?reactHotLoaderGlobal.default.signature:function(a){return a};class Dropdown extends _react.Component{constructor(props){super(props);this.onChange=this.onChange.bind(this);this.onCreate=this.onCreate.bind(this)}onChange(selection){const{multi,onChange,valueKey}=this.props;if(!selection){return onChange(null)}return multi?onChange(selection.map(s=>s[valueKey])):onChange(selection[valueKey])}onCreate(value){const{onCreate}=this.props;if(!value){return onCreate(null)}return onCreate(value)}render(){const{minWidth,placeholder,clearable,creatable,value,options,searchable,multi,noResultsText,valueKey,disabled,className,width}=this.props;const{localize:_}=this.context;const dropdownStyle={minWidth};if(width){dropdownStyle.width=width}const opts=options.map(opt=>typeof opt==="string"?{label:opt,[valueKey]:opt}:opt);const dropdownContainerClass=(0,_classnames.default)("dropdown-container",{"dropdown--dark":this.props.backgroundDark,[className]:className});const getOption=value=>{if((0,_isNil.default)(value)){return null}return opts.find(o=>o[valueKey]===value)||{label:value,[valueKey]:value}};const Select=creatable?_creatable.default:_reactSelect.default;return _react.default.createElement("div",{className:dropdownContainerClass,style:dropdownStyle},_react.default.createElement(Select,{placeholder:placeholder||_("Select an Option"),isClearable:clearable,value:Array.isArray(value)?value.reduce((acc,v)=>{acc.push(getOption(v));return acc},[]):getOption(value),options:opts,isSearchable:searchable,onChange:this.onChange,onCreateOption:this.onCreate,isMulti:multi,noOptionsMessage:()=>noResultsText||_("No Results"),getOptionValue:o=>o[valueKey],getOptionLabel:o=>o.label,isDisabled:disabled,className:dropdownContainerClass,classNamePrefix:"Select",components:this.props.components}))}__reactstandin__regenerateByEval(key,code){this[key]=eval(code)}}Dropdown.defaultProps={clearable:true,creatable:false,multi:false,searchable:false,minWidth:"120px",valueKey:"value",disabled:false};Dropdown.propTypes={backgroundDark:_propTypes.default.bool,clearable:_propTypes.default.bool,creatable:_propTypes.default.bool,onChange:_propTypes.default.func.isRequired,onCreate:_propTypes.default.func,options:_propTypes.default.array.isRequired,placeholder:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.object]),searchable:_propTypes.default.bool,minWidth:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),valueKey:_propTypes.default.string,value:_propTypes.default.any,multi:_propTypes.default.bool,components:_propTypes.default.object,noResultsText:_propTypes.default.string,disabled:_propTypes.default.bool,className:_propTypes.default.string,width:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number])};Dropdown.contextTypes={localize:_propTypes.default.func};const _default=Dropdown;var _default2=exports.default=_default;;(function(){var reactHotLoader=typeof reactHotLoaderGlobal!=="undefined"?reactHotLoaderGlobal.default:undefined;if(!reactHotLoader){return}reactHotLoader.register(Dropdown,"Dropdown","/react-chart-editor/src/components/widgets/Dropdown.js");reactHotLoader.register(_default,"default","/react-chart-editor/src/components/widgets/Dropdown.js")})();;(function(){var leaveModule=typeof reactHotLoaderGlobal!=="undefined"?reactHotLoaderGlobal.leaveModule:undefined;leaveModule&&leaveModule(module)})();
//# sourceMappingURL=Dropdown.js.map