Socket
Socket
Sign inDemoInstall

@uiw/react-color

Package Overview
Dependencies
Maintainers
2
Versions
81
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@uiw/react-color - npm Package Compare versions

Comparing version 1.2.2 to 1.2.3

2

dist/color.min.js
/*! For license information please see color.min.js.LICENSE.txt */
!function(e,r){"object"===typeof exports&&"object"===typeof module?module.exports=r(require("react")):"function"===typeof define&&define.amd?define(["react"],r):"object"===typeof exports?exports["@uiw/react-color"]=r(require("react")):e["@uiw/react-color"]=r(e.React)}(self,(e=>(()=>{"use strict";var r={858:(e,r,t)=>{var o=t(787),a=Symbol.for("react.element"),s=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,l=o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,i={key:!0,ref:!0,__self:!0,__source:!0};function d(e,r,t){var o,s={},d=null,p=null;for(o in void 0!==t&&(d=""+t),void 0!==r.key&&(d=""+r.key),void 0!==r.ref&&(p=r.ref),r)n.call(r,o)&&!i.hasOwnProperty(o)&&(s[o]=r[o]);if(e&&e.defaultProps)for(o in r=e.defaultProps)void 0===s[o]&&(s[o]=r[o]);return{$$typeof:a,type:e,key:d,ref:p,props:s,_owner:l.current}}r.jsx=d,r.jsxs=d},664:(e,r,t)=>{e.exports=t(858)},787:r=>{r.exports=e}},t={};function o(e){var a=t[e];if(void 0!==a)return a.exports;var s=t[e]={exports:{}};return r[e](s,s.exports,o),s.exports}o.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return o.d(r,{a:r}),r},o.d=(e,r)=>{for(var t in r)o.o(r,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},o.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),o.r=e=>{"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};return(()=>{function e(){return e=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e},e.apply(this,arguments)}o.r(a),o.d(a,{Alpha:()=>re,BACKGROUND_IMG:()=>K,Block:()=>He,Chrome:()=>Le,ChromeInputType:()=>Te,Circle:()=>$e,Colorful:()=>qe,Compact:()=>We,EditableInput:()=>Ce,EditableInputHSLA:()=>Ne,EditableInputRGBA:()=>Re,Github:()=>ce,GithubPlacement:()=>de,Hue:()=>ve,Material:()=>rr,Pointer:()=>$,Saturation:()=>fe,ShadeSlider:()=>ar,Sketch:()=>hr,Slider:()=>lr,Swatch:()=>ae,Wheel:()=>wr,color:()=>I,equalColorObjects:()=>r,equalColorString:()=>t,equalHex:()=>s,getContrastingColor:()=>l,hexToHsva:()=>A,hexToRgba:()=>k,hslStringToHsla:()=>f,hslStringToHsva:()=>b,hslaStringToHsva:()=>x,hslaToHsl:()=>F,hslaToHsva:()=>v,hsvStringToHsva:()=>j,hsvaStringToHsva:()=>m,hsvaToHex:()=>D,hsvaToHexa:()=>M,hsvaToHslString:()=>c,hsvaToHsla:()=>y,hsvaToHslaString:()=>u,hsvaToHsv:()=>H,hsvaToHsvString:()=>h,hsvaToHsvaString:()=>g,hsvaToRgbString:()=>T,hsvaToRgba:()=>P,hsvaToRgbaString:()=>E,parseHue:()=>w,rgbStringToHsva:()=>S,rgbaStringToHsva:()=>R,rgbaToHex:()=>B,rgbaToHexa:()=>N,rgbaToHsva:()=>p,rgbaToRgb:()=>L,validHex:()=>n});var r=(e,r)=>{if(e===r)return!0;for(var t in e)if(e[t]!==r[t])return!1;return!0},t=(e,r)=>e.replace(/\s/g,"")===r.replace(/\s/g,""),s=(e,t)=>e.toLowerCase()===t.toLowerCase()||r(k(e),k(t)),n=e=>/^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(e),l=e=>{if(!e)return"#fff";var r=I(e);return(299*r.rgb.r+587*r.rgb.g+114*r.rgb.b)/1e3>=128?"#000":"#fff"},i=255,d=100,p=e=>{var{r:r,g:t,b:o,a:a}=e,s=Math.max(r,t,o),n=s-Math.min(r,t,o),l=n?s===r?(t-o)/n:s===t?2+(o-r)/n:4+(r-t)/n:0;return{h:60*(l<0?l+6:l),s:s?n/s*d:0,v:s/i*d,a:a}},c=e=>{var{h:r,s:t,l:o}=y(e);return"hsl("+r+", "+Math.round(t)+"%, "+Math.round(o)+"%)"},h=e=>{var{h:r,s:t,v:o}=e;return"hsv("+r+", "+t+"%, "+o+"%)"},g=e=>{var{h:r,s:t,v:o,a:a}=e;return"hsva("+r+", "+t+"%, "+o+"%, "+a+")"},u=e=>{var{h:r,s:t,l:o,a:a}=y(e);return"hsla("+r+", "+t+"%, "+o+"%, "+a+")"},f=e=>{var[r,t,o,a]=(e.match(/\d+/g)||[]).map(Number);return{h:r,s:t,l:o,a:a}},x=e=>{var r=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?v({h:w(r[1],r[2]),s:Number(r[3]),l:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?100:1)}):{h:0,s:0,v:0,a:1}},b=x,v=e=>{var{h:r,s:t,l:o,a:a}=e;return{h:r,s:(t*=(o<50?o:d-o)/d)>0?2*t/(o+t)*d:0,v:o+t,a:a}},y=e=>{var{h:r,s:t,v:o,a:a}=e,s=(200-t)*o/d;return{h:r,s:s>0&&s<200?t*o/d/(s<=d?s:200-s)*d:0,l:s/2,a:a}},m=e=>{var r=/hsva?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?{h:w(r[1],r[2]),s:Number(r[3]),v:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?d:1)}:{h:0,s:0,v:0,a:1}},C={grad:.9,turn:360,rad:360/(2*Math.PI)},w=function(e,r){return void 0===r&&(r="deg"),Number(e)*(C[r]||1)},j=m,R=e=>{var r=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?p({r:Number(r[1])/(r[2]?d/i:1),g:Number(r[3])/(r[4]?d/i:1),b:Number(r[5])/(r[6]?d/i:1),a:void 0===r[7]?1:Number(r[7])/(r[8]?d:1)}):{h:0,s:0,v:0,a:1}},S=R,B=e=>{var r,{r:t,g:o,b:a}=e;return"#"+(r=(t<<16|o<<8|a).toString(16),new Array(7-r.length).join("0")+r)},N=e=>{var{r:r,g:t,b:o,a:a}=e,s="number"===typeof a&&(255*a|256).toString(16).slice(1);return""+B({r:r,g:t,b:o,a:a})+(s||"")},A=e=>p(k(e)),k=e=>{var r=e.replace("#","");/^#?/.test(e)&&3===r.length&&(e="#"+r.charAt(0)+r.charAt(0)+r.charAt(1)+r.charAt(1)+r.charAt(2)+r.charAt(2));var t=new RegExp("[A-Za-z0-9]{2}","g"),[o,a,s=0,n]=e.match(t).map((e=>parseInt(e,16)));return{r:o,g:a,b:s,a:n?n/i:1}},P=r=>{var{h:t,s:o,v:a,a:s}=r,n=t/60,l=o/d,p=a/d,c=Math.floor(n)%6,h=n-Math.floor(n),g=i*p*(1-l),u=i*p*(1-l*h),f=i*p*(1-l*(1-h));p*=i;var x={};switch(c){case 0:x.r=p,x.g=f,x.b=g;break;case 1:x.r=u,x.g=p,x.b=g;break;case 2:x.r=g,x.g=p,x.b=f;break;case 3:x.r=g,x.g=u,x.b=p;break;case 4:x.r=f,x.g=g,x.b=p;break;case 5:x.r=p,x.g=g,x.b=u}return x.r=Math.round(x.r),x.g=Math.round(x.g),x.b=Math.round(x.b),e({},x,{a:s})},T=e=>{var{r:r,g:t,b:o}=P(e);return"rgb("+r+", "+t+", "+o+")"},E=e=>{var{r:r,g:t,b:o,a:a}=P(e);return"rgba("+r+", "+t+", "+o+", "+a+")"},L=e=>{var{r:r,g:t,b:o}=e;return{r:r,g:t,b:o}},F=e=>{var{h:r,s:t,l:o}=e;return{h:r,s:t,l:o}},D=e=>B(P(e)),M=e=>N(P(e)),H=e=>{var{h:r,s:t,v:o}=e;return{h:r,s:t,v:o}},I=e=>{var r,t,o,a,s,l,i,d;return"string"===typeof e&&n(e)?(l=A(e),i=e):"string"!==typeof e&&(l=e),l&&(o=H(l),s=y(l),a=P(l),d=N(a),i=D(l),t=F(s),r=L(a)),{rgb:r,hsl:t,hsv:o,rgba:a,hsla:s,hsva:l,hex:i,hexa:d}};function z(e,r){if(null==e)return{};var t,o,a={},s=Object.keys(e);for(o=0;o<s.length;o++)t=s[o],r.indexOf(t)>=0||(a[t]=e[t]);return a}var O=o(787),_=o.n(O);function W(e){var r=(0,O.useRef)(e);return(0,O.useEffect)((()=>{r.current=e})),(0,O.useCallback)(((e,t)=>r.current&&r.current(e,t)),[])}var G=e=>"touches"in e,U=e=>{!G(e)&&e.preventDefault&&e.preventDefault()},X=function(e,r,t){return void 0===r&&(r=0),void 0===t&&(t=1),e>t?t:e<r?r:e},Y=(e,r)=>{var t=e.getBoundingClientRect(),o=G(r)?r.touches[0]:r;return{left:X((o.pageX-(t.left+window.pageXOffset))/t.width),top:X((o.pageY-(t.top+window.pageYOffset))/t.height),width:t.width,height:t.height,x:o.pageX-(t.left+window.pageXOffset),y:o.pageY-(t.top+window.pageYOffset)}},q=o(664),V=["prefixCls","className","onMove","onDown"],Q=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-interactive",className:a,onMove:s,onDown:n}=r,l=z(r,V),i=(0,O.useRef)(null),d=(0,O.useRef)(!1),[p,c]=(0,O.useState)(!1),h=W(s),g=W(n),u=(0,O.useCallback)((e=>{U(e),(G(e)?e.touches.length>0:e.buttons>0)&&i.current?h&&h(Y(i.current,e),e):c(!1)}),[h]),f=(0,O.useCallback)((()=>c(!1)),[]),x=(0,O.useCallback)((e=>{var r=e?window.addEventListener:window.removeEventListener;r(d.current?"touchmove":"mousemove",u),r(d.current?"touchend":"mouseup",f)}),[]);(0,O.useEffect)((()=>(x(p),()=>{p&&x(!1)})),[p,x]);var b=(0,O.useCallback)((e=>{U(e.nativeEvent),(e=>!(d.current&&!G(e))&&(d.current=G(e),!0))(e.nativeEvent)&&(g&&g(Y(i.current,e.nativeEvent),e.nativeEvent),c(!0))}),[g]);return(0,q.jsx)("div",e({},l,{className:[o,a||""].filter(Boolean).join(" "),style:e({},l.style,{touchAction:"none"}),ref:i,tabIndex:0,onMouseDown:b,onTouchStart:b}))}));Q.displayName="Interactive";const Z=Q;var $=e=>{var{className:r,prefixCls:t,left:o,top:a}=e,s={position:"absolute",left:o,top:a};return(0,O.useMemo)((()=>(0,q.jsx)("div",{className:t+"-pointer "+(r||""),style:s,children:(0,q.jsx)("div",{className:t+"-fill",style:{width:18,height:18,transform:o?"translate(-9px, -1px)":"translate(-1px, -9px)",boxShadow:"rgb(0 0 0 / 37%) 0px 1px 4px 0px",borderRadius:"50%",backgroundColor:"rgb(248, 248, 248)"}})})),[r,o,a,t])},J=["prefixCls","className","hsva","background","bgProps","innerProps","radius","width","height","direction","style","onChange","pointer"],K="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMUlEQVQ4T2NkYGAQYcAP3uCTZhw1gGGYhAGBZIA/nYDCgBDAm9BGDWAAJyRCgLaBCAAgXwixzAS0pgAAAABJRU5ErkJggg==",ee=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-alpha",className:a,hsva:s,background:n,bgProps:l={},innerProps:i={},radius:d=0,width:p,height:c=16,direction:h="horizontal",style:g,onChange:f,pointer:x}=r,b=z(r,J),v=r=>{f&&f(e({},s,{a:"horizontal"===h?r.left:r.top}),r)},y=u(Object.assign({},s,{a:1})),m="linear-gradient(to "+("horizontal"===h?"right":"bottom")+", rgba(244, 67, 54, 0) 0%, "+y+" 100%)",C={};return"horizontal"===h?C.left=100*s.a+"%":C.top=100*s.a+"%",(0,q.jsxs)("div",e({},b,{className:[o,o+"-"+h,a||""].filter(Boolean).join(" "),style:e({borderRadius:d,background:"url("+K+") left center",backgroundColor:"#fff"},g,{position:"relative"},{width:p,height:c}),ref:t,children:[(0,q.jsx)("div",e({},l,{style:e({inset:0,position:"absolute",background:n||m,borderRadius:d},l.style)})),(0,q.jsx)(Z,e({},i,{style:e({},i.style,{inset:0,zIndex:1,position:"absolute"}),onMove:v,onDown:v,children:_().createElement(x||$,e({prefixCls:o},C))}))]}))}));ee.displayName="Aplha";const re=ee;var te=["prefixCls","className","color","colors","style","rectProps","onChange","addonAfter","addonBefore","rectRender"],oe=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-swatch",className:a,color:s,colors:n=[],style:l,rectProps:i={},onChange:d,addonAfter:p,addonBefore:c,rectRender:h}=r,g=z(r,te),u=e({background:"rgb(144, 19, 254)",height:15,width:15,marginRight:5,marginBottom:5,cursor:"pointer",position:"relative",outline:"none",borderRadius:2},i.style),f=e=>{d&&d(A(e))};return(0,q.jsxs)("div",e({ref:t},g,{className:[o,a||""].filter(Boolean).join(" "),style:e({display:"flex",flexWrap:"wrap",position:"relative"},l),children:[c&&_().isValidElement(c)&&c,n&&Array.isArray(n)&&n.map(((r,t)=>{var o="",a="";"string"===typeof r&&(o=r,a=r),"object"===typeof r&&r.color&&(o=r.title||r.color,a=r.color);var n=s&&s.toLocaleLowerCase()===a.toLocaleLowerCase();if(h)return h({key:t,title:o,color:a,checked:!!n,style:e({},u,{background:a}),onClick:()=>f(a)});var l=i.children&&_().isValidElement(i.children)?_().cloneElement(i.children,{color:a,checked:n}):null;return(0,q.jsx)("div",e({tabIndex:0,title:o,onClick:()=>f(a)},i,{children:l,style:e({},u,{background:a})}),t)})),p&&_().isValidElement(p)&&p]}))}));oe.displayName="Swatch";const ae=oe;function se(r){var{style:t,title:o,checked:a,color:s,onClick:n,rectProps:l}=r,i=(0,O.useRef)(null),d=(0,O.useCallback)((()=>{i.current.style.zIndex="2",i.current.style.outline="#fff solid 2px",i.current.style.boxShadow="rgb(0 0 0 / 25%) 0 0 5px 2px"}),[]),p=(0,O.useCallback)((()=>{a||(i.current.style.zIndex="0",i.current.style.outline="initial",i.current.style.boxShadow="initial")}),[a]);return(0,q.jsx)("div",e({ref:i,title:o},l,{onClick:n,onMouseEnter:d,onMouseLeave:p,style:e({},t,{marginRight:0,marginBottom:0,borderRadius:0,boxSizing:"border-box",height:25,width:25},a?{zIndex:1,outline:"#fff solid 2px",boxShadow:"rgb(0 0 0 / 25%) 0 0 5px 2px"}:{zIndex:0},l.style)}))}var ne=["prefixCls","placement","className","style","color","colors","rectProps","onChange"],le=["key"],ie=["#B80000","#DB3E00","#FCCB00","#008B02","#006B76","#1273DE","#004DCF","#5300EB","#EB9694","#FAD0C3","#FEF3BD","#C1E1C5","#BEDADC","#C4DEF6","#BED3F3","#D4C4FB"],de=function(e){return e.Left="L",e.LeftTop="LT",e.LeftBotton="LB",e.Right="R",e.RightTop="RT",e.RightBotton="RB",e.Top="T",e.TopRight="TR",e.TopLeft="TL",e.Botton="B",e.BottonLeft="BL",e.BottonRight="BR",e}({}),pe=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-github",placement:a=de.TopRight,className:s,style:l,color:i,colors:d=ie,rectProps:p={},onChange:c}=r,h=z(r,ne),g="string"===typeof i&&n(i)?A(i):i,u=i?D(g):"",f={borderStyle:"solid",position:"absolute"},x=e({},f),b=e({},f);return/^T/.test(a)&&(x.borderWidth="0 8px 8px",x.borderColor="transparent transparent rgba(0, 0, 0, 0.15)",b.borderWidth="0 7px 7px",b.borderColor="transparent transparent #fff"),a===de.TopRight&&(x.top=-8,b.top=-7),a===de.Top&&(x.top=-8,b.top=-7),a===de.TopLeft&&(x.top=-8,b.top=-7),/^B/.test(a)&&(x.borderWidth="8px 8px 0 ",x.borderColor="rgba(0, 0, 0, 0.15) transparent transparent",b.borderWidth="7px 7px 0px",b.borderColor="#fff transparent transparent",a===de.BottonRight&&(x.top="100%",b.top="100%"),a===de.Botton&&(x.top="100%",b.top="100%"),a===de.BottonLeft&&(x.top="100%",b.top="100%")),/^(B|T)/.test(a)&&(a!==de.Top&&a!==de.Botton||(x.left="50%",x.marginLeft=-8,b.left="50%",b.marginLeft=-7),a!==de.TopRight&&a!==de.BottonRight||(x.right=10,b.right=11),a!==de.TopLeft&&a!==de.BottonLeft||(x.left=7,b.left=8)),/^L/.test(a)&&(x.borderWidth="8px 8px 8px 0px",x.borderColor="transparent rgba(0, 0, 0, 0.15) transparent transparent",b.borderWidth="7px 7px 7px 0px",b.borderColor="transparent #fff transparent transparent",x.left=-8,b.left=-7),/^R/.test(a)&&(x.borderWidth="8px 0px 8px 8px",x.borderColor="transparent transparent transparent rgba(0, 0, 0, 0.15)",b.borderWidth="7px 0px 7px 7px",b.borderColor="transparent transparent transparent #fff",x.right=-8,b.right=-7),/^(L|R)/.test(a)&&(a!==de.RightTop&&a!==de.LeftTop||(x.top=5,b.top=6),a!==de.Left&&a!==de.Right||(x.top="50%",b.top="50%",x.marginTop=-8,b.marginTop=-7),a!==de.LeftBotton&&a!==de.RightBotton||(x.top="100%",b.top="100%",x.marginTop=-21,b.marginTop=-20)),(0,q.jsx)(ae,e({ref:t,className:[o,s].filter(Boolean).join(" "),colors:d,color:u,rectRender:r=>{var{key:t}=r,o=z(r,le);return(0,q.jsx)(se,e({},o,{rectProps:p}),t)}},h,{onChange:e=>c&&c(I(e)),style:e({width:200,borderRadius:4,background:"#fff",boxShadow:"rgb(0 0 0 / 15%) 0px 3px 12px",border:"1px solid rgba(0, 0, 0, 0.2)",position:"relative",padding:5},l),rectProps:{style:{marginRight:0,marginBottom:0,borderRadius:0,height:25,width:25}},addonBefore:(0,q.jsxs)(O.Fragment,{children:[(0,q.jsx)("div",{style:x}),(0,q.jsx)("div",{style:b})]})}))}));pe.displayName="Github";const ce=pe;var he=e=>{var{className:r,color:t,left:o,top:a,prefixCls:s}=e,n={position:"absolute",top:a,left:o};return(0,O.useMemo)((()=>(0,q.jsx)("div",{className:s+"-pointer "+(r||""),style:n,children:(0,q.jsx)("div",{className:s+"-fill",style:{width:6,height:6,transform:"translate(-3px, -3px)",boxShadow:"rgb(255 255 255) 0px 0px 0px 1.5px, rgb(0 0 0 / 30%) 0px 0px 1px 1px inset, rgb(0 0 0 / 40%) 0px 0px 1px 2px",borderRadius:"50%",backgroundColor:t}})})),[a,o,t,r,s])},ge=["prefixCls","radius","pointer","className","style","hsva","onChange"],ue=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-saturation",radius:a=0,pointer:s,className:n,style:l,hsva:i,onChange:d}=r,p=z(r,ge),c=e({width:200,height:200,borderRadius:a},l,{position:"relative"}),h=(e,r)=>{d&&d({h:i.h,s:100*e.left,v:100*(1-e.top),a:i.a})},g={top:100-i.v+"%",left:i.s+"%",color:u(i)};return(0,q.jsx)(Z,e({className:[o,n||""].filter(Boolean).join(" ")},p,{style:e({position:"absolute",inset:0,cursor:"crosshair",backgroundImage:"linear-gradient(0deg, #000, transparent), linear-gradient(90deg, #fff, hsl("+i.h+", 100%, 50%))"},c),ref:t,onMove:h,onDown:h,children:_().createElement(s||he,e({prefixCls:o},g))}))}));ue.displayName="Saturation";const fe=ue;var xe=["prefixCls","className","hue","onChange","direction"],be=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-hue",className:a,hue:s=0,onChange:n,direction:l="horizontal"}=r,i=z(r,xe);return(0,q.jsx)(re,e({ref:t,className:o+" "+(a||"")},i,{direction:l,background:"linear-gradient(to "+("horizontal"===l?"right":"bottom")+", rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)",hsva:{h:s,s:100,v:100,a:s/360},onChange:(e,r)=>{n&&n({h:"horizontal"===l?360*r.left:360*r.top})}}))}));be.displayName="Hue";const ve=be;var ye=["prefixCls","placement","label","value","className","style","labelStyle","inputStyle","onChange","onBlur"],me=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input",placement:a="bottom",label:s,value:n,className:l,style:i,labelStyle:d,inputStyle:p,onChange:c,onBlur:h}=r,g=z(r,ye),[u,f]=(0,O.useState)(n),x=(0,O.useRef)(!1);(0,O.useEffect)((()=>{r.value!==u&&(x.current||f(r.value))}),[r.value]);var b={};return"bottom"===a&&(b.flexDirection="column"),"top"===a&&(b.flexDirection="column-reverse"),"left"===a&&(b.flexDirection="row-reverse"),(0,q.jsxs)("div",{className:[o,l||""].filter(Boolean).join(" "),style:e({position:"relative",alignItems:"center",display:"flex",fontSize:11},b,i),children:[(0,q.jsx)("input",e({ref:t,value:u,onChange:function(e,r){var t=r||e.target.value;/^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(t)&&c&&c(e,t);var o=(e=>Number(String(e).replace(/%/g,"")))(t);isNaN(o)||c&&c(e,o),f(t)},onBlur:function(e){x.current=!1,f(r.value),h&&h(e)},autoComplete:"off",onFocus:()=>x.current=!0},g,{style:e({width:"100%",paddingTop:2,paddingBottom:2,paddingLeft:3,paddingRight:3,fontSize:11,boxSizing:"border-box",border:"none",boxShadow:"rgb(204 204 204) 0px 0px 0px 1px inset"},p)})),s&&(0,q.jsx)("span",{style:e({color:"rgb(153, 153, 153)",textTransform:"capitalize"},d),children:s})]})}));me.displayName="EditableInput";const Ce=me;var we=["prefixCls","hsva","placement","rProps","gProps","bProps","aProps","className","style","onChange"],je=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input-rgba",hsva:a,placement:s="bottom",rProps:n={},gProps:l={},bProps:i={},aProps:d={},className:c,style:h,onChange:g}=r,u=z(r,we),f=a?P(a):{};function x(e){var r=Number(e.target.value);r&&r>255&&(e.target.value="255"),r&&r<0&&(e.target.value="0")}var b=(r,t,o)=>{"number"===typeof r&&("a"===t&&(r<0&&(r=0),r>100&&(r=100),g&&g(I(p(e({},f,{a:r/100}))))),r>255&&(r=255,o.target.value="255"),r<0&&(r=0,o.target.value="0"),"r"===t&&g&&g(I(p(e({},f,{r:r})))),"g"===t&&g&&g(I(p(e({},f,{g:r})))),"b"===t&&g&&g(I(p(e({},f,{b:r})))))};return(0,q.jsxs)("div",e({ref:t,className:[o,c||""].filter(Boolean).join(" ")},u,{style:e({fontSize:11,display:"flex"},h),children:[(0,q.jsx)(Ce,e({label:"R",value:f.r||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"r",e)},n,{style:e({},n.style)})),(0,q.jsx)(Ce,e({label:"G",value:f.g||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"g",e)},l,{style:e({marginLeft:5},n.style)})),(0,q.jsx)(Ce,e({label:"B",value:f.b||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"b",e)},i,{style:e({marginLeft:5},i.style)})),d&&(0,q.jsx)(Ce,e({label:"A",value:f.a?parseInt(String(100*f.a),10):0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"a",e)},d,{style:e({marginLeft:5},d.style)}))]}))}));je.displayName="EditableInputRGBA";const Re=je;var Se=["prefixCls","hsva","hProps","sProps","lProps","aProps","className","onChange"],Be=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input-hsla",hsva:a,hProps:s={},sProps:n={},lProps:l={},aProps:i={},className:d,onChange:p}=r,c=z(r,Se),h=a?y(a):{h:0,s:0,l:0,a:0},g=(r,t,o)=>{"number"===typeof r&&("h"===t&&(r<0&&(r=0),r>360&&(r=360),p&&p(I(v(e({},h,{h:r}))))),"s"===t&&(r<0&&(r=0),r>100&&(r=100),p&&p(I(v(e({},h,{s:r}))))),"l"===t&&(r<0&&(r=0),r>100&&(r=100),p&&p(I(v(e({},h,{l:r}))))),"a"===t&&(r<0&&(r=0),r>1&&(r=1),p&&p(I(v(e({},h,{a:r}))))))};return(0,q.jsx)(Re,e({ref:t,hsva:a,rProps:e({label:"H",value:Math.round(h.h)},s,{onChange:(e,r)=>g(r,"h")}),gProps:e({label:"S",value:Math.round(h.s)+"%"},n,{onChange:(e,r)=>g(r,"s")}),bProps:e({label:"L",value:Math.round(h.l)+"%"},l,{onChange:(e,r)=>g(r,"l")}),aProps:e({label:"A",value:Math.round(100*h.a)/100},i,{onChange:(e,r)=>g(r,"a")}),className:[o,d||""].filter(Boolean).join(" ")},c))}));Be.displayName="EditableInputHSLA";const Ne=Be;var Ae=["style"];function ke(r){var{style:t}=r,o=z(r,Ae),a=(0,O.useRef)(null),s=(0,O.useCallback)((()=>{a.current.style.backgroundColor="#e8e8e8"}),[]),n=(0,O.useCallback)((()=>{a.current.style.backgroundColor="transparent"}),[]);return(0,q.jsx)("div",e({ref:a,style:e({marginLeft:5,cursor:"pointer",transition:"background-color .3s",borderRadius:2},t)},o,{onMouseEnter:s,onMouseLeave:n,children:(0,q.jsx)("svg",{viewBox:"0 0 1024 1024",width:"24",height:"24",style:{display:"block"},children:(0,q.jsx)("path",{d:"M373.888 576h276.224c9.322667 0 14.293333 11.178667 9.173333 18.773333l-1.258666 1.557334-138.112 146.858666a10.709333 10.709333 0 0 1-14.293334 1.365334l-1.536-1.365334-138.112-146.858666c-6.592-6.997333-2.666667-18.645333 5.973334-20.16l1.941333-0.170667h276.224-276.224z m146.026667-295.189333l138.112 146.858666c7.04 7.509333 2.069333 20.330667-7.914667 20.330667H373.888c-9.984 0-14.976-12.821333-7.914667-20.330667l138.112-146.858666a10.730667 10.730667 0 0 1 15.829334 0z",fill:"#333"})})}))}var Pe=["prefixCls","className","style","color","inputType","rectProps","onChange"],Te=function(e){return e.HEXA="hexa",e.RGBA="rgba",e.HSLA="hsla",e}({}),Ee=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-chrome",className:a,style:s,color:l,inputType:i=Te.RGBA,rectProps:d={},onChange:p}=r,c=z(r,Pe),h="string"===typeof l&&n(l)?A(l):l||{h:0,s:0,l:0,a:0},g=e=>p&&p(I(e)),[u,f]=(0,O.useState)(i),x={paddingTop:6},b={textAlign:"center",paddingTop:4,paddingBottom:4};return(0,q.jsx)(ce,e({ref:t,color:h,style:e({borderRadius:0,flexDirection:"column",width:230,padding:0},s),colors:void 0,className:[o,a].filter(Boolean).join(" "),placement:de.TopLeft},c,{addonAfter:(0,q.jsxs)(O.Fragment,{children:[(0,q.jsx)(fe,{hsva:h,style:{width:"100%",height:130},onChange:r=>{g(e({},h,r,{a:h.a}))}}),(0,q.jsxs)("div",{style:{padding:15,display:"flex",alignItems:"center"},children:[(0,q.jsx)(re,{width:24,height:24,hsva:h,radius:2,style:{marginRight:15,borderRadius:"50%"},bgProps:{style:{background:"transparent"}},innerProps:{style:{borderRadius:"50%",background:E(h),boxShadow:"rgb(0 0 0 / 25%) 0px 0px 1px inset"}},pointer:()=>(0,q.jsx)(O.Fragment,{})}),(0,q.jsxs)("div",{style:{flex:1},children:[(0,q.jsx)(ve,{hue:h.h,style:{width:"100%"},bgProps:{style:{borderRadius:2}},onChange:r=>{g(e({},h,r))}}),(0,q.jsx)(re,{hsva:h,style:{marginTop:10},bgProps:{style:{borderRadius:2}},onChange:r=>{g(e({},h,r))}})]})]}),(0,q.jsxs)("div",{style:{display:"flex",alignItems:"flex-start",padding:"0 15px 15px 15px",userSelect:"none"},children:[(0,q.jsxs)("div",{style:{flex:1},children:[u==Te.RGBA&&(0,q.jsx)(Re,{hsva:h,rProps:{labelStyle:x,inputStyle:b},gProps:{labelStyle:x,inputStyle:b},bProps:{labelStyle:x,inputStyle:b},aProps:{labelStyle:x,inputStyle:b},onChange:e=>g(e.hsva)}),u===Te.HEXA&&(0,q.jsx)(Ce,{label:"HEX",labelStyle:x,inputStyle:b,value:h.a>0&&h.a<1?M(h).toLocaleUpperCase():D(h).toLocaleUpperCase(),onChange:(e,r)=>{"string"===typeof r&&g(A(/^#/.test(r)?r:"#"+r))}}),u===Te.HSLA&&(0,q.jsx)(Ne,{hsva:h,hProps:{labelStyle:x,inputStyle:b},sProps:{labelStyle:x,inputStyle:b},lProps:{labelStyle:x,inputStyle:b},aProps:{labelStyle:x,inputStyle:b},onChange:e=>g(e.hsva)})]}),(0,q.jsx)(ke,{onClick:()=>{u===Te.RGBA&&f(Te.HSLA),u===Te.HSLA&&f(Te.HEXA),u===Te.HEXA&&f(Te.RGBA)}})]})]}),rectRender:e=>{var{key:r}=e;return(0,q.jsx)(O.Fragment,{},r)}}))}));Ee.displayName="Chrome";const Le=Ee;var Fe=["prefixCls","className","style","color","colors","onChange"],De=["#D9E3F0","#F47373","#697689","#37D67A","#2CCCE4","#555555","#dce775","#ff8a65","#ba68c8"],Me=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-block",className:a,style:s,color:i,colors:d=De,onChange:p}=r,c=z(r,Fe),h="string"===typeof i&&n(i)?A(i):i,g=i?D(h):"",u=(e,r)=>{"string"===typeof e&&n(e)&&/(3|6)/.test(String(e.replace(/^#/,"").length))&&p&&p(I(A(e)))};return(0,q.jsxs)("div",e({ref:t,className:[o,a].filter(Boolean).join(" "),style:e({width:170,borderRadius:6,background:"rgb(255, 255, 255)",boxShadow:"rgb(0 0 0 / 10%) 0 1px",position:"relative"},s)},c,{children:[(0,q.jsx)("div",{style:{width:0,height:0,borderStyle:"solid",borderWidth:"0 10px 10px",borderColor:"transparent transparent "+g,position:"absolute",top:-10,left:"50%",marginLeft:-10}}),(0,q.jsx)("div",{title:g,style:{backgroundColor:""+g,color:l(g),height:110,fontSize:18,borderRadius:"6px 6px 0 0",display:"flex",alignItems:"center",justifyContent:"center"},children:g.toLocaleUpperCase()}),(0,q.jsx)(ae,{colors:d,color:g,style:{paddingLeft:10,paddingTop:10},rectProps:{style:{marginRight:10,marginBottom:10,borderRadius:4,height:22,width:22}},onChange:e=>{p&&p(I(e))}}),(0,q.jsx)(Ce,{value:g.toLocaleUpperCase(),onChange:(e,r)=>u(r),onBlur:e=>{var r=e.target.value;e.target.value=r.slice(0,6),u(r.slice(0,6))},inputStyle:{height:22,outline:0,borderRadius:3,color:"#666",padding:"0 7px"},style:{padding:10,paddingTop:0,borderRadius:"0 0 6px 6px"}})]}))}));Me.displayName="Block";const He=Me;var Ie=["prefixCls","className","style","onChange","color","colors"],ze=["#4D4D4D","#999999","#FFFFFF","#F44E3B","#FE9200","#FCDC00","#DBDF00","#A4DD00","#68CCCA","#73D8FF","#AEA1FF","#FDA1FF","#333333","#808080","#cccccc","#D33115","#E27300","#FCC400","#B0BC00","#68BC00","#16A5A5","#009CE0","#7B64FF","#FA28FF","#000000","#666666","#B3B3B3","#9F0500","#C45100","#FB9E00","#808900","#194D33","#0C797D","#0062B1","#653294","#AB149E"];function Oe(e){return e.checked?(0,q.jsx)("div",{style:{height:5,width:5,borderRadius:"50%",backgroundColor:l(e.color)}}):null}var _e=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-compact",className:a,style:s,onChange:l,color:i,colors:d=ze}=r,p=z(r,Ie),c="string"===typeof i&&n(i)?A(i):i,h=i?D(c).replace(/^#/,""):"",g=(0,O.useCallback)((e=>l&&l(I(e))),[]),u={style:{alignItems:"baseline"},inputStyle:{boxShadow:"none",backgroundColor:"transparent",outline:0}};return(0,q.jsxs)("div",e({ref:t,style:e({background:"#f6f6f6",borderRadius:3,display:"flex",width:240,flexWrap:"wrap",paddingTop:5,paddingLeft:5},s),className:[o,a||""].filter(Boolean).join(" ")},p,{children:[(0,q.jsx)(ae,{colors:d,color:i?D(c):void 0,rectProps:{children:(0,q.jsx)(Oe,{}),style:{display:"flex",alignItems:"center",justifyContent:"center"}},onChange:e=>g(e)}),(0,q.jsxs)("div",{style:{display:"flex",margin:"0 4px 3px 0"},children:[(0,q.jsx)(Ce,{onChange:(e,r)=>{var t;"string"===typeof(t=r)&&n(t)&&/(3|6)/.test(String(t.length))&&g(A(t))},labelStyle:{paddingRight:5,marginTop:-1},value:h.toLocaleUpperCase(),label:(0,q.jsx)("div",{style:{width:8,height:8,backgroundColor:"#"+h}}),inputStyle:{outline:"none",boxShadow:"initial",background:"transparent"},style:{flexDirection:"row-reverse",flex:"1 1 0%",minWidth:80}}),(0,q.jsx)(Re,{hsva:c,placement:"left",onChange:e=>g(e.hsva),aProps:!1,rProps:u,gProps:u,bProps:u})]})]}))}));_e.displayName="Compact";const We=_e;var Ge=["style","color"],Ue=["prefixCls","className","onChange","color","style","disableAlpha"],Xe=r=>{var{style:t,color:o}=r,a=z(r,Ge);return(0,q.jsx)("div",e({},a,{style:e({height:28,width:28,position:"absolute",transform:"translate(-14px, -4px)",boxShadow:"0 2px 4px rgb(0 0 0 / 20%)",borderRadius:"50%",background:"url("+K+")",backgroundColor:"#fff",border:"2px solid #fff",zIndex:1},t),children:(0,q.jsx)("div",{style:{backgroundColor:o,borderRadius:"50%",height:" 100%",width:"100%"}})}))},Ye=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-colorful",className:a,onChange:s,color:l,style:i,disableAlpha:d}=r,p=z(r,Ue),c="string"===typeof l&&n(l)?A(l):l||{},h=e=>s&&s(I(e));return(0,q.jsxs)("div",e({ref:t,style:e({width:200,position:"relative"},i)},p,{className:o+" "+(a||""),children:[(0,q.jsx)(fe,{hsva:c,className:o,radius:"8px 8px 0 0",style:{width:"auto",height:150,minWidth:120,borderBottom:"12px solid #000"},pointer:e=>{var{left:r,top:t,color:o}=e;return(0,q.jsx)(Xe,{style:{left:r,top:t,transform:"translate(-16px, -16px)"},color:D(c)})},onChange:r=>h(e({},c,r))}),(0,q.jsx)(ve,{hue:c.h,height:24,radius:d?"0 0 8px 8px":0,className:o,onChange:r=>h(e({},c,r)),pointer:e=>{var{left:r}=e;return(0,q.jsx)(Xe,{style:{left:r},color:"hsl("+(c.h||0)+"deg 100% 50%)"})}}),!d&&(0,q.jsx)(re,{hsva:c,height:24,className:o,radius:"0 0 8px 8px",pointer:e=>{var{left:r}=e;return(0,q.jsx)(Xe,{style:{left:r},color:E(c)})},onChange:r=>h(e({},c,r))})]}))}));Ye.displayName="Colorful";const qe=Ye;function Ve(r){var{style:t,title:o,checked:a,color:s,onClick:n,rectProps:l}=r,i=(0,O.useRef)(null),d=(0,O.useCallback)((()=>{i.current.style.transform="scale(1.2)"}),[]),p=(0,O.useCallback)((()=>{i.current.style.transform="scale(1)"}),[]);return(0,q.jsx)("div",{ref:i,onClick:n,onMouseEnter:d,onMouseLeave:p,title:o,style:e({},t,{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:3,borderRadius:"50%",marginRight:12,marginBottom:12,boxSizing:"border-box",transform:"scale(1)",boxShadow:s+" 0px 0px "+(a?5:0)+"px",transition:"transform 100ms ease 0s, box-shadow 100ms ease 0s"}),children:(0,q.jsx)("div",e({},l,{style:e({height:a?"100%":0,width:a?"100%":0,borderRadius:"50%",backgroundColor:"#fff",boxSizing:"border-box",transition:"height 100ms ease 0s, width 100ms ease 0s"},l.style)}))})}var Qe=["prefixCls","className","color","colors","rectProps","onChange"],Ze=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-circle",className:a,color:s,colors:l=[],rectProps:i={},onChange:d}=r,p=z(r,Qe),c="string"===typeof s&&n(s)?A(s):s||{},h=s?D(c):"";return(0,q.jsx)(ae,e({ref:t,colors:l,color:h},p,{className:[o,a].filter(Boolean).join(" "),rectRender:r=>{var t=e({},(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(r),r));return(0,q.jsx)(Ve,e({},t,{rectProps:i}))},onChange:e=>{d&&d(I(e))}}))}));Ze.displayName="Circle";const $e=Ze;var Je=["prefixCls","className","style","color","onChange"],Ke={boxShadow:"initial",borderWidth:"0 0 1px 0",borderBottomColor:"#eee",borderBottomStyle:"solid",height:30,outline:0,fontSize:15,padding:0},er=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-material",className:a,style:s,color:l,onChange:i}=r,d=z(r,Je),p="string"===typeof l&&n(l)?A(l):l,c=l?D(p).replace(/^#/,""):"",h=(e,r)=>{"string"===typeof e&&n(e)&&/(3|6)/.test(String(e.length))&&i&&i(I(A(e)))};return(0,q.jsxs)("div",e({ref:t,className:[o,a||""].filter(Boolean).join(" "),style:e({padding:16,width:98,fontFamily:"Roboto",backgroundColor:"#fff"},s)},d,{children:[(0,q.jsx)(Ce,{label:"Hex",value:c.toLocaleUpperCase(),onChange:(e,r)=>h(r),onBlur:e=>{var r=e.target.value;e.target.value=r.slice(0,6),h(r.slice(0,6))},inputStyle:{outline:0,border:0,height:30,fontSize:15,padding:0,boxShadow:"initial",borderWidth:"0 0 2px 0",borderBottomColor:c?"#"+c:"#eee",borderBottomStyle:"solid"},style:{flexDirection:"column-reverse",alignItems:"flex-start"}}),(0,q.jsx)(Re,{hsva:p,placement:"top",style:{marginTop:11},rProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},gProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},bProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},aProps:!1,onChange:e=>{return r=e.hsva,void(i&&i(I(r)));var r}})]}))}));er.displayName="Material";const rr=er;var tr=["prefixCls","className","onChange","direction","hsva"],or=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-saturation",className:a,onChange:s,direction:n="horizontal",hsva:l}=r,i=z(r,tr),d=u(e({},l,{a:1,v:100}));return(0,q.jsx)(re,e({ref:t},i,{className:o+" "+(a||""),hsva:{h:l.h,s:l.s,v:l.v,a:1-l.v/100},direction:n,background:"linear-gradient(to "+("horizontal"===n?"right":"bottom")+", "+d+", rgb(0, 0, 0))",onChange:(e,r)=>{s&&s({v:"horizontal"===n?100-100*r.left:100-100*r.top})}}))}));or.displayName="ShadeSlider";const ar=or;var sr=["prefixCls","className","style","onChange","color","lightness"],nr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-slider",className:a,style:s,onChange:l,color:i,lightness:d=[80,65,50,35,20]}=r,p=z(r,sr),h="string"===typeof i&&n(i)?A(i):i||{};return(0,q.jsx)("div",e({ref:t,style:e({display:"flex"},s),className:[o,a||""].filter(Boolean).join(" ")},p,{children:d.map(((r,t)=>{var o="hsl("+y(h).h+", 50%, "+r+"%)",a=o===c(h);return(0,q.jsx)("div",{style:{paddingLeft:1,width:100/d.length+"%",boxSizing:"border-box"},children:(0,q.jsx)("div",{onClick:e=>((e,r)=>{l&&l(I(b(e)),r)})(o,e),style:e({backgroundColor:o,height:12,cursor:"pointer"},a?{borderRadius:2,transform:"scale(1, 1.5)"}:{})})},t)}))}))}));nr.displayName="Slider";const lr=nr;var ir=["prefixCls","className","onChange","width","presetColors","color","editableDisable","disableAlpha","style"],dr=["#D0021B","#F5A623","#f8e61b","#8B572A","#7ED321","#417505","#BD10E0","#9013FE","#4A90E2","#50E3C2","#B8E986","#000000","#4A4A4A","#9B9B9B","#FFFFFF"],pr=e=>(0,q.jsx)("div",{style:{boxShadow:"rgb(0 0 0 / 60%) 0px 0px 2px",width:4,top:1,bottom:1,left:e.left,borderRadius:1,position:"absolute",backgroundColor:"#fff"}}),cr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-sketch",className:a,onChange:s,width:l=218,presetColors:i=dr,color:d,editableDisable:p=!0,disableAlpha:c=!1,style:h}=r,g=z(r,ir),[u,f]=(0,O.useState)({h:209,s:36,v:90,a:1});(0,O.useEffect)((()=>{"string"===typeof d&&n(d)&&f(A(d)),"object"===typeof d&&f(d)}),[d]);var x=e=>{f(e),s&&s(I(e))};return(0,q.jsxs)("div",e({},g,{className:o+" "+(a||""),ref:t,style:e({background:"rgb(255, 255, 255)",borderRadius:4,boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px, rgb(0 0 0 / 15%) 0px 8px 16px",width:l},h),children:[(0,q.jsxs)("div",{style:{padding:"10px 10px 8px"},children:[(0,q.jsx)(fe,{hsva:u,style:{width:"auto",height:150},onChange:r=>x(e({},u,r,{a:u.a}))}),(0,q.jsxs)("div",{style:{display:"flex",marginTop:4},children:[(0,q.jsxs)("div",{style:{flex:1},children:[(0,q.jsx)(ve,{width:"auto",height:10,hue:u.h,pointer:pr,innerProps:{style:{marginLeft:1,marginRight:5}},onChange:r=>x(e({},u,r))}),!c&&(0,q.jsx)(re,{width:"auto",height:10,hsva:u,pointer:pr,style:{marginTop:4},innerProps:{style:{marginLeft:1,marginRight:5}},onChange:r=>x(e({},u,{a:r.a}))})]}),!c&&(0,q.jsx)(re,{width:24,height:24,hsva:u,radius:2,style:{marginLeft:4},bgProps:{style:{background:"transparent"}},innerProps:{style:{borderRadius:2,background:E(u),boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px inset, rgb(0 0 0 / 25%) 0px 0px 4px inset"}},pointer:()=>(0,q.jsx)(O.Fragment,{})})]})]}),p&&(0,q.jsxs)("div",{style:{display:"flex",margin:"0 10px 3px 10px"},children:[(0,q.jsx)(Ce,{label:"Hex",value:D(u).replace(/^#/,"").toLocaleUpperCase(),onChange:(e,r)=>{var t;"string"===typeof(t=r)&&n(t)&&/(3|6)/.test(String(t.length))&&x(A(t))},style:{minWidth:58}}),(0,q.jsx)(Re,{hsva:u,style:{marginLeft:6},aProps:!c&&{},onChange:e=>x(e.hsva)})]}),i&&i.length>0&&(0,q.jsx)(ae,{style:{borderTop:"1px solid rgb(238, 238, 238)",paddingTop:10,paddingLeft:10},colors:i,color:D(u),onChange:e=>x(e),rectProps:{style:{marginRight:10,marginBottom:10,borderRadius:3,boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px inset"}}})]}))}));cr.displayName="Sketch";const hr=cr;var gr=r=>{var{className:t,color:o,left:a,top:s,style:n,prefixCls:l}=r,i=e({},n,{position:"absolute",top:s,left:a}),d=l+"-pointer "+(t||"");return(0,q.jsx)("div",{className:d,style:i,children:(0,q.jsx)("div",{className:l+"-fill",style:{width:10,height:10,transform:"translate(-5px, -5px)",boxShadow:"rgb(255 255 255) 0px 0px 0px 1.5px, rgb(0 0 0 / 30%) 0px 0px 1px 1px inset, rgb(0 0 0 / 40%) 0px 0px 1px 2px",borderRadius:"50%",backgroundColor:"#fff"},children:(0,q.jsx)("div",{style:{inset:0,borderRadius:"50%",position:"absolute",backgroundColor:o}})})})},ur=2*Math.PI,fr=(e,r)=>(e%r+r)%r,xr=(e,r)=>Math.sqrt(e*e+r*r);function br(e){var{width:r=0}=e,t=r/2;return{width:r,radius:t,cx:t,cy:t}}function vr(e){var{width:r=0}=e;return r/2}function yr(e,r,t){var o=e.angle||0,a=e.direction;return t&&"clockwise"===a?r=o+r:"clockwise"===a?r=360-o+r:t&&"anticlockwise"===a?r=o+180-r:"anticlockwise"===a&&(r=o-r),fr(r,360)}var mr=["prefixCls","radius","pointer","className","style","width","height","direction","angle","color","onChange"],Cr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-wheel",radius:a=0,pointer:s,className:l,style:i,width:d=200,height:p=200,direction:c="anticlockwise",angle:h=180,color:g,onChange:u}=r,f=z(r,mr),x="string"===typeof g&&n(g)?A(g):g||{},b=g?D(x):"",v=function(e,r){var{cx:t,cy:o}=br(e),a=vr(e),s=(180+yr(e,r.h,!0))*(ur/360),n=r.s/100*a,l="clockwise"===e.direction?-1:1;return{x:t+n*Math.cos(s)*l,y:o+n*Math.sin(s)*l}}({width:d},x),y={top:"0",left:"0",color:b},m=(e,r)=>{var t=function(e,r,t){var{cx:o,cy:a}=br(e),s=vr(e);r=o-r,t=a-t;var n=yr(e,Math.atan2(-t,-r)*(360/ur)),l=Math.min(xr(r,t),s);return{h:Math.round(n),s:Math.round(100/s*l)}}({width:d},d-e.x,p-e.y),o={h:t.h,s:t.s,v:x.v,a:x.a};u&&u(I(o))};return(0,q.jsxs)(Z,e({className:[o,l||""].filter(Boolean).join(" ")},f,{style:e({position:"relative",width:d,height:p},i),ref:t,onMove:m,onDown:m,children:[_().createElement(s||gr,e({prefixCls:o,style:{zIndex:1,transform:"translate("+v.x+"px, "+v.y+"px)"}},y)),(0,q.jsx)("div",{style:{position:"absolute",borderRadius:"50%",background:"anticlockwise"===c?"conic-gradient(red, yellow, lime, aqua, blue, magenta, red)":"conic-gradient(red, magenta, blue, aqua, lime, yellow, red)",transform:"rotateZ("+(h+90)+"deg)",inset:0}}),(0,q.jsx)("div",{style:{position:"absolute",borderRadius:"50%",background:"radial-gradient(circle closest-side, #fff, transparent)",inset:0}}),(0,q.jsx)("div",{style:{backgroundColor:"#000",borderRadius:"50%",position:"absolute",inset:0,opacity:"number"===typeof x.v?1-x.v/100:0}})]}))}));Cr.displayName="Wheel";const wr=Cr})(),a})()));
!function(e,r){"object"===typeof exports&&"object"===typeof module?module.exports=r(require("react")):"function"===typeof define&&define.amd?define(["react"],r):"object"===typeof exports?exports["@uiw/react-color"]=r(require("react")):e["@uiw/react-color"]=r(e.React)}(self,(e=>(()=>{"use strict";var r={858:(e,r,t)=>{var o=t(787),a=Symbol.for("react.element"),s=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,l=o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,i={key:!0,ref:!0,__self:!0,__source:!0};function d(e,r,t){var o,s={},d=null,p=null;for(o in void 0!==t&&(d=""+t),void 0!==r.key&&(d=""+r.key),void 0!==r.ref&&(p=r.ref),r)n.call(r,o)&&!i.hasOwnProperty(o)&&(s[o]=r[o]);if(e&&e.defaultProps)for(o in r=e.defaultProps)void 0===s[o]&&(s[o]=r[o]);return{$$typeof:a,type:e,key:d,ref:p,props:s,_owner:l.current}}r.jsx=d,r.jsxs=d},664:(e,r,t)=>{e.exports=t(858)},787:r=>{r.exports=e}},t={};function o(e){var a=t[e];if(void 0!==a)return a.exports;var s=t[e]={exports:{}};return r[e](s,s.exports,o),s.exports}o.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return o.d(r,{a:r}),r},o.d=(e,r)=>{for(var t in r)o.o(r,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},o.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),o.r=e=>{"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};return(()=>{function e(){return e=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e},e.apply(this,arguments)}o.r(a),o.d(a,{Alpha:()=>re,BACKGROUND_IMG:()=>K,Block:()=>He,Chrome:()=>Le,ChromeInputType:()=>Te,Circle:()=>$e,Colorful:()=>qe,Compact:()=>We,EditableInput:()=>Ce,EditableInputHSLA:()=>Ne,EditableInputRGBA:()=>Re,Github:()=>ce,GithubPlacement:()=>de,Hue:()=>ve,Material:()=>rr,Pointer:()=>$,Saturation:()=>fe,ShadeSlider:()=>ar,Sketch:()=>hr,Slider:()=>lr,Swatch:()=>ae,Wheel:()=>wr,color:()=>I,equalColorObjects:()=>r,equalColorString:()=>t,equalHex:()=>s,getContrastingColor:()=>l,hexToHsva:()=>A,hexToRgba:()=>k,hslStringToHsla:()=>f,hslStringToHsva:()=>b,hslaStringToHsva:()=>x,hslaToHsl:()=>F,hslaToHsva:()=>v,hsvStringToHsva:()=>j,hsvaStringToHsva:()=>m,hsvaToHex:()=>D,hsvaToHexa:()=>M,hsvaToHslString:()=>c,hsvaToHsla:()=>y,hsvaToHslaString:()=>u,hsvaToHsv:()=>H,hsvaToHsvString:()=>h,hsvaToHsvaString:()=>g,hsvaToRgbString:()=>T,hsvaToRgba:()=>P,hsvaToRgbaString:()=>E,parseHue:()=>w,rgbStringToHsva:()=>S,rgbaStringToHsva:()=>R,rgbaToHex:()=>B,rgbaToHexa:()=>N,rgbaToHsva:()=>p,rgbaToRgb:()=>L,validHex:()=>n});var r=(e,r)=>{if(e===r)return!0;for(var t in e)if(e[t]!==r[t])return!1;return!0},t=(e,r)=>e.replace(/\s/g,"")===r.replace(/\s/g,""),s=(e,t)=>e.toLowerCase()===t.toLowerCase()||r(k(e),k(t)),n=e=>/^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(e),l=e=>{if(!e)return"#fff";var r=I(e);return(299*r.rgb.r+587*r.rgb.g+114*r.rgb.b)/1e3>=128?"#000":"#fff"},i=255,d=100,p=e=>{var{r:r,g:t,b:o,a:a}=e,s=Math.max(r,t,o),n=s-Math.min(r,t,o),l=n?s===r?(t-o)/n:s===t?2+(o-r)/n:4+(r-t)/n:0;return{h:60*(l<0?l+6:l),s:s?n/s*d:0,v:s/i*d,a:a}},c=e=>{var{h:r,s:t,l:o}=y(e);return"hsl("+r+", "+Math.round(t)+"%, "+Math.round(o)+"%)"},h=e=>{var{h:r,s:t,v:o}=e;return"hsv("+r+", "+t+"%, "+o+"%)"},g=e=>{var{h:r,s:t,v:o,a:a}=e;return"hsva("+r+", "+t+"%, "+o+"%, "+a+")"},u=e=>{var{h:r,s:t,l:o,a:a}=y(e);return"hsla("+r+", "+t+"%, "+o+"%, "+a+")"},f=e=>{var[r,t,o,a]=(e.match(/\d+/g)||[]).map(Number);return{h:r,s:t,l:o,a:a}},x=e=>{var r=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?v({h:w(r[1],r[2]),s:Number(r[3]),l:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?100:1)}):{h:0,s:0,v:0,a:1}},b=x,v=e=>{var{h:r,s:t,l:o,a:a}=e;return{h:r,s:(t*=(o<50?o:d-o)/d)>0?2*t/(o+t)*d:0,v:o+t,a:a}},y=e=>{var{h:r,s:t,v:o,a:a}=e,s=(200-t)*o/d;return{h:r,s:s>0&&s<200?t*o/d/(s<=d?s:200-s)*d:0,l:s/2,a:a}},m=e=>{var r=/hsva?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?{h:w(r[1],r[2]),s:Number(r[3]),v:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?d:1)}:{h:0,s:0,v:0,a:1}},C={grad:.9,turn:360,rad:360/(2*Math.PI)},w=function(e,r){return void 0===r&&(r="deg"),Number(e)*(C[r]||1)},j=m,R=e=>{var r=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?p({r:Number(r[1])/(r[2]?d/i:1),g:Number(r[3])/(r[4]?d/i:1),b:Number(r[5])/(r[6]?d/i:1),a:void 0===r[7]?1:Number(r[7])/(r[8]?d:1)}):{h:0,s:0,v:0,a:1}},S=R,B=e=>{var r,{r:t,g:o,b:a}=e;return"#"+(r=(t<<16|o<<8|a).toString(16),new Array(7-r.length).join("0")+r)},N=e=>{var{r:r,g:t,b:o,a:a}=e,s="number"===typeof a&&(255*a|256).toString(16).slice(1);return""+B({r:r,g:t,b:o,a:a})+(s||"")},A=e=>p(k(e)),k=e=>{var r=e.replace("#","");/^#?/.test(e)&&3===r.length&&(e="#"+r.charAt(0)+r.charAt(0)+r.charAt(1)+r.charAt(1)+r.charAt(2)+r.charAt(2));var t=new RegExp("[A-Za-z0-9]{2}","g"),[o,a,s=0,n]=e.match(t).map((e=>parseInt(e,16)));return{r:o,g:a,b:s,a:n?n/i:1}},P=r=>{var{h:t,s:o,v:a,a:s}=r,n=t/60,l=o/d,p=a/d,c=Math.floor(n)%6,h=n-Math.floor(n),g=i*p*(1-l),u=i*p*(1-l*h),f=i*p*(1-l*(1-h));p*=i;var x={};switch(c){case 0:x.r=p,x.g=f,x.b=g;break;case 1:x.r=u,x.g=p,x.b=g;break;case 2:x.r=g,x.g=p,x.b=f;break;case 3:x.r=g,x.g=u,x.b=p;break;case 4:x.r=f,x.g=g,x.b=p;break;case 5:x.r=p,x.g=g,x.b=u}return x.r=Math.round(x.r),x.g=Math.round(x.g),x.b=Math.round(x.b),e({},x,{a:s})},T=e=>{var{r:r,g:t,b:o}=P(e);return"rgb("+r+", "+t+", "+o+")"},E=e=>{var{r:r,g:t,b:o,a:a}=P(e);return"rgba("+r+", "+t+", "+o+", "+a+")"},L=e=>{var{r:r,g:t,b:o}=e;return{r:r,g:t,b:o}},F=e=>{var{h:r,s:t,l:o}=e;return{h:r,s:t,l:o}},D=e=>B(P(e)),M=e=>N(P(e)),H=e=>{var{h:r,s:t,v:o}=e;return{h:r,s:t,v:o}},I=e=>{var r,t,o,a,s,l,i,d;return"string"===typeof e&&n(e)?(l=A(e),i=e):"string"!==typeof e&&(l=e),l&&(o=H(l),s=y(l),a=P(l),d=N(a),i=D(l),t=F(s),r=L(a)),{rgb:r,hsl:t,hsv:o,rgba:a,hsla:s,hsva:l,hex:i,hexa:d}};function z(e,r){if(null==e)return{};var t,o,a={},s=Object.keys(e);for(o=0;o<s.length;o++)t=s[o],r.indexOf(t)>=0||(a[t]=e[t]);return a}var O=o(787),_=o.n(O);function W(e){var r=(0,O.useRef)(e);return(0,O.useEffect)((()=>{r.current=e})),(0,O.useCallback)(((e,t)=>r.current&&r.current(e,t)),[])}var G=e=>"touches"in e,U=e=>{!G(e)&&e.preventDefault&&e.preventDefault()},X=function(e,r,t){return void 0===r&&(r=0),void 0===t&&(t=1),e>t?t:e<r?r:e},Y=(e,r)=>{var t=e.getBoundingClientRect(),o=G(r)?r.touches[0]:r;return{left:X((o.pageX-(t.left+window.pageXOffset))/t.width),top:X((o.pageY-(t.top+window.pageYOffset))/t.height),width:t.width,height:t.height,x:o.pageX-(t.left+window.pageXOffset),y:o.pageY-(t.top+window.pageYOffset)}},q=o(664),V=["prefixCls","className","onMove","onDown"],Q=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-interactive",className:a,onMove:s,onDown:n}=r,l=z(r,V),i=(0,O.useRef)(null),d=(0,O.useRef)(!1),[p,c]=(0,O.useState)(!1),h=W(s),g=W(n),u=(0,O.useCallback)((e=>{U(e),(G(e)?e.touches.length>0:e.buttons>0)&&i.current?h&&h(Y(i.current,e),e):c(!1)}),[h]),f=(0,O.useCallback)((()=>c(!1)),[]),x=(0,O.useCallback)((e=>{var r=e?window.addEventListener:window.removeEventListener;r(d.current?"touchmove":"mousemove",u),r(d.current?"touchend":"mouseup",f)}),[]);(0,O.useEffect)((()=>(x(p),()=>{p&&x(!1)})),[p,x]);var b=(0,O.useCallback)((e=>{U(e.nativeEvent),(e=>!(d.current&&!G(e))&&(d.current=G(e),!0))(e.nativeEvent)&&(g&&g(Y(i.current,e.nativeEvent),e.nativeEvent),c(!0))}),[g]);return(0,q.jsx)("div",e({},l,{className:[o,a||""].filter(Boolean).join(" "),style:e({},l.style,{touchAction:"none"}),ref:i,tabIndex:0,onMouseDown:b,onTouchStart:b}))}));Q.displayName="Interactive";const Z=Q;var $=e=>{var{className:r,prefixCls:t,left:o,top:a}=e,s={position:"absolute",left:o,top:a};return(0,O.useMemo)((()=>(0,q.jsx)("div",{className:t+"-pointer "+(r||""),style:s,children:(0,q.jsx)("div",{className:t+"-fill",style:{width:18,height:18,transform:o?"translate(-9px, -1px)":"translate(-1px, -9px)",boxShadow:"rgb(0 0 0 / 37%) 0px 1px 4px 0px",borderRadius:"50%",backgroundColor:"rgb(248, 248, 248)"}})})),[r,o,a,t])},J=["prefixCls","className","hsva","background","bgProps","innerProps","radius","width","height","direction","style","onChange","pointer"],K="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMUlEQVQ4T2NkYGAQYcAP3uCTZhw1gGGYhAGBZIA/nYDCgBDAm9BGDWAAJyRCgLaBCAAgXwixzAS0pgAAAABJRU5ErkJggg==",ee=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-alpha",className:a,hsva:s,background:n,bgProps:l={},innerProps:i={},radius:d=0,width:p,height:c=16,direction:h="horizontal",style:g,onChange:f,pointer:x}=r,b=z(r,J),v=r=>{f&&f(e({},s,{a:"horizontal"===h?r.left:r.top}),r)},y=u(Object.assign({},s,{a:1})),m="linear-gradient(to "+("horizontal"===h?"right":"bottom")+", rgba(244, 67, 54, 0) 0%, "+y+" 100%)",C={};return"horizontal"===h?C.left=100*s.a+"%":C.top=100*s.a+"%",(0,q.jsxs)("div",e({},b,{className:[o,o+"-"+h,a||""].filter(Boolean).join(" "),style:e({borderRadius:d,background:"url("+K+") left center",backgroundColor:"#fff"},g,{position:"relative"},{width:p,height:c}),ref:t,children:[(0,q.jsx)("div",e({},l,{style:e({inset:0,position:"absolute",background:n||m,borderRadius:d},l.style)})),(0,q.jsx)(Z,e({},i,{style:e({},i.style,{inset:0,zIndex:1,position:"absolute"}),onMove:v,onDown:v,children:_().createElement(x||$,e({prefixCls:o},C))}))]}))}));ee.displayName="Aplha";const re=ee;var te=["prefixCls","className","color","colors","style","rectProps","onChange","addonAfter","addonBefore","rectRender"],oe=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-swatch",className:a,color:s,colors:n=[],style:l,rectProps:i={},onChange:d,addonAfter:p,addonBefore:c,rectRender:h}=r,g=z(r,te),u=e({background:"rgb(144, 19, 254)",height:15,width:15,marginRight:5,marginBottom:5,cursor:"pointer",position:"relative",outline:"none",borderRadius:2},i.style),f=(e,r)=>{d&&d(A(e),I(A(e)),r)};return(0,q.jsxs)("div",e({ref:t},g,{className:[o,a||""].filter(Boolean).join(" "),style:e({display:"flex",flexWrap:"wrap",position:"relative"},l),children:[c&&_().isValidElement(c)&&c,n&&Array.isArray(n)&&n.map(((r,t)=>{var o="",a="";"string"===typeof r&&(o=r,a=r),"object"===typeof r&&r.color&&(o=r.title||r.color,a=r.color);var n=s&&s.toLocaleLowerCase()===a.toLocaleLowerCase();if(h)return h({key:t,title:o,color:a,checked:!!n,style:e({},u,{background:a}),onClick:e=>f(a,e)});var l=i.children&&_().isValidElement(i.children)?_().cloneElement(i.children,{color:a,checked:n}):null;return(0,q.jsx)("div",e({tabIndex:0,title:o,onClick:e=>f(a,e)},i,{children:l,style:e({},u,{background:a})}),t)})),p&&_().isValidElement(p)&&p]}))}));oe.displayName="Swatch";const ae=oe;function se(r){var{style:t,title:o,checked:a,color:s,onClick:n,rectProps:l}=r,i=(0,O.useRef)(null),d=(0,O.useCallback)((()=>{i.current.style.zIndex="2",i.current.style.outline="#fff solid 2px",i.current.style.boxShadow="rgb(0 0 0 / 25%) 0 0 5px 2px"}),[]),p=(0,O.useCallback)((()=>{a||(i.current.style.zIndex="0",i.current.style.outline="initial",i.current.style.boxShadow="initial")}),[a]);return(0,q.jsx)("div",e({ref:i,title:o},l,{onClick:n,onMouseEnter:d,onMouseLeave:p,style:e({},t,{marginRight:0,marginBottom:0,borderRadius:0,boxSizing:"border-box",height:25,width:25},a?{zIndex:1,outline:"#fff solid 2px",boxShadow:"rgb(0 0 0 / 25%) 0 0 5px 2px"}:{zIndex:0},l.style)}))}var ne=["prefixCls","placement","className","style","color","colors","rectProps","onChange"],le=["key"],ie=["#B80000","#DB3E00","#FCCB00","#008B02","#006B76","#1273DE","#004DCF","#5300EB","#EB9694","#FAD0C3","#FEF3BD","#C1E1C5","#BEDADC","#C4DEF6","#BED3F3","#D4C4FB"],de=function(e){return e.Left="L",e.LeftTop="LT",e.LeftBotton="LB",e.Right="R",e.RightTop="RT",e.RightBotton="RB",e.Top="T",e.TopRight="TR",e.TopLeft="TL",e.Botton="B",e.BottonLeft="BL",e.BottonRight="BR",e}({}),pe=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-github",placement:a=de.TopRight,className:s,style:l,color:i,colors:d=ie,rectProps:p={},onChange:c}=r,h=z(r,ne),g="string"===typeof i&&n(i)?A(i):i,u=i?D(g):"",f={borderStyle:"solid",position:"absolute"},x=e({},f),b=e({},f);return/^T/.test(a)&&(x.borderWidth="0 8px 8px",x.borderColor="transparent transparent rgba(0, 0, 0, 0.15)",b.borderWidth="0 7px 7px",b.borderColor="transparent transparent #fff"),a===de.TopRight&&(x.top=-8,b.top=-7),a===de.Top&&(x.top=-8,b.top=-7),a===de.TopLeft&&(x.top=-8,b.top=-7),/^B/.test(a)&&(x.borderWidth="8px 8px 0 ",x.borderColor="rgba(0, 0, 0, 0.15) transparent transparent",b.borderWidth="7px 7px 0px",b.borderColor="#fff transparent transparent",a===de.BottonRight&&(x.top="100%",b.top="100%"),a===de.Botton&&(x.top="100%",b.top="100%"),a===de.BottonLeft&&(x.top="100%",b.top="100%")),/^(B|T)/.test(a)&&(a!==de.Top&&a!==de.Botton||(x.left="50%",x.marginLeft=-8,b.left="50%",b.marginLeft=-7),a!==de.TopRight&&a!==de.BottonRight||(x.right=10,b.right=11),a!==de.TopLeft&&a!==de.BottonLeft||(x.left=7,b.left=8)),/^L/.test(a)&&(x.borderWidth="8px 8px 8px 0px",x.borderColor="transparent rgba(0, 0, 0, 0.15) transparent transparent",b.borderWidth="7px 7px 7px 0px",b.borderColor="transparent #fff transparent transparent",x.left=-8,b.left=-7),/^R/.test(a)&&(x.borderWidth="8px 0px 8px 8px",x.borderColor="transparent transparent transparent rgba(0, 0, 0, 0.15)",b.borderWidth="7px 0px 7px 7px",b.borderColor="transparent transparent transparent #fff",x.right=-8,b.right=-7),/^(L|R)/.test(a)&&(a!==de.RightTop&&a!==de.LeftTop||(x.top=5,b.top=6),a!==de.Left&&a!==de.Right||(x.top="50%",b.top="50%",x.marginTop=-8,b.marginTop=-7),a!==de.LeftBotton&&a!==de.RightBotton||(x.top="100%",b.top="100%",x.marginTop=-21,b.marginTop=-20)),(0,q.jsx)(ae,e({ref:t,className:[o,s].filter(Boolean).join(" "),colors:d,color:u,rectRender:r=>{var{key:t}=r,o=z(r,le);return(0,q.jsx)(se,e({},o,{rectProps:p}),t)}},h,{onChange:e=>c&&c(I(e)),style:e({width:200,borderRadius:4,background:"#fff",boxShadow:"rgb(0 0 0 / 15%) 0px 3px 12px",border:"1px solid rgba(0, 0, 0, 0.2)",position:"relative",padding:5},l),rectProps:{style:{marginRight:0,marginBottom:0,borderRadius:0,height:25,width:25}},addonBefore:(0,q.jsxs)(O.Fragment,{children:[(0,q.jsx)("div",{style:x}),(0,q.jsx)("div",{style:b})]})}))}));pe.displayName="Github";const ce=pe;var he=e=>{var{className:r,color:t,left:o,top:a,prefixCls:s}=e,n={position:"absolute",top:a,left:o};return(0,O.useMemo)((()=>(0,q.jsx)("div",{className:s+"-pointer "+(r||""),style:n,children:(0,q.jsx)("div",{className:s+"-fill",style:{width:6,height:6,transform:"translate(-3px, -3px)",boxShadow:"rgb(255 255 255) 0px 0px 0px 1.5px, rgb(0 0 0 / 30%) 0px 0px 1px 1px inset, rgb(0 0 0 / 40%) 0px 0px 1px 2px",borderRadius:"50%",backgroundColor:t}})})),[a,o,t,r,s])},ge=["prefixCls","radius","pointer","className","style","hsva","onChange"],ue=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-saturation",radius:a=0,pointer:s,className:n,style:l,hsva:i,onChange:d}=r,p=z(r,ge),c=e({width:200,height:200,borderRadius:a},l,{position:"relative"}),h=(e,r)=>{d&&d({h:i.h,s:100*e.left,v:100*(1-e.top),a:i.a})},g={top:100-i.v+"%",left:i.s+"%",color:u(i)};return(0,q.jsx)(Z,e({className:[o,n||""].filter(Boolean).join(" ")},p,{style:e({position:"absolute",inset:0,cursor:"crosshair",backgroundImage:"linear-gradient(0deg, #000, transparent), linear-gradient(90deg, #fff, hsl("+i.h+", 100%, 50%))"},c),ref:t,onMove:h,onDown:h,children:_().createElement(s||he,e({prefixCls:o},g))}))}));ue.displayName="Saturation";const fe=ue;var xe=["prefixCls","className","hue","onChange","direction"],be=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-hue",className:a,hue:s=0,onChange:n,direction:l="horizontal"}=r,i=z(r,xe);return(0,q.jsx)(re,e({ref:t,className:o+" "+(a||"")},i,{direction:l,background:"linear-gradient(to "+("horizontal"===l?"right":"bottom")+", rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)",hsva:{h:s,s:100,v:100,a:s/360},onChange:(e,r)=>{n&&n({h:"horizontal"===l?360*r.left:360*r.top})}}))}));be.displayName="Hue";const ve=be;var ye=["prefixCls","placement","label","value","className","style","labelStyle","inputStyle","onChange","onBlur"],me=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input",placement:a="bottom",label:s,value:n,className:l,style:i,labelStyle:d,inputStyle:p,onChange:c,onBlur:h}=r,g=z(r,ye),[u,f]=(0,O.useState)(n),x=(0,O.useRef)(!1);(0,O.useEffect)((()=>{r.value!==u&&(x.current||f(r.value))}),[r.value]);var b={};return"bottom"===a&&(b.flexDirection="column"),"top"===a&&(b.flexDirection="column-reverse"),"left"===a&&(b.flexDirection="row-reverse"),(0,q.jsxs)("div",{className:[o,l||""].filter(Boolean).join(" "),style:e({position:"relative",alignItems:"center",display:"flex",fontSize:11},b,i),children:[(0,q.jsx)("input",e({ref:t,value:u,onChange:function(e,r){var t=r||e.target.value;/^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(t)&&c&&c(e,t);var o=(e=>Number(String(e).replace(/%/g,"")))(t);isNaN(o)||c&&c(e,o),f(t)},onBlur:function(e){x.current=!1,f(r.value),h&&h(e)},autoComplete:"off",onFocus:()=>x.current=!0},g,{style:e({width:"100%",paddingTop:2,paddingBottom:2,paddingLeft:3,paddingRight:3,fontSize:11,boxSizing:"border-box",border:"none",boxShadow:"rgb(204 204 204) 0px 0px 0px 1px inset"},p)})),s&&(0,q.jsx)("span",{style:e({color:"rgb(153, 153, 153)",textTransform:"capitalize"},d),children:s})]})}));me.displayName="EditableInput";const Ce=me;var we=["prefixCls","hsva","placement","rProps","gProps","bProps","aProps","className","style","onChange"],je=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input-rgba",hsva:a,placement:s="bottom",rProps:n={},gProps:l={},bProps:i={},aProps:d={},className:c,style:h,onChange:g}=r,u=z(r,we),f=a?P(a):{};function x(e){var r=Number(e.target.value);r&&r>255&&(e.target.value="255"),r&&r<0&&(e.target.value="0")}var b=(r,t,o)=>{"number"===typeof r&&("a"===t&&(r<0&&(r=0),r>100&&(r=100),g&&g(I(p(e({},f,{a:r/100}))))),r>255&&(r=255,o.target.value="255"),r<0&&(r=0,o.target.value="0"),"r"===t&&g&&g(I(p(e({},f,{r:r})))),"g"===t&&g&&g(I(p(e({},f,{g:r})))),"b"===t&&g&&g(I(p(e({},f,{b:r})))))};return(0,q.jsxs)("div",e({ref:t,className:[o,c||""].filter(Boolean).join(" ")},u,{style:e({fontSize:11,display:"flex"},h),children:[(0,q.jsx)(Ce,e({label:"R",value:f.r||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"r",e)},n,{style:e({},n.style)})),(0,q.jsx)(Ce,e({label:"G",value:f.g||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"g",e)},l,{style:e({marginLeft:5},n.style)})),(0,q.jsx)(Ce,e({label:"B",value:f.b||0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"b",e)},i,{style:e({marginLeft:5},i.style)})),d&&(0,q.jsx)(Ce,e({label:"A",value:f.a?parseInt(String(100*f.a),10):0,onBlur:x,placement:s,onChange:(e,r)=>b(r,"a",e)},d,{style:e({marginLeft:5},d.style)}))]}))}));je.displayName="EditableInputRGBA";const Re=je;var Se=["prefixCls","hsva","hProps","sProps","lProps","aProps","className","onChange"],Be=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-editable-input-hsla",hsva:a,hProps:s={},sProps:n={},lProps:l={},aProps:i={},className:d,onChange:p}=r,c=z(r,Se),h=a?y(a):{h:0,s:0,l:0,a:0},g=(r,t,o)=>{"number"===typeof r&&("h"===t&&(r<0&&(r=0),r>360&&(r=360),p&&p(I(v(e({},h,{h:r}))))),"s"===t&&(r<0&&(r=0),r>100&&(r=100),p&&p(I(v(e({},h,{s:r}))))),"l"===t&&(r<0&&(r=0),r>100&&(r=100),p&&p(I(v(e({},h,{l:r}))))),"a"===t&&(r<0&&(r=0),r>1&&(r=1),p&&p(I(v(e({},h,{a:r}))))))};return(0,q.jsx)(Re,e({ref:t,hsva:a,rProps:e({label:"H",value:Math.round(h.h)},s,{onChange:(e,r)=>g(r,"h")}),gProps:e({label:"S",value:Math.round(h.s)+"%"},n,{onChange:(e,r)=>g(r,"s")}),bProps:e({label:"L",value:Math.round(h.l)+"%"},l,{onChange:(e,r)=>g(r,"l")}),aProps:e({label:"A",value:Math.round(100*h.a)/100},i,{onChange:(e,r)=>g(r,"a")}),className:[o,d||""].filter(Boolean).join(" ")},c))}));Be.displayName="EditableInputHSLA";const Ne=Be;var Ae=["style"];function ke(r){var{style:t}=r,o=z(r,Ae),a=(0,O.useRef)(null),s=(0,O.useCallback)((()=>{a.current.style.backgroundColor="#e8e8e8"}),[]),n=(0,O.useCallback)((()=>{a.current.style.backgroundColor="transparent"}),[]);return(0,q.jsx)("div",e({ref:a,style:e({marginLeft:5,cursor:"pointer",transition:"background-color .3s",borderRadius:2},t)},o,{onMouseEnter:s,onMouseLeave:n,children:(0,q.jsx)("svg",{viewBox:"0 0 1024 1024",width:"24",height:"24",style:{display:"block"},children:(0,q.jsx)("path",{d:"M373.888 576h276.224c9.322667 0 14.293333 11.178667 9.173333 18.773333l-1.258666 1.557334-138.112 146.858666a10.709333 10.709333 0 0 1-14.293334 1.365334l-1.536-1.365334-138.112-146.858666c-6.592-6.997333-2.666667-18.645333 5.973334-20.16l1.941333-0.170667h276.224-276.224z m146.026667-295.189333l138.112 146.858666c7.04 7.509333 2.069333 20.330667-7.914667 20.330667H373.888c-9.984 0-14.976-12.821333-7.914667-20.330667l138.112-146.858666a10.730667 10.730667 0 0 1 15.829334 0z",fill:"#333"})})}))}var Pe=["prefixCls","className","style","color","inputType","rectProps","onChange"],Te=function(e){return e.HEXA="hexa",e.RGBA="rgba",e.HSLA="hsla",e}({}),Ee=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-chrome",className:a,style:s,color:l,inputType:i=Te.RGBA,rectProps:d={},onChange:p}=r,c=z(r,Pe),h="string"===typeof l&&n(l)?A(l):l||{h:0,s:0,l:0,a:0},g=e=>p&&p(I(e)),[u,f]=(0,O.useState)(i),x={paddingTop:6},b={textAlign:"center",paddingTop:4,paddingBottom:4};return(0,q.jsx)(ce,e({ref:t,color:h,style:e({borderRadius:0,flexDirection:"column",width:230,padding:0},s),colors:void 0,className:[o,a].filter(Boolean).join(" "),placement:de.TopLeft},c,{addonAfter:(0,q.jsxs)(O.Fragment,{children:[(0,q.jsx)(fe,{hsva:h,style:{width:"100%",height:130},onChange:r=>{g(e({},h,r,{a:h.a}))}}),(0,q.jsxs)("div",{style:{padding:15,display:"flex",alignItems:"center"},children:[(0,q.jsx)(re,{width:24,height:24,hsva:h,radius:2,style:{marginRight:15,borderRadius:"50%"},bgProps:{style:{background:"transparent"}},innerProps:{style:{borderRadius:"50%",background:E(h),boxShadow:"rgb(0 0 0 / 25%) 0px 0px 1px inset"}},pointer:()=>(0,q.jsx)(O.Fragment,{})}),(0,q.jsxs)("div",{style:{flex:1},children:[(0,q.jsx)(ve,{hue:h.h,style:{width:"100%"},bgProps:{style:{borderRadius:2}},onChange:r=>{g(e({},h,r))}}),(0,q.jsx)(re,{hsva:h,style:{marginTop:10},bgProps:{style:{borderRadius:2}},onChange:r=>{g(e({},h,r))}})]})]}),(0,q.jsxs)("div",{style:{display:"flex",alignItems:"flex-start",padding:"0 15px 15px 15px",userSelect:"none"},children:[(0,q.jsxs)("div",{style:{flex:1},children:[u==Te.RGBA&&(0,q.jsx)(Re,{hsva:h,rProps:{labelStyle:x,inputStyle:b},gProps:{labelStyle:x,inputStyle:b},bProps:{labelStyle:x,inputStyle:b},aProps:{labelStyle:x,inputStyle:b},onChange:e=>g(e.hsva)}),u===Te.HEXA&&(0,q.jsx)(Ce,{label:"HEX",labelStyle:x,inputStyle:b,value:h.a>0&&h.a<1?M(h).toLocaleUpperCase():D(h).toLocaleUpperCase(),onChange:(e,r)=>{"string"===typeof r&&g(A(/^#/.test(r)?r:"#"+r))}}),u===Te.HSLA&&(0,q.jsx)(Ne,{hsva:h,hProps:{labelStyle:x,inputStyle:b},sProps:{labelStyle:x,inputStyle:b},lProps:{labelStyle:x,inputStyle:b},aProps:{labelStyle:x,inputStyle:b},onChange:e=>g(e.hsva)})]}),(0,q.jsx)(ke,{onClick:()=>{u===Te.RGBA&&f(Te.HSLA),u===Te.HSLA&&f(Te.HEXA),u===Te.HEXA&&f(Te.RGBA)}})]})]}),rectRender:e=>{var{key:r}=e;return(0,q.jsx)(O.Fragment,{},r)}}))}));Ee.displayName="Chrome";const Le=Ee;var Fe=["prefixCls","className","style","color","colors","onChange"],De=["#D9E3F0","#F47373","#697689","#37D67A","#2CCCE4","#555555","#dce775","#ff8a65","#ba68c8"],Me=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-block",className:a,style:s,color:i,colors:d=De,onChange:p}=r,c=z(r,Fe),h="string"===typeof i&&n(i)?A(i):i,g=i?D(h):"",u=(e,r)=>{"string"===typeof e&&n(e)&&/(3|6)/.test(String(e.replace(/^#/,"").length))&&p&&p(I(A(e)))};return(0,q.jsxs)("div",e({ref:t,className:[o,a].filter(Boolean).join(" "),style:e({width:170,borderRadius:6,background:"rgb(255, 255, 255)",boxShadow:"rgb(0 0 0 / 10%) 0 1px",position:"relative"},s)},c,{children:[(0,q.jsx)("div",{style:{width:0,height:0,borderStyle:"solid",borderWidth:"0 10px 10px",borderColor:"transparent transparent "+g,position:"absolute",top:-10,left:"50%",marginLeft:-10}}),(0,q.jsx)("div",{title:g,style:{backgroundColor:""+g,color:l(g),height:110,fontSize:18,borderRadius:"6px 6px 0 0",display:"flex",alignItems:"center",justifyContent:"center"},children:g.toLocaleUpperCase()}),(0,q.jsx)(ae,{colors:d,color:g,style:{paddingLeft:10,paddingTop:10},rectProps:{style:{marginRight:10,marginBottom:10,borderRadius:4,height:22,width:22}},onChange:e=>{p&&p(I(e))}}),(0,q.jsx)(Ce,{value:g.toLocaleUpperCase(),onChange:(e,r)=>u(r),onBlur:e=>{var r=e.target.value;e.target.value=r.slice(0,6),u(r.slice(0,6))},inputStyle:{height:22,outline:0,borderRadius:3,color:"#666",padding:"0 7px"},style:{padding:10,paddingTop:0,borderRadius:"0 0 6px 6px"}})]}))}));Me.displayName="Block";const He=Me;var Ie=["prefixCls","className","style","onChange","color","colors"],ze=["#4D4D4D","#999999","#FFFFFF","#F44E3B","#FE9200","#FCDC00","#DBDF00","#A4DD00","#68CCCA","#73D8FF","#AEA1FF","#FDA1FF","#333333","#808080","#cccccc","#D33115","#E27300","#FCC400","#B0BC00","#68BC00","#16A5A5","#009CE0","#7B64FF","#FA28FF","#000000","#666666","#B3B3B3","#9F0500","#C45100","#FB9E00","#808900","#194D33","#0C797D","#0062B1","#653294","#AB149E"];function Oe(e){return e.checked?(0,q.jsx)("div",{style:{height:5,width:5,borderRadius:"50%",backgroundColor:l(e.color)}}):null}var _e=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-compact",className:a,style:s,onChange:l,color:i,colors:d=ze}=r,p=z(r,Ie),c="string"===typeof i&&n(i)?A(i):i,h=i?D(c).replace(/^#/,""):"",g=(0,O.useCallback)((e=>l&&l(I(e))),[]),u={style:{alignItems:"baseline"},inputStyle:{boxShadow:"none",backgroundColor:"transparent",outline:0}};return(0,q.jsxs)("div",e({ref:t,style:e({background:"#f6f6f6",borderRadius:3,display:"flex",width:240,flexWrap:"wrap",paddingTop:5,paddingLeft:5},s),className:[o,a||""].filter(Boolean).join(" ")},p,{children:[(0,q.jsx)(ae,{colors:d,color:i?D(c):void 0,rectProps:{children:(0,q.jsx)(Oe,{}),style:{display:"flex",alignItems:"center",justifyContent:"center"}},onChange:e=>g(e)}),(0,q.jsxs)("div",{style:{display:"flex",margin:"0 4px 3px 0"},children:[(0,q.jsx)(Ce,{onChange:(e,r)=>{var t;"string"===typeof(t=r)&&n(t)&&/(3|6)/.test(String(t.length))&&g(A(t))},labelStyle:{paddingRight:5,marginTop:-1},value:h.toLocaleUpperCase(),label:(0,q.jsx)("div",{style:{width:8,height:8,backgroundColor:"#"+h}}),inputStyle:{outline:"none",boxShadow:"initial",background:"transparent"},style:{flexDirection:"row-reverse",flex:"1 1 0%",minWidth:80}}),(0,q.jsx)(Re,{hsva:c,placement:"left",onChange:e=>g(e.hsva),aProps:!1,rProps:u,gProps:u,bProps:u})]})]}))}));_e.displayName="Compact";const We=_e;var Ge=["style","color"],Ue=["prefixCls","className","onChange","color","style","disableAlpha"],Xe=r=>{var{style:t,color:o}=r,a=z(r,Ge);return(0,q.jsx)("div",e({},a,{style:e({height:28,width:28,position:"absolute",transform:"translate(-14px, -4px)",boxShadow:"0 2px 4px rgb(0 0 0 / 20%)",borderRadius:"50%",background:"url("+K+")",backgroundColor:"#fff",border:"2px solid #fff",zIndex:1},t),children:(0,q.jsx)("div",{style:{backgroundColor:o,borderRadius:"50%",height:" 100%",width:"100%"}})}))},Ye=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-colorful",className:a,onChange:s,color:l,style:i,disableAlpha:d}=r,p=z(r,Ue),c="string"===typeof l&&n(l)?A(l):l||{},h=e=>s&&s(I(e));return(0,q.jsxs)("div",e({ref:t,style:e({width:200,position:"relative"},i)},p,{className:o+" "+(a||""),children:[(0,q.jsx)(fe,{hsva:c,className:o,radius:"8px 8px 0 0",style:{width:"auto",height:150,minWidth:120,borderBottom:"12px solid #000"},pointer:e=>{var{left:r,top:t,color:o}=e;return(0,q.jsx)(Xe,{style:{left:r,top:t,transform:"translate(-16px, -16px)"},color:D(c)})},onChange:r=>h(e({},c,r))}),(0,q.jsx)(ve,{hue:c.h,height:24,radius:d?"0 0 8px 8px":0,className:o,onChange:r=>h(e({},c,r)),pointer:e=>{var{left:r}=e;return(0,q.jsx)(Xe,{style:{left:r},color:"hsl("+(c.h||0)+"deg 100% 50%)"})}}),!d&&(0,q.jsx)(re,{hsva:c,height:24,className:o,radius:"0 0 8px 8px",pointer:e=>{var{left:r}=e;return(0,q.jsx)(Xe,{style:{left:r},color:E(c)})},onChange:r=>h(e({},c,r))})]}))}));Ye.displayName="Colorful";const qe=Ye;function Ve(r){var{style:t,title:o,checked:a,color:s,onClick:n,rectProps:l}=r,i=(0,O.useRef)(null),d=(0,O.useCallback)((()=>{i.current.style.transform="scale(1.2)"}),[]),p=(0,O.useCallback)((()=>{i.current.style.transform="scale(1)"}),[]);return(0,q.jsx)("div",{ref:i,onClick:n,onMouseEnter:d,onMouseLeave:p,title:o,style:e({},t,{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:3,borderRadius:"50%",marginRight:12,marginBottom:12,boxSizing:"border-box",transform:"scale(1)",boxShadow:s+" 0px 0px "+(a?5:0)+"px",transition:"transform 100ms ease 0s, box-shadow 100ms ease 0s"}),children:(0,q.jsx)("div",e({},l,{style:e({height:a?"100%":0,width:a?"100%":0,borderRadius:"50%",backgroundColor:"#fff",boxSizing:"border-box",transition:"height 100ms ease 0s, width 100ms ease 0s"},l.style)}))})}var Qe=["prefixCls","className","color","colors","rectProps","onChange"],Ze=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-circle",className:a,color:s,colors:l=[],rectProps:i={},onChange:d}=r,p=z(r,Qe),c="string"===typeof s&&n(s)?A(s):s||{},h=s?D(c):"";return(0,q.jsx)(ae,e({ref:t,colors:l,color:h},p,{className:[o,a].filter(Boolean).join(" "),rectRender:r=>{var t=e({},(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(r),r));return(0,q.jsx)(Ve,e({},t,{rectProps:i}))},onChange:e=>{d&&d(I(e))}}))}));Ze.displayName="Circle";const $e=Ze;var Je=["prefixCls","className","style","color","onChange"],Ke={boxShadow:"initial",borderWidth:"0 0 1px 0",borderBottomColor:"#eee",borderBottomStyle:"solid",height:30,outline:0,fontSize:15,padding:0},er=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-material",className:a,style:s,color:l,onChange:i}=r,d=z(r,Je),p="string"===typeof l&&n(l)?A(l):l,c=l?D(p).replace(/^#/,""):"",h=(e,r)=>{"string"===typeof e&&n(e)&&/(3|6)/.test(String(e.length))&&i&&i(I(A(e)))};return(0,q.jsxs)("div",e({ref:t,className:[o,a||""].filter(Boolean).join(" "),style:e({padding:16,width:98,fontFamily:"Roboto",backgroundColor:"#fff"},s)},d,{children:[(0,q.jsx)(Ce,{label:"Hex",value:c.toLocaleUpperCase(),onChange:(e,r)=>h(r),onBlur:e=>{var r=e.target.value;e.target.value=r.slice(0,6),h(r.slice(0,6))},inputStyle:{outline:0,border:0,height:30,fontSize:15,padding:0,boxShadow:"initial",borderWidth:"0 0 2px 0",borderBottomColor:c?"#"+c:"#eee",borderBottomStyle:"solid"},style:{flexDirection:"column-reverse",alignItems:"flex-start"}}),(0,q.jsx)(Re,{hsva:p,placement:"top",style:{marginTop:11},rProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},gProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},bProps:{style:{alignItems:"flex-start"},inputStyle:e({},Ke)},aProps:!1,onChange:e=>{return r=e.hsva,void(i&&i(I(r)));var r}})]}))}));er.displayName="Material";const rr=er;var tr=["prefixCls","className","onChange","direction","hsva"],or=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-saturation",className:a,onChange:s,direction:n="horizontal",hsva:l}=r,i=z(r,tr),d=u(e({},l,{a:1,v:100}));return(0,q.jsx)(re,e({ref:t},i,{className:o+" "+(a||""),hsva:{h:l.h,s:l.s,v:l.v,a:1-l.v/100},direction:n,background:"linear-gradient(to "+("horizontal"===n?"right":"bottom")+", "+d+", rgb(0, 0, 0))",onChange:(e,r)=>{s&&s({v:"horizontal"===n?100-100*r.left:100-100*r.top})}}))}));or.displayName="ShadeSlider";const ar=or;var sr=["prefixCls","className","style","onChange","color","lightness"],nr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-slider",className:a,style:s,onChange:l,color:i,lightness:d=[80,65,50,35,20]}=r,p=z(r,sr),h="string"===typeof i&&n(i)?A(i):i||{};return(0,q.jsx)("div",e({ref:t,style:e({display:"flex"},s),className:[o,a||""].filter(Boolean).join(" ")},p,{children:d.map(((r,t)=>{var o="hsl("+y(h).h+", 50%, "+r+"%)",a=o===c(h);return(0,q.jsx)("div",{style:{paddingLeft:1,width:100/d.length+"%",boxSizing:"border-box"},children:(0,q.jsx)("div",{onClick:e=>((e,r)=>{l&&l(I(b(e)),r)})(o,e),style:e({backgroundColor:o,height:12,cursor:"pointer"},a?{borderRadius:2,transform:"scale(1, 1.5)"}:{})})},t)}))}))}));nr.displayName="Slider";const lr=nr;var ir=["prefixCls","className","onChange","width","presetColors","color","editableDisable","disableAlpha","style"],dr=["#D0021B","#F5A623","#f8e61b","#8B572A","#7ED321","#417505","#BD10E0","#9013FE","#4A90E2","#50E3C2","#B8E986","#000000","#4A4A4A","#9B9B9B","#FFFFFF"],pr=e=>(0,q.jsx)("div",{style:{boxShadow:"rgb(0 0 0 / 60%) 0px 0px 2px",width:4,top:1,bottom:1,left:e.left,borderRadius:1,position:"absolute",backgroundColor:"#fff"}}),cr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-sketch",className:a,onChange:s,width:l=218,presetColors:i=dr,color:d,editableDisable:p=!0,disableAlpha:c=!1,style:h}=r,g=z(r,ir),[u,f]=(0,O.useState)({h:209,s:36,v:90,a:1});(0,O.useEffect)((()=>{"string"===typeof d&&n(d)&&f(A(d)),"object"===typeof d&&f(d)}),[d]);var x=e=>{f(e),s&&s(I(e))};return(0,q.jsxs)("div",e({},g,{className:o+" "+(a||""),ref:t,style:e({background:"rgb(255, 255, 255)",borderRadius:4,boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px, rgb(0 0 0 / 15%) 0px 8px 16px",width:l},h),children:[(0,q.jsxs)("div",{style:{padding:"10px 10px 8px"},children:[(0,q.jsx)(fe,{hsva:u,style:{width:"auto",height:150},onChange:r=>x(e({},u,r,{a:u.a}))}),(0,q.jsxs)("div",{style:{display:"flex",marginTop:4},children:[(0,q.jsxs)("div",{style:{flex:1},children:[(0,q.jsx)(ve,{width:"auto",height:10,hue:u.h,pointer:pr,innerProps:{style:{marginLeft:1,marginRight:5}},onChange:r=>x(e({},u,r))}),!c&&(0,q.jsx)(re,{width:"auto",height:10,hsva:u,pointer:pr,style:{marginTop:4},innerProps:{style:{marginLeft:1,marginRight:5}},onChange:r=>x(e({},u,{a:r.a}))})]}),!c&&(0,q.jsx)(re,{width:24,height:24,hsva:u,radius:2,style:{marginLeft:4},bgProps:{style:{background:"transparent"}},innerProps:{style:{borderRadius:2,background:E(u),boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px inset, rgb(0 0 0 / 25%) 0px 0px 4px inset"}},pointer:()=>(0,q.jsx)(O.Fragment,{})})]})]}),p&&(0,q.jsxs)("div",{style:{display:"flex",margin:"0 10px 3px 10px"},children:[(0,q.jsx)(Ce,{label:"Hex",value:D(u).replace(/^#/,"").toLocaleUpperCase(),onChange:(e,r)=>{var t;"string"===typeof(t=r)&&n(t)&&/(3|6)/.test(String(t.length))&&x(A(t))},style:{minWidth:58}}),(0,q.jsx)(Re,{hsva:u,style:{marginLeft:6},aProps:!c&&{},onChange:e=>x(e.hsva)})]}),i&&i.length>0&&(0,q.jsx)(ae,{style:{borderTop:"1px solid rgb(238, 238, 238)",paddingTop:10,paddingLeft:10},colors:i,color:D(u),onChange:e=>x(e),rectProps:{style:{marginRight:10,marginBottom:10,borderRadius:3,boxShadow:"rgb(0 0 0 / 15%) 0px 0px 0px 1px inset"}}})]}))}));cr.displayName="Sketch";const hr=cr;var gr=r=>{var{className:t,color:o,left:a,top:s,style:n,prefixCls:l}=r,i=e({},n,{position:"absolute",top:s,left:a}),d=l+"-pointer "+(t||"");return(0,q.jsx)("div",{className:d,style:i,children:(0,q.jsx)("div",{className:l+"-fill",style:{width:10,height:10,transform:"translate(-5px, -5px)",boxShadow:"rgb(255 255 255) 0px 0px 0px 1.5px, rgb(0 0 0 / 30%) 0px 0px 1px 1px inset, rgb(0 0 0 / 40%) 0px 0px 1px 2px",borderRadius:"50%",backgroundColor:"#fff"},children:(0,q.jsx)("div",{style:{inset:0,borderRadius:"50%",position:"absolute",backgroundColor:o}})})})},ur=2*Math.PI,fr=(e,r)=>(e%r+r)%r,xr=(e,r)=>Math.sqrt(e*e+r*r);function br(e){var{width:r=0}=e,t=r/2;return{width:r,radius:t,cx:t,cy:t}}function vr(e){var{width:r=0}=e;return r/2}function yr(e,r,t){var o=e.angle||0,a=e.direction;return t&&"clockwise"===a?r=o+r:"clockwise"===a?r=360-o+r:t&&"anticlockwise"===a?r=o+180-r:"anticlockwise"===a&&(r=o-r),fr(r,360)}var mr=["prefixCls","radius","pointer","className","style","width","height","direction","angle","color","onChange"],Cr=_().forwardRef(((r,t)=>{var{prefixCls:o="w-color-wheel",radius:a=0,pointer:s,className:l,style:i,width:d=200,height:p=200,direction:c="anticlockwise",angle:h=180,color:g,onChange:u}=r,f=z(r,mr),x="string"===typeof g&&n(g)?A(g):g||{},b=g?D(x):"",v=function(e,r){var{cx:t,cy:o}=br(e),a=vr(e),s=(180+yr(e,r.h,!0))*(ur/360),n=r.s/100*a,l="clockwise"===e.direction?-1:1;return{x:t+n*Math.cos(s)*l,y:o+n*Math.sin(s)*l}}({width:d},x),y={top:"0",left:"0",color:b},m=(e,r)=>{var t=function(e,r,t){var{cx:o,cy:a}=br(e),s=vr(e);r=o-r,t=a-t;var n=yr(e,Math.atan2(-t,-r)*(360/ur)),l=Math.min(xr(r,t),s);return{h:Math.round(n),s:Math.round(100/s*l)}}({width:d},d-e.x,p-e.y),o={h:t.h,s:t.s,v:x.v,a:x.a};u&&u(I(o))};return(0,q.jsxs)(Z,e({className:[o,l||""].filter(Boolean).join(" ")},f,{style:e({position:"relative",width:d,height:p},i),ref:t,onMove:m,onDown:m,children:[_().createElement(s||gr,e({prefixCls:o,style:{zIndex:1,transform:"translate("+v.x+"px, "+v.y+"px)"}},y)),(0,q.jsx)("div",{style:{position:"absolute",borderRadius:"50%",background:"anticlockwise"===c?"conic-gradient(red, yellow, lime, aqua, blue, magenta, red)":"conic-gradient(red, magenta, blue, aqua, lime, yellow, red)",transform:"rotateZ("+(h+90)+"deg)",inset:0}}),(0,q.jsx)("div",{style:{position:"absolute",borderRadius:"50%",background:"radial-gradient(circle closest-side, #fff, transparent)",inset:0}}),(0,q.jsx)("div",{style:{backgroundColor:"#000",borderRadius:"50%",position:"absolute",inset:0,opacity:"number"===typeof x.v?1-x.v/100:0}})]}))}));Cr.displayName="Wheel";const wr=Cr})(),a})()));

40

package.json
{
"name": "@uiw/react-color",
"version": "1.2.2",
"version": "1.2.3",
"description": "Color Picker component for React.",

@@ -50,21 +50,21 @@ "homepage": "https://uiwjs.github.io/react-color",

"dependencies": {
"@uiw/color-convert": "1.2.2",
"@uiw/react-color-alpha": "1.2.2",
"@uiw/react-color-block": "1.2.2",
"@uiw/react-color-chrome": "1.2.2",
"@uiw/react-color-circle": "1.2.2",
"@uiw/react-color-colorful": "1.2.2",
"@uiw/react-color-compact": "1.2.2",
"@uiw/react-color-editable-input": "1.2.2",
"@uiw/react-color-editable-input-hsla": "1.2.2",
"@uiw/react-color-editable-input-rgba": "1.2.2",
"@uiw/react-color-github": "1.2.2",
"@uiw/react-color-hue": "1.2.2",
"@uiw/react-color-material": "1.2.2",
"@uiw/react-color-saturation": "1.2.2",
"@uiw/react-color-shade-slider": "1.2.2",
"@uiw/react-color-sketch": "1.2.2",
"@uiw/react-color-slider": "1.2.2",
"@uiw/react-color-swatch": "1.2.2",
"@uiw/react-color-wheel": "1.2.2"
"@uiw/color-convert": "1.2.3",
"@uiw/react-color-alpha": "1.2.3",
"@uiw/react-color-block": "1.2.3",
"@uiw/react-color-chrome": "1.2.3",
"@uiw/react-color-circle": "1.2.3",
"@uiw/react-color-colorful": "1.2.3",
"@uiw/react-color-compact": "1.2.3",
"@uiw/react-color-editable-input": "1.2.3",
"@uiw/react-color-editable-input-hsla": "1.2.3",
"@uiw/react-color-editable-input-rgba": "1.2.3",
"@uiw/react-color-github": "1.2.3",
"@uiw/react-color-hue": "1.2.3",
"@uiw/react-color-material": "1.2.3",
"@uiw/react-color-saturation": "1.2.3",
"@uiw/react-color-shade-slider": "1.2.3",
"@uiw/react-color-sketch": "1.2.3",
"@uiw/react-color-slider": "1.2.3",
"@uiw/react-color-swatch": "1.2.3",
"@uiw/react-color-wheel": "1.2.3"
},

@@ -71,0 +71,0 @@ "devDependencies": {

25

README.md

@@ -1,9 +0,15 @@

<div align="center">
<!--rehype:ignore:start-->
<br/><br/><br/>
<p align="center">
<a title="React Color" href="https://uiwjs.github.io/react-color/">
<img src="https://user-images.githubusercontent.com/1680273/126048210-964aa087-8641-428e-a4e4-67cdca812159.png" alt="@uiw/react-color" />
<img src="https://github.com/uiwjs/react-color/assets/1680273/da32cf40-46fa-4da8-bd8e-fe6ad2ce3b1f" alt="@uiw/react-color" />
</a>
</div>
</p>
<br/><br/>
<!--dividing-->
<h1 align="center">React Color</h1>
<!--rehype:ignore:end-->
<div align="center">

@@ -31,2 +37,13 @@ <a href="https://github.com/uiwjs/react-color/actions/workflows/ci.yml">

<!--rehype:ignore:start-->
<br/><br/>
<p align="center">
<a title="React Color" href="https://uiwjs.github.io/react-color/">
<img src="https://user-images.githubusercontent.com/1680273/126048210-964aa087-8641-428e-a4e4-67cdca812159.png" alt="@uiw/react-color" />
</a>
</p>
<br/><br/>
<!--rehype:ignore:end-->
## Getting Started

@@ -33,0 +50,0 @@ 

dist/color.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc