epic-designer-gold/dist/index-B7KH3Crt.cjs

基于vue3的设计器,可视化开发页面表单

"use strict";const T=require("./_commonjsHelpers-DwTZ_eVU.cjs"),b=require("./index-CFee6cT1.cjs"),Mt=require("./index-DQpYVvll.cjs"),V=require("./_vue_commonjs-external-CccDNqHl.cjs"),Ve=require("./index-C_YCXvAJ.cjs"),ke=require("./index-CZGqsCMq.cjs"),Rt=require("./fade-in-scale-up.cssr-BPTizfZJ.cjs");function Ut(e,o){for(var r=0;r<o.length;r++){const l=o[r];if(typeof l!="string"&&!Array.isArray(l)){for(const i in l)if(i!=="default"&&!(i in e)){const t=Object.getOwnPropertyDescriptor(l,i);t&&Object.defineProperty(e,i,t.get?t:{enumerable:!0,get:()=>l[i]})}}}return Object.freeze(Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}))}var rt={},ot={},nt={},He={},ce={};Object.defineProperty(ce,"__esModule",{value:!0});ce.self=lt;const At=b.useTheme,Dt=b.common,zt=Ve.styles,Vt=ke.styles;function lt(e){const{fontSize:o,boxShadow2:r,popoverColor:l,textColor2:i,borderRadius:t,borderColor:a,heightSmall:s,heightMedium:h,heightLarge:k,fontSizeSmall:H,fontSizeMedium:M,fontSizeLarge:I,dividerColor:j}=e;return{panelFontSize:o,boxShadow:r,color:l,textColor:i,borderRadius:t,border:`1px solid ${a}`,heightSmall:s,heightMedium:h,heightLarge:k,fontSizeSmall:H,fontSizeMedium:M,fontSizeLarge:I,dividerColor:j}}const Ht=(0,At.createTheme)({name:"ColorPicker",common:Dt.commonLight,peers:{Input:Vt.inputLight,Button:zt.buttonLight},self:lt});ce.default=Ht;Object.defineProperty(He,"__esModule",{value:!0});const It=b.common,jt=Ve.styles,qt=ke.styles,Bt=ce,Ot={name:"ColorPicker",common:It.commonDark,peers:{Input:qt.inputDark,Button:jt.buttonDark},self:Bt.self};He.default=Ot;(function(e){var o=T.commonjsGlobal&&T.commonjsGlobal.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};Object.defineProperty(e,"__esModule",{value:!0}),e.colorPickerLight=e.colorPickerDark=void 0;var r=He;Object.defineProperty(e,"colorPickerDark",{enumerable:!0,get:function(){return o(r).default}});var l=ce;Object.defineProperty(e,"colorPickerLight",{enumerable:!0,get:function(){return o(l).default}})})(nt);var Ie={},y={};Object.defineProperty(y,"__esModule",{value:!0});y.deriveDefaultValue=Tt;y.getModeFromValue=it;y.getWCAGContrast=Ft;y.floor=Nt;y.normalizeHue=Lt;y.normalizeAlpha=Gt;y.convertColor=Wt;const c=b.require$$0,Et=b._utils;function Tt(e,o){switch(e[0]){case"hex":return o?"#000000FF":"#000000";case"rgb":return o?"rgba(0, 0, 0, 1)":"rgb(0, 0, 0)";case"hsl":return o?"hsla(0, 0%, 0%, 1)":"hsl(0, 0%, 0%)";case"hsv":return o?"hsva(0, 0%, 0%, 1)":"hsv(0, 0%, 0%)"}return process.env.NODE_ENV!=="production"&&(0,Et.warn)("color-picker","props.modes is invalid."),"#000000"}function it(e){return e===null?null:/^ *#/.test(e)?"hex":e.includes("rgb")?"rgb":e.includes("hsl")?"hsl":e.includes("hsv")?"hsv":null}function Ft(e,o=[255,255,255],r="AA"){const[l,i,t,a]=(0,c.rgba)((0,c.toHslaString)(e));if(a===1){const j=pe([l,i,t]),Y=pe(o);return(Math.max(j,Y)+.05)/(Math.min(j,Y)+.05)>=(r==="AA"?4.5:7)}const s=Math.round(l*a+o[0]*(1-a)),h=Math.round(i*a+o[1]*(1-a)),k=Math.round(t*a+o[2]*(1-a)),H=pe([s,h,k]),M=pe(o);return(Math.max(H,M)+.05)/(Math.min(H,M)+.05)>=(r==="AA"?4.5:7)}function pe(e){const[o,r,l]=e.map(i=>(i/=255,i<=.03928?i/12.92:Math.pow((i+.055)/1.055,2.4)));return .2126*o+.7152*r+.0722*l}function Nt(e){return e.map(o=>Math.floor(o))}function Lt(e){return e=Math.round(e),e>=360?359:e<0?0:e}function Gt(e){return e=Math.round(e*100)/100,e>1?1:e<0?0:e}const Kt={rgb:{hex(e){return(0,c.toHexaString)((0,c.rgba)(e))},hsl(e){const[o,r,l,i]=(0,c.rgba)(e);return(0,c.toHslaString)([...(0,c.rgb2hsl)(o,r,l),i])},hsv(e){const[o,r,l,i]=(0,c.rgba)(e);return(0,c.toHsvaString)([...(0,c.rgb2hsv)(o,r,l),i])}},hex:{rgb(e){return(0,c.toRgbaString)((0,c.rgba)(e))},hsl(e){const[o,r,l,i]=(0,c.rgba)(e);return(0,c.toHslaString)([...(0,c.rgb2hsl)(o,r,l),i])},hsv(e){const[o,r,l,i]=(0,c.rgba)(e);return(0,c.toHsvaString)([...(0,c.rgb2hsv)(o,r,l),i])}},hsl:{hex(e){const[o,r,l,i]=(0,c.hsla)(e);return(0,c.toHexaString)([...(0,c.hsl2rgb)(o,r,l),i])},rgb(e){const[o,r,l,i]=(0,c.hsla)(e);return(0,c.toRgbaString)([...(0,c.hsl2rgb)(o,r,l),i])},hsv(e){const[o,r,l,i]=(0,c.hsla)(e);return(0,c.toHsvaString)([...(0,c.hsl2hsv)(o,r,l),i])}},hsv:{hex(e){const[o,r,l,i]=(0,c.hsva)(e);return(0,c.toHexaString)([...(0,c.hsv2rgb)(o,r,l),i])},rgb(e){const[o,r,l,i]=(0,c.hsva)(e);return(0,c.toRgbaString)([...(0,c.hsv2rgb)(o,r,l),i])},hsl(e){const[o,r,l,i]=(0,c.hsva)(e);return(0,c.toHslaString)([...(0,c.hsv2hsl)(o,r,l),i])}}};function Wt(e,o,r){return r=r||it(e),r?r===o?e:Kt[r][o](e):null}Object.defineProperty(Ie,"__esModule",{value:!0});const ge=b.require$$0$1,Xt=b.require$$0,U=V.require$$2,Zt=y,ae="12px",Yt=12,K="6px";Ie.default=(0,U.defineComponent)({name:"AlphaSlider",props:{clsPrefix:{type:String,required:!0},rgba:{type:Array,default:null},alpha:{type:Number,default:0},onUpdateAlpha:{type:Function,required:!0},onComplete:Function},setup(e){const o=(0,U.ref)(null);function r(t){!o.value||!e.rgba||((0,ge.on)("mousemove",document,l),(0,ge.on)("mouseup",document,i),l(t))}function l(t){const{value:a}=o;if(!a)return;const{width:s,left:h}=a.getBoundingClientRect(),k=(t.clientX-h)/(s-Yt);e.onUpdateAlpha((0,Zt.normalizeAlpha)(k))}function i(){var t;(0,ge.off)("mousemove",document,l),(0,ge.off)("mouseup",document,i),(t=e.onComplete)===null||t===void 0||t.call(e)}return{railRef:o,railBackgroundImage:(0,U.computed)(()=>{const{rgba:t}=e;return t?`linear-gradient(to right, rgba(${t[0]}, ${t[1]}, ${t[2]}, 0) 0%, rgba(${t[0]}, ${t[1]}, ${t[2]}, 1) 100%)`:""}),handleMouseDown:r}},render(){const{clsPrefix:e}=this;return(0,U.h)("div",{class:`${e}-color-picker-slider`,ref:"railRef",style:{height:ae,borderRadius:K},onMousedown:this.handleMouseDown},(0,U.h)("div",{style:{borderRadius:K,position:"absolute",left:0,right:0,top:0,bottom:0,overflow:"hidden"}},(0,U.h)("div",{class:`${e}-color-picker-checkboard`}),(0,U.h)("div",{class:`${e}-color-picker-slider__image`,style:{backgroundImage:this.railBackgroundImage}})),this.rgba&&(0,U.h)("div",{style:{position:"absolute",left:K,right:K,top:0,bottom:0}},(0,U.h)("div",{class:`${e}-color-picker-handle`,style:{left:`calc(${this.alpha*100}% - ${K})`,borderRadius:K,width:ae,height:ae}},(0,U.h)("div",{class:`${e}-color-picker-handle__fill`,style:{backgroundColor:(0,Xt.toRgbaString)(this.rgba),borderRadius:K,width:ae,height:ae}}))))}});var je={},qe={},ne={};Object.defineProperty(ne,"__esModule",{value:!0});ne.colorPickerInjectionKey=void 0;const Jt=b._utils;ne.colorPickerInjectionKey=(0,Jt.createInjectionKey)("n-color-picker");Object.defineProperty(qe,"__esModule",{value:!0});const se=V.require$$2,Qt=ke.input,er=ne;function tr(e){return/^\d{1,3}\.?\d*$/.test(e.trim())?Math.max(0,Math.min(Number.parseInt(e),255)):!1}function rr(e){return/^\d{1,3}\.?\d*$/.test(e.trim())?Math.max(0,Math.min(Number.parseInt(e),360)):!1}function or(e){return/^\d{1,3}\.?\d*$/.test(e.trim())?Math.max(0,Math.min(Number.parseInt(e),100)):!1}function nr(e){const o=e.trim();return/^#[0-9a-fA-F]+$/.test(o)?[4,5,7,9].includes(o.length):!1}function lr(e){return/^\d{1,3}\.?\d*%$/.test(e.trim())?Math.max(0,Math.min(Number.parseInt(e)/100,100)):!1}const ir={paddingSmall:"0 4px"};qe.default=(0,se.defineComponent)({name:"ColorInputUnit",props:{label:{type:String,required:!0},value:{type:[Number,String],default:null},showAlpha:Boolean,onUpdateValue:{type:Function,required:!0}},setup(e){const o=(0,se.ref)(""),{themeRef:r}=(0,se.inject)(er.colorPickerInjectionKey,null);(0,se.watchEffect)(()=>{o.value=l()});function l(){const{value:a}=e;if(a===null)return"";const{label:s}=e;return s==="HEX"?a:s==="A"?`${Math.floor(a*100)}%`:String(Math.floor(a))}function i(a){o.value=a}function t(a){let s,h;switch(e.label){case"HEX":h=nr(a),h&&e.onUpdateValue(a),o.value=l();break;case"H":s=rr(a),s===!1?o.value=l():e.onUpdateValue(s);break;case"S":case"L":case"V":s=or(a),s===!1?o.value=l():e.onUpdateValue(s);break;case"A":s=lr(a),s===!1?o.value=l():e.onUpdateValue(s);break;case"R":case"G":case"B":s=tr(a),s===!1?o.value=l():e.onUpdateValue(s);break}}return{mergedTheme:r,inputValue:o,handleInputChange:t,handleInputUpdateValue:i}},render(){const{mergedTheme:e}=this;return(0,se.h)(Qt.NInput,{size:"small",placeholder:this.label,theme:e.peers.Input,themeOverrides:e.peerOverrides.Input,builtinThemeOverrides:ir,value:this.inputValue,onUpdateValue:this.handleInputUpdateValue,onChange:this.handleInputChange,style:this.label==="A"?"flex-grow: 1.25;":""})}});var ar=T.commonjsGlobal&&T.commonjsGlobal.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(je,"__esModule",{value:!0});const A=b.require$$0,re=V.require$$2,sr=ke.input,Qe=ar(qe);je.default=(0,re.defineComponent)({name:"ColorInput",props:{clsPrefix:{type:String,required:!0},mode:{type:String,required:!0},modes:{type:Array,required:!0},showAlpha:{type:Boolean,required:!0},value:{type:String,default:null},valueArr:{type:Array,default:null},onUpdateValue:{type:Function,required:!0},onUpdateMode:{type:Function,required:!0}},setup(e){return{handleUnitUpdateValue(o,r){const{showAlpha:l}=e;if(e.mode==="hex"){e.onUpdateValue((l?A.toHexaString:A.toHexString)(r));return}let i;switch(e.valueArr===null?i=[0,0,0,0]:i=Array.from(e.valueArr),e.mode){case"hsv":i[o]=r,e.onUpdateValue((l?A.toHsvaString:A.toHsvString)(i));break;case"rgb":i[o]=r,e.onUpdateValue((l?A.toRgbaString:A.toRgbString)(i));break;case"hsl":i[o]=r,e.onUpdateValue((l?A.toHslaString:A.toHslString)(i));break}}}},render(){const{clsPrefix:e,modes:o}=this;return(0,re.h)("div",{class:`${e}-color-picker-input`},(0,re.h)("div",{class:`${e}-color-picker-input__mode`,onClick:this.onUpdateMode,style:{cursor:o.length===1?"":"pointer"}},this.mode.toUpperCase()+(this.showAlpha?"A":"")),(0,re.h)(sr.NInputGroup,null,{default:()=>{const{mode:r,valueArr:l,showAlpha:i}=this;if(r==="hex"){let t=null;try{t=l===null?null:(i?A.toHexaString:A.toHexString)(l)}catch{}return(0,re.h)(Qe.default,{label:"HEX",showAlpha:i,value:t,onUpdateValue:a=>{this.handleUnitUpdateValue(0,a)}})}return(r+(i?"a":"")).split("").map((t,a)=>(0,re.h)(Qe.default,{label:t.toUpperCase(),value:l===null?null:l[a],onUpdateValue:s=>{this.handleUnitUpdateValue(a,s)}}))}}))}});var Be={};Object.defineProperty(Be,"__esModule",{value:!0});const ze=b.require$$0,ue=V.require$$2,ur=b._utils,et=y;function cr(e,o){if(o==="hsv"){const[r,l,i,t]=(0,ze.hsva)(e);return(0,ze.toRgbaString)([...(0,ze.hsv2rgb)(r,l,i),t])}return e}function dr(e){const o=document.createElement("canvas").getContext("2d");return o?(o.fillStyle=e,o.fillStyle):"#000000"}Be.default=(0,ue.defineComponent)({name:"ColorPickerSwatches",props:{clsPrefix:{type:String,required:!0},mode:{type:String,required:!0},swatches:{type:Array,required:!0},onUpdateColor:{type:Function,required:!0}},setup(e){const o=(0,ue.computed)(()=>e.swatches.map(t=>{const a=(0,et.getModeFromValue)(t);return{value:t,mode:a,legalValue:cr(t,a)}}));function r(t){const{mode:a}=e;let{value:s,mode:h}=t;return h||(h="hex",/^[a-zA-Z]+$/.test(s)?s=dr(s):((0,ur.warn)("color-picker",`color ${s} in swatches is invalid.`),s="#000000")),h===a?s:(0,et.convertColor)(s,a,h)}function l(t){e.onUpdateColor(r(t))}function i(t,a){t.key==="Enter"&&l(a)}return{parsedSwatchesRef:o,handleSwatchSelect:l,handleSwatchKeyDown:i}},render(){const{clsPrefix:e}=this;return(0,ue.h)("div",{class:`${e}-color-picker-swatches`},this.parsedSwatchesRef.map(o=>(0,ue.h)("div",{class:`${e}-color-picker-swatch`,tabindex:0,onClick:()=>{this.handleSwatchSelect(o)},onKeydown:r=>{this.handleSwatchKeyDown(r,o)}},(0,ue.h)("div",{class:`${e}-color-picker-swatch__fill`,style:{background:o.legalValue}}))))}});var Oe={};Object.defineProperty(Oe,"__esModule",{value:!0});const hr=b.require$$0,W=V.require$$2,fr=ne,pr=y;Oe.default=(0,W.defineComponent)({name:"ColorPickerTrigger",slots:Object,props:{clsPrefix:{type:String,required:!0},value:{type:String,default:null},hsla:{type:Array,default:null},disabled:Boolean,onClick:Function},setup(e){const{colorPickerSlots:o,renderLabelRef:r}=(0,W.inject)(fr.colorPickerInjectionKey,null);return()=>{const{hsla:l,value:i,clsPrefix:t,onClick:a,disabled:s}=e,h=o.label||r.value;return(0,W.h)("div",{class:[`${t}-color-picker`,s&&`${t}-color-picker--disabled`],onClick:s?void 0:a},(0,W.h)("div",{class:`${t}-color-picker__fill`},(0,W.h)("div",{class:`${t}-color-picker-checkboard`}),(0,W.h)("div",{style:{position:"absolute",left:0,right:0,top:0,bottom:0,backgroundColor:l?(0,hr.toHslaString)(l):""}}),i&&l?(0,W.h)("div",{class:`${t}-color-picker__value`,style:{color:(0,pr.getWCAGContrast)(l)?"white":"black"}},h?h(i):i):null))}}});var Ee={};Object.defineProperty(Ee,"__esModule",{value:!0});const ve=V.require$$2,tt=y;Ee.default=(0,ve.defineComponent)({name:"ColorPreview",props:{clsPrefix:{type:String,required:!0},mode:{type:String,required:!0},color:{type:String,default:null,validator:e=>{const o=(0,tt.getModeFromValue)(e);return!!(!e||o&&o!=="hsv")}},onUpdateColor:{type:Function,required:!0}},setup(e){function o(r){var l;const i=r.target.value;(l=e.onUpdateColor)===null||l===void 0||l.call(e,(0,tt.convertColor)(i.toUpperCase(),e.mode,"hex")),r.stopPropagation()}return{handleChange:o}},render(){const{clsPrefix:e}=this;return(0,ve.h)("div",{class:`${e}-color-picker-preview__preview`},(0,ve.h)("span",{class:`${e}-color-picker-preview__fill`,style:{background:this.color||"#000000"}}),(0,ve.h)("input",{class:`${e}-color-picker-preview__input`,type:"color",value:this.color,onChange:this.handleChange}))}});var Te={};Object.defineProperty(Te,"__esModule",{value:!0});const me=b.require$$0$1,X=V.require$$2,gr=y,oe="12px",vr=12,Z="6px",mr=6,br="linear-gradient(90deg,red,#ff0 16.66%,#0f0 33.33%,#0ff 50%,#00f 66.66%,#f0f 83.33%,red)";Te.default=(0,X.defineComponent)({name:"HueSlider",props:{clsPrefix:{type:String,required:!0},hue:{type:Number,required:!0},onUpdateHue:{type:Function,required:!0},onComplete:Function},setup(e){const o=(0,X.ref)(null);function r(t){o.value&&((0,me.on)("mousemove",document,l),(0,me.on)("mouseup",document,i),l(t))}function l(t){const{value:a}=o;if(!a)return;const{width:s,left:h}=a.getBoundingClientRect(),k=(0,gr.normalizeHue)((t.clientX-h-mr)/(s-vr)*360);e.onUpdateHue(k)}function i(){var t;(0,me.off)("mousemove",document,l),(0,me.off)("mouseup",document,i),(t=e.onComplete)===null||t===void 0||t.call(e)}return{railRef:o,handleMouseDown:r}},render(){const{clsPrefix:e}=this;return(0,X.h)("div",{class:`${e}-color-picker-slider`,style:{height:oe,borderRadius:Z}},(0,X.h)("div",{ref:"railRef",style:{boxShadow:"inset 0 0 2px 0 rgba(0, 0, 0, .24)",boxSizing:"border-box",backgroundImage:br,height:oe,borderRadius:Z,position:"relative"},onMousedown:this.handleMouseDown},(0,X.h)("div",{style:{position:"absolute",left:Z,right:Z,top:0,bottom:0}},(0,X.h)("div",{class:`${e}-color-picker-handle`,style:{left:`calc((${this.hue}%) / 359 * 100 - ${Z})`,borderRadius:Z,width:oe,height:oe}},(0,X.h)("div",{class:`${e}-color-picker-handle__fill`,style:{backgroundColor:`hsl(${this.hue}, 100%, 50%)`,borderRadius:Z,width:oe,height:oe}})))))}});var Fe={};Object.defineProperty(Fe,"__esModule",{value:!0});const be=b.require$$0$1,E=V.require$$2,_e="12px",xe="6px";Fe.default=(0,E.defineComponent)({name:"Pallete",props:{clsPrefix:{type:String,required:!0},rgba:{type:Array,default:null},displayedHue:{type:Number,required:!0},displayedSv:{type:Array,required:!0},onUpdateSV:{type:Function,required:!0},onComplete:Function},setup(e){const o=(0,E.ref)(null);function r(t){o.value&&((0,be.on)("mousemove",document,l),(0,be.on)("mouseup",document,i),l(t))}function l(t){const{value:a}=o;if(!a)return;const{width:s,height:h,left:k,bottom:H}=a.getBoundingClientRect(),M=(H-t.clientY)/h,I=(t.clientX-k)/s,j=100*(I>1?1:I<0?0:I),Y=100*(M>1?1:M<0?0:M);e.onUpdateSV(j,Y)}function i(){var t;(0,be.off)("mousemove",document,l),(0,be.off)("mouseup",document,i),(t=e.onComplete)===null||t===void 0||t.call(e)}return{palleteRef:o,handleColor:(0,E.computed)(()=>{const{rgba:t}=e;return t?`rgb(${t[0]}, ${t[1]}, ${t[2]})`:""}),handleMouseDown:r}},render(){const{clsPrefix:e}=this;return(0,E.h)("div",{class:`${e}-color-picker-pallete`,onMousedown:this.handleMouseDown,ref:"palleteRef"},(0,E.h)("div",{class:`${e}-color-picker-pallete__layer`,style:{backgroundImage:`linear-gradient(90deg, white, hsl(${this.displayedHue}, 100%, 50%))`}}),(0,E.h)("div",{class:`${e}-color-picker-pallete__layer ${e}-color-picker-pallete__layer--shadowed`,style:{backgroundImage:"linear-gradient(180deg, rgba(0, 0, 0, 0%), rgba(0, 0, 0, 100%))"}}),this.rgba&&(0,E.h)("div",{class:`${e}-color-picker-handle`,style:{width:_e,height:_e,borderRadius:xe,left:`calc(${this.displayedSv[0]}% - ${xe})`,bottom:`calc(${this.displayedSv[1]}% - ${xe})`}},(0,E.h)("div",{class:`${e}-color-picker-handle__fill`,style:{backgroundColor:this.handleColor,borderRadius:xe,width:_e,height:_e}})))}});var Ne={};Object.defineProperty(Ne,"__esModule",{value:!0});const _r=Rt.fadeInScaleUp_cssr,u=b.cssr;Ne.default=(0,u.c)([(0,u.cB)("color-picker-panel",`
 margin: 4px 0;
 width: 240px;
 font-size: var(--n-panel-font-size);
 color: var(--n-text-color);
 background-color: var(--n-color);
 transition:
 box-shadow .3s var(--n-bezier),
 color .3s var(--n-bezier),
 background-color .3s var(--n-bezier);
 border-radius: var(--n-border-radius);
 box-shadow: var(--n-box-shadow);
 `,[(0,_r.fadeInScaleUpTransition)(),(0,u.cB)("input",`
 text-align: center;
 `)]),(0,u.cB)("color-picker-checkboard",`
 background: white; 
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 `,[(0,u.c)("&::after",`
 background-image: linear-gradient(45deg, #DDD 25%, #0000 25%), linear-gradient(-45deg, #DDD 25%, #0000 25%), linear-gradient(45deg, #0000 75%, #DDD 75%), linear-gradient(-45deg, #0000 75%, #DDD 75%);
 background-size: 12px 12px;
 background-position: 0 0, 0 6px, 6px -6px, -6px 0px;
 background-repeat: repeat;
 content: "";
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 `)]),(0,u.cB)("color-picker-slider",`
 margin-bottom: 8px;
 position: relative;
 box-sizing: border-box;
 `,[(0,u.cE)("image",`
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 `),(0,u.c)("&::after",`
 content: "";
 position: absolute;
 border-radius: inherit;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .24);
 pointer-events: none;
 `)]),(0,u.cB)("color-picker-handle",`
 z-index: 1;
 box-shadow: 0 0 2px 0 rgba(0, 0, 0, .45);
 position: absolute;
 background-color: white;
 overflow: hidden;
 `,[(0,u.cE)("fill",`
 box-sizing: border-box;
 border: 2px solid white;
 `)]),(0,u.cB)("color-picker-pallete",`
 height: 180px;
 position: relative;
 margin-bottom: 8px;
 cursor: crosshair;
 `,[(0,u.cE)("layer",`
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 `,[(0,u.cM)("shadowed",`
 box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .24);
 `)])]),(0,u.cB)("color-picker-preview",`
 display: flex;
 `,[(0,u.cE)("sliders",`
 flex: 1 0 auto;
 `),(0,u.cE)("preview",`
 position: relative;
 height: 30px;
 width: 30px;
 margin: 0 0 8px 6px;
 border-radius: 50%;
 box-shadow: rgba(0, 0, 0, .15) 0px 0px 0px 1px inset;
 overflow: hidden;
 `),(0,u.cE)("fill",`
 display: block;
 width: 30px;
 height: 30px;
 `),(0,u.cE)("input",`
 position: absolute;
 top: 0;
 left: 0;
 width: 30px;
 height: 30px;
 opacity: 0;
 z-index: 1;
 `)]),(0,u.cB)("color-picker-input",`
 display: flex;
 align-items: center;
 `,[(0,u.cB)("input",`
 flex-grow: 1;
 flex-basis: 0;
 `),(0,u.cE)("mode",`
 width: 72px;
 text-align: center;
 `)]),(0,u.cB)("color-picker-control",`
 padding: 12px;
 `),(0,u.cB)("color-picker-action",`
 display: flex;
 margin-top: -4px;
 border-top: 1px solid var(--n-divider-color);
 padding: 8px 12px;
 justify-content: flex-end;
 `,[(0,u.cB)("button","margin-left: 8px;")]),(0,u.cB)("color-picker",`
 display: inline-block;
 box-sizing: border-box;
 height: var(--n-height);
 font-size: var(--n-font-size);
 width: 100%;
 position: relative;
 cursor: pointer;
 border: var(--n-border);
 border-radius: var(--n-border-radius);
 transition: border-color .3s var(--n-bezier);
 `,[(0,u.cM)("disabled","cursor: not-allowed"),(0,u.cE)("value",`
 white-space: nowrap;
 position: relative;
 `),(0,u.cE)("fill",`
 border-radius: var(--n-border-radius);
 position: absolute;
 display: flex;
 align-items: center;
 justify-content: center;
 left: 4px;
 right: 4px;
 top: 4px;
 bottom: 4px;
 `),(0,u.cB)("color-picker-checkboard",`
 border-radius: var(--n-border-radius);
 `,[(0,u.c)("&::after",`
 --n-block-size: calc((var(--n-height) - 8px) / 3);
 background-size: calc(var(--n-block-size) * 2) calc(var(--n-block-size) * 2);
 background-position: 0 0, 0 var(--n-block-size), var(--n-block-size) calc(-1 * var(--n-block-size)), calc(-1 * var(--n-block-size)) 0px; 
 `)])]),(0,u.cB)("color-picker-swatches",`
 display: grid;
 grid-gap: 8px;
 flex-wrap: wrap;
 position: relative;
 grid-template-columns: repeat(auto-fill, 18px);
 margin-top: 10px;
 `,[(0,u.cB)("color-picker-swatch",`
 width: 18px;
 height: 18px;
 background-image: linear-gradient(45deg, #DDD 25%, #0000 25%), linear-gradient(-45deg, #DDD 25%, #0000 25%), linear-gradient(45deg, #0000 75%, #DDD 75%), linear-gradient(-45deg, #0000 75%, #DDD 75%);
 background-size: 8px 8px;
 background-position: 0px 0, 0px 4px, 4px -4px, -4px 0px;
 background-repeat: repeat;
 `,[(0,u.cE)("fill",`
 position: relative;
 width: 100%;
 height: 100%;
 border-radius: 3px;
 box-shadow: rgba(0, 0, 0, .15) 0px 0px 0px 1px inset;
 cursor: pointer;
 `),(0,u.c)("&:focus",`
 outline: none;
 `,[(0,u.cE)("fill",[(0,u.c)("&::after",`
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 background: inherit;
 filter: blur(2px);
 content: "";
 `)])])])])]);(function(e){var o=T.commonjsGlobal&&T.commonjsGlobal.__importDefault||function(d){return d&&d.__esModule?d:{default:d}};Object.defineProperty(e,"__esModule",{value:!0}),e.colorPickerProps=void 0;const r=b.require$$0,l=Mt.require$$2,i=b.require$$1,t=V.require$$2,a=b.require$$4,s=b._mixins,h=b._utils,k=Ve.button,H=nt,M=o(Ie),I=o(je),j=o(Be),Y=o(Oe),Le=o(Ee),at=ne,st=o(Te),ut=o(Fe),ct=o(Ne),ye=y;e.colorPickerProps=Object.assign(Object.assign({},s.useTheme.props),{value:String,show:{type:Boolean,default:void 0},defaultShow:Boolean,defaultValue:String,modes:{type:Array,default:()=>["rgb","hex","hsl"]},placement:{type:String,default:"bottom-start"},to:h.useAdjustedTo.propTo,showAlpha:{type:Boolean,default:!0},showPreview:Boolean,swatches:Array,disabled:{type:Boolean,default:void 0},actions:{type:Array,default:null},internalActions:Array,size:String,renderLabel:Function,onComplete:Function,onConfirm:Function,onClear:Function,"onUpdate:show":[Function,Array],onUpdateShow:[Function,Array],"onUpdate:value":[Function,Array],onUpdateValue:[Function,Array]}),e.default=(0,t.defineComponent)({name:"ColorPicker",props:e.colorPickerProps,slots:Object,setup(d,{slots:F}){let N=null;function Ge(n){N=n}let le=null;const{mergedClsPrefixRef:Se,namespaceRef:dt,inlineThemeDisabled:we,mergedComponentPropsRef:$e}=(0,s.useConfig)(d),Ce=(0,s.useFormItem)(d,{mergedSize:n=>{var f,p;const{size:v}=d;if(v)return v;const{mergedSize:m}=n||{};if(m!=null&&m.value)return m.value;const g=(p=(f=$e==null?void 0:$e.value)===null||f===void 0?void 0:f.ColorPicker)===null||p===void 0?void 0:p.size;return g||"medium"}}),{mergedSizeRef:Ke,mergedDisabledRef:We}=Ce,{localeRef:de}=(0,s.useLocale)("global"),Pe=(0,s.useTheme)("ColorPicker","-color-picker",ct.default,H.colorPickerLight,d,Se);(0,t.provide)(at.colorPickerInjectionKey,{themeRef:Pe,renderLabelRef:(0,t.toRef)(d,"renderLabel"),colorPickerSlots:F});const Xe=(0,t.ref)(d.defaultShow),Ze=(0,i.useMergedState)((0,t.toRef)(d,"show"),Xe);function he(n){const{onUpdateShow:f,"onUpdate:show":p}=d;f&&(0,h.call)(f,n),p&&(0,h.call)(p,n),Xe.value=n}const{defaultValue:Ye}=d,Je=(0,t.ref)(Ye===void 0?(0,ye.deriveDefaultValue)(d.modes,d.showAlpha):Ye),S=(0,i.useMergedState)((0,t.toRef)(d,"value"),Je),J=(0,t.ref)([S.value]),D=(0,t.ref)(0),Me=(0,t.computed)(()=>(0,ye.getModeFromValue)(S.value)),{modes:ht}=d,R=(0,t.ref)((0,ye.getModeFromValue)(S.value)||ht[0]||"rgb");function ft(){const{modes:n}=d,{value:f}=R,p=n.findIndex(v=>v===f);~p?R.value=n[(p+1)%n.length]:R.value="rgb"}let $,C,Q,ee,q,B,O,P;const ie=(0,t.computed)(()=>{const{value:n}=S;if(!n)return null;switch(Me.value){case"hsv":return(0,r.hsva)(n);case"hsl":return[$,C,Q,P]=(0,r.hsla)(n),[...(0,r.hsl2hsv)($,C,Q),P];case"rgb":case"hex":return[q,B,O,P]=(0,r.rgba)(n),[...(0,r.rgb2hsv)(q,B,O),P]}}),L=(0,t.computed)(()=>{const{value:n}=S;if(!n)return null;switch(Me.value){case"rgb":case"hex":return(0,r.rgba)(n);case"hsv":return[$,C,ee,P]=(0,r.hsva)(n),[...(0,r.hsv2rgb)($,C,ee),P];case"hsl":return[$,C,Q,P]=(0,r.hsla)(n),[...(0,r.hsl2rgb)($,C,Q),P]}}),Re=(0,t.computed)(()=>{const{value:n}=S;if(!n)return null;switch(Me.value){case"hsl":return(0,r.hsla)(n);case"hsv":return[$,C,ee,P]=(0,r.hsva)(n),[...(0,r.hsv2hsl)($,C,ee),P];case"rgb":case"hex":return[q,B,O,P]=(0,r.rgba)(n),[...(0,r.rgb2hsl)(q,B,O),P]}}),pt=(0,t.computed)(()=>{switch(R.value){case"rgb":case"hex":return L.value;case"hsv":return ie.value;case"hsl":return Re.value}}),fe=(0,t.ref)(0),Ue=(0,t.ref)(1),Ae=(0,t.ref)([0,0]);function gt(n,f){const{value:p}=ie,v=fe.value,m=p?p[3]:1;Ae.value=[n,f];const{showAlpha:g}=d;switch(R.value){case"hsv":_((g?r.toHsvaString:r.toHsvString)([v,n,f,m]),"cursor");break;case"hsl":_((g?r.toHslaString:r.toHslString)([...(0,r.hsv2hsl)(v,n,f),m]),"cursor");break;case"rgb":_((g?r.toRgbaString:r.toRgbString)([...(0,r.hsv2rgb)(v,n,f),m]),"cursor");break;case"hex":_((g?r.toHexaString:r.toHexString)([...(0,r.hsv2rgb)(v,n,f),m]),"cursor");break}}function vt(n){fe.value=n;const{value:f}=ie;if(!f)return;const[,p,v,m]=f,{showAlpha:g}=d;switch(R.value){case"hsv":_((g?r.toHsvaString:r.toHsvString)([n,p,v,m]),"cursor");break;case"rgb":_((g?r.toRgbaString:r.toRgbString)([...(0,r.hsv2rgb)(n,p,v),m]),"cursor");break;case"hex":_((g?r.toHexaString:r.toHexString)([...(0,r.hsv2rgb)(n,p,v),m]),"cursor");break;case"hsl":_((g?r.toHslaString:r.toHslString)([...(0,r.hsv2hsl)(n,p,v),m]),"cursor");break}}function mt(n){switch(R.value){case"hsv":[$,C,ee]=ie.value,_((0,r.toHsvaString)([$,C,ee,n]),"cursor");break;case"rgb":[q,B,O]=L.value,_((0,r.toRgbaString)([q,B,O,n]),"cursor");break;case"hex":[q,B,O]=L.value,_((0,r.toHexaString)([q,B,O,n]),"cursor");break;case"hsl":[$,C,Q]=Re.value,_((0,r.toHslaString)([$,C,Q,n]),"cursor");break}Ue.value=n}function _(n,f){f==="cursor"?le=n:le=null;const{nTriggerFormChange:p,nTriggerFormInput:v}=Ce,{onUpdateValue:m,"onUpdate:value":g}=d;m&&(0,h.call)(m,n),g&&(0,h.call)(g,n),p(),v(),Je.value=n}function bt(n){_(n,"input"),(0,t.nextTick)(te)}function te(n=!0){const{value:f}=S;if(f){const{nTriggerFormChange:p,nTriggerFormInput:v}=Ce,{onComplete:m}=d;m&&m(f);const{value:g}=J,{value:w}=D;n&&(g.splice(w+1,g.length,f),D.value=w+1),p(),v()}}function _t(){const{value:n}=D;n-1<0||(_(J.value[n-1],"input"),te(!1),D.value=n-1)}function xt(){const{value:n}=D;n<0||n+1>=J.value.length||(_(J.value[n+1],"input"),te(!1),D.value=n+1)}function kt(){_(null,"input");const{onClear:n}=d;n&&n(),he(!1)}function yt(){const{value:n}=S,{onConfirm:f}=d;f&&f(n),he(!1)}const St=(0,t.computed)(()=>D.value>=1),wt=(0,t.computed)(()=>{const{value:n}=J;return n.length>1&&D.value<n.length-1});(0,t.watch)(Ze,n=>{n||(J.value=[S.value],D.value=0)}),(0,t.watchEffect)(()=>{if(!(le&&le===S.value)){const{value:n}=ie;n&&(fe.value=n[0],Ue.value=n[3],Ae.value=[n[1],n[2]])}le=null});const De=(0,t.computed)(()=>{const{value:n}=Ke,{common:{cubicBezierEaseInOut:f},self:{textColor:p,color:v,panelFontSize:m,boxShadow:g,border:w,borderRadius:x,dividerColor:G,[(0,h.createKey)("height",n)]:Ct,[(0,h.createKey)("fontSize",n)]:Pt}}=Pe.value;return{"--n-bezier":f,"--n-text-color":p,"--n-color":v,"--n-panel-font-size":m,"--n-font-size":Pt,"--n-box-shadow":g,"--n-border":w,"--n-border-radius":x,"--n-height":Ct,"--n-divider-color":G}}),z=we?(0,s.useThemeClass)("color-picker",(0,t.computed)(()=>Ke.value[0]),De,d):void 0;function $t(){var n;const{value:f}=L,{value:p}=fe,{internalActions:v,modes:m,actions:g}=d,{value:w}=Pe,{value:x}=Se;return(0,t.h)("div",{class:[`${x}-color-picker-panel`,z==null?void 0:z.themeClass.value],onDragstart:G=>{G.preventDefault()},style:we?void 0:De.value},(0,t.h)("div",{class:`${x}-color-picker-control`},(0,t.h)(ut.default,{clsPrefix:x,rgba:f,displayedHue:p,displayedSv:Ae.value,onUpdateSV:gt,onComplete:te}),(0,t.h)("div",{class:`${x}-color-picker-preview`},(0,t.h)("div",{class:`${x}-color-picker-preview__sliders`},(0,t.h)(st.default,{clsPrefix:x,hue:p,onUpdateHue:vt,onComplete:te}),d.showAlpha?(0,t.h)(M.default,{clsPrefix:x,rgba:f,alpha:Ue.value,onUpdateAlpha:mt,onComplete:te}):null),d.showPreview?(0,t.h)(Le.default,{clsPrefix:x,mode:R.value,color:L.value&&(0,r.toHexString)(L.value),onUpdateColor:G=>{_(G,"input")}}):null),(0,t.h)(I.default,{clsPrefix:x,showAlpha:d.showAlpha,mode:R.value,modes:m,onUpdateMode:ft,value:S.value,valueArr:pt.value,onUpdateValue:bt}),((n=d.swatches)===null||n===void 0?void 0:n.length)&&(0,t.h)(j.default,{clsPrefix:x,mode:R.value,swatches:d.swatches,onUpdateColor:G=>{_(G,"input")}})),g!=null&&g.length?(0,t.h)("div",{class:`${x}-color-picker-action`},g.includes("confirm")&&(0,t.h)(k.NButton,{size:"small",onClick:yt,theme:w.peers.Button,themeOverrides:w.peerOverrides.Button},{default:()=>de.value.confirm}),g.includes("clear")&&(0,t.h)(k.NButton,{size:"small",onClick:kt,disabled:!S.value,theme:w.peers.Button,themeOverrides:w.peerOverrides.Button},{default:()=>de.value.clear})):null,F.action?(0,t.h)("div",{class:`${x}-color-picker-action`},{default:F.action}):v?(0,t.h)("div",{class:`${x}-color-picker-action`},v.includes("undo")&&(0,t.h)(k.NButton,{size:"small",onClick:_t,disabled:!St.value,theme:w.peers.Button,themeOverrides:w.peerOverrides.Button},{default:()=>de.value.undo}),v.includes("redo")&&(0,t.h)(k.NButton,{size:"small",onClick:xt,disabled:!wt.value,theme:w.peers.Button,themeOverrides:w.peerOverrides.Button},{default:()=>de.value.redo})):null)}return{mergedClsPrefix:Se,namespace:dt,hsla:Re,rgba:L,mergedShow:Ze,mergedDisabled:We,isMounted:(0,i.useIsMounted)(),adjustedTo:(0,h.useAdjustedTo)(d),mergedValue:S,handleTriggerClick(){We.value||he(!0)},setTriggerRef:Ge,handleClickOutside(n){if(N instanceof Element){if(N.contains((0,r.getPreciseEventTarget)(n)))return}else if(N&&N.$el.contains((0,r.getPreciseEventTarget)(n)))return;he(!1)},renderPanel:$t,cssVars:we?void 0:De,themeClass:z==null?void 0:z.themeClass,onRender:z==null?void 0:z.onRender}},render(){const{mergedClsPrefix:d,onRender:F}=this;return F==null||F(),(0,t.h)(a.VBinder,null,{default:()=>[(0,t.h)(a.VTarget,null,{default:()=>(0,h.resolveWrappedSlotWithProps)(this.$slots.trigger,{value:this.mergedValue,onClick:this.handleTriggerClick,ref:this.setTriggerRef},N=>N||(0,t.h)(Y.default,{clsPrefix:d,value:this.mergedValue,hsla:this.hsla,style:this.cssVars,ref:this.setTriggerRef,disabled:this.mergedDisabled,class:this.themeClass,onClick:this.mergedDisabled?void 0:this.handleTriggerClick}))}),(0,t.h)(a.VFollower,{placement:this.placement,show:this.mergedShow,containerClass:this.namespace,teleportDisabled:this.adjustedTo===h.useAdjustedTo.tdkey,to:this.adjustedTo},{default:()=>(0,t.h)(t.Transition,{name:"fade-in-scale-up-transition",appear:this.isMounted},{default:()=>this.mergedShow?(0,t.withDirectives)(this.renderPanel(),[[l.clickoutside,this.handleClickOutside,void 0,{capture:!0}]]):null})})]})}})})(ot);(function(e){var o=T.commonjsGlobal&&T.commonjsGlobal.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(e,"__esModule",{value:!0}),e.NColorPicker=e.colorPickerProps=void 0;var r=ot;Object.defineProperty(e,"colorPickerProps",{enumerable:!0,get:function(){return r.colorPickerProps}}),Object.defineProperty(e,"NColorPicker",{enumerable:!0,get:function(){return o(r).default}})})(rt);const xr=Ut({__proto__:null},[rt]);exports.index=xr;