primereact/colorpicker/colorpicker.min.js

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

this.primereact=this.primereact||{},this.primereact.colorpicker=function(e,n,t,r,o,l,a,i,c){"use strict";function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var f=s(n),p=u(t);function d(){return d=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},d.apply(this,arguments)}function m(e){if(Array.isArray(e))return e}function h(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,l,a,i=[],c=!0,u=!1;try{if(l=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;c=!1}else for(;!(c=(r=l.call(t)).done)&&(i.push(r.value),i.length!==n);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=t.return&&(a=t.return(),Object(a)!==a))return}finally{if(u)throw o}}return i}}function g(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function b(e,n){if(e){if("string"==typeof e)return g(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?g(e,n):void 0}}function v(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function y(e,n){return m(e)||h(e,n)||b(e,n)||v()}var E={defaultProps:{__TYPE:"ColorPicker",appendTo:null,className:null,defaultColor:"ff0000",disabled:!1,format:"hex",id:null,inline:!1,inputId:null,inputRef:null,onChange:null,onHide:null,onShow:null,panelClassName:null,panelStyle:null,style:null,tabIndex:null,tooltip:null,tooltipOptions:null,transitionOptions:null,value:null,children:void 0},getProps:function(e){return a.ObjectUtils.getMergedProps(e,E.defaultProps)},getOtherProps:function(e){return a.ObjectUtils.getDiffProps(e,E.defaultProps)}},O=f.forwardRef((function(e,n){var t,r=(t=a.classNames("p-colorpicker-panel",e.panelClassName,{"p-colorpicker-overlay-panel":!e.inline,"p-disabled":e.disabled,"p-input-filled":"filled"===p.default.inputStyle,"p-ripple-disabled":!1===p.default.ripple}),f.createElement(i.CSSTransition,{nodeRef:n,classNames:"p-connected-overlay",in:e.in,timeout:{enter:120,exit:100},options:e.transitionOptions,unmountOnExit:!0,onEnter:e.onEnter,onEntered:e.onEntered,onExit:e.onExit,onExited:e.onExited},f.createElement("div",{ref:n,className:t,style:e.panelStyle,onClick:e.onClick},e.children)));return e.inline?r:f.createElement(c.Portal,{element:r,appendTo:e.appendTo})}));O.displayName="ColorPickerPanel";var M=f.memo(f.forwardRef((function(e,n){var t=E.getProps(e),i=y(f.useState(!1),2),c=i[0],u=i[1],s=f.useRef(null),m=f.useRef(null),h=f.useRef(t.inputRef),g=f.useRef(null),b=f.useRef(null),v=f.useRef(null),M=f.useRef(null),k=f.useRef(!1),x=f.useRef(null),C=f.useRef(!1),w=y(r.useOverlayListener({target:s,overlay:m,listener:function(e,n){n.valid&&ee()},when:c}),2),T=w[0],N=w[1],P=y(r.useEventListener({type:"mousemove",listener:function(e){C.current&&X(e),k.current&&Y(e)}}),2),S=P[0],R=P[1],j=y(r.useEventListener({type:"mouseup",listener:function(){C.current=k.current=!1,a.DomHandler.removeClass(s.current,"p-colorpicker-dragging"),R(),I()}}),2),D=j[0],I=j[1],U=function(e){t.disabled||(z(),H(e))},H=function(e){t.disabled||(k.current=!0,Y(e),a.DomHandler.addClass(s.current,"p-colorpicker-dragging"))},Y=function(e){var n=M.current.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);x.current=oe({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150),s:100,b:100}),G(),Q(),F()},A=function(e){t.disabled||(z(),_(e))},_=function(e){t.disabled||(C.current=!0,X(e),a.DomHandler.addClass(s.current,"p-colorpicker-dragging"),e.preventDefault())},L=function(e){C.current&&(X(e),e.preventDefault()),k.current&&(Y(e),e.preventDefault())},Z=function(){C.current=!1,k.current=!1,a.DomHandler.removeClass(s.current,"p-colorpicker-dragging"),B()},z=function(){S(),D()},B=function(){R(),I()},X=function(e){var n=g.current.getBoundingClientRect(),t=n.top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0),r=n.left+document.body.scrollLeft,o=Math.floor(100*Math.max(0,Math.min(150,(e.pageX||e.changedTouches[0].pageX)-r))/150),l=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150);x.current=oe({h:x.current.h,s:o,b:l}),J(),V(),F()},F=function(){switch(t.format){case"hex":q(se(x.current));break;case"rgb":q(ce(x.current));break;case"hsb":q(x.current)}},K=function(e){var n;if(e)switch(t.format){case"hex":n=ae(e);break;case"rgb":n=ie(e);break;case"hsb":n=e}else n=ae(t.defaultColor);return n},$=function(e){x.current=K(e)},q=function(e){t.onChange&&t.onChange({value:e,stopPropagation:function(){},preventDefault:function(){},target:{name:t.name,id:t.id,value:e}})},G=function(){if(g.current){var e=oe({h:x.current.h,s:100,b:100});g.current.style.backgroundColor="#"+se(e)}},J=function(){b.current&&(b.current.style.left=Math.floor(150*x.current.s/100)+"px",b.current.style.top=Math.floor(150*(100-x.current.b)/100)+"px")},Q=function(){v.current&&(v.current.style.top=Math.floor(150-150*x.current.h/360)+"px")},V=function(){h.current&&(h.current.style.backgroundColor="#"+se(x.current))},W=function(){u(!0)},ee=function(){u(!1)},ne=function(){te()},te=function(){c?ee():W()},re=function(e){switch(e.which){case 32:te(),e.preventDefault();break;case 27:case 9:ee()}},oe=function(e){return{h:Math.min(360,Math.max(0,e.h)),s:Math.min(100,Math.max(0,e.s)),b:Math.min(100,Math.max(0,e.b))}},le=function(e){var n=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:n>>16,g:(65280&n)>>8,b:255&n}},ae=function(e){return ie(le(e))},ie=function(e){var n={h:0,s:0,b:0},t=Math.min(e.r,e.g,e.b),r=Math.max(e.r,e.g,e.b),o=r-t;return n.b=r,n.s=0!==r?255*o/r:0,n.h=0!==n.s?e.r===r?(e.g-e.b)/o:e.g===r?2+(e.b-e.r)/o:4+(e.r-e.g)/o:-1,n.h*=60,n.h<0&&(n.h+=360),n.s*=100/255,n.b*=100/255,n},ce=function(e){var n={r:null,g:null,b:null},t=Math.round(e.h),r=Math.round(255*e.s/100),o=Math.round(255*e.b/100);if(0===r)n={r:o,g:o,b:o};else{var l=o,a=(255-r)*o/255,i=t%60*(l-a)/60;360===t&&(t=0),t<60?(n.r=l,n.b=a,n.g=a+i):t<120?(n.g=l,n.b=a,n.r=l-i):t<180?(n.g=l,n.r=a,n.b=a+i):t<240?(n.b=l,n.r=a,n.g=l-i):t<300?(n.b=l,n.g=a,n.r=a+i):t<360?(n.r=l,n.g=a,n.b=l-i):(n.r=0,n.g=0,n.b=0)}return{r:Math.round(n.r),g:Math.round(n.g),b:Math.round(n.b)}},ue=function(e){var n=[e.r.toString(16),e.g.toString(16),e.b.toString(16)];for(var t in n)1===n[t].length&&(n[t]="0"+n[t]);return n.join("")},se=function(e){return ue(ce(e))},fe=function(){Q(),J(),V(),G()},pe=function(){h.current&&a.DomHandler.alignOverlay(m.current,h.current.parentElement,t.appendTo||p.default.appendTo)};f.useImperativeHandle(n,(function(){return{props:t,show:W,hide:ee,focus:function(){return a.DomHandler.focus(h.current)},getElement:function(){return s.current},getOverlay:function(){return m.current},getInput:function(){return h.current}}})),f.useEffect((function(){a.ObjectUtils.combinedRefs(h,t.inputRef)}),[h,t.inputRef]),r.useMountEffect((function(){$(t.value),fe()})),r.useUpdateEffect((function(){C.current||k.current||$(t.value)}),[t.value]),r.useUpdateEffect((function(){fe()})),r.useUnmountEffect((function(){a.ZIndexUtils.clear(m.current)}));var de=a.ObjectUtils.isNotEmpty(t.tooltip),me=E.getOtherProps(t),he=a.classNames("p-colorpicker p-component",{"p-colorpicker-overlay":!t.inline},t.className),ge=f.createElement("div",{className:"p-colorpicker-content"},f.createElement("div",{ref:g,className:"p-colorpicker-color-selector",onMouseDown:A,onTouchStart:_,onTouchMove:L,onTouchEnd:Z},f.createElement("div",{className:"p-colorpicker-color"},f.createElement("div",{ref:b,className:"p-colorpicker-color-handle"}))),f.createElement("div",{ref:M,className:"p-colorpicker-hue",onMouseDown:U,onTouchStart:H,onTouchMove:L,onTouchEnd:Z},f.createElement("div",{ref:v,className:"p-colorpicker-hue-handle"}))),be=function(){if(!t.inline){var e=a.classNames("p-colorpicker-preview p-inputtext",{"p-disabled":t.disabled}),n=E.getOtherProps(t);return f.createElement("input",d({ref:h,type:"text",className:e,readOnly:!0,id:t.inputId,tabIndex:t.tabIndex,disabled:t.disabled,onClick:ne,onKeyDown:re},n))}return null}();return f.createElement(f.Fragment,null,f.createElement("div",d({ref:s,id:t.id,style:t.style,className:he},me),be,f.createElement(O,{ref:m,appendTo:t.appendTo,inline:t.inline,disabled:t.disabled,panelStyle:t.panelStyle,panelClassName:t.panelClassName,onClick:function(e){t.inline||o.OverlayService.emit("overlay-click",{originalEvent:e,target:s.current})},in:t.inline||c,onEnter:function(){a.ZIndexUtils.set("overlay",m.current,p.default.autoZIndex,p.default.zIndex.overlay),pe()},onEntered:function(){T(),t.onShow&&t.onShow()},onExit:function(){N()},onExited:function(){a.ZIndexUtils.clear(m.current),t.onHide&&t.onHide()},transitionOptions:t.transitionOptions},ge)),de&&f.createElement(l.Tooltip,d({target:s,content:t.tooltip},t.tooltipOptions)))})));return M.displayName="ColorPicker",e.ColorPicker=M,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.overlayservice,primereact.tooltip,primereact.utils,primereact.csstransition,primereact.portal);