primereact 8.7.3 → 9.0.0-beta.1

package/colorpicker/colorpicker.d.ts

@@ -1,61 +1,178 @@
+/**
+ *
+ * ColorPicker is an input component to select a color.
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/colorpicker/)
+ *
+ * @module colorpicker
+ *
+ */
 import * as React from 'react';
 import { CSSTransitionProps } from '../csstransition';
-import TooltipOptions from '../tooltip/tooltipoptions';
-
-type ColorPickerAppendToType = 'self' | HTMLElement | undefined | null;
-
-type ColorPickerFormatType = 'hex' | 'rgb' | 'hsb';
-
-type ColorPickerValueType = string | ColorPickerRGBType | ColorPickerHSBType | undefined;
+import { TooltipOptions } from '../tooltip/tooltipoptions';
+import { FormEvent } from '../ts-helpers';
 
+/**
+ * RGB type of value
+ */
 interface ColorPickerRGBType {
+    /**
+     * red color number
+     */
     r: number;
+    /**
+     * green color number
+     */
     g: number;
+    /**
+     * blue color number
+     */
     b: number;
 }
 
+/**
+ * HSB type of value
+ */
 interface ColorPickerHSBType {
+    /**
+     * hue number
+     */
     h: number;
+    /**
+     * saturation number
+     */
     s: number;
+    /**
+     * brightness number
+     */
     b: number;
 }
 
-interface ColorPickerChangeTargetOptions {
-    name: string;
-    id: string;
-    value: ColorPickerValueType;
-}
-
-interface ColorPickerChangeParams {
-    value: ColorPickerValueType;
-    stopPropagation(): void;
-    preventDefault(): void;
-    target: ColorPickerChangeTargetOptions;
-}
+/**
+ * Custom change event.
+ * @see {@link ColorPickerProps.onChange}
+ * @extends {FormEvent}
+ * @event
+ */
+interface ColorPickerChangeEvent extends FormEvent<string | ColorPickerRGBType | ColorPickerHSBType> {}
 
+/**
+ * Defines valid properties in AutoComplete component. In addition to these, all properties of HTMLInputElement can be used in this component.
+ * @group Properties
+ */
 export interface ColorPickerProps extends Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, 'onChange' | 'value' | 'ref'> {
-    appendTo?: ColorPickerAppendToType;
-    children?: React.ReactNode;
-    defaultColor?: string;
-    format?: string;
-    inline?: boolean;
-    inputId?: string;
-    inputRef?: React.Ref<HTMLInputElement>;
+    /**
+     * DOM element instance where the overlay panel should be mounted. Valid values are any DOM Element and "self". The "self" value is used to render a component where it is located.
+     * @defaultValue document.body
+     */
+    appendTo?: 'self' | HTMLElement | undefined | null;
+    /**
+     * Default color to display when value is null.
+     * @defaultValue ff0000
+     */
+    defaultColor?: string | undefined;
+    /**
+     * Format to use in value binding.
+     * @defaultValue hex
+     */
+    format?: 'hex' | 'rgb' | 'hsb' | undefined;
+    /**
+     * Whether to display as an overlay or not.
+     * @defaultValue false
+     */
+    inline?: boolean | undefined;
+    /**
+     * Identifier of the focus input to match a label defined for the dropdown.
+     */
+    inputId?: string | undefined;
+    /**
+     * Reference of the input element.
+     */
+    inputRef?: React.Ref<HTMLInputElement> | undefined;
+    /**
+     * Style class of the overlay panel.
+     */
     panelClassName?: string | undefined;
+    /**
+     * Inline style of the overlay panel.
+     */
     panelStyle?: React.CSSProperties | undefined;
-    tooltip?: string;
-    tooltipOptions?: TooltipOptions;
-    transitionOptions?: CSSTransitionProps;
-    value?: ColorPickerValueType;
-    onChange?(e: ColorPickerChangeParams): void;
+    /**
+     * Content of the tooltip.
+     */
+    tooltip?: string | undefined;
+    /**
+     * Configuration of the tooltip, refer to the tooltip documentation for more information.
+     * @type {TooltipOptions}
+     */
+    tooltipOptions?: TooltipOptions | undefined;
+    /**
+     * The properties of CSSTransition can be customized, except for "nodeRef" and "in" properties.
+     * @type {CSSTransitionProps}
+     */
+    transitionOptions?: CSSTransitionProps | undefined;
+    /**
+     * Value of the component.
+     * @type {string | ColorPickerRGBType | ColorPickerHSBType}
+     */
+    value?: string | ColorPickerRGBType | ColorPickerHSBType | undefined;
+    /**
+     * Callback to invoke when a color is selected.
+     * @param {ColorPickerChangeEvent} event - Custom change event.
+     */
+    onChange?(event: ColorPickerChangeEvent): void;
+    /**
+     * Callback to invoke when overlay panel becomes visible.
+     */
     onShow?(): void;
+    /**
+     * Callback to invoke when overlay panel becomes hidden.
+     */
     onHide?(): void;
+    /**
+     * Used to get the child elements of the component.
+     * @readonly
+     */
+    children?: React.ReactNode | undefined;
 }
 
+/**
+ * **PrimeReact - ColorPicker**
+ *
+ * _ColorPicker is an input component to select a color._
+ *
+ * [Live Demo](https://www.primefaces.org/primereact/colorpicker/)
+ * --- ---
+ * ![PrimeReact](https://www.primefaces.org/primereact/images/logo-100.png)
+ *
+ * @group Component
+ */
 export declare class ColorPicker extends React.Component<ColorPickerProps, any> {
+    /**
+     * Used to show the overlay.
+     */
     public show(): void;
+    /**
+     * Used to hide the overlay.
+     */
     public hide(): void;
+    /**
+     * Used to focus the component.
+     */
+    public focus(): void;
+    /**
+     * Used to get container element.
+     * @return {HTMLDivElement} Container element
+     */
     public getElement(): HTMLDivElement;
+    /**
+     * Used to get input element.
+     * @return {HTMLInputElement} Input element
+     */
     public getInput(): HTMLInputElement;
+    /**
+     * Used to get overlay element.
+     * @return {HTMLElement} Overlay element
+     */
     public getOverlay(): HTMLElement;
 }

package/colorpicker/colorpicker.esm.js

@@ -85,7 +85,9 @@ var ColorPickerPanel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var createElement = function createElement() {
     var className = classNames('p-colorpicker-panel', props.panelClassName, {
       'p-colorpicker-overlay-panel': !props.inline,
-      'p-disabled': props.disabled
+      'p-disabled': props.disabled,
+      'p-input-filled': PrimeReact.inputStyle === 'filled',
+      'p-ripple-disabled': PrimeReact.ripple === false
     });
     return /*#__PURE__*/React.createElement(CSSTransition, {
       nodeRef: ref,
@@ -503,6 +505,9 @@ var ColorPicker = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functio
       props: props,
       show: show,
       hide: hide,
+      focus: function focus() {
+        return DomHandler.focus(inputRef.current);
+      },
       getElement: function getElement() {
         return elementRef.current;
       },

package/colorpicker/colorpicker.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import n from"primereact/api";import{useOverlayListener as t,useEventListener as r,useMountEffect as o,useUpdateEffect as a,useUnmountEffect as l}from"primereact/hooks";import{OverlayService as i}from"primereact/overlayservice";import{Tooltip as c}from"primereact/tooltip";import{classNames as u,DomHandler as s,ObjectUtils as f,ZIndexUtils as p}from"primereact/utils";import{CSSTransition as d}from"primereact/csstransition";import{Portal as m}from"primereact/portal";function h(){return h=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},h.apply(this,arguments)}function g(e){if(Array.isArray(e))return e}function b(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,a,l,i=[],c=!0,u=!1;try{if(a=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;c=!1}else for(;!(c=(r=a.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&&(l=t.return(),Object(l)!==l))return}finally{if(u)throw o}}return i}}function v(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 y(e,n){if(e){if("string"==typeof e)return v(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)?v(e,n):void 0}}function E(){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 k(e,n){return g(e)||b(e,n)||y(e,n)||E()}var x=e.forwardRef((function(n,t){var r,o=(r=u("p-colorpicker-panel",n.panelClassName,{"p-colorpicker-overlay-panel":!n.inline,"p-disabled":n.disabled}),e.createElement(d,{nodeRef:t,classNames:"p-connected-overlay",in:n.in,timeout:{enter:120,exit:100},options:n.transitionOptions,unmountOnExit:!0,onEnter:n.onEnter,onEntered:n.onEntered,onExit:n.onExit,onExited:n.onExited},e.createElement("div",{ref:t,className:r,style:n.panelStyle,onClick:n.onClick},n.children)));return n.inline?o:e.createElement(m,{element:o,appendTo:n.appendTo})}));x.displayName="ColorPickerPanel";var M=e.memo(e.forwardRef((function(d,m){var g=k(e.useState(!1),2),b=g[0],v=g[1],y=e.useRef(null),E=e.useRef(null),C=e.useRef(d.inputRef),w=e.useRef(null),T=e.useRef(null),O=e.useRef(null),R=e.useRef(null),N=e.useRef(!1),S=e.useRef(null),I=e.useRef(!1),D=k(t({target:y,overlay:E,listener:function(e,n){n.valid&&le()},when:b}),2),P=D[0],j=D[1],Y=k(r({type:"mousemove",listener:function(e){I.current&&J(e),N.current&&F(e)}}),2),A=Y[0],H=Y[1],K=k(r({type:"mouseup",listener:function(){I.current=N.current=!1,s.removeClass(y.current,"p-colorpicker-dragging"),H(),X()}}),2),B=K[0],X=K[1],_=function(e){d.disabled||(q(),z(e))},z=function(e){d.disabled||(N.current=!0,F(e),s.addClass(y.current,"p-colorpicker-dragging"))},F=function(e){var n=R.current.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);S.current=se({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150),s:100,b:100}),ne(),re(),Q()},L=function(e){d.disabled||(q(),U(e))},U=function(e){d.disabled||(I.current=!0,J(e),s.addClass(y.current,"p-colorpicker-dragging"),e.preventDefault())},Z=function(e){I.current&&(J(e),e.preventDefault()),N.current&&(F(e),e.preventDefault())},$=function(){I.current=!1,N.current=!1,s.removeClass(y.current,"p-colorpicker-dragging"),G()},q=function(){A(),B()},G=function(){H(),X()},J=function(e){var n=w.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),a=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150);S.current=se({h:S.current.h,s:o,b:a}),te(),oe(),Q()},Q=function(){switch(d.format){case"hex":ee(ge(S.current));break;case"rgb":ee(me(S.current));break;case"hsb":ee(S.current)}},V=function(e){var n;if(e)switch(d.format){case"hex":n=pe(e);break;case"rgb":n=de(e);break;case"hsb":n=e}else n=pe(d.defaultColor);return n},W=function(e){S.current=V(e)},ee=function(e){d.onChange&&d.onChange({value:e,stopPropagation:function(){},preventDefault:function(){},target:{name:d.name,id:d.id,value:e}})},ne=function(){if(w.current){var e=se({h:S.current.h,s:100,b:100});w.current.style.backgroundColor="#"+ge(e)}},te=function(){T.current&&(T.current.style.left=Math.floor(150*S.current.s/100)+"px",T.current.style.top=Math.floor(150*(100-S.current.b)/100)+"px")},re=function(){O.current&&(O.current.style.top=Math.floor(150-150*S.current.h/360)+"px")},oe=function(){C.current&&(C.current.style.backgroundColor="#"+ge(S.current))},ae=function(){v(!0)},le=function(){v(!1)},ie=function(){ce()},ce=function(){b?le():ae()},ue=function(e){switch(e.which){case 32:ce(),e.preventDefault();break;case 27:case 9:le()}},se=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))}},fe=function(e){var n=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:n>>16,g:(65280&n)>>8,b:255&n}},pe=function(e){return de(fe(e))},de=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},me=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 a=o,l=(255-r)*o/255,i=t%60*(a-l)/60;360===t&&(t=0),t<60?(n.r=a,n.b=l,n.g=l+i):t<120?(n.g=a,n.b=l,n.r=a-i):t<180?(n.g=a,n.r=l,n.b=l+i):t<240?(n.b=a,n.r=l,n.g=a-i):t<300?(n.b=a,n.g=l,n.r=l+i):t<360?(n.r=a,n.g=l,n.b=a-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)}},he=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("")},ge=function(e){return he(me(e))},be=function(){re(),te(),oe(),ne()},ve=function(){C.current&&s.alignOverlay(E.current,C.current.parentElement,d.appendTo||n.appendTo)};e.useImperativeHandle(m,(function(){return{props:d,show:ae,hide:le,getElement:function(){return y.current},getOverlay:function(){return E.current},getInput:function(){return C.current}}})),e.useEffect((function(){f.combinedRefs(C,d.inputRef)}),[C,d.inputRef]),o((function(){W(d.value),be()})),a((function(){I.current||N.current||W(d.value)}),[d.value]),a((function(){be()})),l((function(){p.clear(E.current)}));var ye=f.isNotEmpty(d.tooltip),Ee=f.findDiffKeys(d,M.defaultProps),ke=u("p-colorpicker p-component",{"p-colorpicker-overlay":!d.inline},d.className),xe=e.createElement("div",{className:"p-colorpicker-content"},e.createElement("div",{ref:w,className:"p-colorpicker-color-selector",onMouseDown:L,onTouchStart:U,onTouchMove:Z,onTouchEnd:$},e.createElement("div",{className:"p-colorpicker-color"},e.createElement("div",{ref:T,className:"p-colorpicker-color-handle"}))),e.createElement("div",{ref:R,className:"p-colorpicker-hue",onMouseDown:_,onTouchStart:z,onTouchMove:Z,onTouchEnd:$},e.createElement("div",{ref:O,className:"p-colorpicker-hue-handle"}))),Me=function(){if(!d.inline){var n=u("p-colorpicker-preview p-inputtext",{"p-disabled":d.disabled}),t=f.findDiffKeys(d,M.defaultProps);return e.createElement("input",h({ref:C,type:"text",className:n,readOnly:!0,id:d.inputId,tabIndex:d.tabIndex,disabled:d.disabled,onClick:ie,onKeyDown:ue},t))}return null}();return e.createElement(e.Fragment,null,e.createElement("div",h({ref:y,id:d.id,style:d.style,className:ke},Ee),Me,e.createElement(x,{ref:E,appendTo:d.appendTo,inline:d.inline,disabled:d.disabled,panelStyle:d.panelStyle,panelClassName:d.panelClassName,onClick:function(e){d.inline||i.emit("overlay-click",{originalEvent:e,target:y.current})},in:d.inline||b,onEnter:function(){p.set("overlay",E.current,n.autoZIndex,n.zIndex.overlay),ve()},onEntered:function(){P(),d.onShow&&d.onShow()},onExit:function(){j()},onExited:function(){p.clear(E.current),d.onHide&&d.onHide()},transitionOptions:d.transitionOptions},xe)),ye&&e.createElement(c,h({target:y,content:d.tooltip},d.tooltipOptions)))})));M.displayName="ColorPicker",M.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};export{M as ColorPicker};
+import*as e from"react";import n from"primereact/api";import{useOverlayListener as t,useEventListener as r,useMountEffect as o,useUpdateEffect as l,useUnmountEffect as a}from"primereact/hooks";import{OverlayService as i}from"primereact/overlayservice";import{Tooltip as c}from"primereact/tooltip";import{classNames as u,DomHandler as s,ObjectUtils as p,ZIndexUtils as f}from"primereact/utils";import{CSSTransition as d}from"primereact/csstransition";import{Portal as m}from"primereact/portal";function h(){return h=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},h.apply(this,arguments)}function g(e){if(Array.isArray(e))return e}function b(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 v(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 y(e,n){if(e){if("string"==typeof e)return v(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)?v(e,n):void 0}}function E(){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 k(e,n){return g(e)||b(e,n)||y(e,n)||E()}var x=e.forwardRef((function(t,r){var o,l=(o=u("p-colorpicker-panel",t.panelClassName,{"p-colorpicker-overlay-panel":!t.inline,"p-disabled":t.disabled,"p-input-filled":"filled"===n.inputStyle,"p-ripple-disabled":!1===n.ripple}),e.createElement(d,{nodeRef:r,classNames:"p-connected-overlay",in:t.in,timeout:{enter:120,exit:100},options:t.transitionOptions,unmountOnExit:!0,onEnter:t.onEnter,onEntered:t.onEntered,onExit:t.onExit,onExited:t.onExited},e.createElement("div",{ref:r,className:o,style:t.panelStyle,onClick:t.onClick},t.children)));return t.inline?l:e.createElement(m,{element:l,appendTo:t.appendTo})}));x.displayName="ColorPickerPanel";var M=e.memo(e.forwardRef((function(d,m){var g=k(e.useState(!1),2),b=g[0],v=g[1],y=e.useRef(null),E=e.useRef(null),C=e.useRef(d.inputRef),w=e.useRef(null),T=e.useRef(null),O=e.useRef(null),R=e.useRef(null),N=e.useRef(!1),S=e.useRef(null),I=e.useRef(!1),D=k(t({target:y,overlay:E,listener:function(e,n){n.valid&&ae()},when:b}),2),P=D[0],j=D[1],Y=k(r({type:"mousemove",listener:function(e){I.current&&J(e),N.current&&F(e)}}),2),A=Y[0],H=Y[1],K=k(r({type:"mouseup",listener:function(){I.current=N.current=!1,s.removeClass(y.current,"p-colorpicker-dragging"),H(),X()}}),2),B=K[0],X=K[1],_=function(e){d.disabled||(q(),z(e))},z=function(e){d.disabled||(N.current=!0,F(e),s.addClass(y.current,"p-colorpicker-dragging"))},F=function(e){var n=R.current.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);S.current=se({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150),s:100,b:100}),ne(),re(),Q()},L=function(e){d.disabled||(q(),U(e))},U=function(e){d.disabled||(I.current=!0,J(e),s.addClass(y.current,"p-colorpicker-dragging"),e.preventDefault())},Z=function(e){I.current&&(J(e),e.preventDefault()),N.current&&(F(e),e.preventDefault())},$=function(){I.current=!1,N.current=!1,s.removeClass(y.current,"p-colorpicker-dragging"),G()},q=function(){A(),B()},G=function(){H(),X()},J=function(e){var n=w.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);S.current=se({h:S.current.h,s:o,b:l}),te(),oe(),Q()},Q=function(){switch(d.format){case"hex":ee(ge(S.current));break;case"rgb":ee(me(S.current));break;case"hsb":ee(S.current)}},V=function(e){var n;if(e)switch(d.format){case"hex":n=fe(e);break;case"rgb":n=de(e);break;case"hsb":n=e}else n=fe(d.defaultColor);return n},W=function(e){S.current=V(e)},ee=function(e){d.onChange&&d.onChange({value:e,stopPropagation:function(){},preventDefault:function(){},target:{name:d.name,id:d.id,value:e}})},ne=function(){if(w.current){var e=se({h:S.current.h,s:100,b:100});w.current.style.backgroundColor="#"+ge(e)}},te=function(){T.current&&(T.current.style.left=Math.floor(150*S.current.s/100)+"px",T.current.style.top=Math.floor(150*(100-S.current.b)/100)+"px")},re=function(){O.current&&(O.current.style.top=Math.floor(150-150*S.current.h/360)+"px")},oe=function(){C.current&&(C.current.style.backgroundColor="#"+ge(S.current))},le=function(){v(!0)},ae=function(){v(!1)},ie=function(){ce()},ce=function(){b?ae():le()},ue=function(e){switch(e.which){case 32:ce(),e.preventDefault();break;case 27:case 9:ae()}},se=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))}},pe=function(e){var n=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:n>>16,g:(65280&n)>>8,b:255&n}},fe=function(e){return de(pe(e))},de=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},me=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)}},he=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("")},ge=function(e){return he(me(e))},be=function(){re(),te(),oe(),ne()},ve=function(){C.current&&s.alignOverlay(E.current,C.current.parentElement,d.appendTo||n.appendTo)};e.useImperativeHandle(m,(function(){return{props:d,show:le,hide:ae,focus:function(){return s.focus(C.current)},getElement:function(){return y.current},getOverlay:function(){return E.current},getInput:function(){return C.current}}})),e.useEffect((function(){p.combinedRefs(C,d.inputRef)}),[C,d.inputRef]),o((function(){W(d.value),be()})),l((function(){I.current||N.current||W(d.value)}),[d.value]),l((function(){be()})),a((function(){f.clear(E.current)}));var ye=p.isNotEmpty(d.tooltip),Ee=p.findDiffKeys(d,M.defaultProps),ke=u("p-colorpicker p-component",{"p-colorpicker-overlay":!d.inline},d.className),xe=e.createElement("div",{className:"p-colorpicker-content"},e.createElement("div",{ref:w,className:"p-colorpicker-color-selector",onMouseDown:L,onTouchStart:U,onTouchMove:Z,onTouchEnd:$},e.createElement("div",{className:"p-colorpicker-color"},e.createElement("div",{ref:T,className:"p-colorpicker-color-handle"}))),e.createElement("div",{ref:R,className:"p-colorpicker-hue",onMouseDown:_,onTouchStart:z,onTouchMove:Z,onTouchEnd:$},e.createElement("div",{ref:O,className:"p-colorpicker-hue-handle"}))),Me=function(){if(!d.inline){var n=u("p-colorpicker-preview p-inputtext",{"p-disabled":d.disabled}),t=p.findDiffKeys(d,M.defaultProps);return e.createElement("input",h({ref:C,type:"text",className:n,readOnly:!0,id:d.inputId,tabIndex:d.tabIndex,disabled:d.disabled,onClick:ie,onKeyDown:ue},t))}return null}();return e.createElement(e.Fragment,null,e.createElement("div",h({ref:y,id:d.id,style:d.style,className:ke},Ee),Me,e.createElement(x,{ref:E,appendTo:d.appendTo,inline:d.inline,disabled:d.disabled,panelStyle:d.panelStyle,panelClassName:d.panelClassName,onClick:function(e){d.inline||i.emit("overlay-click",{originalEvent:e,target:y.current})},in:d.inline||b,onEnter:function(){f.set("overlay",E.current,n.autoZIndex,n.zIndex.overlay),ve()},onEntered:function(){P(),d.onShow&&d.onShow()},onExit:function(){j()},onExited:function(){f.clear(E.current),d.onHide&&d.onHide()},transitionOptions:d.transitionOptions},xe)),ye&&e.createElement(c,h({target:y,content:d.tooltip},d.tooltipOptions)))})));M.displayName="ColorPicker",M.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};export{M as ColorPicker};

package/colorpicker/colorpicker.js

@@ -103,7 +103,9 @@ this.primereact.colorpicker = (function (exports, React, PrimeReact, hooks, over
     var createElement = function createElement() {
       var className = utils.classNames('p-colorpicker-panel', props.panelClassName, {
         'p-colorpicker-overlay-panel': !props.inline,
-        'p-disabled': props.disabled
+        'p-disabled': props.disabled,
+        'p-input-filled': PrimeReact__default["default"].inputStyle === 'filled',
+        'p-ripple-disabled': PrimeReact__default["default"].ripple === false
       });
       return /*#__PURE__*/React__namespace.createElement(csstransition.CSSTransition, {
         nodeRef: ref,
@@ -521,6 +523,9 @@ this.primereact.colorpicker = (function (exports, React, PrimeReact, hooks, over
         props: props,
         show: show,
         hide: hide,
+        focus: function focus() {
+          return utils.DomHandler.focus(inputRef.current);
+        },
         getElement: function getElement() {
           return elementRef.current;
         },

package/colorpicker/colorpicker.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.colorpicker=function(e,n,t,r,o,a,l,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,a,l,i=[],c=!0,u=!1;try{if(a=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;c=!1}else for(;!(c=(r=a.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&&(l=t.return(),Object(l)!==l))return}finally{if(u)throw o}}return i}}function b(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 g(e,n){if(e){if("string"==typeof e)return b(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)?b(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)||g(e,n)||v()}var E=f.forwardRef((function(e,n){var t,r=(t=l.classNames("p-colorpicker-panel",e.panelClassName,{"p-colorpicker-overlay-panel":!e.inline,"p-disabled":e.disabled}),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})}));E.displayName="ColorPickerPanel";var k=f.memo(f.forwardRef((function(e,n){var t=y(f.useState(!1),2),i=t[0],c=t[1],u=f.useRef(null),s=f.useRef(null),m=f.useRef(e.inputRef),h=f.useRef(null),b=f.useRef(null),g=f.useRef(null),v=f.useRef(null),M=f.useRef(!1),O=f.useRef(null),x=f.useRef(!1),C=y(r.useOverlayListener({target:u,overlay:s,listener:function(e,n){n.valid&&W()},when:i}),2),w=C[0],T=C[1],N=y(r.useEventListener({type:"mousemove",listener:function(e){x.current&&z(e),M.current&&H(e)}}),2),R=N[0],S=N[1],j=y(r.useEventListener({type:"mouseup",listener:function(){x.current=M.current=!1,l.DomHandler.removeClass(u.current,"p-colorpicker-dragging"),S(),I()}}),2),D=j[0],I=j[1],P=function(n){e.disabled||(Z(),U(n))},U=function(n){e.disabled||(M.current=!0,H(n),l.DomHandler.addClass(u.current,"p-colorpicker-dragging"))},H=function(e){var n=v.current.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);O.current=re({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150),s:100,b:100}),q(),J(),B()},Y=function(n){e.disabled||(Z(),A(n))},A=function(n){e.disabled||(x.current=!0,z(n),l.DomHandler.addClass(u.current,"p-colorpicker-dragging"),n.preventDefault())},_=function(e){x.current&&(z(e),e.preventDefault()),M.current&&(H(e),e.preventDefault())},L=function(){x.current=!1,M.current=!1,l.DomHandler.removeClass(u.current,"p-colorpicker-dragging"),K()},Z=function(){R(),D()},K=function(){S(),I()},z=function(e){var n=h.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),a=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150);O.current=re({h:O.current.h,s:o,b:a}),G(),Q(),B()},B=function(){switch(e.format){case"hex":$(ue(O.current));break;case"rgb":$(ie(O.current));break;case"hsb":$(O.current)}},X=function(n){var t;if(n)switch(e.format){case"hex":t=ae(n);break;case"rgb":t=le(n);break;case"hsb":t=n}else t=ae(e.defaultColor);return t},F=function(e){O.current=X(e)},$=function(n){e.onChange&&e.onChange({value:n,stopPropagation:function(){},preventDefault:function(){},target:{name:e.name,id:e.id,value:n}})},q=function(){if(h.current){var e=re({h:O.current.h,s:100,b:100});h.current.style.backgroundColor="#"+ue(e)}},G=function(){b.current&&(b.current.style.left=Math.floor(150*O.current.s/100)+"px",b.current.style.top=Math.floor(150*(100-O.current.b)/100)+"px")},J=function(){g.current&&(g.current.style.top=Math.floor(150-150*O.current.h/360)+"px")},Q=function(){m.current&&(m.current.style.backgroundColor="#"+ue(O.current))},V=function(){c(!0)},W=function(){c(!1)},ee=function(){ne()},ne=function(){i?W():V()},te=function(e){switch(e.which){case 32:ne(),e.preventDefault();break;case 27:case 9:W()}},re=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))}},oe=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 le(oe(e))},le=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},ie=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 a=o,l=(255-r)*o/255,i=t%60*(a-l)/60;360===t&&(t=0),t<60?(n.r=a,n.b=l,n.g=l+i):t<120?(n.g=a,n.b=l,n.r=a-i):t<180?(n.g=a,n.r=l,n.b=l+i):t<240?(n.b=a,n.r=l,n.g=a-i):t<300?(n.b=a,n.g=l,n.r=l+i):t<360?(n.r=a,n.g=l,n.b=a-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)}},ce=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("")},ue=function(e){return ce(ie(e))},se=function(){J(),G(),Q(),q()},fe=function(){m.current&&l.DomHandler.alignOverlay(s.current,m.current.parentElement,e.appendTo||p.default.appendTo)};f.useImperativeHandle(n,(function(){return{props:e,show:V,hide:W,getElement:function(){return u.current},getOverlay:function(){return s.current},getInput:function(){return m.current}}})),f.useEffect((function(){l.ObjectUtils.combinedRefs(m,e.inputRef)}),[m,e.inputRef]),r.useMountEffect((function(){F(e.value),se()})),r.useUpdateEffect((function(){x.current||M.current||F(e.value)}),[e.value]),r.useUpdateEffect((function(){se()})),r.useUnmountEffect((function(){l.ZIndexUtils.clear(s.current)}));var pe=l.ObjectUtils.isNotEmpty(e.tooltip),de=l.ObjectUtils.findDiffKeys(e,k.defaultProps),me=l.classNames("p-colorpicker p-component",{"p-colorpicker-overlay":!e.inline},e.className),he=f.createElement("div",{className:"p-colorpicker-content"},f.createElement("div",{ref:h,className:"p-colorpicker-color-selector",onMouseDown:Y,onTouchStart:A,onTouchMove:_,onTouchEnd:L},f.createElement("div",{className:"p-colorpicker-color"},f.createElement("div",{ref:b,className:"p-colorpicker-color-handle"}))),f.createElement("div",{ref:v,className:"p-colorpicker-hue",onMouseDown:P,onTouchStart:U,onTouchMove:_,onTouchEnd:L},f.createElement("div",{ref:g,className:"p-colorpicker-hue-handle"}))),be=function(){if(!e.inline){var n=l.classNames("p-colorpicker-preview p-inputtext",{"p-disabled":e.disabled}),t=l.ObjectUtils.findDiffKeys(e,k.defaultProps);return f.createElement("input",d({ref:m,type:"text",className:n,readOnly:!0,id:e.inputId,tabIndex:e.tabIndex,disabled:e.disabled,onClick:ee,onKeyDown:te},t))}return null}();return f.createElement(f.Fragment,null,f.createElement("div",d({ref:u,id:e.id,style:e.style,className:me},de),be,f.createElement(E,{ref:s,appendTo:e.appendTo,inline:e.inline,disabled:e.disabled,panelStyle:e.panelStyle,panelClassName:e.panelClassName,onClick:function(n){e.inline||o.OverlayService.emit("overlay-click",{originalEvent:n,target:u.current})},in:e.inline||i,onEnter:function(){l.ZIndexUtils.set("overlay",s.current,p.default.autoZIndex,p.default.zIndex.overlay),fe()},onEntered:function(){w(),e.onShow&&e.onShow()},onExit:function(){T()},onExited:function(){l.ZIndexUtils.clear(s.current),e.onHide&&e.onHide()},transitionOptions:e.transitionOptions},he)),pe&&f.createElement(a.Tooltip,d({target:u,content:e.tooltip},e.tooltipOptions)))})));return k.displayName="ColorPicker",k.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},e.ColorPicker=k,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.overlayservice,primereact.tooltip,primereact.utils,primereact.csstransition,primereact.portal);
+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 b(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 g(e,n){if(e){if("string"==typeof e)return b(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)?b(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)||g(e,n)||v()}var E=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})}));E.displayName="ColorPickerPanel";var k=f.memo(f.forwardRef((function(e,n){var t=y(f.useState(!1),2),i=t[0],c=t[1],u=f.useRef(null),s=f.useRef(null),m=f.useRef(e.inputRef),h=f.useRef(null),b=f.useRef(null),g=f.useRef(null),v=f.useRef(null),M=f.useRef(!1),O=f.useRef(null),x=f.useRef(!1),C=y(r.useOverlayListener({target:u,overlay:s,listener:function(e,n){n.valid&&W()},when:i}),2),w=C[0],T=C[1],N=y(r.useEventListener({type:"mousemove",listener:function(e){x.current&&z(e),M.current&&H(e)}}),2),S=N[0],R=N[1],j=y(r.useEventListener({type:"mouseup",listener:function(){x.current=M.current=!1,a.DomHandler.removeClass(u.current,"p-colorpicker-dragging"),R(),I()}}),2),D=j[0],I=j[1],P=function(n){e.disabled||(Z(),U(n))},U=function(n){e.disabled||(M.current=!0,H(n),a.DomHandler.addClass(u.current,"p-colorpicker-dragging"))},H=function(e){var n=v.current.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);O.current=re({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150),s:100,b:100}),q(),J(),B()},Y=function(n){e.disabled||(Z(),A(n))},A=function(n){e.disabled||(x.current=!0,z(n),a.DomHandler.addClass(u.current,"p-colorpicker-dragging"),n.preventDefault())},_=function(e){x.current&&(z(e),e.preventDefault()),M.current&&(H(e),e.preventDefault())},L=function(){x.current=!1,M.current=!1,a.DomHandler.removeClass(u.current,"p-colorpicker-dragging"),K()},Z=function(){S(),D()},K=function(){R(),I()},z=function(e){var n=h.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);O.current=re({h:O.current.h,s:o,b:l}),G(),Q(),B()},B=function(){switch(e.format){case"hex":$(ue(O.current));break;case"rgb":$(ie(O.current));break;case"hsb":$(O.current)}},X=function(n){var t;if(n)switch(e.format){case"hex":t=le(n);break;case"rgb":t=ae(n);break;case"hsb":t=n}else t=le(e.defaultColor);return t},F=function(e){O.current=X(e)},$=function(n){e.onChange&&e.onChange({value:n,stopPropagation:function(){},preventDefault:function(){},target:{name:e.name,id:e.id,value:n}})},q=function(){if(h.current){var e=re({h:O.current.h,s:100,b:100});h.current.style.backgroundColor="#"+ue(e)}},G=function(){b.current&&(b.current.style.left=Math.floor(150*O.current.s/100)+"px",b.current.style.top=Math.floor(150*(100-O.current.b)/100)+"px")},J=function(){g.current&&(g.current.style.top=Math.floor(150-150*O.current.h/360)+"px")},Q=function(){m.current&&(m.current.style.backgroundColor="#"+ue(O.current))},V=function(){c(!0)},W=function(){c(!1)},ee=function(){ne()},ne=function(){i?W():V()},te=function(e){switch(e.which){case 32:ne(),e.preventDefault();break;case 27:case 9:W()}},re=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))}},oe=function(e){var n=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:n>>16,g:(65280&n)>>8,b:255&n}},le=function(e){return ae(oe(e))},ae=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},ie=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)}},ce=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("")},ue=function(e){return ce(ie(e))},se=function(){J(),G(),Q(),q()},fe=function(){m.current&&a.DomHandler.alignOverlay(s.current,m.current.parentElement,e.appendTo||p.default.appendTo)};f.useImperativeHandle(n,(function(){return{props:e,show:V,hide:W,focus:function(){return a.DomHandler.focus(m.current)},getElement:function(){return u.current},getOverlay:function(){return s.current},getInput:function(){return m.current}}})),f.useEffect((function(){a.ObjectUtils.combinedRefs(m,e.inputRef)}),[m,e.inputRef]),r.useMountEffect((function(){F(e.value),se()})),r.useUpdateEffect((function(){x.current||M.current||F(e.value)}),[e.value]),r.useUpdateEffect((function(){se()})),r.useUnmountEffect((function(){a.ZIndexUtils.clear(s.current)}));var pe=a.ObjectUtils.isNotEmpty(e.tooltip),de=a.ObjectUtils.findDiffKeys(e,k.defaultProps),me=a.classNames("p-colorpicker p-component",{"p-colorpicker-overlay":!e.inline},e.className),he=f.createElement("div",{className:"p-colorpicker-content"},f.createElement("div",{ref:h,className:"p-colorpicker-color-selector",onMouseDown:Y,onTouchStart:A,onTouchMove:_,onTouchEnd:L},f.createElement("div",{className:"p-colorpicker-color"},f.createElement("div",{ref:b,className:"p-colorpicker-color-handle"}))),f.createElement("div",{ref:v,className:"p-colorpicker-hue",onMouseDown:P,onTouchStart:U,onTouchMove:_,onTouchEnd:L},f.createElement("div",{ref:g,className:"p-colorpicker-hue-handle"}))),be=function(){if(!e.inline){var n=a.classNames("p-colorpicker-preview p-inputtext",{"p-disabled":e.disabled}),t=a.ObjectUtils.findDiffKeys(e,k.defaultProps);return f.createElement("input",d({ref:m,type:"text",className:n,readOnly:!0,id:e.inputId,tabIndex:e.tabIndex,disabled:e.disabled,onClick:ee,onKeyDown:te},t))}return null}();return f.createElement(f.Fragment,null,f.createElement("div",d({ref:u,id:e.id,style:e.style,className:me},de),be,f.createElement(E,{ref:s,appendTo:e.appendTo,inline:e.inline,disabled:e.disabled,panelStyle:e.panelStyle,panelClassName:e.panelClassName,onClick:function(n){e.inline||o.OverlayService.emit("overlay-click",{originalEvent:n,target:u.current})},in:e.inline||i,onEnter:function(){a.ZIndexUtils.set("overlay",s.current,p.default.autoZIndex,p.default.zIndex.overlay),fe()},onEntered:function(){w(),e.onShow&&e.onShow()},onExit:function(){T()},onExited:function(){a.ZIndexUtils.clear(s.current),e.onHide&&e.onHide()},transitionOptions:e.transitionOptions},he)),pe&&f.createElement(l.Tooltip,d({target:u,content:e.tooltip},e.tooltipOptions)))})));return k.displayName="ColorPicker",k.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},e.ColorPicker=k,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.hooks,primereact.overlayservice,primereact.tooltip,primereact.utils,primereact.csstransition,primereact.portal);