2 lines
5.6 KiB
JavaScript
2 lines
5.6 KiB
JavaScript
import{t as F,R as r,I as y,O as S,J as k,P as I,K as V,L as P,M as c,N as M,y as T,z as A,D as f,Q as B,T as D,U}from"./index-BnEnDzpZ.js";var R=function(C){F(n,C);function n(t){var e=C.call(this,t)||this;return e.state={isOpened:!1,isFocused:!1,inputValue:e.props.value||"",tempValue:e.props.value||""},e.open=e.open.bind(e),e.close=e.close.bind(e),e.focus=e.focus.bind(e),e.blur=e.blur.bind(e),e.handleChange=e.handleChange.bind(e),e.handleTempChange=e.handleTempChange.bind(e),e.handleConfirm=e.handleConfirm.bind(e),e.handleFocus=e.handleFocus.bind(e),e.handleBlur=e.handleBlur.bind(e),e.clearValue=e.clearValue.bind(e),e.handleInputChange=e.handleInputChange.bind(e),e.handleClick=e.handleClick.bind(e),e.preview=r.createRef(),e.input=r.createRef(),e}return n.prototype.componentDidUpdate=function(t){var e=this.props;t.value!==e.value&&this.setState({inputValue:e.value||""})},n.prototype.handleFocus=function(){this.setState({isFocused:!0})},n.prototype.handleBlur=function(){this.setState({isFocused:!1,inputValue:this.props.value})},n.prototype.focus=function(){this.input.current&&this.input.current.focus()},n.prototype.blur=function(){this.input.current&&this.input.current.blur()},n.prototype.open=function(t){this.props.disabled||this.setState({isOpened:!0},t)},n.prototype.close=function(){this.setState({isOpened:!1})},n.prototype.clearValue=function(){var t=this.props,e=t.onChange,o=t.resetValue;e(o||"")},n.prototype.handleClick=function(){this.state.isOpened?this.close():this.open(this.focus)},n.prototype.handleInputChange=function(t){var e=this;if(this.props.allowCustomColor){var o=this.props.onChange;this.setState({inputValue:t.currentTarget.value},function(){var s=e.validateColor(e.state.inputValue);s&&o(e.state.inputValue)})}},n.prototype.validateColor=function(t){if(t===""||t==="inherit"||t==="transparent")return!1;var e=document.createElement("img");return e.style.color="rgb(0, 0, 0)",e.style.color=t,e.style.color!=="rgb(0, 0, 0)"?!0:(e.style.color="rgb(255, 255, 255)",e.style.color=t,e.style.color!=="rgb(255, 255, 255)")},n.prototype.handleChange=function(t){var e=this.props,o=e.onChange,s=e.format;o(s==="rgba"?"rgba(".concat(t.rgb.r,", ").concat(t.rgb.g,", ").concat(t.rgb.b,", ").concat(t.rgb.a,")"):s==="rgb"?"rgb(".concat(t.rgb.r,", ").concat(t.rgb.g,", ").concat(t.rgb.b,")"):s==="hsl"?"hsl(".concat(Math.round(t.hsl.h),", ").concat(Math.round(t.hsl.s*100),"%, ").concat(Math.round(t.hsl.l*100),"%)"):t.hex)},n.prototype.handleTempChange=function(t){var e=this.state.tempValue,o=this.props.format;o==="rgba"?e="rgba(".concat(t.rgb.r,", ").concat(t.rgb.g,", ").concat(t.rgb.b,", ").concat(t.rgb.a,")"):o==="rgb"?e="rgb(".concat(t.rgb.r,", ").concat(t.rgb.g,", ").concat(t.rgb.b,")"):o==="hsl"?e="hsl(".concat(Math.round(t.hsl.h),", ").concat(Math.round(t.hsl.s*100),"%, ").concat(Math.round(t.hsl.l*100),"%)"):e=t.hex,this.setState({tempValue:e})},n.prototype.handleConfirm=function(){var t=this.props.onChange,e=this.state.tempValue;t(e),this.close()},n.prototype.render=function(){var t=this,e=this.props,o=e.classPrefix,s=e.className,E=e.popoverClassName,p=e.value,N=e.placeholder,h=e.disabled,g=e.popOverContainer,m=e.format,O=e.clearable,x=e.placement,l=e.classnames,i=e.presetColors,b=e.allowCustomColor,u=e.mobileUI,w=this.props.translate,d=this.state.isOpened,_=this.state.isFocused,v=this.state.tempValue;return r.createElement("div",{className:l("ColorPicker",{"is-disabled":h,"is-focused":_,"is-opened":d},s)},r.createElement("span",{onClick:this.handleClick,className:l("ColorPicker-preview")},r.createElement("i",{ref:this.preview,className:"".concat(o,"ColorPicker-previewIcon"),style:{background:this.state.inputValue||"#ccc"}})),r.createElement("input",{ref:this.input,type:"text",autoComplete:"off",size:10,className:l("ColorPicker-input"),value:this.state.inputValue||"",placeholder:w(N),disabled:h,onChange:this.handleInputChange,onFocus:this.handleFocus,onBlur:this.handleBlur,onClick:this.handleClick,readOnly:u}),O&&!h&&p?r.createElement("a",{onClick:this.clearValue,className:l("ColorPicker-clear")},r.createElement(y,{icon:"input-clear",className:"icon"})):null,r.createElement("span",{className:l("ColorPicker-arrow")},r.createElement(y,{icon:"right-arrow-bold",className:"icon",onClick:this.handleClick})),!u&&d?r.createElement(S,{placement:x||"auto",target:function(){return k.findDOMNode(t)},onHide:this.close,container:g||function(){return k.findDOMNode(t)},rootClose:!1,show:!0},r.createElement(I,{classPrefix:o,className:l("ColorPicker-popover",E),onHide:this.close,overlay:!0},b?r.createElement(V,{styles:{},disableAlpha:!!~["rgb","hex"].indexOf(m),color:p,presetColors:i,onChangeComplete:this.handleChange}):r.createElement(P,{color:p,colors:Array.isArray(i)?i.filter(function(a){return typeof a=="string"||c(a)}).map(function(a){return typeof a=="string"?a:c(a)?a==null?void 0:a.color:a}):void 0,onChangeComplete:this.handleChange}))):null,u&&r.createElement(M,{className:l("".concat(o,"ColorPicker-popup")),container:g,isShow:d,onHide:this.handleClick,showConfirm:!0,onConfirm:this.handleConfirm},b?r.createElement(V,{styles:{},disableAlpha:!!~["rgb","hex"].indexOf(m),color:v,presetColors:i,onChangeComplete:this.handleTempChange}):r.createElement(P,{color:v,colors:Array.isArray(i)?i.filter(function(a){return typeof a=="string"||c(a)}).map(function(a){return typeof a=="string"?a:c(a)?a==null?void 0:a.color:a}):void 0,onChangeComplete:this.handleTempChange})))},n.defaultProps={format:"hex",clearable:!0,placeholder:"ColorPicker.placeholder",allowCustomColor:!0},T([A,f("design:type",Function),f("design:paramtypes",[String]),f("design:returntype",void 0)],n.prototype,"validateColor",null),n}(r.PureComponent),z=B(D(U(R,{value:"onChange"})));export{R as ColorControl,z as default};
|