halleyx-ui-framework 11.11.0 → 11.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{ColorPicker-D1oBj2cv.js → ColorPicker-CCTqen0d.js} +1 -1
- package/dist/assets/{index-CGaycY2y.css → index-BuoTyB2f.css} +1 -1
- package/dist/assets/{index--65pUzH_.js → index-Djh91Mb4.js} +2 -2
- package/dist/cjs/index.css +1 -1
- package/dist/es/index.css +1 -1
- package/dist/index.html +2 -2
- package/dist/umd/index.css +1 -1
- package/dist/umd/index.umd.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as t,c as e,i as a,l as n,n as r,o as i,r as o,s,t as l}from"./index--65pUzH_.js";function d(t){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},d(t)}var c=/^\s+/,f=/\s+$/;function u(t,e){if(e=e||{},(t=t||"")instanceof u)return t;if(!(this instanceof u))return new u(t,e);var a=function(t){var e={r:0,g:0,b:0},a=1,n=null,r=null,i=null,o=!1,s=!1;"string"==typeof t&&(t=function(t){t=t.replace(c,"").replace(f,"").toLowerCase();var e,a=!1;if(F[t])t=F[t],a=!0;else if("transparent"==t)return{r:0,g:0,b:0,a:0,format:"name"};return(e=G.rgb.exec(t))?{r:e[1],g:e[2],b:e[3]}:(e=G.rgba.exec(t))?{r:e[1],g:e[2],b:e[3],a:e[4]}:(e=G.hsl.exec(t))?{h:e[1],s:e[2],l:e[3]}:(e=G.hsla.exec(t))?{h:e[1],s:e[2],l:e[3],a:e[4]}:(e=G.hsv.exec(t))?{h:e[1],s:e[2],v:e[3]}:(e=G.hsva.exec(t))?{h:e[1],s:e[2],v:e[3],a:e[4]}:(e=G.hex8.exec(t))?{r:I(e[1]),g:I(e[2]),b:I(e[3]),a:D(e[4]),format:a?"name":"hex8"}:(e=G.hex6.exec(t))?{r:I(e[1]),g:I(e[2]),b:I(e[3]),format:a?"name":"hex"}:(e=G.hex4.exec(t))?{r:I(e[1]+""+e[1]),g:I(e[2]+""+e[2]),b:I(e[3]+""+e[3]),a:D(e[4]+""+e[4]),format:a?"name":"hex8"}:!!(e=G.hex3.exec(t))&&{r:I(e[1]+""+e[1]),g:I(e[2]+""+e[2]),b:I(e[3]+""+e[3]),format:a?"name":"hex"}}(t));"object"==d(t)&&(O(t.r)&&O(t.g)&&O(t.b)?(l=t.r,u=t.g,h=t.b,e={r:255*H(l,255),g:255*H(u,255),b:255*H(h,255)},o=!0,s="%"===String(t.r).substr(-1)?"prgb":"rgb"):O(t.h)&&O(t.s)&&O(t.v)?(n=N(t.s),r=N(t.v),e=function(t,e,a){t=6*H(t,360),e=H(e,100),a=H(a,100);var n=Math.floor(t),r=t-n,i=a*(1-e),o=a*(1-r*e),s=a*(1-(1-r)*e),l=n%6,d=[a,o,i,i,s,a][l],c=[s,a,a,o,i,i][l],f=[i,i,s,a,a,o][l];return{r:255*d,g:255*c,b:255*f}}(t.h,n,r),o=!0,s="hsv"):O(t.h)&&O(t.s)&&O(t.l)&&(n=N(t.s),i=N(t.l),e=function(t,e,a){var n,r,i;function o(t,e,a){return a<0&&(a+=1),a>1&&(a-=1),a<1/6?t+6*(e-t)*a:a<.5?e:a<2/3?t+(e-t)*(2/3-a)*6:t}if(t=H(t,360),e=H(e,100),a=H(a,100),0===e)n=r=i=a;else{var s=a<.5?a*(1+e):a+e-a*e,l=2*a-s;n=o(l,s,t+1/3),r=o(l,s,t),i=o(l,s,t-1/3)}return{r:255*n,g:255*r,b:255*i}}(t.h,n,i),o=!0,s="hsl"),t.hasOwnProperty("a")&&(a=t.a));var l,u,h;return a=R(a),{ok:o,format:t.format||s,r:Math.min(255,Math.max(e.r,0)),g:Math.min(255,Math.max(e.g,0)),b:Math.min(255,Math.max(e.b,0)),a:a}}(t);this._originalInput=t,this._r=a.r,this._g=a.g,this._b=a.b,this._a=a.a,this._roundA=Math.round(100*this._a)/100,this._format=e.format||a.format,this._gradientType=e.gradientType,this._r<1&&(this._r=Math.round(this._r)),this._g<1&&(this._g=Math.round(this._g)),this._b<1&&(this._b=Math.round(this._b)),this._ok=a.ok}function h(t,e,a){t=H(t,255),e=H(e,255),a=H(a,255);var n,r,i=Math.max(t,e,a),o=Math.min(t,e,a),s=(i+o)/2;if(i==o)n=r=0;else{var l=i-o;switch(r=s>.5?l/(2-i-o):l/(i+o),i){case t:n=(e-a)/l+(e<a?6:0);break;case e:n=(a-t)/l+2;break;case a:n=(t-e)/l+4}n/=6}return{h:n,s:r,l:s}}function g(t,e,a){t=H(t,255),e=H(e,255),a=H(a,255);var n,r,i=Math.max(t,e,a),o=Math.min(t,e,a),s=i,l=i-o;if(r=0===i?0:l/i,i==o)n=0;else{switch(i){case t:n=(e-a)/l+(e<a?6:0);break;case e:n=(a-t)/l+2;break;case a:n=(t-e)/l+4}n/=6}return{h:n,s:r,v:s}}function b(t,e,a,n){var r=[q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16))];return n&&r[0].charAt(0)==r[0].charAt(1)&&r[1].charAt(0)==r[1].charAt(1)&&r[2].charAt(0)==r[2].charAt(1)?r[0].charAt(0)+r[1].charAt(0)+r[2].charAt(0):r.join("")}function v(t,e,a,n){return[q(z(n)),q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16))].join("")}function p(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.s-=e/100,a.s=B(a.s),u(a)}function m(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.s+=e/100,a.s=B(a.s),u(a)}function y(t){return u(t).desaturate(100)}function _(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.l+=e/100,a.l=B(a.l),u(a)}function w(t,e){e=0===e?0:e||10;var a=u(t).toRgb();return a.r=Math.max(0,Math.min(255,a.r-Math.round(-e/100*255))),a.g=Math.max(0,Math.min(255,a.g-Math.round(-e/100*255))),a.b=Math.max(0,Math.min(255,a.b-Math.round(-e/100*255))),u(a)}function x(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.l-=e/100,a.l=B(a.l),u(a)}function M(t,e){var a=u(t).toHsl(),n=(a.h+e)%360;return a.h=n<0?360+n:n,u(a)}function A(t){var e=u(t).toHsl();return e.h=(e.h+180)%360,u(e)}function k(t,e){if(isNaN(e)||e<=0)throw new Error("Argument to polyad must be a positive number");for(var a=u(t).toHsl(),n=[u(t)],r=360/e,i=1;i<e;i++)n.push(u({h:(a.h+i*r)%360,s:a.s,l:a.l}));return n}function S(t){var e=u(t).toHsl(),a=e.h;return[u(t),u({h:(a+72)%360,s:e.s,l:e.l}),u({h:(a+216)%360,s:e.s,l:e.l})]}function E(t,e,a){e=e||6,a=a||30;var n=u(t).toHsl(),r=360/a,i=[u(t)];for(n.h=(n.h-(r*e>>1)+720)%360;--e;)n.h=(n.h+r)%360,i.push(u(n));return i}function C(t,e){e=e||6;for(var a=u(t).toHsv(),n=a.h,r=a.s,i=a.v,o=[],s=1/e;e--;)o.push(u({h:n,s:r,v:i})),i=(i+s)%1;return o}u.prototype={isDark:function(){return this.getBrightness()<128},isLight:function(){return!this.isDark()},isValid:function(){return this._ok},getOriginalInput:function(){return this._originalInput},getFormat:function(){return this._format},getAlpha:function(){return this._a},getBrightness:function(){var t=this.toRgb();return(299*t.r+587*t.g+114*t.b)/1e3},getLuminance:function(){var t=this.toRgb(),e=t.r/255,a=t.g/255,n=t.b/255;return.2126*(e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4))+.7152*(a<=.03928?a/12.92:Math.pow((a+.055)/1.055,2.4))+.0722*(n<=.03928?n/12.92:Math.pow((n+.055)/1.055,2.4))},setAlpha:function(t){return this._a=R(t),this._roundA=Math.round(100*this._a)/100,this},toHsv:function(){var t=g(this._r,this._g,this._b);return{h:360*t.h,s:t.s,v:t.v,a:this._a}},toHsvString:function(){var t=g(this._r,this._g,this._b),e=Math.round(360*t.h),a=Math.round(100*t.s),n=Math.round(100*t.v);return 1==this._a?"hsv("+e+", "+a+"%, "+n+"%)":"hsva("+e+", "+a+"%, "+n+"%, "+this._roundA+")"},toHsl:function(){var t=h(this._r,this._g,this._b);return{h:360*t.h,s:t.s,l:t.l,a:this._a}},toHslString:function(){var t=h(this._r,this._g,this._b),e=Math.round(360*t.h),a=Math.round(100*t.s),n=Math.round(100*t.l);return 1==this._a?"hsl("+e+", "+a+"%, "+n+"%)":"hsla("+e+", "+a+"%, "+n+"%, "+this._roundA+")"},toHex:function(t){return b(this._r,this._g,this._b,t)},toHexString:function(t){return"#"+this.toHex(t)},toHex8:function(t){return function(t,e,a,n,r){var i=[q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16)),q(z(n))];return r&&i[0].charAt(0)==i[0].charAt(1)&&i[1].charAt(0)==i[1].charAt(1)&&i[2].charAt(0)==i[2].charAt(1)&&i[3].charAt(0)==i[3].charAt(1)?i[0].charAt(0)+i[1].charAt(0)+i[2].charAt(0)+i[3].charAt(0):i.join("")}(this._r,this._g,this._b,this._a,t)},toHex8String:function(t){return"#"+this.toHex8(t)},toRgb:function(){return{r:Math.round(this._r),g:Math.round(this._g),b:Math.round(this._b),a:this._a}},toRgbString:function(){return 1==this._a?"rgb("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+")":"rgba("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+", "+this._roundA+")"},toPercentageRgb:function(){return{r:Math.round(100*H(this._r,255))+"%",g:Math.round(100*H(this._g,255))+"%",b:Math.round(100*H(this._b,255))+"%",a:this._a}},toPercentageRgbString:function(){return 1==this._a?"rgb("+Math.round(100*H(this._r,255))+"%, "+Math.round(100*H(this._g,255))+"%, "+Math.round(100*H(this._b,255))+"%)":"rgba("+Math.round(100*H(this._r,255))+"%, "+Math.round(100*H(this._g,255))+"%, "+Math.round(100*H(this._b,255))+"%, "+this._roundA+")"},toName:function(){return 0===this._a?"transparent":!(this._a<1)&&(L[b(this._r,this._g,this._b,!0)]||!1)},toFilter:function(t){var e="#"+v(this._r,this._g,this._b,this._a),a=e,n=this._gradientType?"GradientType = 1, ":"";if(t){var r=u(t);a="#"+v(r._r,r._g,r._b,r._a)}return"progid:DXImageTransform.Microsoft.gradient("+n+"startColorstr="+e+",endColorstr="+a+")"},toString:function(t){var e=!!t;t=t||this._format;var a=!1,n=this._a<1&&this._a>=0;return e||!n||"hex"!==t&&"hex6"!==t&&"hex3"!==t&&"hex4"!==t&&"hex8"!==t&&"name"!==t?("rgb"===t&&(a=this.toRgbString()),"prgb"===t&&(a=this.toPercentageRgbString()),"hex"!==t&&"hex6"!==t||(a=this.toHexString()),"hex3"===t&&(a=this.toHexString(!0)),"hex4"===t&&(a=this.toHex8String(!0)),"hex8"===t&&(a=this.toHex8String()),"name"===t&&(a=this.toName()),"hsl"===t&&(a=this.toHslString()),"hsv"===t&&(a=this.toHsvString()),a||this.toHexString()):"name"===t&&0===this._a?this.toName():this.toRgbString()},clone:function(){return u(this.toString())},_applyModification:function(t,e){var a=t.apply(null,[this].concat([].slice.call(e)));return this._r=a._r,this._g=a._g,this._b=a._b,this.setAlpha(a._a),this},lighten:function(){return this._applyModification(_,arguments)},brighten:function(){return this._applyModification(w,arguments)},darken:function(){return this._applyModification(x,arguments)},desaturate:function(){return this._applyModification(p,arguments)},saturate:function(){return this._applyModification(m,arguments)},greyscale:function(){return this._applyModification(y,arguments)},spin:function(){return this._applyModification(M,arguments)},_applyCombination:function(t,e){return t.apply(null,[this].concat([].slice.call(e)))},analogous:function(){return this._applyCombination(E,arguments)},complement:function(){return this._applyCombination(A,arguments)},monochromatic:function(){return this._applyCombination(C,arguments)},splitcomplement:function(){return this._applyCombination(S,arguments)},triad:function(){return this._applyCombination(k,[3])},tetrad:function(){return this._applyCombination(k,[4])}},u.fromRatio=function(t,e){if("object"==d(t)){var a={};for(var n in t)t.hasOwnProperty(n)&&(a[n]="a"===n?t[n]:N(t[n]));t=a}return u(t,e)},u.equals=function(t,e){return!(!t||!e)&&u(t).toRgbString()==u(e).toRgbString()},u.random=function(){return u.fromRatio({r:Math.random(),g:Math.random(),b:Math.random()})},u.mix=function(t,e,a){a=0===a?0:a||50;var n=u(t).toRgb(),r=u(e).toRgb(),i=a/100;return u({r:(r.r-n.r)*i+n.r,g:(r.g-n.g)*i+n.g,b:(r.b-n.b)*i+n.b,a:(r.a-n.a)*i+n.a})},u.readability=function(t,e){var a=u(t),n=u(e);return(Math.max(a.getLuminance(),n.getLuminance())+.05)/(Math.min(a.getLuminance(),n.getLuminance())+.05)},u.isReadable=function(t,e,a){var n,r=u.readability(t,e),i=!1;switch((n=function(t){var e,a;e=((t=t||{level:"AA",size:"small"}).level||"AA").toUpperCase(),a=(t.size||"small").toLowerCase(),"AA"!==e&&"AAA"!==e&&(e="AA");"small"!==a&&"large"!==a&&(a="small");return{level:e,size:a}}(a)).level+n.size){case"AAsmall":case"AAAlarge":i=r>=4.5;break;case"AAlarge":i=r>=3;break;case"AAAsmall":i=r>=7}return i},u.mostReadable=function(t,e,a){var n,r,i,o,s=null,l=0;r=(a=a||{}).includeFallbackColors,i=a.level,o=a.size;for(var d=0;d<e.length;d++)(n=u.readability(t,e[d]))>l&&(l=n,s=u(e[d]));return u.isReadable(t,s,{level:i,size:o})||!r?s:(a.includeFallbackColors=!1,u.mostReadable(t,["#fff","#000"],a))};var F=u.names={aliceblue:"f0f8ff",antiquewhite:"faebd7",aqua:"0ff",aquamarine:"7fffd4",azure:"f0ffff",beige:"f5f5dc",bisque:"ffe4c4",black:"000",blanchedalmond:"ffebcd",blue:"00f",blueviolet:"8a2be2",brown:"a52a2a",burlywood:"deb887",burntsienna:"ea7e5d",cadetblue:"5f9ea0",chartreuse:"7fff00",chocolate:"d2691e",coral:"ff7f50",cornflowerblue:"6495ed",cornsilk:"fff8dc",crimson:"dc143c",cyan:"0ff",darkblue:"00008b",darkcyan:"008b8b",darkgoldenrod:"b8860b",darkgray:"a9a9a9",darkgreen:"006400",darkgrey:"a9a9a9",darkkhaki:"bdb76b",darkmagenta:"8b008b",darkolivegreen:"556b2f",darkorange:"ff8c00",darkorchid:"9932cc",darkred:"8b0000",darksalmon:"e9967a",darkseagreen:"8fbc8f",darkslateblue:"483d8b",darkslategray:"2f4f4f",darkslategrey:"2f4f4f",darkturquoise:"00ced1",darkviolet:"9400d3",deeppink:"ff1493",deepskyblue:"00bfff",dimgray:"696969",dimgrey:"696969",dodgerblue:"1e90ff",firebrick:"b22222",floralwhite:"fffaf0",forestgreen:"228b22",fuchsia:"f0f",gainsboro:"dcdcdc",ghostwhite:"f8f8ff",gold:"ffd700",goldenrod:"daa520",gray:"808080",green:"008000",greenyellow:"adff2f",grey:"808080",honeydew:"f0fff0",hotpink:"ff69b4",indianred:"cd5c5c",indigo:"4b0082",ivory:"fffff0",khaki:"f0e68c",lavender:"e6e6fa",lavenderblush:"fff0f5",lawngreen:"7cfc00",lemonchiffon:"fffacd",lightblue:"add8e6",lightcoral:"f08080",lightcyan:"e0ffff",lightgoldenrodyellow:"fafad2",lightgray:"d3d3d3",lightgreen:"90ee90",lightgrey:"d3d3d3",lightpink:"ffb6c1",lightsalmon:"ffa07a",lightseagreen:"20b2aa",lightskyblue:"87cefa",lightslategray:"789",lightslategrey:"789",lightsteelblue:"b0c4de",lightyellow:"ffffe0",lime:"0f0",limegreen:"32cd32",linen:"faf0e6",magenta:"f0f",maroon:"800000",mediumaquamarine:"66cdaa",mediumblue:"0000cd",mediumorchid:"ba55d3",mediumpurple:"9370db",mediumseagreen:"3cb371",mediumslateblue:"7b68ee",mediumspringgreen:"00fa9a",mediumturquoise:"48d1cc",mediumvioletred:"c71585",midnightblue:"191970",mintcream:"f5fffa",mistyrose:"ffe4e1",moccasin:"ffe4b5",navajowhite:"ffdead",navy:"000080",oldlace:"fdf5e6",olive:"808000",olivedrab:"6b8e23",orange:"ffa500",orangered:"ff4500",orchid:"da70d6",palegoldenrod:"eee8aa",palegreen:"98fb98",paleturquoise:"afeeee",palevioletred:"db7093",papayawhip:"ffefd5",peachpuff:"ffdab9",peru:"cd853f",pink:"ffc0cb",plum:"dda0dd",powderblue:"b0e0e6",purple:"800080",rebeccapurple:"663399",red:"f00",rosybrown:"bc8f8f",royalblue:"4169e1",saddlebrown:"8b4513",salmon:"fa8072",sandybrown:"f4a460",seagreen:"2e8b57",seashell:"fff5ee",sienna:"a0522d",silver:"c0c0c0",skyblue:"87ceeb",slateblue:"6a5acd",slategray:"708090",slategrey:"708090",snow:"fffafa",springgreen:"00ff7f",steelblue:"4682b4",tan:"d2b48c",teal:"008080",thistle:"d8bfd8",tomato:"ff6347",turquoise:"40e0d0",violet:"ee82ee",wheat:"f5deb3",white:"fff",whitesmoke:"f5f5f5",yellow:"ff0",yellowgreen:"9acd32"},L=u.hexNames=function(t){var e={};for(var a in t)t.hasOwnProperty(a)&&(e[t[a]]=a);return e}(F);function R(t){return t=parseFloat(t),(isNaN(t)||t<0||t>1)&&(t=1),t}function H(t,e){(function(t){return"string"==typeof t&&-1!=t.indexOf(".")&&1===parseFloat(t)})(t)&&(t="100%");var a=function(t){return"string"==typeof t&&-1!=t.indexOf("%")}(t);return t=Math.min(e,Math.max(0,parseFloat(t))),a&&(t=parseInt(t*e,10)/100),Math.abs(t-e)<1e-6?1:t%e/parseFloat(e)}function B(t){return Math.min(1,Math.max(0,t))}function I(t){return parseInt(t,16)}function q(t){return 1==t.length?"0"+t:""+t}function N(t){return t<=1&&(t=100*t+"%"),t}function z(t){return Math.round(255*parseFloat(t)).toString(16)}function D(t){return I(t)/255}var j,T,P,G=(T="[\\s|\\(]+("+(j="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)")+")[,|\\s]+("+j+")[,|\\s]+("+j+")\\s*\\)?",P="[\\s|\\(]+("+j+")[,|\\s]+("+j+")[,|\\s]+("+j+")[,|\\s]+("+j+")\\s*\\)?",{CSS_UNIT:new RegExp(j),rgb:new RegExp("rgb"+T),rgba:new RegExp("rgba"+P),hsl:new RegExp("hsl"+T),hsla:new RegExp("hsla"+P),hsv:new RegExp("hsv"+T),hsva:new RegExp("hsva"+P),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/});function O(t){return!!G.CSS_UNIT.exec(t)}var $={class:"component-example"},U={class:"example-footer"},J={id:"color-picker",class:"source-code",style:{display:"none"}},V={class:"example-source-wrapper"},X={class:"source"};var Y=r({components:{CodeEditor:l},data:()=>({editor_theme:"light",color_picker:"<template>\n <color-picker/>\n </template>"}),mounted(){this.call()},methods:{showCode(t){document.getElementById(t+"-icon").classList.toggle("active-icon"),"none"===document.getElementById(t).style.display?document.getElementById(t).style.display="block":"block"===document.getElementById(t).style.display&&(document.getElementById(t).style.display="none")},call(){var t=document.getElementById("add-swatch"),e=document.getElementById("mode-toggle"),a=document.getElementsByClassName("default-swatches")[0],n=document.getElementById("color-indicator"),r=document.getElementById("user-swatches"),i=document.getElementById("spectrum-canvas"),o=i.getContext("2d"),s=document.getElementById("spectrum-cursor"),l=i.getBoundingClientRect(),d=document.getElementById("hue-canvas"),c=d.getContext("2d"),f=document.getElementById("hue-cursor"),h=d.getBoundingClientRect(),g="",b=0,v=1,p=.5,m=document.getElementById("rgb-fields"),y=document.getElementById("hex-field"),_=document.getElementById("red"),w=document.getElementById("blue"),x=document.getElementById("green"),M=document.getElementById("hex");function A(){var t,e,a;this.addDefaultSwatches(),E(),t=d,(a=(e=c).createLinearGradient(0,0,0,t.height)).addColorStop(0,"hsl(0, 100%, 50%)"),a.addColorStop(.17,"hsl(298.8, 100%, 50%)"),a.addColorStop(.33,"hsl(241.2, 100%, 50%)"),a.addColorStop(.5,"hsl(180, 100%, 50%)"),a.addColorStop(.67,"hsl(118.8, 100%, 50%)"),a.addColorStop(.83,"hsl(61.2, 100%, 50%)"),a.addColorStop(1,"hsl(360, 100%, 50%)"),e.fillStyle=a,e.fillRect(0,0,t.width,t.height),t.addEventListener("mousedown",function(t){!function(t){N(t),f.classList.add("dragging"),window.addEventListener("mousemove",N),window.addEventListener("mouseup",z)}(t)})}function k(t,e){var a=document.createElement("button");a.classList.add("swatch"),a.setAttribute("title",e),a.style.backgroundColor=e,a.addEventListener("click",function(){var t=u(this.style.backgroundColor);C(t),F(t)}),t.appendChild(a),S()}function S(){l=i.getBoundingClientRect(),h=d.getBoundingClientRect()}function E(t){let e=i,a=o;a.clearRect(0,0,e.width,e.height),t||(t="#f00"),a.fillStyle=t,a.fillRect(0,0,e.width,e.height);var n=a.createLinearGradient(0,0,e.width,0);n.addColorStop(0,"#fff"),n.addColorStop(1,"transparent"),a.fillStyle=n,a.fillRect(0,0,e.width,e.height);var r=a.createLinearGradient(0,0,0,e.height);r.addColorStop(0,"transparent"),r.addColorStop(1,"#000"),a.fillStyle=r,a.fillRect(0,0,e.width,e.height),e.addEventListener("mousedown",function(t){B(t)})}function C(t){b=t.toHsl().h;var e=t.toHsv(),a=l.width*e.s,n=l.height*(1-e.v),r=h.height-b/360*h.height;H(a,n),R(r),L(t),E(function(t){return u("hsl "+t.toHsl().h+" 1 .5").toHslString()}(t))}function F(t){var e=t.toRgb(),a=t.toHex();_.value=e.r,x.value=e.g,w.value=e.b,M.value=a}function L(t){t=u(t),g=t,n.style.backgroundColor=t,document.querySelector(".color-space").style.backgroundColor=t,s.style.backgroundColor=t,f.style.backgroundColor="hsl("+t.toHsl().h+",100%, 50%)"}function R(t){f.style.top=t+"px"}function H(t,e){s.style.left=t+"px",s.style.top=e+"px"}A.prototype.defaultSwatches=["#FFFFFF","#FFFB0D","#0532FF","#FF9300","#00F91A","#FF2700","#000000","#686868","#EE5464","#D27AEE","#5BA8C4","#E64AA9"],A.prototype.addDefaultSwatches=function(){for(var t=0;t<this.defaultSwatches.length;++t)k(a,this.defaultSwatches[t])};var B=function(t){I(t),s.classList.add("dragging"),window.addEventListener("mousemove",I),window.addEventListener("mouseup",q)};function I(t){t.preventDefault();var e=t.pageX-l.left,a=t.pageY-l.top;e>l.width&&(e=l.width),e<0&&(e=0),a>l.height&&(a=l.height),a<0&&(a=.1);var n=e/l.width*100,r=1-a/l.height*100/100,i=n/100;p=r/2*(2-i),v=r*i/(1-Math.abs(2*p-1));var o=u("hsl "+b+" "+v+" "+p);L(o),F(o),H(e,a)}function q(){s.classList.remove("dragging"),window.removeEventListener("mousemove",I)}function N(t){t.preventDefault();var e=t.pageY-h.top;e>h.height&&(e=h.height),e<0&&(e=0);var a=u("hsl "+(b=360-e/h.height*360)+" 1 .5").toHslString(),n=u("hsl "+b+" "+v+" "+p).toHslString();E(a),R(e),L(n),F(n)}function z(){f.classList.remove("dragging"),window.removeEventListener("mousemove",N)}_.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),x.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),w.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),t.addEventListener("click",function(){k(r,g)}),e.addEventListener("click",function(){m.classList.contains("active")?m.classList.remove("active"):m.classList.add("active"),y.classList.contains("active")?y.classList.remove("active"):y.classList.add("active")}),window.addEventListener("resize",function(){S()}),new A}}},[["render",function(r,l,d,c,f,u){const h=n("divider"),g=n("CodeEditor");return e(),t(o,null,[l[3]||(l[3]=a("h1",{class:"component-heading"},"Color picker",-1)),l[4]||(l[4]=a("p",{class:"component-description"}," This component allows for a fully accessible and configurable color picker, allowing the user to pick from a set of predefined colors (swatches). ",-1)),s(h,{position:"horizontal",space:"20px"}),l[5]||(l[5]=a("div",{class:"notes"},null,-1)),a("div",$,[l[2]||(l[2]=i('<div class="example-body" data-v-504f9f93><div class="color-space" data-v-504f9f93></div><div class="color-picker-panel" data-v-504f9f93><div class="panel-row" data-v-504f9f93><div class="swatches default-swatches" data-v-504f9f93></div><button class="button eyedropper" data-v-504f9f93>Get Color</button></div><div class="panel-row" data-v-504f9f93><div class="spectrum-map" data-v-504f9f93><button id="spectrum-cursor" class="color-cursor" data-v-504f9f93></button><canvas id="spectrum-canvas" data-v-504f9f93></canvas></div><div class="hue-map" data-v-504f9f93><button id="hue-cursor" class="color-cursor" data-v-504f9f93></button><canvas id="hue-canvas" data-v-504f9f93></canvas></div></div><div class="panel-row" data-v-504f9f93><div id="rgb-fields" class="field-group value-fields rgb-fields active" data-v-504f9f93><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>R:</label><input id="red" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>G:</label><input id="green" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>B:</label><input id="blue" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div></div><div id="hex-field" class="field-group value-fields hex-field" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>Hex:</label><input id="hex" type="text" class="field-input" data-v-504f9f93></div><button id="mode-toggle" class="button mode-toggle" data-v-504f9f93>Mode</button></div><div class="panel-row" data-v-504f9f93><h2 class="panel-header" data-v-504f9f93>User Colors</h2><div id="user-swatches" class="swatches custom-swatches" data-v-504f9f93></div><button id="add-swatch" class="button add-swatch" data-v-504f9f93><span id="color-indicator" class="color-indicator" data-v-504f9f93></span><span data-v-504f9f93>Add to Swatches</span></button></div></div></div>',1)),a("div",U,[a("span",{id:"color-picker-icon",class:"icon",onClick:l[0]||(l[0]=t=>u.showCode("color-picker"))},[...l[1]||(l[1]=[a("i",{class:"icon-code-regular"},null,-1)])])])]),a("div",J,[a("section",V,[a("div",X,[s(g,{id:"editor",display_language:!1,value:f.color_picker,read_only:!0,theme:f.editor_theme,languages:[["Javascript","Vue"],["javascript","JS"],["python","Python"]]},null,8,["value","theme"])])])]),s(h,{position:"horizontal",space:"20px"})],64)}],["__scopeId","data-v-504f9f93"]]);export{Y as default};
|
|
1
|
+
import{a as t,c as e,i as a,l as n,n as r,o as i,r as o,s,t as l}from"./index-Djh91Mb4.js";function d(t){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},d(t)}var c=/^\s+/,f=/\s+$/;function u(t,e){if(e=e||{},(t=t||"")instanceof u)return t;if(!(this instanceof u))return new u(t,e);var a=function(t){var e={r:0,g:0,b:0},a=1,n=null,r=null,i=null,o=!1,s=!1;"string"==typeof t&&(t=function(t){t=t.replace(c,"").replace(f,"").toLowerCase();var e,a=!1;if(F[t])t=F[t],a=!0;else if("transparent"==t)return{r:0,g:0,b:0,a:0,format:"name"};return(e=G.rgb.exec(t))?{r:e[1],g:e[2],b:e[3]}:(e=G.rgba.exec(t))?{r:e[1],g:e[2],b:e[3],a:e[4]}:(e=G.hsl.exec(t))?{h:e[1],s:e[2],l:e[3]}:(e=G.hsla.exec(t))?{h:e[1],s:e[2],l:e[3],a:e[4]}:(e=G.hsv.exec(t))?{h:e[1],s:e[2],v:e[3]}:(e=G.hsva.exec(t))?{h:e[1],s:e[2],v:e[3],a:e[4]}:(e=G.hex8.exec(t))?{r:I(e[1]),g:I(e[2]),b:I(e[3]),a:D(e[4]),format:a?"name":"hex8"}:(e=G.hex6.exec(t))?{r:I(e[1]),g:I(e[2]),b:I(e[3]),format:a?"name":"hex"}:(e=G.hex4.exec(t))?{r:I(e[1]+""+e[1]),g:I(e[2]+""+e[2]),b:I(e[3]+""+e[3]),a:D(e[4]+""+e[4]),format:a?"name":"hex8"}:!!(e=G.hex3.exec(t))&&{r:I(e[1]+""+e[1]),g:I(e[2]+""+e[2]),b:I(e[3]+""+e[3]),format:a?"name":"hex"}}(t));"object"==d(t)&&(O(t.r)&&O(t.g)&&O(t.b)?(l=t.r,u=t.g,h=t.b,e={r:255*H(l,255),g:255*H(u,255),b:255*H(h,255)},o=!0,s="%"===String(t.r).substr(-1)?"prgb":"rgb"):O(t.h)&&O(t.s)&&O(t.v)?(n=N(t.s),r=N(t.v),e=function(t,e,a){t=6*H(t,360),e=H(e,100),a=H(a,100);var n=Math.floor(t),r=t-n,i=a*(1-e),o=a*(1-r*e),s=a*(1-(1-r)*e),l=n%6,d=[a,o,i,i,s,a][l],c=[s,a,a,o,i,i][l],f=[i,i,s,a,a,o][l];return{r:255*d,g:255*c,b:255*f}}(t.h,n,r),o=!0,s="hsv"):O(t.h)&&O(t.s)&&O(t.l)&&(n=N(t.s),i=N(t.l),e=function(t,e,a){var n,r,i;function o(t,e,a){return a<0&&(a+=1),a>1&&(a-=1),a<1/6?t+6*(e-t)*a:a<.5?e:a<2/3?t+(e-t)*(2/3-a)*6:t}if(t=H(t,360),e=H(e,100),a=H(a,100),0===e)n=r=i=a;else{var s=a<.5?a*(1+e):a+e-a*e,l=2*a-s;n=o(l,s,t+1/3),r=o(l,s,t),i=o(l,s,t-1/3)}return{r:255*n,g:255*r,b:255*i}}(t.h,n,i),o=!0,s="hsl"),t.hasOwnProperty("a")&&(a=t.a));var l,u,h;return a=R(a),{ok:o,format:t.format||s,r:Math.min(255,Math.max(e.r,0)),g:Math.min(255,Math.max(e.g,0)),b:Math.min(255,Math.max(e.b,0)),a:a}}(t);this._originalInput=t,this._r=a.r,this._g=a.g,this._b=a.b,this._a=a.a,this._roundA=Math.round(100*this._a)/100,this._format=e.format||a.format,this._gradientType=e.gradientType,this._r<1&&(this._r=Math.round(this._r)),this._g<1&&(this._g=Math.round(this._g)),this._b<1&&(this._b=Math.round(this._b)),this._ok=a.ok}function h(t,e,a){t=H(t,255),e=H(e,255),a=H(a,255);var n,r,i=Math.max(t,e,a),o=Math.min(t,e,a),s=(i+o)/2;if(i==o)n=r=0;else{var l=i-o;switch(r=s>.5?l/(2-i-o):l/(i+o),i){case t:n=(e-a)/l+(e<a?6:0);break;case e:n=(a-t)/l+2;break;case a:n=(t-e)/l+4}n/=6}return{h:n,s:r,l:s}}function g(t,e,a){t=H(t,255),e=H(e,255),a=H(a,255);var n,r,i=Math.max(t,e,a),o=Math.min(t,e,a),s=i,l=i-o;if(r=0===i?0:l/i,i==o)n=0;else{switch(i){case t:n=(e-a)/l+(e<a?6:0);break;case e:n=(a-t)/l+2;break;case a:n=(t-e)/l+4}n/=6}return{h:n,s:r,v:s}}function b(t,e,a,n){var r=[q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16))];return n&&r[0].charAt(0)==r[0].charAt(1)&&r[1].charAt(0)==r[1].charAt(1)&&r[2].charAt(0)==r[2].charAt(1)?r[0].charAt(0)+r[1].charAt(0)+r[2].charAt(0):r.join("")}function v(t,e,a,n){return[q(z(n)),q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16))].join("")}function p(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.s-=e/100,a.s=B(a.s),u(a)}function m(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.s+=e/100,a.s=B(a.s),u(a)}function y(t){return u(t).desaturate(100)}function _(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.l+=e/100,a.l=B(a.l),u(a)}function w(t,e){e=0===e?0:e||10;var a=u(t).toRgb();return a.r=Math.max(0,Math.min(255,a.r-Math.round(-e/100*255))),a.g=Math.max(0,Math.min(255,a.g-Math.round(-e/100*255))),a.b=Math.max(0,Math.min(255,a.b-Math.round(-e/100*255))),u(a)}function x(t,e){e=0===e?0:e||10;var a=u(t).toHsl();return a.l-=e/100,a.l=B(a.l),u(a)}function M(t,e){var a=u(t).toHsl(),n=(a.h+e)%360;return a.h=n<0?360+n:n,u(a)}function A(t){var e=u(t).toHsl();return e.h=(e.h+180)%360,u(e)}function k(t,e){if(isNaN(e)||e<=0)throw new Error("Argument to polyad must be a positive number");for(var a=u(t).toHsl(),n=[u(t)],r=360/e,i=1;i<e;i++)n.push(u({h:(a.h+i*r)%360,s:a.s,l:a.l}));return n}function S(t){var e=u(t).toHsl(),a=e.h;return[u(t),u({h:(a+72)%360,s:e.s,l:e.l}),u({h:(a+216)%360,s:e.s,l:e.l})]}function E(t,e,a){e=e||6,a=a||30;var n=u(t).toHsl(),r=360/a,i=[u(t)];for(n.h=(n.h-(r*e>>1)+720)%360;--e;)n.h=(n.h+r)%360,i.push(u(n));return i}function C(t,e){e=e||6;for(var a=u(t).toHsv(),n=a.h,r=a.s,i=a.v,o=[],s=1/e;e--;)o.push(u({h:n,s:r,v:i})),i=(i+s)%1;return o}u.prototype={isDark:function(){return this.getBrightness()<128},isLight:function(){return!this.isDark()},isValid:function(){return this._ok},getOriginalInput:function(){return this._originalInput},getFormat:function(){return this._format},getAlpha:function(){return this._a},getBrightness:function(){var t=this.toRgb();return(299*t.r+587*t.g+114*t.b)/1e3},getLuminance:function(){var t=this.toRgb(),e=t.r/255,a=t.g/255,n=t.b/255;return.2126*(e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4))+.7152*(a<=.03928?a/12.92:Math.pow((a+.055)/1.055,2.4))+.0722*(n<=.03928?n/12.92:Math.pow((n+.055)/1.055,2.4))},setAlpha:function(t){return this._a=R(t),this._roundA=Math.round(100*this._a)/100,this},toHsv:function(){var t=g(this._r,this._g,this._b);return{h:360*t.h,s:t.s,v:t.v,a:this._a}},toHsvString:function(){var t=g(this._r,this._g,this._b),e=Math.round(360*t.h),a=Math.round(100*t.s),n=Math.round(100*t.v);return 1==this._a?"hsv("+e+", "+a+"%, "+n+"%)":"hsva("+e+", "+a+"%, "+n+"%, "+this._roundA+")"},toHsl:function(){var t=h(this._r,this._g,this._b);return{h:360*t.h,s:t.s,l:t.l,a:this._a}},toHslString:function(){var t=h(this._r,this._g,this._b),e=Math.round(360*t.h),a=Math.round(100*t.s),n=Math.round(100*t.l);return 1==this._a?"hsl("+e+", "+a+"%, "+n+"%)":"hsla("+e+", "+a+"%, "+n+"%, "+this._roundA+")"},toHex:function(t){return b(this._r,this._g,this._b,t)},toHexString:function(t){return"#"+this.toHex(t)},toHex8:function(t){return function(t,e,a,n,r){var i=[q(Math.round(t).toString(16)),q(Math.round(e).toString(16)),q(Math.round(a).toString(16)),q(z(n))];return r&&i[0].charAt(0)==i[0].charAt(1)&&i[1].charAt(0)==i[1].charAt(1)&&i[2].charAt(0)==i[2].charAt(1)&&i[3].charAt(0)==i[3].charAt(1)?i[0].charAt(0)+i[1].charAt(0)+i[2].charAt(0)+i[3].charAt(0):i.join("")}(this._r,this._g,this._b,this._a,t)},toHex8String:function(t){return"#"+this.toHex8(t)},toRgb:function(){return{r:Math.round(this._r),g:Math.round(this._g),b:Math.round(this._b),a:this._a}},toRgbString:function(){return 1==this._a?"rgb("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+")":"rgba("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+", "+this._roundA+")"},toPercentageRgb:function(){return{r:Math.round(100*H(this._r,255))+"%",g:Math.round(100*H(this._g,255))+"%",b:Math.round(100*H(this._b,255))+"%",a:this._a}},toPercentageRgbString:function(){return 1==this._a?"rgb("+Math.round(100*H(this._r,255))+"%, "+Math.round(100*H(this._g,255))+"%, "+Math.round(100*H(this._b,255))+"%)":"rgba("+Math.round(100*H(this._r,255))+"%, "+Math.round(100*H(this._g,255))+"%, "+Math.round(100*H(this._b,255))+"%, "+this._roundA+")"},toName:function(){return 0===this._a?"transparent":!(this._a<1)&&(L[b(this._r,this._g,this._b,!0)]||!1)},toFilter:function(t){var e="#"+v(this._r,this._g,this._b,this._a),a=e,n=this._gradientType?"GradientType = 1, ":"";if(t){var r=u(t);a="#"+v(r._r,r._g,r._b,r._a)}return"progid:DXImageTransform.Microsoft.gradient("+n+"startColorstr="+e+",endColorstr="+a+")"},toString:function(t){var e=!!t;t=t||this._format;var a=!1,n=this._a<1&&this._a>=0;return e||!n||"hex"!==t&&"hex6"!==t&&"hex3"!==t&&"hex4"!==t&&"hex8"!==t&&"name"!==t?("rgb"===t&&(a=this.toRgbString()),"prgb"===t&&(a=this.toPercentageRgbString()),"hex"!==t&&"hex6"!==t||(a=this.toHexString()),"hex3"===t&&(a=this.toHexString(!0)),"hex4"===t&&(a=this.toHex8String(!0)),"hex8"===t&&(a=this.toHex8String()),"name"===t&&(a=this.toName()),"hsl"===t&&(a=this.toHslString()),"hsv"===t&&(a=this.toHsvString()),a||this.toHexString()):"name"===t&&0===this._a?this.toName():this.toRgbString()},clone:function(){return u(this.toString())},_applyModification:function(t,e){var a=t.apply(null,[this].concat([].slice.call(e)));return this._r=a._r,this._g=a._g,this._b=a._b,this.setAlpha(a._a),this},lighten:function(){return this._applyModification(_,arguments)},brighten:function(){return this._applyModification(w,arguments)},darken:function(){return this._applyModification(x,arguments)},desaturate:function(){return this._applyModification(p,arguments)},saturate:function(){return this._applyModification(m,arguments)},greyscale:function(){return this._applyModification(y,arguments)},spin:function(){return this._applyModification(M,arguments)},_applyCombination:function(t,e){return t.apply(null,[this].concat([].slice.call(e)))},analogous:function(){return this._applyCombination(E,arguments)},complement:function(){return this._applyCombination(A,arguments)},monochromatic:function(){return this._applyCombination(C,arguments)},splitcomplement:function(){return this._applyCombination(S,arguments)},triad:function(){return this._applyCombination(k,[3])},tetrad:function(){return this._applyCombination(k,[4])}},u.fromRatio=function(t,e){if("object"==d(t)){var a={};for(var n in t)t.hasOwnProperty(n)&&(a[n]="a"===n?t[n]:N(t[n]));t=a}return u(t,e)},u.equals=function(t,e){return!(!t||!e)&&u(t).toRgbString()==u(e).toRgbString()},u.random=function(){return u.fromRatio({r:Math.random(),g:Math.random(),b:Math.random()})},u.mix=function(t,e,a){a=0===a?0:a||50;var n=u(t).toRgb(),r=u(e).toRgb(),i=a/100;return u({r:(r.r-n.r)*i+n.r,g:(r.g-n.g)*i+n.g,b:(r.b-n.b)*i+n.b,a:(r.a-n.a)*i+n.a})},u.readability=function(t,e){var a=u(t),n=u(e);return(Math.max(a.getLuminance(),n.getLuminance())+.05)/(Math.min(a.getLuminance(),n.getLuminance())+.05)},u.isReadable=function(t,e,a){var n,r=u.readability(t,e),i=!1;switch((n=function(t){var e,a;e=((t=t||{level:"AA",size:"small"}).level||"AA").toUpperCase(),a=(t.size||"small").toLowerCase(),"AA"!==e&&"AAA"!==e&&(e="AA");"small"!==a&&"large"!==a&&(a="small");return{level:e,size:a}}(a)).level+n.size){case"AAsmall":case"AAAlarge":i=r>=4.5;break;case"AAlarge":i=r>=3;break;case"AAAsmall":i=r>=7}return i},u.mostReadable=function(t,e,a){var n,r,i,o,s=null,l=0;r=(a=a||{}).includeFallbackColors,i=a.level,o=a.size;for(var d=0;d<e.length;d++)(n=u.readability(t,e[d]))>l&&(l=n,s=u(e[d]));return u.isReadable(t,s,{level:i,size:o})||!r?s:(a.includeFallbackColors=!1,u.mostReadable(t,["#fff","#000"],a))};var F=u.names={aliceblue:"f0f8ff",antiquewhite:"faebd7",aqua:"0ff",aquamarine:"7fffd4",azure:"f0ffff",beige:"f5f5dc",bisque:"ffe4c4",black:"000",blanchedalmond:"ffebcd",blue:"00f",blueviolet:"8a2be2",brown:"a52a2a",burlywood:"deb887",burntsienna:"ea7e5d",cadetblue:"5f9ea0",chartreuse:"7fff00",chocolate:"d2691e",coral:"ff7f50",cornflowerblue:"6495ed",cornsilk:"fff8dc",crimson:"dc143c",cyan:"0ff",darkblue:"00008b",darkcyan:"008b8b",darkgoldenrod:"b8860b",darkgray:"a9a9a9",darkgreen:"006400",darkgrey:"a9a9a9",darkkhaki:"bdb76b",darkmagenta:"8b008b",darkolivegreen:"556b2f",darkorange:"ff8c00",darkorchid:"9932cc",darkred:"8b0000",darksalmon:"e9967a",darkseagreen:"8fbc8f",darkslateblue:"483d8b",darkslategray:"2f4f4f",darkslategrey:"2f4f4f",darkturquoise:"00ced1",darkviolet:"9400d3",deeppink:"ff1493",deepskyblue:"00bfff",dimgray:"696969",dimgrey:"696969",dodgerblue:"1e90ff",firebrick:"b22222",floralwhite:"fffaf0",forestgreen:"228b22",fuchsia:"f0f",gainsboro:"dcdcdc",ghostwhite:"f8f8ff",gold:"ffd700",goldenrod:"daa520",gray:"808080",green:"008000",greenyellow:"adff2f",grey:"808080",honeydew:"f0fff0",hotpink:"ff69b4",indianred:"cd5c5c",indigo:"4b0082",ivory:"fffff0",khaki:"f0e68c",lavender:"e6e6fa",lavenderblush:"fff0f5",lawngreen:"7cfc00",lemonchiffon:"fffacd",lightblue:"add8e6",lightcoral:"f08080",lightcyan:"e0ffff",lightgoldenrodyellow:"fafad2",lightgray:"d3d3d3",lightgreen:"90ee90",lightgrey:"d3d3d3",lightpink:"ffb6c1",lightsalmon:"ffa07a",lightseagreen:"20b2aa",lightskyblue:"87cefa",lightslategray:"789",lightslategrey:"789",lightsteelblue:"b0c4de",lightyellow:"ffffe0",lime:"0f0",limegreen:"32cd32",linen:"faf0e6",magenta:"f0f",maroon:"800000",mediumaquamarine:"66cdaa",mediumblue:"0000cd",mediumorchid:"ba55d3",mediumpurple:"9370db",mediumseagreen:"3cb371",mediumslateblue:"7b68ee",mediumspringgreen:"00fa9a",mediumturquoise:"48d1cc",mediumvioletred:"c71585",midnightblue:"191970",mintcream:"f5fffa",mistyrose:"ffe4e1",moccasin:"ffe4b5",navajowhite:"ffdead",navy:"000080",oldlace:"fdf5e6",olive:"808000",olivedrab:"6b8e23",orange:"ffa500",orangered:"ff4500",orchid:"da70d6",palegoldenrod:"eee8aa",palegreen:"98fb98",paleturquoise:"afeeee",palevioletred:"db7093",papayawhip:"ffefd5",peachpuff:"ffdab9",peru:"cd853f",pink:"ffc0cb",plum:"dda0dd",powderblue:"b0e0e6",purple:"800080",rebeccapurple:"663399",red:"f00",rosybrown:"bc8f8f",royalblue:"4169e1",saddlebrown:"8b4513",salmon:"fa8072",sandybrown:"f4a460",seagreen:"2e8b57",seashell:"fff5ee",sienna:"a0522d",silver:"c0c0c0",skyblue:"87ceeb",slateblue:"6a5acd",slategray:"708090",slategrey:"708090",snow:"fffafa",springgreen:"00ff7f",steelblue:"4682b4",tan:"d2b48c",teal:"008080",thistle:"d8bfd8",tomato:"ff6347",turquoise:"40e0d0",violet:"ee82ee",wheat:"f5deb3",white:"fff",whitesmoke:"f5f5f5",yellow:"ff0",yellowgreen:"9acd32"},L=u.hexNames=function(t){var e={};for(var a in t)t.hasOwnProperty(a)&&(e[t[a]]=a);return e}(F);function R(t){return t=parseFloat(t),(isNaN(t)||t<0||t>1)&&(t=1),t}function H(t,e){(function(t){return"string"==typeof t&&-1!=t.indexOf(".")&&1===parseFloat(t)})(t)&&(t="100%");var a=function(t){return"string"==typeof t&&-1!=t.indexOf("%")}(t);return t=Math.min(e,Math.max(0,parseFloat(t))),a&&(t=parseInt(t*e,10)/100),Math.abs(t-e)<1e-6?1:t%e/parseFloat(e)}function B(t){return Math.min(1,Math.max(0,t))}function I(t){return parseInt(t,16)}function q(t){return 1==t.length?"0"+t:""+t}function N(t){return t<=1&&(t=100*t+"%"),t}function z(t){return Math.round(255*parseFloat(t)).toString(16)}function D(t){return I(t)/255}var j,T,P,G=(T="[\\s|\\(]+("+(j="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)")+")[,|\\s]+("+j+")[,|\\s]+("+j+")\\s*\\)?",P="[\\s|\\(]+("+j+")[,|\\s]+("+j+")[,|\\s]+("+j+")[,|\\s]+("+j+")\\s*\\)?",{CSS_UNIT:new RegExp(j),rgb:new RegExp("rgb"+T),rgba:new RegExp("rgba"+P),hsl:new RegExp("hsl"+T),hsla:new RegExp("hsla"+P),hsv:new RegExp("hsv"+T),hsva:new RegExp("hsva"+P),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/});function O(t){return!!G.CSS_UNIT.exec(t)}var $={class:"component-example"},U={class:"example-footer"},J={id:"color-picker",class:"source-code",style:{display:"none"}},V={class:"example-source-wrapper"},X={class:"source"};var Y=r({components:{CodeEditor:l},data:()=>({editor_theme:"light",color_picker:"<template>\n <color-picker/>\n </template>"}),mounted(){this.call()},methods:{showCode(t){document.getElementById(t+"-icon").classList.toggle("active-icon"),"none"===document.getElementById(t).style.display?document.getElementById(t).style.display="block":"block"===document.getElementById(t).style.display&&(document.getElementById(t).style.display="none")},call(){var t=document.getElementById("add-swatch"),e=document.getElementById("mode-toggle"),a=document.getElementsByClassName("default-swatches")[0],n=document.getElementById("color-indicator"),r=document.getElementById("user-swatches"),i=document.getElementById("spectrum-canvas"),o=i.getContext("2d"),s=document.getElementById("spectrum-cursor"),l=i.getBoundingClientRect(),d=document.getElementById("hue-canvas"),c=d.getContext("2d"),f=document.getElementById("hue-cursor"),h=d.getBoundingClientRect(),g="",b=0,v=1,p=.5,m=document.getElementById("rgb-fields"),y=document.getElementById("hex-field"),_=document.getElementById("red"),w=document.getElementById("blue"),x=document.getElementById("green"),M=document.getElementById("hex");function A(){var t,e,a;this.addDefaultSwatches(),E(),t=d,(a=(e=c).createLinearGradient(0,0,0,t.height)).addColorStop(0,"hsl(0, 100%, 50%)"),a.addColorStop(.17,"hsl(298.8, 100%, 50%)"),a.addColorStop(.33,"hsl(241.2, 100%, 50%)"),a.addColorStop(.5,"hsl(180, 100%, 50%)"),a.addColorStop(.67,"hsl(118.8, 100%, 50%)"),a.addColorStop(.83,"hsl(61.2, 100%, 50%)"),a.addColorStop(1,"hsl(360, 100%, 50%)"),e.fillStyle=a,e.fillRect(0,0,t.width,t.height),t.addEventListener("mousedown",function(t){!function(t){N(t),f.classList.add("dragging"),window.addEventListener("mousemove",N),window.addEventListener("mouseup",z)}(t)})}function k(t,e){var a=document.createElement("button");a.classList.add("swatch"),a.setAttribute("title",e),a.style.backgroundColor=e,a.addEventListener("click",function(){var t=u(this.style.backgroundColor);C(t),F(t)}),t.appendChild(a),S()}function S(){l=i.getBoundingClientRect(),h=d.getBoundingClientRect()}function E(t){let e=i,a=o;a.clearRect(0,0,e.width,e.height),t||(t="#f00"),a.fillStyle=t,a.fillRect(0,0,e.width,e.height);var n=a.createLinearGradient(0,0,e.width,0);n.addColorStop(0,"#fff"),n.addColorStop(1,"transparent"),a.fillStyle=n,a.fillRect(0,0,e.width,e.height);var r=a.createLinearGradient(0,0,0,e.height);r.addColorStop(0,"transparent"),r.addColorStop(1,"#000"),a.fillStyle=r,a.fillRect(0,0,e.width,e.height),e.addEventListener("mousedown",function(t){B(t)})}function C(t){b=t.toHsl().h;var e=t.toHsv(),a=l.width*e.s,n=l.height*(1-e.v),r=h.height-b/360*h.height;H(a,n),R(r),L(t),E(function(t){return u("hsl "+t.toHsl().h+" 1 .5").toHslString()}(t))}function F(t){var e=t.toRgb(),a=t.toHex();_.value=e.r,x.value=e.g,w.value=e.b,M.value=a}function L(t){t=u(t),g=t,n.style.backgroundColor=t,document.querySelector(".color-space").style.backgroundColor=t,s.style.backgroundColor=t,f.style.backgroundColor="hsl("+t.toHsl().h+",100%, 50%)"}function R(t){f.style.top=t+"px"}function H(t,e){s.style.left=t+"px",s.style.top=e+"px"}A.prototype.defaultSwatches=["#FFFFFF","#FFFB0D","#0532FF","#FF9300","#00F91A","#FF2700","#000000","#686868","#EE5464","#D27AEE","#5BA8C4","#E64AA9"],A.prototype.addDefaultSwatches=function(){for(var t=0;t<this.defaultSwatches.length;++t)k(a,this.defaultSwatches[t])};var B=function(t){I(t),s.classList.add("dragging"),window.addEventListener("mousemove",I),window.addEventListener("mouseup",q)};function I(t){t.preventDefault();var e=t.pageX-l.left,a=t.pageY-l.top;e>l.width&&(e=l.width),e<0&&(e=0),a>l.height&&(a=l.height),a<0&&(a=.1);var n=e/l.width*100,r=1-a/l.height*100/100,i=n/100;p=r/2*(2-i),v=r*i/(1-Math.abs(2*p-1));var o=u("hsl "+b+" "+v+" "+p);L(o),F(o),H(e,a)}function q(){s.classList.remove("dragging"),window.removeEventListener("mousemove",I)}function N(t){t.preventDefault();var e=t.pageY-h.top;e>h.height&&(e=h.height),e<0&&(e=0);var a=u("hsl "+(b=360-e/h.height*360)+" 1 .5").toHslString(),n=u("hsl "+b+" "+v+" "+p).toHslString();E(a),R(e),L(n),F(n)}function z(){f.classList.remove("dragging"),window.removeEventListener("mousemove",N)}_.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),x.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),w.addEventListener("change",function(){C(u("rgb "+_.value+" "+x.value+" "+w.value))}),t.addEventListener("click",function(){k(r,g)}),e.addEventListener("click",function(){m.classList.contains("active")?m.classList.remove("active"):m.classList.add("active"),y.classList.contains("active")?y.classList.remove("active"):y.classList.add("active")}),window.addEventListener("resize",function(){S()}),new A}}},[["render",function(r,l,d,c,f,u){const h=n("divider"),g=n("CodeEditor");return e(),t(o,null,[l[3]||(l[3]=a("h1",{class:"component-heading"},"Color picker",-1)),l[4]||(l[4]=a("p",{class:"component-description"}," This component allows for a fully accessible and configurable color picker, allowing the user to pick from a set of predefined colors (swatches). ",-1)),s(h,{position:"horizontal",space:"20px"}),l[5]||(l[5]=a("div",{class:"notes"},null,-1)),a("div",$,[l[2]||(l[2]=i('<div class="example-body" data-v-504f9f93><div class="color-space" data-v-504f9f93></div><div class="color-picker-panel" data-v-504f9f93><div class="panel-row" data-v-504f9f93><div class="swatches default-swatches" data-v-504f9f93></div><button class="button eyedropper" data-v-504f9f93>Get Color</button></div><div class="panel-row" data-v-504f9f93><div class="spectrum-map" data-v-504f9f93><button id="spectrum-cursor" class="color-cursor" data-v-504f9f93></button><canvas id="spectrum-canvas" data-v-504f9f93></canvas></div><div class="hue-map" data-v-504f9f93><button id="hue-cursor" class="color-cursor" data-v-504f9f93></button><canvas id="hue-canvas" data-v-504f9f93></canvas></div></div><div class="panel-row" data-v-504f9f93><div id="rgb-fields" class="field-group value-fields rgb-fields active" data-v-504f9f93><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>R:</label><input id="red" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>G:</label><input id="green" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div><div class="field-group" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>B:</label><input id="blue" type="number" max="255" min="0" class="field-input rgb-input" data-v-504f9f93></div></div><div id="hex-field" class="field-group value-fields hex-field" data-v-504f9f93><label for="" class="field-label" data-v-504f9f93>Hex:</label><input id="hex" type="text" class="field-input" data-v-504f9f93></div><button id="mode-toggle" class="button mode-toggle" data-v-504f9f93>Mode</button></div><div class="panel-row" data-v-504f9f93><h2 class="panel-header" data-v-504f9f93>User Colors</h2><div id="user-swatches" class="swatches custom-swatches" data-v-504f9f93></div><button id="add-swatch" class="button add-swatch" data-v-504f9f93><span id="color-indicator" class="color-indicator" data-v-504f9f93></span><span data-v-504f9f93>Add to Swatches</span></button></div></div></div>',1)),a("div",U,[a("span",{id:"color-picker-icon",class:"icon",onClick:l[0]||(l[0]=t=>u.showCode("color-picker"))},[...l[1]||(l[1]=[a("i",{class:"icon-code-regular"},null,-1)])])])]),a("div",J,[a("section",V,[a("div",X,[s(g,{id:"editor",display_language:!1,value:f.color_picker,read_only:!0,theme:f.editor_theme,languages:[["Javascript","Vue"],["javascript","JS"],["python","Python"]]},null,8,["value","theme"])])])]),s(h,{position:"horizontal",space:"20px"})],64)}],["__scopeId","data-v-504f9f93"]]);export{Y as default};
|