hdr-color-input 0.2.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Adam Argyle
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,32 @@
+# `<color-input>`
+
+A standalone web component color picker using [colorjs.io](http://colorjs.io/) and [Preact signals](https://github.com/preactjs/signals).
+
+- One script import, one custom element tag
+- Colorspaces: srgb, hsl, hwb, lab, lch, oklch, oklab and wide-gamut RGB-like spaces
+- Popover UI with automatic positioning and Shadow DOM encapsulation
+
+Try on [CodePen](https://codepen.io/argyleink/pen/dPGBYZg)
+
+> Consider this as a beta or alpha build, needing battle testing, contributions and possibly a couple more features before being production ready
+
+## Usage
+
+### With CDN
+
+```html
+<script src="https://cdn.jsdelivr.net/gh/argyleink/css-color-component/dist/index.js"></script>
+
+<color-input value="oklch(75% 75% 180)"></color-input>
+```
+
+## API
+- Attributes: `value`, `theme` (auto|light|dark)
+- Properties: `value`, `colorspace`, `theme`, readonly: `gamut`, `contrastColor`
+- Methods: `show()`, `close()`, `setAnchor(element)`
+- Events: `change`, `open`, `close`
+
+## Dev
+- Dev docs: `npm run dev` (serves docs/)
+- Build library: `npm run build` (outputs to dist/)
+- Tests: `npm test`

package/dist/color-input.min.js

@@ -0,0 +1,3 @@
+/* color-input web component - https://github.com/pops/css-color-component */
+var ColorInput=function(e){"use strict";var t,r,n,a,o,i,s,l,c,h,u,p,d,f,g,m,b,v,y,w,M,k,x,C,S,$,L,A,B,E,R,N,z,P,H,W,_,q,I,j,O=Object.defineProperty,T=e=>{throw TypeError(e)},G=(e,t,r)=>((e,t,r)=>t in e?O(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r)(e,"symbol"!=typeof t?t+"":t,r),D=(e,t,r)=>t.has(e)||T("Cannot "+r),F=(e,t,r)=>(D(e,t,"read from private field"),r?r.call(e):t.get(e)),Z=(e,t,r)=>t.has(e)?T("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,r),X=(e,t,r,n)=>(D(e,t,"write to private field"),n?n.call(e,r):t.set(e,r),r),Y=(e,t,r)=>(D(e,t,"access private method"),r),J=Symbol.for("preact-signals");function U(){if(ee>1)ee--;else{for(var e,t=!1;void 0!==K;){var r=K;for(K=void 0,te++;void 0!==r;){var n=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&ie(r))try{r.c()}catch(a){t||(e=a,t=!0)}r=n}}if(te=0,ee--,t)throw e}}var V=void 0;function Q(e){var t=V;V=void 0;try{return e()}finally{V=t}}var K=void 0,ee=0,te=0,re=0;function ne(e){if(void 0!==V){var t=e.n;if(void 0===t||t.t!==V)return t={i:0,S:e,p:V.s,n:void 0,t:V,e:void 0,x:void 0,r:t},void 0!==V.s&&(V.s.n=t),V.s=t,e.n=t,32&V.f&&e.S(t),t;if(-1===t.i)return t.i=0,void 0!==t.n&&(t.n.p=t.p,void 0!==t.p&&(t.p.n=t.n),t.p=V.s,t.n=void 0,V.s.n=t,V.s=t),t}}function ae(e,t){this.v=e,this.i=0,this.n=void 0,this.t=void 0,this.W=null==t?void 0:t.watched,this.Z=null==t?void 0:t.unwatched,this.name=null==t?void 0:t.name}function oe(e,t){return new ae(e,t)}function ie(e){for(var t=e.s;void 0!==t;t=t.n)if(t.S.i!==t.i||!t.S.h()||t.S.i!==t.i)return!0;return!1}function se(e){for(var t=e.s;void 0!==t;t=t.n){var r=t.S.n;if(void 0!==r&&(t.r=r),t.S.n=t,t.i=-1,void 0===t.n){e.s=t;break}}}function le(e){for(var t=e.s,r=void 0;void 0!==t;){var n=t.p;-1===t.i?(t.S.U(t),void 0!==n&&(n.n=t.n),void 0!==t.n&&(t.n.p=n)):r=t,t.S.n=t.r,void 0!==t.r&&(t.r=void 0),t=n}e.s=r}function ce(e,t){ae.call(this,void 0),this.x=e,this.s=void 0,this.g=re-1,this.f=4,this.W=null==t?void 0:t.watched,this.Z=null==t?void 0:t.unwatched,this.name=null==t?void 0:t.name}function he(e,t){return new ce(e,t)}function ue(e){var t=e.u;if(e.u=void 0,"function"==typeof t){ee++;var r=V;V=void 0;try{t()}catch(n){throw e.f&=-2,e.f|=8,pe(e),n}finally{V=r,U()}}}function pe(e){for(var t=e.s;void 0!==t;t=t.n)t.S.U(t);e.x=void 0,e.s=void 0,ue(e)}function de(e){if(V!==this)throw new Error("Out-of-order effect");le(this),V=e,this.f&=-2,8&this.f&&pe(this),U()}function fe(e,t){this.x=e,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32,this.name=null==t?void 0:t.name}function ge(e,t){var r=new fe(e,t);try{r.c()}catch(a){throw r.d(),a}var n=r.d.bind(r);return n[Symbol.dispose]=n,n}function me(e,t){let r=e.length;Array.isArray(e[0])||(e=[e]),Array.isArray(t[0])||(t=t.map(e=>[e]));let n=t[0].length,a=t[0].map((e,r)=>t.map(e=>e[r])),o=e.map(e=>a.map(t=>{let r=0;if(!Array.isArray(e)){for(let n of t)r+=e*n;return r}for(let n=0;n<e.length;n++)r+=e[n]*(t[n]||0);return r}));return 1===r&&(o=o[0]),1===n?o.map(e=>e[0]):o}function be(e){return"string"===ve(e)}function ve(e){return(Object.prototype.toString.call(e).match(/^\[object\s+(.*?)\]$/)[1]||"").toLowerCase()}function ye(e,{precision:t,unit:r}){return we(e)?"none":ke(e,t)+(null!=r?r:"")}function we(e){return Number.isNaN(e)||e instanceof Number&&(null==e?void 0:e.none)}function Me(e){return we(e)?0:e}function ke(e,t){if(0===e)return 0;let r=~~e,n=0;r&&t&&(n=1+~~Math.log10(Math.abs(r)));const a=10**(t-n);return Math.floor(e*a+.5)/a}ae.prototype.brand=J,ae.prototype.h=function(){return!0},ae.prototype.S=function(e){var t=this,r=this.t;r!==e&&void 0===e.e&&(e.x=r,this.t=e,void 0!==r?r.e=e:Q(function(){var e;null==(e=t.W)||e.call(t)}))},ae.prototype.U=function(e){var t=this;if(void 0!==this.t){var r=e.e,n=e.x;void 0!==r&&(r.x=n,e.e=void 0),void 0!==n&&(n.e=r,e.x=void 0),e===this.t&&(this.t=n,void 0===n&&Q(function(){var e;null==(e=t.Z)||e.call(t)}))}},ae.prototype.subscribe=function(e){var t=this;return ge(function(){var r=t.value,n=V;V=void 0;try{e(r)}finally{V=n}},{name:"sub"})},ae.prototype.valueOf=function(){return this.value},ae.prototype.toString=function(){return this.value+""},ae.prototype.toJSON=function(){return this.value},ae.prototype.peek=function(){var e=V;V=void 0;try{return this.value}finally{V=e}},Object.defineProperty(ae.prototype,"value",{get:function(){var e=ne(this);return void 0!==e&&(e.i=this.i),this.v},set:function(e){if(e!==this.v){if(te>100)throw new Error("Cycle detected");this.v=e,this.i++,re++,ee++;try{for(var t=this.t;void 0!==t;t=t.x)t.t.N()}finally{U()}}}}),ce.prototype=new ae,ce.prototype.h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===re)return!0;if(this.g=re,this.f|=1,this.i>0&&!ie(this))return this.f&=-2,!0;var e=V;try{se(this),V=this;var t=this.x();(16&this.f||this.v!==t||0===this.i)&&(this.v=t,this.f&=-17,this.i++)}catch(r){this.v=r,this.f|=16,this.i++}return V=e,le(this),this.f&=-2,!0},ce.prototype.S=function(e){if(void 0===this.t){this.f|=36;for(var t=this.s;void 0!==t;t=t.n)t.S.S(t)}ae.prototype.S.call(this,e)},ce.prototype.U=function(e){if(void 0!==this.t&&(ae.prototype.U.call(this,e),void 0===this.t)){this.f&=-33;for(var t=this.s;void 0!==t;t=t.n)t.S.U(t)}},ce.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var e=this.t;void 0!==e;e=e.x)e.t.N()}},Object.defineProperty(ce.prototype,"value",{get:function(){if(1&this.f)throw new Error("Cycle detected");var e=ne(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),fe.prototype.c=function(){var e=this.S();try{if(8&this.f)return;if(void 0===this.x)return;var t=this.x();"function"==typeof t&&(this.u=t)}finally{e()}},fe.prototype.S=function(){if(1&this.f)throw new Error("Cycle detected");this.f|=1,this.f&=-9,ue(this),se(this),ee++;var e=V;return V=this,de.bind(this,e)},fe.prototype.N=function(){2&this.f||(this.f|=2,this.o=K,K=this)},fe.prototype.d=function(){this.f|=8,1&this.f||pe(this)},fe.prototype.dispose=function(){this.d()};const xe={deg:1,grad:.9,rad:180/Math.PI,turn:360};function Ce(e){if(!e)return;e=e.trim();const t=/^-?[\d.]+$/,r=/%|deg|g?rad|turn$/,n=/\/?\s*(none|[-\w.]+(?:%|deg|g?rad|turn)?)/g;let a=e.match(/^([a-z]+)\((.+?)\)$/i);if(a){let e=[];return a[2].replace(n,(n,a)=>{let o=a.match(r),i=a;if(o){let e=o[0],t=i.slice(0,-e.length);"%"===e?(i=new Number(t/100),i.type="<percentage>"):(i=new Number(t*xe[e]),i.type="<angle>",i.unit=e)}else t.test(i)?(i=new Number(i),i.type="<number>"):"none"===i&&(i=new Number(NaN),i.none=!0);n.startsWith("/")&&(i=i instanceof Number?i:new Number(i),i.alpha=!0),"object"==typeof i&&i instanceof Number&&(i.raw=a),e.push(i)}),{name:a[1].toLowerCase(),rawName:a[1],rawArgs:a[2],args:e}}}function Se(e){return e[e.length-1]}function $e(e,t,r){return isNaN(e)?t:isNaN(t)?e:e+(t-e)*r}function Le(e,t,r){return(r-e)/(t-e)}function Ae(e,t,r){return $e(t[0],t[1],Le(e[0],e[1],r))}function Be(e){return e.map(e=>e.split("|").map(e=>{let t=(e=e.trim()).match(/^(<[a-z]+>)\[(-?[.\d]+),\s*(-?[.\d]+)\]?$/);if(t){let e=new String(t[1]);return e.range=[+t[2],+t[3]],e}return e}))}function Ee(e,t,r){return Math.max(Math.min(r,t),e)}function Re(e,t){return Math.sign(e)===Math.sign(t)?e:-e}function Ne(e,t){return Re(Math.abs(e)**t,e)}function ze(e,t){return 0===t?0:e/t}function Pe(e,t,r=0,n=e.length){for(;r<n;){const a=r+n>>1;e[a]<t?r=a+1:n=a}return r}var He=Object.freeze({__proto__:null,bisectLeft:Pe,clamp:Ee,copySign:Re,interpolate:$e,interpolateInv:Le,isNone:we,isString:be,last:Se,mapRange:Ae,multiplyMatrices:me,parseCoordGrammar:Be,parseFunction:Ce,serializeNumber:ye,skipNone:Me,spow:Ne,toPrecision:ke,type:ve,zdiv:ze});const We=new class{add(e,t,r){if("string"==typeof arguments[0])(Array.isArray(e)?e:[e]).forEach(function(e){this[e]=this[e]||[],t&&this[e][r?"unshift":"push"](t)},this);else for(var e in arguments[0])this.add(e,arguments[0][e],arguments[1])}run(e,t){this[e]=this[e]||[],this[e].forEach(function(e){e.call(t&&t.context?t.context:t,t)})}};var _e={gamut_mapping:"css",precision:5,deltaE:"76",verbose:"test"!==(null==(n=null==(r=null==(t=null==globalThis?void 0:globalThis.process)?void 0:t.env)?void 0:r.NODE_ENV)?void 0:n.toLowerCase()),warn:function(e){var t,r;this.verbose&&(null==(r=null==(t=null==globalThis?void 0:globalThis.console)?void 0:t.warn)||r.call(t,e))}};const qe={D50:[.3457/.3585,1,.2958/.3585],D65:[.3127/.329,1,.3583/.329]};function Ie(e){return Array.isArray(e)?e:qe[e]}function je(e,t,r,n={}){if(e=Ie(e),t=Ie(t),!e||!t)throw new TypeError(`Missing white point to convert ${e?"":"from"}${e||t?"":"/"}${t?"":"to"}`);if(e===t)return r;let a={W1:e,W2:t,XYZ:r,options:n};if(We.run("chromatic-adaptation-start",a),a.M||(a.W1===qe.D65&&a.W2===qe.D50?a.M=[[1.0479297925449969,.022946870601609652,-.05019226628920524],[.02962780877005599,.9904344267538799,-.017073799063418826],[-.009243040646204504,.015055191490298152,.7518742814281371]]:a.W1===qe.D50&&a.W2===qe.D65&&(a.M=[[.955473421488075,-.02309845494876471,.06325924320057072],[-.0283697093338637,1.0099953980813041,.021041441191917323],[.012314014864481998,-.020507649298898964,1.330365926242124]])),We.run("chromatic-adaptation-end",a),a.M)return me(a.M,a.XYZ);throw new TypeError("Only Bradford CAT with white points D50 and D65 supported for now.")}const Oe=new Set(["<number>","<percentage>","<angle>"]);function Te(e,t,r,n){return Object.entries(e.coords).map(([e,a],o)=>{let i,s=t.coordGrammar[o],l=n[o],c=null==l?void 0:l.type;if(i=l.none?s.find(e=>Oe.has(e)):s.find(e=>e==c),!i){let t=a.name||e;throw new TypeError(`${null!=c?c:l.raw} not allowed for ${t} in ${r}()`)}let h=i.range;"<percentage>"===c&&(h||(h=[0,1]));let u=a.range||a.refRange;return h&&u&&(n[o]=Ae(h,u,n[o])),i})}function Ge(e,{meta:t}={}){var r,n,a,o;let i={str:null==(r=String(e))?void 0:r.trim()};if(We.run("parse-start",i),i.color)return i.color;if(i.parsed=Ce(i.str),i.parsed){let e=i.parsed.name;if("color"===e){let e=i.parsed.args.shift(),r=e.startsWith("--")?e.substring(2):`--${e}`,s=[e,r],l=i.parsed.rawArgs.indexOf("/")>0?i.parsed.args.pop():1;for(let a of Ze.all){let r=a.getFormat("color");if(r&&(s.includes(r.id)||(null==(n=r.ids)?void 0:n.filter(e=>s.includes(e)).length))){const n=Object.keys(a.coords).map((e,t)=>i.parsed.args[t]||0);let o;return r.coordGrammar&&(o=Te(a,r,"color",n)),t&&Object.assign(t,{formatId:"color",types:o}),r.id.startsWith("--")&&!e.startsWith("--")&&_e.warn(`${a.name} is a non-standard space and not currently supported in the CSS spec. Use prefixed color(${r.id}) instead of color(${e}).`),e.startsWith("--")&&!r.id.startsWith("--")&&_e.warn(`${a.name} is a standard space and supported in the CSS spec. Use color(${r.id}) instead of prefixed color(${e}).`),{spaceId:a.id,coords:n,alpha:l}}}let c="",h=e in Ze.registry?e:r;if(h in Ze.registry){let e=null==(o=null==(a=Ze.registry[h].formats)?void 0:a.color)?void 0:o.id;e&&(c=`Did you mean color(${e})?`)}throw new TypeError(`Cannot parse color(${e}). `+(c||"Missing a plugin?"))}for(let r of Ze.all){let n=r.getFormat(e);if(n&&"function"===n.type){let a=1;(n.lastAlpha||Se(i.parsed.args).alpha)&&(a=i.parsed.args.pop());let o,s=i.parsed.args;return n.coordGrammar&&(o=Te(r,n,e,s)),t&&Object.assign(t,{formatId:n.name,types:o}),{spaceId:r.id,coords:s,alpha:a}}}}else for(let s of Ze.all)for(let e in s.formats){let r=s.formats[e];if("custom"!==r.type)continue;if(r.test&&!r.test(i.str))continue;let n=r.parse(i.str);if(n)return null!=n.alpha||(n.alpha=1),t&&(t.formatId=e),n}throw new TypeError(`Could not parse ${e} as a color. Missing a plugin?`)}function De(e){if(Array.isArray(e))return e.map(De);if(!e)throw new TypeError("Empty color reference");be(e)&&(e=Ge(e));let t=e.space||e.spaceId;return t instanceof Ze||(e.space=Ze.get(t)),void 0===e.alpha&&(e.alpha=1),e}const Fe=class e{constructor(t){var r,n,a,o,i,s;this.id=t.id,this.name=t.name,this.base=t.base?e.get(t.base):null,this.aliases=t.aliases,this.base&&(this.fromBase=t.fromBase,this.toBase=t.toBase);let l=null!=(r=t.coords)?r:this.base.coords;for(let e in l)"name"in l[e]||(l[e].name=e);this.coords=l;let c=null!=(a=null!=(n=t.white)?n:this.base.white)?a:"D65";this.white=Ie(c),this.formats=null!=(o=t.formats)?o:{};for(let e in this.formats){let t=this.formats[e];t.type||(t.type="function"),t.name||(t.name=e)}(null==(i=this.formats.color)?void 0:i.id)||(this.formats.color={...null!=(s=this.formats.color)?s:{},id:t.cssId||this.id}),t.gamutSpace?this.gamutSpace="self"===t.gamutSpace?this:e.get(t.gamutSpace):this.isPolar?this.gamutSpace=this.base:this.gamutSpace=this,this.gamutSpace.isUnbounded&&(this.inGamut=(e,t)=>!0),this.referred=t.referred,Object.defineProperty(this,"path",{value:Xe(this).reverse(),writable:!1,enumerable:!0,configurable:!0}),We.run("colorspace-init-end",this)}inGamut(e,{epsilon:t=75e-6}={}){if(!this.equals(this.gamutSpace))return e=this.to(this.gamutSpace,e),this.gamutSpace.inGamut(e,{epsilon:t});let r=Object.values(this.coords);return e.every((e,n)=>{let a=r[n];if("angle"!==a.type&&a.range){if(Number.isNaN(e))return!0;let[r,n]=a.range;return(void 0===r||e>=r-t)&&(void 0===n||e<=n+t)}return!0})}get isUnbounded(){return Object.values(this.coords).every(e=>!("range"in e))}get cssId(){var e,t;return(null==(t=null==(e=this.formats)?void 0:e.color)?void 0:t.id)||this.id}get isPolar(){for(let e in this.coords)if("angle"===this.coords[e].type)return!0;return!1}getFormat(e){if("object"==typeof e)return Ye(e,this);let t;return t="default"===e?Object.values(this.formats)[0]:this.formats[e],t?(t=Ye(t,this),t):null}equals(e){return!!e&&(this===e||this.id===e||this.id===e.id)}to(t,r){if(1===arguments.length){const e=De(t);[t,r]=[e.space,e.coords]}if(t=e.get(t),this.equals(t))return r;r=r.map(e=>Number.isNaN(e)?0:e);let n,a,o=this.path,i=t.path;for(let e=0;e<o.length&&o[e].equals(i[e]);e++)n=o[e],a=e;if(!n)throw new Error(`Cannot convert between color spaces ${this} and ${t}: no connection space was found`);for(let e=o.length-1;e>a;e--)r=o[e].toBase(r);for(let e=a+1;e<i.length;e++)r=i[e].fromBase(r);return r}from(t,r){if(1===arguments.length){const e=De(t);[t,r]=[e.space,e.coords]}return(t=e.get(t)).to(this,r)}toString(){return`${this.name} (${this.id})`}getMinCoords(){var e;let t=[];for(let r in this.coords){let n=this.coords[r],a=n.range||n.refRange;t.push(null!=(e=null==a?void 0:a.min)?e:0)}return t}static get all(){return[...new Set(Object.values(e.registry))]}static register(e,t){if(1===arguments.length&&(e=(t=arguments[0]).id),t=this.get(t),this.registry[e]&&this.registry[e]!==t)throw new Error(`Duplicate color space registration: '${e}'`);if(this.registry[e]=t,1===arguments.length&&t.aliases)for(let r of t.aliases)this.register(r,t);return t}static get(t,...r){if(!t||t instanceof e)return t;if("string"===ve(t)){let r=e.registry[t.toLowerCase()];if(!r)throw new TypeError(`No color space found with id = "${t}"`);return r}if(r.length)return e.get(...r);throw new TypeError(`${t} is not a valid color space`)}static resolveCoord(t,r){var n;let a,o,i=ve(t);if("string"===i?t.includes(".")?[a,o]=t.split("."):[a,o]=[,t]:Array.isArray(t)?[a,o]=t:(a=t.space,o=t.coordId),a=e.get(a),a||(a=r),!a)throw new TypeError(`Cannot resolve coordinate reference ${t}: No color space specified and relative references are not allowed here`);if(i=ve(o),"number"===i||"string"===i&&o>=0){let e=Object.entries(a.coords)[o];if(e)return{space:a,id:e[0],index:o,...e[1]}}a=e.get(a);let s=o.toLowerCase(),l=0;for(let e in a.coords){let t=a.coords[e];if(e.toLowerCase()===s||(null==(n=t.name)?void 0:n.toLowerCase())===s)return{space:a,id:e,index:l,...t};l++}throw new TypeError(`No "${o}" coordinate found in ${a.name}. Its coordinates are: ${Object.keys(a.coords).join(", ")}`)}};G(Fe,"registry",{}),G(Fe,"DEFAULT_FORMAT",{type:"functions",name:"color"});let Ze=Fe;function Xe(e){let t=[e];for(let r=e;r=r.base;)t.push(r);return t}function Ye(e,{coords:t}={}){if(e.coords&&!e.coordGrammar){e.type||(e.type="function"),e.name||(e.name="color"),e.coordGrammar=Be(e.coords);let r=Object.entries(t).map(([t,r],n)=>{let a=e.coordGrammar[n][0],o=r.range||r.refRange,i=a.range,s="";return"<percentage>"==a?(i=[0,100],s="%"):"<angle>"==a&&(s="deg"),{fromRange:o,toRange:i,suffix:s}});e.serializeCoords=(e,t)=>e.map((e,n)=>{let{fromRange:a,toRange:o,suffix:i}=r[n];return a&&o&&(e=Ae(a,o,e)),ye(e,{precision:t,unit:i})})}return e}var Je=new Ze({id:"xyz-d65",name:"XYZ D65",coords:{x:{name:"X"},y:{name:"Y"},z:{name:"Z"}},white:"D65",formats:{color:{ids:["xyz-d65","xyz"]}},aliases:["xyz"]});class Ue extends Ze{constructor(e){e.coords||(e.coords={r:{range:[0,1],name:"Red"},g:{range:[0,1],name:"Green"},b:{range:[0,1],name:"Blue"}}),e.base||(e.base=Je),e.toXYZ_M&&e.fromXYZ_M&&(null!=e.toBase||(e.toBase=t=>{let r=me(e.toXYZ_M,t);return this.white!==this.base.white&&(r=je(this.white,this.base.white,r)),r}),null!=e.fromBase||(e.fromBase=t=>(t=je(this.base.white,this.white,t),me(e.fromXYZ_M,t)))),null!=e.referred||(e.referred="display"),super(e)}}function Ve(e,t){return e=De(e),!t||e.space.equals(t)?e.coords.slice():(t=Ze.get(t)).from(e)}function Qe(e,t){e=De(e);let{space:r,index:n}=Ze.resolveCoord(t,e.space);return Ve(e,r)[n]}function Ke(e,t,r){return e=De(e),t=Ze.get(t),e.coords=t.to(e.space,r),e}function et(e,t,r){if(e=De(e),2===arguments.length&&"object"===ve(arguments[1])){let t=arguments[1];for(let r in t)et(e,r,t[r])}else{"function"==typeof r&&(r=r(Qe(e,t)));let{space:n,index:a}=Ze.resolveCoord(t,e.space),o=Ve(e,n);o[a]=r,Ke(e,n,o)}return e}Ke.returns="color",et.returns="color";var tt=new Ze({id:"xyz-d50",name:"XYZ D50",white:"D50",base:Je,fromBase:e=>je(Je.white,"D50",e),toBase:e=>je("D50",Je.white,e)});const rt=216/24389,nt=24/116,at=24389/27;let ot=qe.D50;var it=new Ze({id:"lab",name:"Lab",coords:{l:{refRange:[0,100],name:"Lightness"},a:{refRange:[-125,125]},b:{refRange:[-125,125]}},white:ot,base:tt,fromBase(e){let t=e.map((e,t)=>e/ot[t]).map(e=>e>rt?Math.cbrt(e):(at*e+16)/116);return[116*t[1]-16,500*(t[0]-t[1]),200*(t[1]-t[2])]},toBase(e){let t=[];return t[1]=(e[0]+16)/116,t[0]=e[1]/500+t[1],t[2]=t[1]-e[2]/200,[t[0]>nt?Math.pow(t[0],3):(116*t[0]-16)/at,e[0]>8?Math.pow((e[0]+16)/116,3):e[0]/at,t[2]>nt?Math.pow(t[2],3):(116*t[2]-16)/at].map((e,t)=>e*ot[t])},formats:{lab:{coords:["<number> | <percentage>","<number> | <percentage>[-1,1]","<number> | <percentage>[-1,1]"]}}});function st(e){return(e%360+360)%360}var lt=new Ze({id:"lch",name:"LCH",coords:{l:{refRange:[0,100],name:"Lightness"},c:{refRange:[0,150],name:"Chroma"},h:{refRange:[0,360],type:"angle",name:"Hue"}},base:it,fromBase(e){let t,[r,n,a]=e;return t=Math.abs(n)<.02&&Math.abs(a)<.02?NaN:180*Math.atan2(a,n)/Math.PI,[r,Math.sqrt(n**2+a**2),st(t)]},toBase(e){let[t,r,n]=e;return r<0&&(r=0),isNaN(n)&&(n=0),[t,r*Math.cos(n*Math.PI/180),r*Math.sin(n*Math.PI/180)]},formats:{lch:{coords:["<number> | <percentage>","<number> | <percentage>","<number> | <angle>"]}}});const ct=25**7,ht=Math.PI,ut=180/ht,pt=ht/180;function dt(e){const t=e*e;return t*t*t*e}function ft(e,t,{kL:r=1,kC:n=1,kH:a=1}={}){[e,t]=De([e,t]);let[o,i,s]=it.from(e),l=lt.from(it,[o,i,s])[1],[c,h,u]=it.from(t),p=lt.from(it,[c,h,u])[1];l<0&&(l=0),p<0&&(p=0);let d=dt((l+p)/2),f=.5*(1-Math.sqrt(d/(d+ct))),g=(1+f)*i,m=(1+f)*h,b=Math.sqrt(g**2+s**2),v=Math.sqrt(m**2+u**2),y=0===g&&0===s?0:Math.atan2(s,g),w=0===m&&0===u?0:Math.atan2(u,m);y<0&&(y+=2*ht),w<0&&(w+=2*ht),y*=ut,w*=ut;let M,k=c-o,x=v-b,C=w-y,S=y+w,$=Math.abs(C);b*v===0?M=0:$<=180?M=C:C>180?M=C-360:C<-180?M=C+360:_e.warn("the unthinkable has happened");let L,A=2*Math.sqrt(v*b)*Math.sin(M*pt/2),B=(o+c)/2,E=(b+v)/2,R=dt(E);L=b*v===0?S:$<=180?S/2:S<360?(S+360)/2:(S-360)/2;let N=(B-50)**2,z=1+.015*N/Math.sqrt(20+N),P=1+.045*E,H=1;H-=.17*Math.cos((L-30)*pt),H+=.24*Math.cos(2*L*pt),H+=.32*Math.cos((3*L+6)*pt),H-=.2*Math.cos((4*L-63)*pt);let W=1+.015*E*H,_=30*Math.exp(-1*((L-275)/25)**2),q=2*Math.sqrt(R/(R+ct)),I=(k/(r*z))**2;return I+=(x/(n*P))**2,I+=(A/(a*W))**2,I+=-1*Math.sin(2*_*pt)*q*(x/(n*P))*(A/(a*W)),Math.sqrt(I)}const gt=[[.819022437996703,.3619062600528904,-.1288737815209879],[.0329836539323885,.9292868615863434,.0361446663506424],[.0481771893596242,.2642395317527308,.6335478284694309]],mt=[[1.2268798758459243,-.5578149944602171,.2813910456659647],[-.0405757452148008,1.112286803280317,-.0717110580655164],[-.0763729366746601,-.4214933324022432,1.5869240198367816]],bt=[[.210454268309314,.7936177747023054,-.0040720430116193],[1.9779985324311684,-2.42859224204858,.450593709617411],[.0259040424655478,.7827717124575296,-.8086757549230774]],vt=[[1,.3963377773761749,.2158037573099136],[1,-.1055613458156586,-.0638541728258133],[1,-.0894841775298119,-1.2914855480194092]];var yt=new Ze({id:"oklab",name:"Oklab",coords:{l:{refRange:[0,1],name:"Lightness"},a:{refRange:[-.4,.4]},b:{refRange:[-.4,.4]}},white:"D65",base:Je,fromBase(e){let t=me(gt,e).map(e=>Math.cbrt(e));return me(bt,t)},toBase(e){let t=me(vt,e).map(e=>e**3);return me(mt,t)},formats:{oklab:{coords:["<percentage> | <number>","<number> | <percentage>[-1,1]","<number> | <percentage>[-1,1]"]}}});function wt(e,t){[e,t]=De([e,t]);let[r,n,a]=yt.from(e),[o,i,s]=yt.from(t),l=r-o,c=n-i,h=a-s;return Math.sqrt(l**2+c**2+h**2)}function Mt(e,t,{epsilon:r=75e-6}={}){e=De(e),t||(t=e.space),t=Ze.get(t);let n=e.coords;return t!==e.space&&(n=t.from(e)),t.inGamut(n,{epsilon:r})}function kt(e){return{space:e.space,coords:e.coords.slice(),alpha:e.alpha}}function xt(e,t,r="lab"){let n=(r=Ze.get(r)).from(e),a=r.from(t);return Math.sqrt(n.reduce((e,t,r)=>{let n=a[r];return isNaN(t)||isNaN(n)?e:e+(n-t)**2},0))}const Ct=Math.PI/180;var St=new Ze({id:"xyz-abs-d65",cssId:"--xyz-abs-d65",name:"Absolute XYZ D65",coords:{x:{refRange:[0,9504.7],name:"Xa"},y:{refRange:[0,1e4],name:"Ya"},z:{refRange:[0,10888.3],name:"Za"}},base:Je,fromBase:e=>e.map(e=>Math.max(203*e,0)),toBase:e=>e.map(e=>Math.max(e/203,0))});const $t=1.15,Lt=.66,At=2610/16384,Bt=16384/2610,Et=.8359375,Rt=2413/128,Nt=18.6875,zt=1.7*2523/32,Pt=32/(1.7*2523),Ht=-.56,Wt=16295499532821565e-27,_t=[[.41478972,.579999,.014648],[-.20151,1.120649,.0531008],[-.0166008,.2648,.6684799]],qt=[[1.9242264357876067,-1.0047923125953657,.037651404030618],[.35031676209499907,.7264811939316552,-.06538442294808501],[-.09098281098284752,-.3127282905230739,1.5227665613052603]],It=[[.5,.5,0],[3.524,-4.066708,.542708],[.199076,1.096799,-1.295875]],jt=[[1,.1386050432715393,.05804731615611886],[.9999999999999999,-.1386050432715393,-.05804731615611886],[.9999999999999998,-.09601924202631895,-.8118918960560388]];var Ot=new Ze({id:"jzazbz",name:"Jzazbz",coords:{jz:{refRange:[0,1],name:"Jz"},az:{refRange:[-.5,.5]},bz:{refRange:[-.5,.5]}},base:St,fromBase(e){let[t,r,n]=e,a=me(_t,[$t*t-($t-1)*n,Lt*r-(Lt-1)*t,n]).map(function(e){return((Et+Rt*(e/1e4)**At)/(1+Nt*(e/1e4)**At))**zt}),[o,i,s]=me(It,a);return[(1+Ht)*o/(1+Ht*o)-Wt,i,s]},toBase(e){let[t,r,n]=e,a=me(jt,[(t+Wt)/(1+Ht-Ht*(t+Wt)),r,n]).map(function(e){return 1e4*((Et-e**Pt)/(Nt*e**Pt-Rt))**Bt}),[o,i,s]=me(qt,a),l=(o+($t-1)*s)/$t;return[l,(i+(Lt-1)*l)/Lt,s]},formats:{color:{coords:["<number> | <percentage>","<number> | <percentage>[-1,1]","<number> | <percentage>[-1,1]"]}}}),Tt=new Ze({id:"jzczhz",name:"JzCzHz",coords:{jz:{refRange:[0,1],name:"Jz"},cz:{refRange:[0,1],name:"Chroma"},hz:{refRange:[0,360],type:"angle",name:"Hue"}},base:Ot,fromBase(e){let t,[r,n,a]=e;const o=2e-4;return t=Math.abs(n)<o&&Math.abs(a)<o?NaN:180*Math.atan2(a,n)/Math.PI,[r,Math.sqrt(n**2+a**2),st(t)]},toBase:e=>[e[0],e[1]*Math.cos(e[2]*Math.PI/180),e[1]*Math.sin(e[2]*Math.PI/180)]});const Gt=.8359375,Dt=2413/128,Ft=18.6875,Zt=2610/16384,Xt=16384/2610,Yt=32/2523,Jt=[[.3592832590121217,.6976051147779502,-.035891593232029],[-.1920808463704993,1.100476797037432,.0753748658519118],[.0070797844607479,.0748396662186362,.8433265453898765]],Ut=[[.5,.5,0],[6610/4096,-13613/4096,7003/4096],[17933/4096,-17390/4096,-543/4096]],Vt=[[.9999999999999998,.0086090370379328,.111029625003026],[.9999999999999998,-.0086090370379328,-.1110296250030259],[.9999999999999998,.5600313357106791,-.3206271749873188]],Qt=[[2.0701522183894223,-1.3263473389671563,.2066510476294053],[.3647385209748072,.6805660249472273,-.0453045459220347],[-.0497472075358123,-.0492609666966131,1.1880659249923042]];var Kt=new Ze({id:"ictcp",name:"ICTCP",coords:{i:{refRange:[0,1],name:"I"},ct:{refRange:[-.5,.5],name:"CT"},cp:{refRange:[-.5,.5],name:"CP"}},base:St,fromBase:e=>function(e){let t=e.map(function(e){return((Gt+Dt*(e/1e4)**Zt)/(1+Ft*(e/1e4)**Zt))**78.84375});return me(Ut,t)}(me(Jt,e)),toBase(e){let t=function(e){return me(Vt,e).map(function(e){return 1e4*(Math.max(e**Yt-Gt,0)/(Dt-Ft*e**Yt))**Xt})}(e);return me(Qt,t)}});const er=qe.D65,tr=1/.42,rr=2*Math.PI,nr=[[.401288,.650173,-.051461],[-.250268,1.204414,.045854],[-.002079,.048952,.953127]],ar=[[1.8620678550872327,-1.0112546305316843,.14918677544445175],[.38752654323613717,.6214474419314753,-.008973985167612518],[-.015841498849333856,-.03412293802851557,1.0499644368778496]],or=[[460,451,288],[460,-891,-261],[460,-220,-6300]],ir={dark:[.8,.525,.8],dim:[.9,.59,.9],average:[1,.69,1]},sr={h:[20.14,90,164.25,237.53,380.14],e:[.8,.7,1,1.2,.8],H:[0,100,200,300,400]},lr=180/Math.PI,cr=Math.PI/180;function hr(e,t){return e.map(e=>{const r=Ne(t*Math.abs(e)*.01,.42);return 400*Re(r,e)/(r+27.13)})}function ur(e,t,r,n,a){const o={};o.discounting=a,o.refWhite=e,o.surround=n;const i=e.map(e=>100*e);o.la=t,o.yb=r;const s=i[1],l=me(nr,i),c=(n=ir[o.surround])[0];o.c=n[1],o.nc=n[2];const h=(1/(5*o.la+1))**4;o.fl=h*o.la+.1*(1-h)*(1-h)*Math.cbrt(5*o.la),o.flRoot=o.fl**.25,o.n=o.yb/s,o.z=1.48+Math.sqrt(o.n),o.nbb=.725*o.n**-.2,o.ncb=o.nbb;const u=Math.max(Math.min(c*(1-1/3.6*Math.exp((-o.la-42)/92)),1),0);o.dRgb=l.map(e=>$e(1,s/e,u)),o.dRgbInv=o.dRgb.map(e=>1/e);const p=hr(l.map((e,t)=>e*o.dRgb[t]),o.fl);return o.aW=o.nbb*(2*p[0]+p[1]+.05*p[2]),o}const pr=ur(er,64/Math.PI*.2,20,"average",!1);function dr(e,t){if(!(void 0!==e.J^void 0!==e.Q))throw new Error("Conversion requires one and only one: 'J' or 'Q'");if(!(void 0!==e.C^void 0!==e.M^void 0!==e.s))throw new Error("Conversion requires one and only one: 'C', 'M' or 's'");if(!(void 0!==e.h^void 0!==e.H))throw new Error("Conversion requires one and only one: 'h' or 'H'");if(0===e.J||0===e.Q)return[0,0,0];let r=0;r=void 0!==e.h?st(e.h)*cr:function(e){let t=(e%400+400)%400;const r=Math.floor(.01*t);t%=100;const[n,a]=sr.h.slice(r,r+2),[o,i]=sr.e.slice(r,r+2);return st((t*(i*n-o*a)-100*n*i)/(t*(i-o)-100*i))}(e.H)*cr;const n=Math.cos(r),a=Math.sin(r);let o=0;void 0!==e.J?o=.1*Ne(e.J,.5):void 0!==e.Q&&(o=.25*t.c*e.Q/((t.aW+4)*t.flRoot));let i=0;void 0!==e.C?i=e.C/o:void 0!==e.M?i=e.M/t.flRoot/o:void 0!==e.s&&(i=4e-4*e.s**2*(t.aW+4)/t.c);const s=Ne(i*Math.pow(1.64-Math.pow(.29,t.n),-.73),10/9),l=.25*(Math.cos(r+2)+3.8),c=t.aW*Ne(o,2/t.c/t.z),h=5e4/13*t.nc*t.ncb*l,u=c/t.nbb,p=23*(u+.305)*ze(s,23*h+s*(11*n+108*a)),d=function(e,t){const r=100/t*2588.068098016295;return e.map(e=>{const t=Math.abs(e);return Re(r*Ne(t/(400-t),tr),e)})}(me(or,[u,p*n,p*a]).map(e=>1*e/1403),t.fl);return me(ar,d.map((e,r)=>e*t.dRgbInv[r])).map(e=>e/100)}function fr(e,t){const r=e.map(e=>100*e),n=hr(me(nr,r).map((e,r)=>e*t.dRgb[r]),t.fl),a=n[0]+(-12*n[1]+n[2])/11,o=(n[0]+n[1]-2*n[2])/9,i=(Math.atan2(o,a)%rr+rr)%rr,s=.25*(Math.cos(i+2)+3.8),l=Ne(5e4/13*t.nc*t.ncb*ze(s*Math.sqrt(a**2+o**2),n[0]+n[1]+1.05*n[2]+.305),.9)*Math.pow(1.64-Math.pow(.29,t.n),.73),c=Ne(t.nbb*(2*n[0]+n[1]+.05*n[2])/t.aW,.5*t.c*t.z),h=100*Ne(c,2),u=4/t.c*c*(t.aW+4)*t.flRoot,p=l*c,d=p*t.flRoot,f=st(i*lr),g=function(e){let t=st(e);t<=sr.h[0]&&(t+=360);const r=Pe(sr.h,t)-1,[n,a]=sr.h.slice(r,r+2),[o,i]=sr.e.slice(r,r+2),s=(t-n)/o;return sr.H[r]+100*s/(s+(a-t)/i)}(f);return{J:h,C:p,h:f,s:50*Ne(t.c*l/(t.aW+4),.5),Q:u,M:d,H:g}}var gr=new Ze({id:"cam16-jmh",cssId:"--cam16-jmh",name:"CAM16-JMh",coords:{j:{refRange:[0,100],name:"J"},m:{refRange:[0,105],name:"Colorfulness"},h:{refRange:[0,360],type:"angle",name:"Hue"}},base:Je,fromBase(e){const t=fr(e,pr);return[t.J,t.M,t.h]},toBase:e=>dr({J:e[0],M:e[1],h:e[2]},pr)});const mr=qe.D65,br=216/24389,vr=24389/27;function yr(e){return e>8?Math.pow((e+16)/116,3):e/vr}const wr=ur(mr,200/Math.PI*yr(50),100*yr(50),"average",!1);var Mr=new Ze({id:"hct",name:"HCT",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},c:{refRange:[0,145],name:"Colorfulness"},t:{refRange:[0,100],name:"Tone"}},base:Je,fromBase:e=>function(e){const t=116*((r=e[1])>br?Math.cbrt(r):(vr*r+16)/116)-16;var r;if(0===t)return[0,0,0];const n=fr(e,wr);return[st(n.h),n.C,t]}(e),toBase:e=>function(e,t){let[r,n,a]=e,o=[],i=0;if(0===a)return[0,0,0];let s=yr(a);i=a>0?.00379058511492914*a**2+.608983189401032*a+.9155088574762233:9514440756550361e-21*a**2+.08693057439788597*a-21.928975842194614;let l=0,c=1/0;for(;l<=15;){o=dr({J:i,C:n,h:r},t);const e=Math.abs(o[1]-s);if(e<c){if(e<=2e-12)return o;c=e}i-=(o[1]-s)*i/(2*o[1]),l+=1}return dr({J:i,C:n,h:r},t)}(e,wr),formats:{color:{id:"--hct",coords:["<number> | <angle>","<percentage> | <number>","<percentage> | <number>"]}}});const kr=Math.PI/180,xr=[1,.007,.0228];function Cr(e){e[1]<0&&(e=Mr.fromBase(Mr.toBase(e)));const t=Math.log(Math.max(1+xr[2]*e[1]*wr.flRoot,1))/xr[2],r=e[0]*kr,n=t*Math.cos(r),a=t*Math.sin(r);return[e[2],n,a]}var Sr={deltaE76:function(e,t){return xt(e,t,"lab")},deltaECMC:function(e,t,{l:r=2,c:n=1}={}){[e,t]=De([e,t]);let[a,o,i]=it.from(e),[,s,l]=lt.from(it,[a,o,i]),[c,h,u]=it.from(t),p=lt.from(it,[c,h,u])[1];s<0&&(s=0),p<0&&(p=0);let d=a-c,f=s-p,g=(o-h)**2+(i-u)**2-f**2,m=.511;a>=16&&(m=.040975*a/(1+.01765*a));let b,v=.0638*s/(1+.0131*s)+.638;Number.isNaN(l)&&(l=0),b=l>=164&&l<=345?.56+Math.abs(.2*Math.cos((l+168)*Ct)):.36+Math.abs(.4*Math.cos((l+35)*Ct));let y=Math.pow(s,4),w=Math.sqrt(y/(y+1900)),M=(d/(r*m))**2;return M+=(f/(n*v))**2,M+=g/(v*(w*b+1-w))**2,Math.sqrt(M)},deltaE2000:ft,deltaEJz:function(e,t){[e,t]=De([e,t]);let[r,n,a]=Tt.from(e),[o,i,s]=Tt.from(t),l=r-o,c=n-i;Number.isNaN(a)&&Number.isNaN(s)?(a=0,s=0):Number.isNaN(a)?a=s:Number.isNaN(s)&&(s=a);let h=a-s,u=2*Math.sqrt(n*i)*Math.sin(h/2*(Math.PI/180));return Math.sqrt(l**2+c**2+u**2)},deltaEITP:function(e,t){[e,t]=De([e,t]);let[r,n,a]=Kt.from(e),[o,i,s]=Kt.from(t);return 720*Math.sqrt((r-o)**2+.25*(n-i)**2+(a-s)**2)},deltaEOK:wt,deltaEHCT:function(e,t){[e,t]=De([e,t]);let[r,n,a]=Cr(Mr.from(e)),[o,i,s]=Cr(Mr.from(t));return Math.sqrt((r-o)**2+(n-i)**2+(a-s)**2)}};const $r={hct:{method:"hct.c",jnd:2,deltaEMethod:"hct",blackWhiteClamp:{}},"hct-tonal":{method:"hct.c",jnd:0,deltaEMethod:"hct",blackWhiteClamp:{channel:"hct.t",min:0,max:100}}};function Lr(e,{method:t=_e.gamut_mapping,space:r,deltaEMethod:n="",jnd:a=2,blackWhiteClamp:o={}}={}){if(e=De(e),be(arguments[1])?r=arguments[1]:r||(r=e.space),Mt(e,r=Ze.get(r),{epsilon:0}))return e;let i;if("css"===t)i=function(e,{space:t}={}){const r=.02,n=1e-4;e=De(e),t||(t=e.space),t=Ze.get(t);const a=Ze.get("oklch");if(t.isUnbounded)return Br(e,t);const o=Br(e,a);let i=o.coords[0];if(i>=1){const r=Br(Ar.WHITE,t);return r.alpha=e.alpha,Br(r,t)}if(i<=0){const r=Br(Ar.BLACK,t);return r.alpha=e.alpha,Br(r,t)}if(Mt(o,t,{epsilon:0}))return Br(o,t);function s(e){const r=Br(e,t),n=Object.values(t.coords);return r.coords=r.coords.map((e,t)=>{if("range"in n[t]){const[r,a]=n[t].range;return Ee(r,e,a)}return e}),r}let l=0,c=o.coords[1],h=!0,u=kt(o),p=s(u),d=wt(p,u);if(d<r)return p;for(;c-l>n;){const e=(l+c)/2;if(u.coords[1]=e,h&&Mt(u,t,{epsilon:0}))l=e;else if(p=s(u),d=wt(p,u),d<r){if(r-d<n)break;h=!1,l=e}else c=e}return p}(e,{space:r});else{if("clip"===t||Mt(e,r))i=Br(e,r);else{Object.prototype.hasOwnProperty.call($r,t)&&({method:t,jnd:a,deltaEMethod:n,blackWhiteClamp:o}=$r[t]);let s=ft;if(""!==n)for(let e in Sr)if("deltae"+n.toLowerCase()===e.toLowerCase()){s=Sr[e];break}let l=Lr(Br(e,r),{method:"clip",space:r});if(s(e,l)>a){if(3===Object.keys(o).length){let t=Ze.resolveCoord(o.channel),r=Qe(Br(e,t.space),t.id);if(we(r)&&(r=0),r>=o.max)return Br({space:"xyz-d65",coords:qe.D65},e.space);if(r<=o.min)return Br({space:"xyz-d65",coords:[0,0,0]},e.space)}let n=Ze.resolveCoord(t),l=n.space,c=n.id,h=Br(e,l);h.coords.forEach((e,t)=>{we(e)&&(h.coords[t]=0)});let u=(n.range||n.refRange)[0],p=function(e){const t=e?Math.floor(Math.log10(Math.abs(e))):0;return Math.max(parseFloat("1e"+(t-2)),1e-6)}(a),d=u,f=Qe(h,c);for(;f-d>p;){let e=kt(h);e=Lr(e,{space:r,method:"clip"}),s(h,e)-a<p?d=Qe(h,c):f=Qe(h,c),et(h,c,(d+f)/2)}i=Br(h,r)}else i=l}if("clip"===t||!Mt(i,r,{epsilon:0})){let e=Object.values(r.coords).map(e=>e.range||[]);i.coords=i.coords.map((t,r)=>{let[n,a]=e[r];return void 0!==n&&(t=Math.max(n,t)),void 0!==a&&(t=Math.min(t,a)),t})}}return r!==e.space&&(i=Br(i,e.space)),e.coords=i.coords,e}Lr.returns="color";const Ar={WHITE:{space:yt,coords:[1,0,0]},BLACK:{space:yt,coords:[0,0,0]}};function Br(e,t,{inGamut:r}={}){e=De(e);let n=(t=Ze.get(t)).from(e),a={space:t,coords:n,alpha:e.alpha};return r&&(a=Lr(a,!0===r?void 0:r)),a}function Er(e,{precision:t=_e.precision,format:r="default",inGamut:n=!0,...a}={}){var o,i,s;let l,c=r;r=null!=(i=null!=(o=(e=De(e)).space.getFormat(r))?o:e.space.getFormat("default"))?i:Ze.DEFAULT_FORMAT;let h=e.coords.slice();if(n||(n=r.toGamut),n&&!Mt(e)&&(h=Lr(kt(e),!0===n?void 0:n).coords),"custom"===r.type){if(a.precision=t,!r.serialize)throw new TypeError(`format ${c} can only be used to parse colors, not for serialization`);l=r.serialize(h,e.alpha,a)}else{let n=r.name||"color";r.serializeCoords?h=r.serializeCoords(h,t):null!==t&&(h=h.map(e=>ye(e,{precision:t})));let a=[...h];if("color"===n){let t=r.id||(null==(s=r.ids)?void 0:s[0])||e.space.id;a.unshift(t)}let o=e.alpha;null!==t&&(o=ye(o,{precision:t}));let i=e.alpha>=1||r.noAlpha?"":`${r.commas?",":" /"} ${o}`;l=`${n}(${a.join(r.commas?", ":" ")}${i})`}return l}Br.returns="color";var Rr=new Ue({id:"rec2020-linear",cssId:"--rec2020-linear",name:"Linear REC.2020",white:"D65",toXYZ_M:[[.6369580483012914,.14461690358620832,.1688809751641721],[.2627002120112671,.6779980715188708,.05930171646986196],[0,.028072693049087428,1.060985057710791]],fromXYZ_M:[[1.716651187971268,-.355670783776392,-.25336628137366],[-.666684351832489,1.616481236634939,.0157685458139111],[.017639857445311,-.042770613257809,.942103121235474]]});const Nr=1.09929682680944,zr=.018053968510807;var Pr=new Ue({id:"rec2020",name:"REC.2020",base:Rr,toBase:e=>e.map(function(e){return e<4.5*zr?e/4.5:Math.pow((e+Nr-1)/Nr,1/.45)}),fromBase:e=>e.map(function(e){return e>=zr?Nr*Math.pow(e,.45)-(Nr-1):4.5*e})}),Hr=new Ue({id:"p3-linear",cssId:"--display-p3-linear",name:"Linear P3",white:"D65",toXYZ_M:[[.4865709486482162,.26566769316909306,.1982172852343625],[.2289745640697488,.6917385218365064,.079286914093745],[0,.04511338185890264,1.043944368900976]],fromXYZ_M:[[2.493496911941425,-.9313836179191239,-.40271078445071684],[-.8294889695615747,1.7626640603183463,.023624685841943577],[.03584583024378447,-.07617238926804182,.9568845240076872]]});const Wr=[[3.2409699419045226,-1.537383177570094,-.4986107602930034],[-.9692436362808796,1.8759675015077202,.04155505740717559],[.05563007969699366,-.20397695888897652,1.0569715142428786]];var _r=new Ue({id:"srgb-linear",name:"Linear sRGB",white:"D65",toXYZ_M:[[.41239079926595934,.357584339383878,.1804807884018343],[.21263900587151027,.715168678767756,.07219231536073371],[.01933081871559182,.11919477979462598,.9505321522496607]],fromXYZ_M:Wr}),qr={aliceblue:[240/255,248/255,1],antiquewhite:[250/255,235/255,215/255],aqua:[0,1,1],aquamarine:[127/255,1,212/255],azure:[240/255,1,1],beige:[245/255,245/255,220/255],bisque:[1,228/255,196/255],black:[0,0,0],blanchedalmond:[1,235/255,205/255],blue:[0,0,1],blueviolet:[138/255,43/255,226/255],brown:[165/255,42/255,42/255],burlywood:[222/255,184/255,135/255],cadetblue:[95/255,158/255,160/255],chartreuse:[127/255,1,0],chocolate:[210/255,105/255,30/255],coral:[1,127/255,80/255],cornflowerblue:[100/255,149/255,237/255],cornsilk:[1,248/255,220/255],crimson:[220/255,20/255,60/255],cyan:[0,1,1],darkblue:[0,0,139/255],darkcyan:[0,139/255,139/255],darkgoldenrod:[184/255,134/255,11/255],darkgray:[169/255,169/255,169/255],darkgreen:[0,100/255,0],darkgrey:[169/255,169/255,169/255],darkkhaki:[189/255,183/255,107/255],darkmagenta:[139/255,0,139/255],darkolivegreen:[85/255,107/255,47/255],darkorange:[1,140/255,0],darkorchid:[.6,50/255,.8],darkred:[139/255,0,0],darksalmon:[233/255,150/255,122/255],darkseagreen:[143/255,188/255,143/255],darkslateblue:[72/255,61/255,139/255],darkslategray:[47/255,79/255,79/255],darkslategrey:[47/255,79/255,79/255],darkturquoise:[0,206/255,209/255],darkviolet:[148/255,0,211/255],deeppink:[1,20/255,147/255],deepskyblue:[0,191/255,1],dimgray:[105/255,105/255,105/255],dimgrey:[105/255,105/255,105/255],dodgerblue:[30/255,144/255,1],firebrick:[178/255,34/255,34/255],floralwhite:[1,250/255,240/255],forestgreen:[34/255,139/255,34/255],fuchsia:[1,0,1],gainsboro:[220/255,220/255,220/255],ghostwhite:[248/255,248/255,1],gold:[1,215/255,0],goldenrod:[218/255,165/255,32/255],gray:[128/255,128/255,128/255],green:[0,128/255,0],greenyellow:[173/255,1,47/255],grey:[128/255,128/255,128/255],honeydew:[240/255,1,240/255],hotpink:[1,105/255,180/255],indianred:[205/255,92/255,92/255],indigo:[75/255,0,130/255],ivory:[1,1,240/255],khaki:[240/255,230/255,140/255],lavender:[230/255,230/255,250/255],lavenderblush:[1,240/255,245/255],lawngreen:[124/255,252/255,0],lemonchiffon:[1,250/255,205/255],lightblue:[173/255,216/255,230/255],lightcoral:[240/255,128/255,128/255],lightcyan:[224/255,1,1],lightgoldenrodyellow:[250/255,250/255,210/255],lightgray:[211/255,211/255,211/255],lightgreen:[144/255,238/255,144/255],lightgrey:[211/255,211/255,211/255],lightpink:[1,182/255,193/255],lightsalmon:[1,160/255,122/255],lightseagreen:[32/255,178/255,170/255],lightskyblue:[135/255,206/255,250/255],lightslategray:[119/255,136/255,.6],lightslategrey:[119/255,136/255,.6],lightsteelblue:[176/255,196/255,222/255],lightyellow:[1,1,224/255],lime:[0,1,0],limegreen:[50/255,205/255,50/255],linen:[250/255,240/255,230/255],magenta:[1,0,1],maroon:[128/255,0,0],mediumaquamarine:[.4,205/255,170/255],mediumblue:[0,0,205/255],mediumorchid:[186/255,85/255,211/255],mediumpurple:[147/255,112/255,219/255],mediumseagreen:[60/255,179/255,113/255],mediumslateblue:[123/255,104/255,238/255],mediumspringgreen:[0,250/255,154/255],mediumturquoise:[72/255,209/255,.8],mediumvioletred:[199/255,21/255,133/255],midnightblue:[25/255,25/255,112/255],mintcream:[245/255,1,250/255],mistyrose:[1,228/255,225/255],moccasin:[1,228/255,181/255],navajowhite:[1,222/255,173/255],navy:[0,0,128/255],oldlace:[253/255,245/255,230/255],olive:[128/255,128/255,0],olivedrab:[107/255,142/255,35/255],orange:[1,165/255,0],orangered:[1,69/255,0],orchid:[218/255,112/255,214/255],palegoldenrod:[238/255,232/255,170/255],palegreen:[152/255,251/255,152/255],paleturquoise:[175/255,238/255,238/255],palevioletred:[219/255,112/255,147/255],papayawhip:[1,239/255,213/255],peachpuff:[1,218/255,185/255],peru:[205/255,133/255,63/255],pink:[1,192/255,203/255],plum:[221/255,160/255,221/255],powderblue:[176/255,224/255,230/255],purple:[128/255,0,128/255],rebeccapurple:[.4,.2,.6],red:[1,0,0],rosybrown:[188/255,143/255,143/255],royalblue:[65/255,105/255,225/255],saddlebrown:[139/255,69/255,19/255],salmon:[250/255,128/255,114/255],sandybrown:[244/255,164/255,96/255],seagreen:[46/255,139/255,87/255],seashell:[1,245/255,238/255],sienna:[160/255,82/255,45/255],silver:[192/255,192/255,192/255],skyblue:[135/255,206/255,235/255],slateblue:[106/255,90/255,205/255],slategray:[112/255,128/255,144/255],slategrey:[112/255,128/255,144/255],snow:[1,250/255,250/255],springgreen:[0,1,127/255],steelblue:[70/255,130/255,180/255],tan:[210/255,180/255,140/255],teal:[0,128/255,128/255],thistle:[216/255,191/255,216/255],tomato:[1,99/255,71/255],turquoise:[64/255,224/255,208/255],violet:[238/255,130/255,238/255],wheat:[245/255,222/255,179/255],white:[1,1,1],whitesmoke:[245/255,245/255,245/255],yellow:[1,1,0],yellowgreen:[154/255,205/255,50/255]};let Ir=Array(3).fill("<percentage> | <number>[0, 255]"),jr=Array(3).fill("<number>[0, 255]");var Or=new Ue({id:"srgb",name:"sRGB",base:_r,fromBase:e=>e.map(e=>{let t=e<0?-1:1,r=e*t;return r>.0031308?t*(1.055*r**(1/2.4)-.055):12.92*e}),toBase:e=>e.map(e=>{let t=e<0?-1:1,r=e*t;return r<=.04045?e/12.92:t*((r+.055)/1.055)**2.4}),formats:{rgb:{coords:Ir},rgb_number:{name:"rgb",commas:!0,coords:jr,noAlpha:!0},color:{},rgba:{coords:Ir,commas:!0,lastAlpha:!0},rgba_number:{name:"rgba",commas:!0,coords:jr},hex:{type:"custom",toGamut:!0,test:e=>/^#([a-f0-9]{3,4}){1,2}$/i.test(e),parse(e){e.length<=5&&(e=e.replace(/[a-f0-9]/gi,"$&$&"));let t=[];return e.replace(/[a-f0-9]{2}/gi,e=>{t.push(parseInt(e,16)/255)}),{spaceId:"srgb",coords:t.slice(0,3),alpha:t.slice(3)[0]}},serialize:(e,t,{collapse:r=!0}={})=>{t<1&&e.push(t),e=e.map(e=>Math.round(255*e));let n=r&&e.every(e=>e%17==0);return"#"+e.map(e=>n?(e/17).toString(16):e.toString(16).padStart(2,"0")).join("")}},keyword:{type:"custom",test:e=>/^[a-z]+$/i.test(e),parse(e){let t={spaceId:"srgb",coords:null,alpha:1};if("transparent"===(e=e.toLowerCase())?(t.coords=qr.black,t.alpha=0):t.coords=qr[e],t.coords)return t}}}}),Tr=new Ue({id:"p3",cssId:"display-p3",name:"P3",base:Hr,fromBase:Or.fromBase,toBase:Or.toBase});let Gr;if(_e.display_space=Or,"undefined"!=typeof CSS&&CSS.supports)for(let Ra of[it,Pr,Tr]){let e=Ra.getMinCoords(),t=Er({space:Ra,coords:e,alpha:1});if(CSS.supports("color",t)){_e.display_space=Ra;break}}function Dr(e){return Qe(e,[Je,"y"])}function Fr(e,t){et(e,[Je,"y"],t)}var Zr=Object.freeze({__proto__:null,getLuminance:Dr,register:function(e){Object.defineProperty(e.prototype,"luminance",{get(){return Dr(this)},set(e){Fr(this,e)}})},setLuminance:Fr});function Xr(e){return e>=.022?e:e+(.022-e)**1.414}function Yr(e){let t=e<0?-1:1,r=Math.abs(e);return t*Math.pow(r,2.4)}const Jr=216/24389,Ur=24/116,Vr=24389/27;let Qr=qe.D65;var Kr=new Ze({id:"lab-d65",name:"Lab D65",coords:{l:{refRange:[0,100],name:"Lightness"},a:{refRange:[-125,125]},b:{refRange:[-125,125]}},white:Qr,base:Je,fromBase(e){let t=e.map((e,t)=>e/Qr[t]).map(e=>e>Jr?Math.cbrt(e):(Vr*e+16)/116);return[116*t[1]-16,500*(t[0]-t[1]),200*(t[1]-t[2])]},toBase(e){let t=[];return t[1]=(e[0]+16)/116,t[0]=e[1]/500+t[1],t[2]=t[1]-e[2]/200,[t[0]>Ur?Math.pow(t[0],3):(116*t[0]-16)/Vr,e[0]>8?Math.pow((e[0]+16)/116,3):e[0]/Vr,t[2]>Ur?Math.pow(t[2],3):(116*t[2]-16)/Vr].map((e,t)=>e*Qr[t])},formats:{"lab-d65":{coords:["<number> | <percentage>","<number> | <percentage>[-1,1]","<number> | <percentage>[-1,1]"]}}});const en=.5*Math.pow(5,.5)+.5;var tn=Object.freeze({__proto__:null,contrastAPCA:function(e,t){let r,n,a,o,i,s;t=De(t),e=De(e),t=Br(t,"srgb"),[o,i,s]=t.coords;let l=.2126729*Yr(o)+.7151522*Yr(i)+.072175*Yr(s);e=Br(e,"srgb"),[o,i,s]=e.coords;let c=.2126729*Yr(o)+.7151522*Yr(i)+.072175*Yr(s),h=Xr(l),u=Xr(c),p=u>h;return Math.abs(u-h)<5e-4?n=0:p?(r=u**.56-h**.57,n=1.14*r):(r=u**.65-h**.62,n=1.14*r),a=Math.abs(n)<.1?0:n>0?n-.027:n+.027,100*a},contrastDeltaPhi:function(e,t){e=De(e),t=De(t);let r=Qe(e,[Kr,"l"]),n=Qe(t,[Kr,"l"]),a=Math.abs(Math.pow(r,en)-Math.pow(n,en)),o=Math.pow(a,1/en)*Math.SQRT2-40;return o<7.5?0:o},contrastLstar:function(e,t){e=De(e),t=De(t);let r=Qe(e,[it,"l"]),n=Qe(t,[it,"l"]);return Math.abs(r-n)},contrastMichelson:function(e,t){e=De(e),t=De(t);let r=Math.max(Dr(e),0),n=Math.max(Dr(t),0);n>r&&([r,n]=[n,r]);let a=r+n;return 0===a?0:(r-n)/a},contrastWCAG21:function(e,t){e=De(e),t=De(t);let r=Math.max(Dr(e),0),n=Math.max(Dr(t),0);return n>r&&([r,n]=[n,r]),(r+.05)/(n+.05)},contrastWeber:function(e,t){e=De(e),t=De(t);let r=Math.max(Dr(e),0),n=Math.max(Dr(t),0);return n>r&&([r,n]=[n,r]),0===n?5e4:(r-n)/n}});function rn(e){let[t,r,n]=Ve(e,Je),a=t+15*r+3*n;return[4*t/a,9*r/a]}function nn(e){let[t,r,n]=Ve(e,Je),a=t+r+n;return[t/a,r/a]}var an=Object.freeze({__proto__:null,register:function(e){Object.defineProperty(e.prototype,"uv",{get(){return rn(this)}}),Object.defineProperty(e.prototype,"xy",{get(){return nn(this)}})},uv:rn,xy:nn});function on(e,t,r={}){be(r)&&(r={method:r});let{method:n=_e.deltaE,...a}=r;for(let o in Sr)if("deltae"+n.toLowerCase()===o.toLowerCase())return Sr[o](e,t,a);throw new TypeError(`Unknown deltaE method: ${n}`)}var sn=Object.freeze({__proto__:null,darken:function(e,t=.25){return et(e,[Ze.get("oklch","lch"),"l"],e=>e*(1-t))},lighten:function(e,t=.25){return et(e,[Ze.get("oklch","lch"),"l"],e=>e*(1+t))}});function ln(e,t,r=.5,n={}){return[e,t]=[De(e),De(t)],"object"===ve(r)&&([r,n]=[.5,r]),hn(e,t,n)(r)}function cn(e,t,r={}){let n;un(e)&&([n,r]=[e,t],[e,t]=n.rangeArgs.colors);let{maxDeltaE:a,deltaEMethod:o,steps:i=2,maxSteps:s=1e3,...l}=r;n||([e,t]=[De(e),De(t)],n=hn(e,t,l));let c=on(e,t),h=a>0?Math.max(i,Math.ceil(c/a)+1):i,u=[];if(void 0!==s&&(h=Math.min(h,s)),1===h)u=[{p:.5,color:n(.5)}];else{let e=1/(h-1);u=Array.from({length:h},(t,r)=>{let a=r*e;return{p:a,color:n(a)}})}if(a>0){let e=u.reduce((e,t,r)=>{if(0===r)return 0;let n=on(t.color,u[r-1].color,o);return Math.max(e,n)},0);for(;e>a;){e=0;for(let t=1;t<u.length&&u.length<s;t++){let r=u[t-1],a=u[t],o=(a.p+r.p)/2,i=n(o);e=Math.max(e,on(i,r.color),on(i,a.color)),u.splice(t,0,{p:o,color:n(o)}),t++}}}return u=u.map(e=>e.color),u}function hn(e,t,r={}){if(un(e)){let[r,n]=[e,t];return hn(...r.rangeArgs.colors,{...r.rangeArgs.options,...n})}let{space:n,outputSpace:a,progression:o,premultiplied:i}=r;e=De(e),t=De(t),e=kt(e),t=kt(t);let s={colors:[e,t],options:r};if(n=n?Ze.get(n):Ze.registry[_e.interpolationSpace]||e.space,a=a?Ze.get(a):n,e=Br(e,n),t=Br(t,n),e=Lr(e),t=Lr(t),n.coords.h&&"angle"===n.coords.h.type){let a=r.hue=r.hue||"shorter",o=[n,"h"],[i,s]=[Qe(e,o),Qe(t,o)];isNaN(i)&&!isNaN(s)?i=s:isNaN(s)&&!isNaN(i)&&(s=i),[i,s]=function(e,t){if("raw"===e)return t;let[r,n]=t.map(st),a=n-r;return"increasing"===e?a<0&&(n+=360):"decreasing"===e?a>0&&(r+=360):"longer"===e?-180<a&&a<180&&(a>0?r+=360:n+=360):"shorter"===e&&(a>180?r+=360:a<-180&&(n+=360)),[r,n]}(a,[i,s]),et(e,o,i),et(t,o,s)}return i&&(e.coords=e.coords.map(t=>t*e.alpha),t.coords=t.coords.map(e=>e*t.alpha)),Object.assign(r=>{r=o?o(r):r;let s=e.coords.map((e,n)=>$e(e,t.coords[n],r)),l=$e(e.alpha,t.alpha,r),c={space:n,coords:s,alpha:l};return i&&(c.coords=c.coords.map(e=>e/l)),a!==n&&(c=Br(c,a)),c},{rangeArgs:s})}function un(e){return"function"===ve(e)&&!!e.rangeArgs}_e.interpolationSpace="lab";var pn=Object.freeze({__proto__:null,isRange:un,mix:ln,range:hn,register:function(e){e.defineFunction("mix",ln,{returns:"color"}),e.defineFunction("range",hn,{returns:"function<color>"}),e.defineFunction("steps",cn,{returns:"array<color>"})},steps:cn}),dn=new Ze({id:"hsl",name:"HSL",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},s:{range:[0,100],name:"Saturation"},l:{range:[0,100],name:"Lightness"}},base:Or,fromBase:e=>{let t=Math.max(...e),r=Math.min(...e),[n,a,o]=e,[i,s,l]=[NaN,0,(r+t)/2],c=t-r;if(0!==c){switch(s=0===l||1===l?0:(t-l)/Math.min(l,1-l),t){case n:i=(a-o)/c+(a<o?6:0);break;case a:i=(o-n)/c+2;break;case o:i=(n-a)/c+4}i*=60}return s<0&&(i+=180,s=Math.abs(s)),i>=360&&(i-=360),[i,100*s,100*l]},toBase:e=>{let[t,r,n]=e;function a(e){let a=(e+t/30)%12,o=r*Math.min(n,1-n);return n-o*Math.max(-1,Math.min(a-3,9-a,1))}return t%=360,t<0&&(t+=360),r/=100,n/=100,[a(0),a(8),a(4)]},formats:{hsl:{coords:["<number> | <angle>","<percentage>","<percentage>"]},hsla:{coords:["<number> | <angle>","<percentage>","<percentage>"],commas:!0,lastAlpha:!0}}}),fn=new Ze({id:"hsv",name:"HSV",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},s:{range:[0,100],name:"Saturation"},v:{range:[0,100],name:"Value"}},base:dn,fromBase(e){let[t,r,n]=e;r/=100,n/=100;let a=n+r*Math.min(n,1-n);return[t,0===a?0:200*(1-n/a),100*a]},toBase(e){let[t,r,n]=e;r/=100,n/=100;let a=n*(1-r/2);return[t,0===a||1===a?0:(n-a)/Math.min(a,1-a)*100,100*a]},formats:{color:{id:"--hsv",coords:["<number> | <angle>","<percentage> | <number>","<percentage> | <number>"]}}}),gn=new Ze({id:"hwb",name:"HWB",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},w:{range:[0,100],name:"Whiteness"},b:{range:[0,100],name:"Blackness"}},base:fn,fromBase(e){let[t,r,n]=e;return[t,n*(100-r)/100,100-n]},toBase(e){let[t,r,n]=e;r/=100,n/=100;let a=r+n;if(a>=1)return[t,0,r/a*100];let o=1-n;return[t,100*(0===o?0:1-r/o),100*o]},formats:{hwb:{coords:["<number> | <angle>","<percentage> | <number>","<percentage> | <number>"]}}}),mn=new Ue({id:"a98rgb-linear",cssId:"--a98-rgb-linear",name:"Linear Adobe® 98 RGB compatible",white:"D65",toXYZ_M:[[.5766690429101305,.1855582379065463,.1882286462349947],[.29734497525053605,.6273635662554661,.07529145849399788],[.02703136138641234,.07068885253582723,.9913375368376388]],fromXYZ_M:[[2.0415879038107465,-.5650069742788596,-.34473135077832956],[-.9692436362808795,1.8759675015077202,.04155505740717557],[.013444280632031142,-.11836239223101838,1.0151749943912054]]}),bn=new Ue({id:"a98rgb",cssId:"a98-rgb",name:"Adobe® 98 RGB compatible",base:mn,toBase:e=>e.map(e=>Math.pow(Math.abs(e),563/256)*Math.sign(e)),fromBase:e=>e.map(e=>Math.pow(Math.abs(e),256/563)*Math.sign(e))}),vn=new Ue({id:"prophoto-linear",cssId:"--prophoto-rgb-linear",name:"Linear ProPhoto",white:"D50",base:tt,toXYZ_M:[[.7977666449006423,.13518129740053308,.0313477341283922],[.2880748288194013,.711835234241873,8993693872564e-17],[0,0,.8251046025104602]],fromXYZ_M:[[1.3457868816471583,-.25557208737979464,-.05110186497554526],[-.5446307051249019,1.5082477428451468,.02052744743642139],[0,0,1.2119675456389452]]});const yn=1/512;var wn=new Ue({id:"prophoto",cssId:"prophoto-rgb",name:"ProPhoto",base:vn,toBase:e=>e.map(e=>e<.03125?e/16:e**1.8),fromBase:e=>e.map(e=>e>=yn?e**(1/1.8):16*e)}),Mn=new Ze({id:"oklch",name:"Oklch",coords:{l:{refRange:[0,1],name:"Lightness"},c:{refRange:[0,.4],name:"Chroma"},h:{refRange:[0,360],type:"angle",name:"Hue"}},white:"D65",base:yt,fromBase(e){let t,[r,n,a]=e;const o=2e-4;return t=Math.abs(n)<o&&Math.abs(a)<o?NaN:180*Math.atan2(a,n)/Math.PI,[r,Math.sqrt(n**2+a**2),st(t)]},toBase(e){let t,r,[n,a,o]=e;return isNaN(o)?(t=0,r=0):(t=a*Math.cos(o*Math.PI/180),r=a*Math.sin(o*Math.PI/180)),[n,t,r]},formats:{oklch:{coords:["<percentage> | <number>","<number> | <percentage>[0,1]","<number> | <angle>"]}}});let kn=qe.D65;const xn=216/24389,Cn=24389/27,[Sn,$n]=rn({space:Je,coords:kn});var Ln=new Ze({id:"luv",name:"Luv",coords:{l:{refRange:[0,100],name:"Lightness"},u:{refRange:[-215,215]},v:{refRange:[-215,215]}},white:kn,base:Je,fromBase(e){let t=[Me(e[0]),Me(e[1]),Me(e[2])],r=t[1],[n,a]=rn({space:Je,coords:t});if(!Number.isFinite(n)||!Number.isFinite(a))return[0,0,0];let o=r<=xn?Cn*r:116*Math.cbrt(r)-16;return[o,13*o*(n-Sn),13*o*(a-$n)]},toBase(e){let[t,r,n]=e;if(0===t||we(t))return[0,0,0];r=Me(r),n=Me(n);let a=r/(13*t)+Sn,o=n/(13*t)+$n,i=t<=8?t/Cn:Math.pow((t+16)/116,3);return[i*(9*a/(4*o)),i,i*((12-3*a-20*o)/(4*o))]},formats:{color:{id:"--luv",coords:["<number> | <percentage>","<number> | <percentage>[-1,1]","<number> | <percentage>[-1,1]"]}}}),An=new Ze({id:"lchuv",name:"LChuv",coords:{l:{refRange:[0,100],name:"Lightness"},c:{refRange:[0,220],name:"Chroma"},h:{refRange:[0,360],type:"angle",name:"Hue"}},base:Ln,fromBase(e){let t,[r,n,a]=e;return t=Math.abs(n)<.02&&Math.abs(a)<.02?NaN:180*Math.atan2(a,n)/Math.PI,[r,Math.sqrt(n**2+a**2),st(t)]},toBase(e){let[t,r,n]=e;return r<0&&(r=0),isNaN(n)&&(n=0),[t,r*Math.cos(n*Math.PI/180),r*Math.sin(n*Math.PI/180)]},formats:{color:{id:"--lchuv",coords:["<number> | <percentage>","<number> | <percentage>","<number> | <angle>"]}}});const Bn=216/24389,En=24389/27,Rn=Wr[0][0],Nn=Wr[0][1],zn=Wr[0][2],Pn=Wr[1][0],Hn=Wr[1][1],Wn=Wr[1][2],_n=Wr[2][0],qn=Wr[2][1],In=Wr[2][2];function jn(e,t,r){const n=t/(Math.sin(r)-e*Math.cos(r));return n<0?1/0:n}function On(e){const t=Math.pow(e+16,3)/1560896,r=t>Bn?t:e/En,n=r*(284517*Rn-94839*zn),a=r*(838422*zn+769860*Nn+731718*Rn),o=r*(632260*zn-126452*Nn),i=r*(284517*Pn-94839*Wn),s=r*(838422*Wn+769860*Hn+731718*Pn),l=r*(632260*Wn-126452*Hn),c=r*(284517*_n-94839*In),h=r*(838422*In+769860*qn+731718*_n),u=r*(632260*In-126452*qn);return{r0s:n/o,r0i:a*e/o,r1s:n/(o+126452),r1i:(a-769860)*e/(o+126452),g0s:i/l,g0i:s*e/l,g1s:i/(l+126452),g1i:(s-769860)*e/(l+126452),b0s:c/u,b0i:h*e/u,b1s:c/(u+126452),b1i:(h-769860)*e/(u+126452)}}function Tn(e,t){const r=t/360*Math.PI*2,n=jn(e.r0s,e.r0i,r),a=jn(e.r1s,e.r1i,r),o=jn(e.g0s,e.g0i,r),i=jn(e.g1s,e.g1i,r),s=jn(e.b0s,e.b0i,r),l=jn(e.b1s,e.b1i,r);return Math.min(n,a,o,i,s,l)}var Gn=new Ze({id:"hsluv",name:"HSLuv",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},s:{range:[0,100],name:"Saturation"},l:{range:[0,100],name:"Lightness"}},base:An,gamutSpace:Or,fromBase(e){let t,[r,n,a]=[Me(e[0]),Me(e[1]),Me(e[2])];return r>99.9999999?(t=0,r=100):r<1e-8?(t=0,r=0):t=n/Tn(On(r),a)*100,[a,t,r]},toBase(e){let t,[r,n,a]=[Me(e[0]),Me(e[1]),Me(e[2])];return a>99.9999999?(a=100,t=0):a<1e-8?(a=0,t=0):t=Tn(On(a),r)/100*n,[a,t,r]},formats:{color:{id:"--hsluv",coords:["<number> | <angle>","<percentage> | <number>","<percentage> | <number>"]}}});function Dn(e,t){return Math.abs(t)/Math.sqrt(Math.pow(e,2)+1)}function Fn(e){let t=Dn(e.r0s,e.r0i),r=Dn(e.r1s,e.r1i),n=Dn(e.g0s,e.g0i),a=Dn(e.g1s,e.g1i),o=Dn(e.b0s,e.b0i),i=Dn(e.b1s,e.b1i);return Math.min(t,r,n,a,o,i)}Wr[0][0],Wr[0][1],Wr[0][2],Wr[1][0],Wr[1][1],Wr[1][2],Wr[2][0],Wr[2][1],Wr[2][2];var Zn=new Ze({id:"hpluv",name:"HPLuv",coords:{h:{refRange:[0,360],type:"angle",name:"Hue"},s:{range:[0,100],name:"Saturation"},l:{range:[0,100],name:"Lightness"}},base:An,gamutSpace:"self",fromBase(e){let t,[r,n,a]=[Me(e[0]),Me(e[1]),Me(e[2])];return r>99.9999999?(t=0,r=100):r<1e-8?(t=0,r=0):t=n/Fn(On(r))*100,[a,t,r]},toBase(e){let t,[r,n,a]=[Me(e[0]),Me(e[1]),Me(e[2])];return a>99.9999999?(a=100,t=0):a<1e-8?(a=0,t=0):t=Fn(On(a))/100*n,[a,t,r]},formats:{color:{id:"--hpluv",coords:["<number> | <angle>","<percentage> | <number>","<percentage> | <number>"]}}});const Xn=2610/16384,Yn=16384/2610,Jn=32/2523,Un=.8359375,Vn=2413/128,Qn=18.6875;var Kn=new Ue({id:"rec2100pq",cssId:"rec2100-pq",name:"REC.2100-PQ",base:Rr,toBase:e=>e.map(function(e){return 1e4*(Math.max(e**Jn-Un,0)/(Vn-Qn*e**Jn))**Yn/203}),fromBase:e=>e.map(function(e){let t=Math.max(203*e/1e4,0);return((Un+Vn*t**Xn)/(1+Qn*t**Xn))**78.84375})});const ea=.17883277,ta=.28466892,ra=.55991073,na=3.7743;var aa=new Ue({id:"rec2100hlg",cssId:"rec2100-hlg",name:"REC.2100-HLG",referred:"scene",base:Rr,toBase:e=>e.map(function(e){return e<=.5?e**2/3*na:(Math.exp((e-ra)/ea)+ta)/12*na}),fromBase:e=>e.map(function(e){return(e/=na)<=1/12?Math.sqrt(3*e):ea*Math.log(12*e-ta)+ra})});const oa={};function ia({id:e,toCone_M:t,fromCone_M:r}){oa[e]=arguments[0]}function sa(e,t,r="Bradford"){let n=oa[r],[a,o,i]=me(n.toCone_M,e),[s,l,c]=me(n.toCone_M,t),h=me([[s/a,0,0],[0,l/o,0],[0,0,c/i]],n.toCone_M);return me(n.fromCone_M,h)}We.add("chromatic-adaptation-start",e=>{e.options.method&&(e.M=sa(e.W1,e.W2,e.options.method))}),We.add("chromatic-adaptation-end",e=>{e.M||(e.M=sa(e.W1,e.W2,e.options.method))}),ia({id:"von Kries",toCone_M:[[.40024,.7076,-.08081],[-.2263,1.16532,.0457],[0,0,.91822]],fromCone_M:[[1.8599363874558397,-1.1293816185800916,.21989740959619328],[.3611914362417676,.6388124632850422,-6370596838649899e-21],[0,0,1.0890636230968613]]}),ia({id:"Bradford",toCone_M:[[.8951,.2664,-.1614],[-.7502,1.7135,.0367],[.0389,-.0685,1.0296]],fromCone_M:[[.9869929054667121,-.14705425642099013,.15996265166373122],[.4323052697233945,.5183602715367774,.049291228212855594],[-.00852866457517732,.04004282165408486,.96848669578755]]}),ia({id:"CAT02",toCone_M:[[.7328,.4296,-.1624],[-.7036,1.6975,.0061],[.003,.0136,.9834]],fromCone_M:[[1.0961238208355142,-.27886900021828726,.18274517938277307],[.4543690419753592,.4735331543074117,.07209780371722911],[-.009627608738429355,-.00569803121611342,1.0153256399545427]]}),ia({id:"CAT16",toCone_M:[[.401288,.650173,-.051461],[-.250268,1.204414,.045854],[-.002079,.048952,.953127]],fromCone_M:[[1.862067855087233,-1.0112546305316845,.14918677544445172],[.3875265432361372,.6214474419314753,-.008973985167612521],[-.01584149884933386,-.03412293802851557,1.0499644368778496]]}),Object.assign(qe,{A:[1.0985,1,.35585],C:[.98074,1,1.18232],D55:[.95682,1,.92149],D75:[.94972,1,1.22638],E:[1,1,1],F2:[.99186,1,.67393],F7:[.95041,1,1.08747],F11:[1.00962,1,.6435]}),qe.ACES=[.32168/.33767,1,.34065/.33767];var la=new Ue({id:"acescg",cssId:"--acescg",name:"ACEScg",coords:{r:{range:[0,65504],name:"Red"},g:{range:[0,65504],name:"Green"},b:{range:[0,65504],name:"Blue"}},referred:"scene",white:qe.ACES,toXYZ_M:[[.6624541811085053,.13400420645643313,.1561876870049078],[.27222871678091454,.6740817658111484,.05368951740793705],[-.005574649490394108,.004060733528982826,1.0103391003129971]],fromXYZ_M:[[1.6410233796943257,-.32480329418479,-.23642469523761225],[-.6636628587229829,1.6153315916573379,.016756347685530137],[.011721894328375376,-.008284441996237409,.9883948585390215]]});const ca=2**-16,ha=-.35828683,ua=(Math.log2(65504)+9.72)/17.52;var pa=new Ue({id:"acescc",cssId:"--acescc",name:"ACEScc",coords:{r:{range:[ha,ua],name:"Red"},g:{range:[ha,ua],name:"Green"},b:{range:[ha,ua],name:"Blue"}},referred:"scene",base:la,toBase:e=>e.map(function(e){return e<=-.3013698630136986?2*(2**(17.52*e-9.72)-ca):e<ua?2**(17.52*e-9.72):65504}),fromBase:e=>e.map(function(e){return e<=0?(Math.log2(ca)+9.72)/17.52:e<ca?(Math.log2(ca+.5*e)+9.72)/17.52:(Math.log2(e)+9.72)/17.52})}),da=Object.freeze({__proto__:null,A98RGB:bn,A98RGB_Linear:mn,ACEScc:pa,ACEScg:la,CAM16_JMh:gr,HCT:Mr,HPLuv:Zn,HSL:dn,HSLuv:Gn,HSV:fn,HWB:gn,ICTCP:Kt,JzCzHz:Tt,Jzazbz:Ot,LCH:lt,LCHuv:An,Lab:it,Lab_D65:Kr,Luv:Ln,OKLCH:Mn,OKLab:yt,P3:Tr,P3_Linear:Hr,ProPhoto:wn,ProPhoto_Linear:vn,REC_2020:Pr,REC_2020_Linear:Rr,REC_2100_HLG:aa,REC_2100_PQ:Kn,XYZ_ABS_D65:St,XYZ_D50:tt,XYZ_D65:Je,sRGB:Or,sRGB_Linear:_r});class fa{constructor(...e){let t,r,n,a;1===e.length&&(t=De(e[0])),t?(r=t.space||t.spaceId,n=t.coords,a=t.alpha):[r,n,a]=e,Object.defineProperty(this,"space",{value:Ze.get(r),writable:!1,enumerable:!0,configurable:!0}),this.coords=n?n.slice():[0,0,0],this.alpha=a>1||void 0===a?1:a<0?0:a;for(let o=0;o<this.coords.length;o++)"NaN"===this.coords[o]&&(this.coords[o]=NaN);for(let o in this.space.coords)Object.defineProperty(this,o,{get:()=>this.get(o),set:e=>this.set(o,e)})}get spaceId(){return this.space.id}clone(){return new fa(this.space,this.coords,this.alpha)}toJSON(){return{spaceId:this.spaceId,coords:this.coords,alpha:this.alpha}}display(...e){let t=function(e,{space:t=_e.display_space,...r}={}){let n=Er(e,r);if("undefined"==typeof CSS||CSS.supports("color",n)||!_e.display_space)n=new String(n),n.color=e;else{let a=e;if((e.coords.some(we)||we(e.alpha))&&!(null!=Gr?Gr:Gr=CSS.supports("color","hsl(none 50% 50%)"))&&(a=kt(e),a.coords=a.coords.map(Me),a.alpha=Me(a.alpha),n=Er(a,r),CSS.supports("color",n)))return n=new String(n),n.color=a,n;a=Br(a,t),n=new String(Er(a,r)),n.color=a}return n}(this,...e);return t.color=new fa(t.color),t}static get(e,...t){return e instanceof fa?e:new fa(e,...t)}static defineFunction(e,t,r=t){let{instance:n=!0,returns:a}=r,o=function(...e){let r=t(...e);if("color"===a)r=fa.get(r);else if("function<color>"===a){let e=r;r=function(...t){let r=e(...t);return fa.get(r)},Object.assign(r,e)}else"array<color>"===a&&(r=r.map(e=>fa.get(e)));return r};e in fa||(fa[e]=o),n&&(fa.prototype[e]=function(...e){return o(this,...e)})}static defineFunctions(e){for(let t in e)fa.defineFunction(t,e[t],e[t])}static extend(e){if(e.register)e.register(fa);else for(let t in e)fa.defineFunction(t,e[t])}}fa.defineFunctions({get:Qe,getAll:Ve,set:et,setAll:Ke,to:Br,equals:function(e,t){return e=De(e),t=De(t),e.space===t.space&&e.alpha===t.alpha&&e.coords.every((e,r)=>e===t.coords[r])},inGamut:Mt,toGamut:Lr,distance:xt,toString:Er}),Object.assign(fa,{util:He,hooks:We,WHITES:qe,Space:Ze,spaces:Ze.registry,parse:Ge,defaults:_e});for(let Ra of Object.keys(da))Ze.register(da[Ra]);for(let Ra in Ze.registry)ga(Ra,Ze.registry[Ra]);function ga(e,t){let r=e.replace(/-/g,"_");Object.defineProperty(fa.prototype,r,{get(){let r=this.getAll(e);return"undefined"==typeof Proxy?r:new Proxy(r,{has:(e,r)=>{try{return Ze.resolveCoord([t,r]),!0}catch(n){}return Reflect.has(e,r)},get:(e,r,n)=>{if(r&&"symbol"!=typeof r&&!(r in e)){let{index:n}=Ze.resolveCoord([t,r]);if(n>=0)return e[n]}return Reflect.get(e,r,n)},set:(r,n,a,o)=>{if(n&&"symbol"!=typeof n&&!(n in r)||n>=0){let{index:o}=Ze.resolveCoord([t,n]);if(o>=0)return r[o]=a,this.setAll(e,r),!0}return Reflect.set(r,n,a,o)}})},set(t){this.setAll(e,t)},configurable:!0,enumerable:!0})}function ma(e){return"display-p3"===e?"p3":"a98-rgb"===e?"a98rgb":e}function ba(e){return"p3"===e?"display-p3":"a98rgb"===e?"a98-rgb":e}function va(e){return"100"===e||100===e?"":` / ${e}%`}function ya(e){return["srgb-linear","display-p3","rec2020","a98-rgb","prophoto","xyz","xyz-d50","xyz-d65"].includes(e)}function wa(e,t=0){return Number(e.toFixed(t)).toString()}function Ma(e,t){var r,n,a,o,i,s,l,c,h,u;const p=null!=(r=t.L)?r:50,d=null!=(n=t.A)?n:0,f=null!=(a=t.B)?a:0,g=null!=(o=t.C)?o:0,m=null!=(i=t.H)?i:0,b=null!=(s=t.S)?s:0,v=null!=(l=t.W)?l:0,y=null!=(c=t.R)?c:0,w=null!=(h=t.G)?h:0,M=null!=(u=t.ALP)?u:100;switch(e){case"oklab":return`oklab(${p}% ${d} ${f}${va(M)})`;case"oklch":return`oklch(${p}% ${g}% ${m}${va(M)})`;case"lab":return`lab(${p}% ${d} ${f}${va(M)})`;case"lch":return`lch(${p}% ${g}% ${m}${va(M)})`;case"hsl":return`hsl(${m} ${b}% ${p}%${va(M)})`;case"hwb":return`hwb(${m} ${v}% ${f}%${va(M)})`;case"srgb":return`rgb(${y}% ${w}% ${f}%${va(M)})`;case"hex":{const e=Math.round(2.55*Number(y)),t=Math.round(2.55*Number(w)),r=Math.round(2.55*Number(f)),n=Number(M),a=e.toString(16).padStart(2,"0"),o=t.toString(16).padStart(2,"0"),i=r.toString(16).padStart(2,"0"),s=a[0]===a[1]&&o[0]===o[1]&&i[0]===i[1];if(n<100){const e=Math.round(n/100*255).toString(16).padStart(2,"0");return s&&e[0]===e[1]?`#${a[0]}${o[0]}${i[0]}${e[0]}`:`#${a}${o}${i}${e}`}return s?`#${a[0]}${o[0]}${i[0]}`:`#${a}${o}${i}`}default:return ya(e)?function(e,t,r,n,a){return`color(${"prophoto"===e?"prophoto-rgb":e} ${t}% ${r}% ${n}%${va(a)})`}(e,y,w,f,M):"oklch(75% 75% 180)"}}function ka(e,t){let r=new fa(t);const n=ma("hex"===e?"srgb":e);r.space.id!==n&&(r=r.to(n));const a=ba(r.space.id),o="rgb"===a?"srgb":a,i={};if("oklab"===o){const[e,t,n]=r.coords;i.L=wa(100*e),i.A=wa(t,2),i.B=wa(n,2),i.ALP=wa(100*r.alpha)}else if("oklch"===o){const[e,t,n]=r.coords;i.L=wa(100*e),i.C=wa(Math.min(100,100*t),0),i.H=isNaN(n)?"0":wa(n),i.ALP=wa(100*r.alpha)}else if("lab"===o){const[e,t,n]=r.coords;i.L=wa(e),i.A=wa(t),i.B=wa(n),i.ALP=wa(100*r.alpha)}else if("lch"===o){const[e,t,n]=r.coords;i.L=wa(e),i.C=wa(Math.min(100,t/1.5),0),i.H=wa(n),i.ALP=wa(100*r.alpha)}else if("hsl"===o){const[e,t,n]=r.coords;i.H=wa(e),i.S=wa(t>1?t:100*t),i.L=wa(n>1?n:100*n),i.ALP=wa(100*r.alpha)}else if("hwb"===o){const[e,t,n]=r.coords;i.H=wa(e),i.W=wa(t>1?t:100*t),i.B=wa(n>1?n:100*n),i.ALP=wa(100*r.alpha)}else if("srgb"===o||"hex"===o){const[e,t,n]=r.toGamut({space:"srgb",method:"clip"}).coords;i.R=wa(100*e),i.G=wa(100*t),i.B=wa(100*n),i.ALP=wa(100*r.alpha)}else if(ya(o)){const[e,t,n]=r.coords;i.R=wa(100*Number(e)),i.G=wa(100*Number(t)),i.B=wa(100*Number(n)),i.ALP=wa(100*r.alpha)}return{space:o,ch:i}}We.add("colorspace-init-end",e=>{var t;ga(e.id,e),null==(t=e.aliases)||t.forEach(t=>{ga(t,e)})}),fa.extend(Sr),fa.extend({deltaE:on}),Object.assign(fa,{deltaEMethods:Sr}),fa.extend(sn),fa.extend({contrast:function(e,t,r={}){be(r)&&(r={algorithm:r});let{algorithm:n,...a}=r;if(!n){let e=Object.keys(tn).map(e=>e.replace(/^contrast/,"")).join(", ");throw new TypeError(`contrast() function needs a contrast algorithm. Please specify one of: ${e}`)}e=De(e),t=De(t);for(let o in tn)if("contrast"+n.toLowerCase()===o.toLowerCase())return tn[o](e,t,a);throw new TypeError(`Unknown contrast algorithm: ${n}`)}}),fa.extend(an),fa.extend(Zr),fa.extend(pn),fa.extend(tn);let xa=null;function Ca(e,t){return e.left>=t.left&&e.top>=t.top&&e.right<=t.right&&e.bottom<=t.bottom}function Sa(e,t){const r=Math.max(e.left,t.left),n=Math.max(e.top,t.top),a=Math.min(e.right,t.right),o=Math.min(e.bottom,t.bottom);return a<=r||o<=n?0:(a-r)*(o-n)}const $a=':root{--radius-round: 1e5px;--radius-2: 5px;--radius-3: 1rem}:host{--canvas: Canvas;--canvas-text: CanvasText;--radius-2: .5rem;--radius-3: .75rem;--radius-round: 1e4px;--shadow-elev: #0305081f 0px -1px 2px 0px, #03050821 0px 2px 1px -2px, #03050821 0px 5px 5px -2px, #03050824 0px 10px 10px -2px, #03050826 0px 20px 20px -2px, #0305082b 0px 40px 40px -2px;--shadow-inner: inset 0 0 0 1px color-mix(in oklab, var(--canvas-text), transparent 94%);--checker: repeating-conic-gradient(color-mix(in oklab, var(--canvas-text), transparent 90%) 0% 25%, transparent 0% 50%) 50%/1rem 1rem;color-scheme:light dark;display:flex;align-items:center;gap:10px;position:relative;@media (width < 350px){overflow:hidden}}:host([hidden]){display:none}button{border:1px solid color-mix(in oklab,var(--canvas-text),var(--canvas) 80%);outline-offset:2px;&.trigger{flex-shrink:0;background:none;padding:0;border:none;display:inline-flex;place-content:center;border-radius:var(--radius-round);.chip{display:inline-block;inline-size:1.25rem;block-size:1.25rem;border-radius:var(--radius-round);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--canvas-text),transparent 92%);background:linear-gradient(var(--value) 0 0),var(--checker);forced-color-adjust:none}}}.input-wrapper{position:relative;display:flex;flex-direction:column;flex:1;min-width:0}.text-input{field-sizing:content;font-family:inherit;padding:1ch 1.5ch;border:1px solid color-mix(in oklab,var(--canvas-text),var(--canvas) 80%);border-radius:var(--radius-2);background:color-mix(in oklab,var(--canvas-text),var(--canvas) 92%);color:var(--canvas-text);box-shadow:var(--shadow-inner);outline-offset:2px;&[aria-invalid=true]{outline-color:red}}.error-message{position:absolute;bottom:-1.5rem;left:0;font-size:12px;color:#ef4444;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s ease}.error-message:not(:empty){opacity:1}.panel{margin:0;max-inline-size:min(92vw,560px);background:var(--canvas);color:var(--canvas-text);box-shadow:var(--shadow-elev);border-radius:var(--radius-3);padding:0;border:1px solid #0000;overflow:hidden}.preview{position:relative;aspect-ratio:16 / 9;min-inline-size:28ch;display:grid;align-content:end;justify-items:start;padding:.75rem;gap:10px;box-shadow:var(--shadow-inner);background:linear-gradient(var(--value) 0 0),var(--checker);forced-color-adjust:none;&:hover .copy-btn,&:focus-within .copy-btn{opacity:1}>*:not(:hover){opacity:.9}.copy-wrap{position:absolute;top:.5rem;right:.5rem;display:flex;flex-direction:column;align-items:flex-end;gap:.25rem}.copy-btn{color:var(--contrast);background:none;border:1px solid #0000;border-radius:0;padding:0;cursor:pointer;opacity:0;transition:opacity .2s ease;display:inline-flex;align-items:center}.copy-btn svg{display:block}.copy-message{color:var(--contrast);font-size:.8rem;font-weight:500;opacity:0;pointer-events:none;transition:opacity .2s ease;white-space:nowrap}.copy-message.show{opacity:1}.visually-hidden:not(:focus):not(:active){clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}.space{-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;min-block-size:1lh;line-height:1.1;font-weight:700;margin:0;padding:0;color:var(--contrast);background:transparent;border-radius:0;border:none;&::picker-icon{content:"›";-webkit-appearance:none;transform:rotate(90deg) scale(1.5)}}@supports not selector(::picker-icon){.space{background-image:url(https://api.iconify.design/basil:caret-down-solid.svg);background-size:1rem;background-position:right .5rem center;background-repeat:no-repeat}}.gamut,.info{line-height:1.1;text-box:cap alphabetic;display:block;color:var(--contrast);background:transparent}.gamut{font-size:1rem;text-box:ex alphabetic}.info{font-size:1.25rem}.controls{display:grid;gap:.5rem;padding:.75rem;border-radius:0 0 var(--radius-3) var(--radius-3);.control{display:grid;grid-template-columns:min-content 1fr 4ch;align-items:center;gap:.5rem}.control .num-wrapper{position:relative;display:flex;align-items:center}.control .num-wrapper sup{opacity:.5;font-size:.5em;place-self:start}.control label{font:500 12px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace}.control input[type=number]{text-align:end;font-size:12px;padding:0;background:none;border:1px solid var(--canvas);border-radius:.25rem;-moz-appearance:textfield;font-variant:tabular-nums;font-family:monospace;&::-webkit-outer-spin-button,&::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}}.control input[type=range]{width:100%;height:1rem;border-radius:999px;border:1px solid var(--canvas);background:var(--canvas);box-shadow:var(--shadow-inner);-webkit-appearance:none;-moz-appearance:none;appearance:none;forced-color-adjust:none}.control input[type=range].alpha{background:linear-gradient(to right,#0000,#000),var(--checker)}.control input[type=range]::-webkit-slider-thumb{cursor:grab;-webkit-appearance:none;appearance:none;border:4px solid white;height:calc(1rem + 8px);aspect-ratio:1;border-radius:var(--radius-round);box-shadow:0 0 1px 1px #00000040,inset 0 1px 2px #00000026}.control input[type=range]:active::-webkit-slider-thumb{cursor:grabbing}.control input[type=range]::-moz-range-thumb{cursor:grab;-moz-appearance:none;appearance:none;border:4px solid white;height:calc(1rem + 8px);aspect-ratio:1;border-radius:var(--radius-round);box-shadow:0 0 1px 1px #00000040,inset 0 1px 2px #00000026;width:calc(8px + 1rem);background:none;box-sizing:border-box}.control input[type=range]:active::-moz-range-thumb{cursor:grabbing}}',La="oklch(75% 75% 180)",Aa="oklch",Ba=new CSSStyleSheet;"function"==typeof Ba.replaceSync&&Ba.replaceSync($a);class Ea extends HTMLElement{constructor(){if(super(),Z(this,L),Z(this,a,oe(La)),Z(this,o,oe(Aa)),Z(this,i,oe("auto")),Z(this,s,oe(!1)),Z(this,l,oe(null)),Z(this,c,oe(null)),Z(this,h,he(()=>function(e){var t,r;try{const n=new fa(e);let a,o;try{a=null!=(t=n.contrast("white","WCAG21"))?t:n.contrastLstar("white"),o=null!=(r=n.contrast("black","WCAG21"))?r:n.contrastLstar("black")}catch{a=n.contrastLstar("white"),o=n.contrastLstar("black")}return a>o?"white":"black"}catch{return"black"}}(F(this,a).value))),Z(this,u,he(()=>function(e){let t="srgb";if(!e||e.startsWith("#"))return t;try{const r=new fa(e),n=new fa("srgb",r.to("srgb").coords),a=new fa("p3",r.to("p3").coords),o=new fa("rec2020",r.to("rec2020").coords);new fa("xyz",r.to("xyz").coords).inGamut()&&(t="xyz"),o.inGamut()&&(t="rec2020"),a.inGamut()&&(t="p3"),n.inGamut()&&(t="srgb")}catch{}return t}(F(this,a).value))),Z(this,p,null),Z(this,d,null),Z(this,f,null),Z(this,g,null),Z(this,m,!1),Z(this,b),Z(this,v),Z(this,y),Z(this,w),Z(this,M),Z(this,k),Z(this,x),Z(this,C),Z(this,S),Z(this,$,null),Z(this,E,null),Z(this,R,null),Z(this,N,[]),Z(this,z,null),X(this,b,this.attachShadow({mode:"open",delegatesFocus:!0})),"adoptedStyleSheets"in F(this,b)&&"function"==typeof Ba.replaceSync)F(this,b).adoptedStyleSheets=[Ba];else{const e=document.createElement("style");e.textContent=$a,F(this,b).appendChild(e)}const e=function(){const e=document.createElement("template");return e.innerHTML='\n  <button class="trigger" part="trigger" aria-haspopup="dialog" aria-label="Open color picker" title="Open color picker">\n    <span class="chip" part="chip"></span>\n  </button>\n  <div class="input-wrapper">\n    <span class="error-message" part="error" role="alert" aria-live="polite"></span>\n    <input type="text" class="text-input" part="input" aria-label="Color value" title="Color value" aria-invalid="false" spellcheck="false" />\n  </div>\n  <div class="panel" popover="auto" part="panel">\n    <div class="preview">\n      <div class="copy-wrap">\n        <button class="copy-btn">\n          <span class="visually-hidden">Copy color</span>\n          <svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true"><title>Copy color</title><path fill="currentColor" d="M5 22q-.825 0-1.413-.588T3 20V6h2v14h11v2H5Zm4-4q-.825 0-1.413-.588T7 16V4q0-.825.588-1.413T9 2h9q.825 0 1.413.588T20 4v12q0 .825-.588 1.413T18 18H9Z"/></svg>\n        </button>\n        <span class="copy-message" aria-hidden="true">Copied!</span>\n        <span class="copy-message-live-region visually-hidden" role="status"></span>\n      </div>\n      <select class="space" title="Colorspace"></select>\n      <output class="info" part="output"></output>\n      <span class="gamut" title="Color\'s gamut" part="gamut"></span>\n    </div>\n    <div class="controls" part="controls"></div>\n  </div>\n  ',e}();F(this,b).appendChild(e.content.cloneNode(!0))}static get observedAttributes(){return["value","colorspace","theme"]}get value(){return F(this,a).value}set value(e){if("string"==typeof e&&e)try{const t=ba(new fa(e).space.id),r="string"==typeof e&&e.trim().startsWith("#");F(this,o).value=r?"hex":"rgb"===t?"srgb":t,F(this,a).value=e,X(this,m,!0),this.setAttribute("value",e),this.setAttribute("colorspace",F(this,o).value),X(this,m,!1),Y(this,L,A).call(this)}catch{}}get colorspace(){return F(this,o).value}set colorspace(e){const t=e||Aa;F(this,o).value=t,X(this,m,!0),this.setAttribute("colorspace",t);try{const e=new fa(F(this,a).value),r="hex"===t?"srgb":t,n=Ma(t,ka(t,e.to(ma(r)).toGamut().toString({precision:12})).ch);F(this,a).value=n,this.setAttribute("value",n),Y(this,L,A).call(this)}catch{}X(this,m,!1),F(this,y)&&Y(this,L,j).call(this)}get theme(){return F(this,i).value}set theme(e){const t="light"===e||"dark"===e?e:"auto";F(this,i).value=t,"auto"===t?this.removeAttribute("theme"):this.setAttribute("theme",t)}get gamut(){return F(this,u).value}get contrastColor(){return F(this,h).value}show(e){var t,r;e&&(F(this,l).value=e),null==(r=null==(t=F(this,v))?void 0:t.showPopover)||r.call(t),Y(this,L,P).call(this)}close(){var e,t;null==(t=null==(e=F(this,v))?void 0:e.hidePopover)||t.call(e),Y(this,L,H).call(this)}showPicker(){this.show()}setAnchor(e){F(this,l).value=e}set setColor(e){this.value=e}set setAnchorElement(e){this.setAnchor(e)}connectedCallback(){var e;const t=F(this,b).querySelector("button.trigger");X(this,x,null!=t?t:void 0),X(this,v,F(this,b).querySelector(".panel")),X(this,y,F(this,b).querySelector(".controls")),X(this,w,F(this,b).querySelector(".space")),X(this,M,F(this,b).querySelector("output.info")),X(this,k,F(this,b).querySelector(".chip")),X(this,C,F(this,b).querySelector(".text-input")),X(this,S,F(this,b).querySelector(".error-message"));const r=F(this,b).querySelector("button.copy-btn"),n=F(this,b).querySelector(".copy-message"),l=F(this,b).querySelector(".copy-message-live-region");if(r&&n&&l){let e=null;r.addEventListener("click",async()=>{try{await navigator.clipboard.writeText(F(this,a).value),n.classList.add("show"),l.innerText=n.innerText,null!==e&&clearTimeout(e),e=window.setTimeout(()=>{n.classList.remove("show"),l.innerText="",e=null},3e3)}catch{}})}F(this,w).innerHTML='\n      <optgroup label="Standard">\n        <option value="hex">hex</option>\n        <option value="srgb">rgb</option>\n        <option value="srgb-linear">srgb-linear</option>\n        <option value="hsl">hsl</option>\n        <option value="hwb">hwb</option>\n      </optgroup>\n      <optgroup label="HDR">\n        <option value="display-p3">display-p3</option>\n        <option value="a98-rgb">a98-rgb</option>\n      </optgroup>\n      <optgroup label="Ultra HDR">\n        <option value="lab">lab</option>\n        <option value="lch">lch</option>\n        <option value="oklch">oklch</option>\n        <option value="oklab">oklab</option>\n        <option value="rec2020">rec2020</option>\n        <option value="prophoto">prophoto</option>\n        <option value="xyz">xyz</option>\n        <option value="xyz-d50">xyz-d50</option>\n        <option value="xyz-d65">xyz-d65</option>\n      </optgroup>\n    ',t&&t.addEventListener("click",()=>this.show(t)),F(this,C)&&(F(this,C).value=F(this,a).value,F(this,C).addEventListener("input",e=>{const t=e.target.value;Y(this,L,B).call(this,t)}),F(this,C).addEventListener("paste",e=>{})),this.addEventListener("command",e=>{const t=e.command;if(!t)return;const r=e.source||e.invoker||(document.activeElement instanceof HTMLElement?document.activeElement:null);r&&(X(this,$,r),this.setAnchor(r)),"show-popover"===t||"show"===t?this.show(F(this,$)):"hide-popover"===t||"close"===t?this.close():"toggle-popover"!==t&&"toggle"!==t||(F(this,s).value?this.close():this.show(F(this,$)))}),null==(e=F(this,v))||e.addEventListener("toggle",()=>{var e,t;const r=F(this,v);let n=!1;try{n=null!=(t=null==(e=r.matches)?void 0:e.call(r,":popover-open"))&&t}catch{}n=n||!r.hasAttribute("hidden"),F(this,s).value=n,n?Y(this,L,P).call(this):Y(this,L,H).call(this),this.dispatchEvent(new CustomEvent(n?"open":"close",{bubbles:!0}))}),F(this,w).addEventListener("change",()=>{this.colorspace=F(this,w).value,Y(this,L,j).call(this)}),X(this,p,ge(()=>{const e=F(this,a).value,t=F(this,u).value,r=F(this,h).value;F(this,M)&&(F(this,M).value=e),F(this,k)&&F(this,k).style.setProperty("--value",e),F(this,C)&&F(this,C).value!==e&&(F(this,C).value=e),this.style.setProperty("--contrast",r),this.style.setProperty("--counter","white"===r?"black":"white");const n=F(this,b).querySelector(".gamut");n&&(n.textContent=t);const o=F(this,b).querySelector(".preview");o&&o.style.setProperty("--value",e)})),X(this,f,ge(()=>{const e=F(this,c).value;e?(this.setAttribute("data-error",""),F(this,S)&&(F(this,S).textContent=e),F(this,C)&&F(this,C).setAttribute("aria-invalid","true")):(this.removeAttribute("data-error"),F(this,S)&&(F(this,S).textContent=""),F(this,C)&&F(this,C).setAttribute("aria-invalid","false"))})),X(this,d,ge(()=>{const e=F(this,i).value,t="auto"===e?"light dark":e;this.style.setProperty("color-scheme",t)})),this.hasAttribute("value")||this.setAttribute("value",La),this.hasAttribute("colorspace")||this.setAttribute("colorspace",F(this,o).value),F(this,w).value=F(this,o).value,Y(this,L,j).call(this)}disconnectedCallback(){F(this,d)&&F(this,d).call(this),F(this,p)&&F(this,p).call(this),F(this,f)&&F(this,f).call(this)}attributeChangedCallback(e,t,r){if(r!==t&&!F(this,m)){if("value"===e&&"string"==typeof r)try{const e=ba(new fa(r).space.id),t="string"==typeof r&&r.trim().startsWith("#");F(this,a).value=r,F(this,o).value=t?"hex":"rgb"===e?"srgb":e,F(this,w)&&(F(this,w).value=F(this,o).value)}catch{}"colorspace"===e&&r&&(F(this,o).value=r,F(this,w)&&(F(this,w).value=r)),"theme"===e&&(F(this,i).value=r||"auto")}}}return a=new WeakMap,o=new WeakMap,i=new WeakMap,s=new WeakMap,l=new WeakMap,c=new WeakMap,h=new WeakMap,u=new WeakMap,p=new WeakMap,d=new WeakMap,f=new WeakMap,g=new WeakMap,m=new WeakMap,b=new WeakMap,v=new WeakMap,y=new WeakMap,w=new WeakMap,M=new WeakMap,k=new WeakMap,x=new WeakMap,C=new WeakMap,S=new WeakMap,$=new WeakMap,L=new WeakSet,A=function(){const e={value:F(this,a).value,colorspace:F(this,o).value,gamut:F(this,u).value};this.dispatchEvent(new CustomEvent("change",{detail:e,bubbles:!0}))},B=function(e){if(e&&e.trim())try{const t=ba(new fa(e).space.id),r="string"==typeof e&&e.trim().startsWith("#");F(this,c).value=null,F(this,o).value=r?"hex":"rgb"===t?"srgb":t,F(this,a).value=e,this.setAttribute("value",e),this.setAttribute("colorspace",F(this,o).value),F(this,w)&&(F(this,w).value=F(this,o).value),Y(this,L,A).call(this)}catch(t){F(this,c).value="Invalid color format"}else F(this,c).value="Invalid color format"},E=new WeakMap,R=new WeakMap,N=new WeakMap,z=new WeakMap,P=function(){var e,t;if(F(this,N).length)return;Y(this,L,W).call(this);const r=null!=(t=null!=(e=F(this,l).value)?e:F(this,$))?t:F(this,x);if(r&&F(this,v)){if("undefined"!=typeof ResizeObserver){const e=new ResizeObserver(()=>Y(this,L,W).call(this));e.observe(r),e.observe(F(this,v)),e.observe(document.documentElement),F(this,N).push(()=>e.disconnect())}else{const e=()=>Y(this,L,W).call(this);window.addEventListener("resize",e),F(this,N).push(()=>window.removeEventListener("resize",e))}if(window.visualViewport){const e=()=>Y(this,L,W).call(this);window.visualViewport.addEventListener("resize",e),window.visualViewport.addEventListener("scroll",e),F(this,N).push(()=>{var t,r;null==(t=window.visualViewport)||t.removeEventListener("resize",e),null==(r=window.visualViewport)||r.removeEventListener("scroll",e)})}if(function(e){const t=[];let r=e.parentElement;for(;r&&r!==document.documentElement;){const e=getComputedStyle(r),n=e.overflowY,a=e.overflowX;"auto"!==n&&"scroll"!==n&&"auto"!==a&&"scroll"!==a||!(r.scrollHeight>r.clientHeight||r.scrollWidth>r.clientWidth)||t.push(r),r=r.parentElement}return document.scrollingElement&&t.push(document.scrollingElement),t}(r).forEach(e=>{const t=()=>Y(this,L,W).call(this);e.addEventListener("scroll",t,{passive:!0}),F(this,N).push(()=>e.removeEventListener("scroll",t))}),"undefined"!=typeof IntersectionObserver){const e=new IntersectionObserver(()=>Y(this,L,W).call(this),{threshold:0});e.observe(r),F(this,N).push(()=>e.disconnect())}}},H=function(){F(this,N).forEach(e=>e()),X(this,N,[]),null!==F(this,z)&&(cancelAnimationFrame(F(this,z)),X(this,z,null))},W=function(){null===F(this,z)&&X(this,z,requestAnimationFrame(()=>{X(this,z,null),Y(this,L,_).call(this)}))},_=function(){if(!F(this,v))return;const e=F(this,v),t=Y(this,L,q).call(this),r=function(){if(xa)return xa;const e=document.createElement("div");e.style.position="fixed",e.style.left="-9999px",e.style.top="0",e.style.paddingTop="env(safe-area-inset-top)",e.style.paddingRight="env(safe-area-inset-right)",e.style.paddingBottom="env(safe-area-inset-bottom)",e.style.paddingLeft="env(safe-area-inset-left)",document.documentElement.appendChild(e);const t=getComputedStyle(e),r=parseFloat(t.paddingTop)||0,n=parseFloat(t.paddingRight)||0,a=parseFloat(t.paddingBottom)||0,o=parseFloat(t.paddingLeft)||0;return document.documentElement.removeChild(e),xa={top:r,right:n,bottom:a,left:o},xa}(),n=function(e){var t,r,n,a;const o=null!=(r=null==(t=window.visualViewport)?void 0:t.width)?r:window.innerWidth,i=null!=(a=null==(n=window.visualViewport)?void 0:n.height)?a:window.innerHeight,s=window.pageXOffset||document.documentElement.scrollLeft,l=window.pageYOffset||document.documentElement.scrollTop,c=e.left+8+s,h=e.top+8+l,u=o-e.right-8+s,p=i-e.bottom-8+l;return{left:c,top:h,right:u,bottom:p,width:u-c,height:p-h}}(r),a=Y(this,L,I).call(this,e),o=function(e,t){const{width:r,height:n}=t,a=[{placement:"bottom-center",left:e.left+e.width/2-r/2,top:e.bottom+8,right:0,bottom:0},{placement:"top-center",left:e.left+e.width/2-r/2,top:e.top-8-n,right:0,bottom:0},{placement:"right-start",left:e.right+8,top:e.top,right:0,bottom:0},{placement:"left-start",left:e.left-8-r,top:e.top,right:0,bottom:0},{placement:"bottom-left",left:e.left,top:e.bottom+8,right:0,bottom:0},{placement:"bottom-right",left:e.right-r,top:e.bottom+8,right:0,bottom:0},{placement:"top-left",left:e.left,top:e.top-8-n,right:0,bottom:0},{placement:"top-right",left:e.right-r,top:e.top-8-n,right:0,bottom:0}];return a.forEach(e=>{e.right=e.left+r,e.bottom=e.top+n}),a}(t,a),i=function(e,t,r){if(r){const n=e.find(e=>e.placement===r);if(n&&Ca(n,t))return n}for(const o of e)if(Ca(o,t))return o;let n=e[0],a=Sa(n,t);for(let o=1;o<e.length;o++){const r=Sa(e[o],t);r>a&&(a=r,n=e[o])}return n}(o,n,F(this,E));X(this,E,i.placement);const s=Math.round(Math.min(Math.max(i.left,n.left),n.right-a.width)),l=Math.round(Math.min(Math.max(i.top,n.top),n.bottom-a.height)),c=n.bottom-n.top;a.height>c?(e.style.maxHeight=`${c}px`,e.style.overflow="auto"):e.style.maxHeight&&(e.style.maxHeight="",e.style.overflow=""),e.style.position="absolute",e.style.left=`${s}px`,e.style.top=`${l}px`,e.style.setProperty("--ci-panel-placement",i.placement),e.dataset.placement=i.placement},q=function(){var e,t,r,n,a,o,i;const s=null!=(r=null!=(t=null!=(e=F(this,l).value)?e:F(this,$))?t:F(this,x))?r:this,c=window.pageXOffset||document.documentElement.scrollLeft,h=window.pageYOffset||document.documentElement.scrollTop;if(!s.isConnected){const e=(null!=(a=null==(n=window.visualViewport)?void 0:n.width)?a:window.innerWidth)/2+c,t=(null!=(i=null==(o=window.visualViewport)?void 0:o.height)?i:window.innerHeight)/2+h;return{left:e,top:t,right:e,bottom:t,width:0,height:0}}const u=s.getBoundingClientRect();return{left:u.left+c,top:u.top+h,right:u.right+c,bottom:u.bottom+h,width:u.width,height:u.height}},I=function(e){var t;const r=e.getBoundingClientRect();if(r.width>0&&r.height>0)return X(this,R,{width:r.width,height:r.height}),F(this,R);const n={display:e.style.display,position:e.style.position,left:e.style.left,top:e.style.top,visibility:e.style.visibility,maxHeight:e.style.maxHeight};e.style.display="block",e.style.position="absolute",e.style.left="-99999px",e.style.top="0",e.style.visibility="hidden",e.style.maxHeight="none";const a=e.getBoundingClientRect();return e.style.display=n.display,e.style.position=n.position,e.style.left=n.left,e.style.top=n.top,e.style.visibility=n.visibility,e.style.maxHeight=n.maxHeight,a.width>0&&a.height>0?(X(this,R,{width:a.width,height:a.height}),F(this,R)):null!=(t=F(this,R))?t:{width:560,height:400}},j=function(){var e,t,r,n,i,s,l,c,h,u,p,d,f,m,b,v;F(this,g)&&F(this,g).call(this);const w=F(this,o).value;if(!F(this,y))return;const M=ka(w,F(this,a).value).ch,k={};Object.keys(M).forEach(e=>{k[e]=oe(String(M[e]))});const x=(e,t,r,n,o=1,i,s)=>{var l,c;const h="H"===t,u=["L","S","C","W","B","R","G","ALP"].includes(t),p="H"===t,d=document.createElement("div");d.className="control";const f=document.createElement("label");f.textContent=e;const g={L:"Lightness",C:"Chroma",H:"Hue",S:"Saturation",A:"A (green-red axis)",W:"Whiteness",R:"Red",G:"Green",ALP:"Alpha"};"B"===t?f.title="oklab"===w||"lab"===w?"B (blue-yellow axis)":"hwb"===w?"Blackness":"Blue":g[t]&&(f.title=g[t]);const m=document.createElement("input");if(m.type="range",m.min=String(r),m.max=String(n),m.step=String(o),m.classList.add(`ch-${t.toLowerCase()}`),i&&(m.style.backgroundImage=i),s&&(m.style.backgroundColor=s),m.value=String(null!=(l=M[t])?l:0),"ALP"===t){m.classList.add("alpha");try{const e=Ma(w,{...M,ALP:"0"}),t=Ma(w,{...M,ALP:"100"}),r="hsl"===w?"hsl":"lch"===w?"lch":"oklch"===w?"oklch":"oklab";m.style.background=`linear-gradient(to right in ${r}, ${e}, ${t}), var(--checker)`}catch{}}const b=document.createElement("input");b.type="number",b.min=String(r),b.max=String(n),b.step=String(o),b.classList.add(`ch-${t.toLowerCase()}`),b.value=String(null!=(c=M[t])?c:0);const v=document.createElement("div");if(v.className="num-wrapper",v.appendChild(b),u||p){const e=document.createElement("sup");e.textContent=p?"°":"%",v.appendChild(e)}const y=()=>{const e=Ma(w,M);F(this,a).value=e,this.setAttribute("value",e),Y(this,L,A).call(this)},x=e=>{const a=e.target;let o=Number(a.value);if(!Number.isFinite(o))return;o=h?(o%360+360)%360:Math.max(r,Math.min(n,o));const i=function(e,t,r){const n=(e,t=0)=>Number(e.toFixed(t));if("oklab"===e){if("L"===t)return String(n(r,0));if("A"===t||"B"===t)return String(n(r,2))}else if("oklch"===e){if("L"===t)return String(n(r,0));if("C"===t)return String(n(r,0));if("H"===t)return String(n(r,0))}else if("lab"===e){if("L"===t)return String(n(r,0));if("A"===t||"B"===t)return String(n(r,0))}else if("lch"===e){if("L"===t||"C"===t||"H"===t)return String(n(r,0))}else if("hsl"===e||"hwb"===e){if("H"===t)return String(n(r,0));if("S"===t||"L"===t||"W"===t||"B"===t)return String(n(r,0))}else if("srgb"===e||"hex"===e){if("R"===t||"G"===t||"B"===t)return String(n(r,0))}else if(["srgb-linear","display-p3","rec2020","a98-rgb","prophoto","xyz","xyz-d50","xyz-d65"].includes(e)&&("R"===t||"G"===t||"B"===t))return String(n(r,0));return String(n(r,"ALP"===t?0:2))}(w,t,o);M[t]=i,k[t].value=i,m.value=String(M[t]),b.value=String(M[t]),y()};return m.addEventListener("input",x),b.addEventListener("input",x),d.append(f,m,v),d};if(F(this,y).innerHTML="","oklab"===w){F(this,y).append(x("L","L",0,100,1,"linear-gradient(in oklab to right, black, white)"),x("A","A",-.5,.5,.01,"linear-gradient(to right in oklab, oklab(65% -.5 .5), oklab(65% .5 .5))"),x("B","B",-.5,.5,.01,"linear-gradient(to right in oklab, oklab(47% -.03 -.32), oklab(96% 0 .25))"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const t=k.L.value||"50",r=k.A.value||"0",n=k.B.value||"0";e&&(e.style.background=`linear-gradient(to right in oklab, oklab(${t}% ${r} ${n} / 0%), oklab(${t}% ${r} ${n} / 100%)), var(--checker)`)}))}else if("oklch"===w){F(this,y).append(x("L","L",0,100,1,"linear-gradient(in oklab to right, black, white)"),x("C","C",0,100,1,`linear-gradient(in oklch to right, oklch(${null!=(e=M.L)?e:0}% 1% ${null!=(t=M.H)?t:0}), oklch(${null!=(r=M.L)?r:0}% 100% ${null!=(n=M.H)?n:0}))`),x("H","H",0,359,1,"linear-gradient(to right in oklch longer hue, oklch(90% 75% 0), oklch(90% 75% 0))"),x("A","ALP",0,100,1));const a=F(this,y).querySelector('input[type="range"].ch-c'),o=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const e=k.L.value||"0",t=k.C.value||"0",r=k.H.value||"0";a&&(a.style.backgroundImage=`linear-gradient(in oklch to right, oklch(${e}% 1% ${r}deg), oklch(${e}% 100% ${r}deg))`),o&&(o.style.background=`linear-gradient(to right in oklch, oklch(${e}% ${t}% ${r} / 0%), oklch(${e}% ${t}% ${r} / 100%)), var(--checker)`)}))}else if("lab"===w){F(this,y).append(x("L","L",0,100,1,"linear-gradient(in lab to right, black, white)"),x("A","A",-160,160,1,"linear-gradient(to right in oklab, lab(85% -100 100), lab(55% 100 100))"),x("B","B",-160,160,1,"linear-gradient(to right in oklab, lab(31% 70 -120), lab(96% 0 120))"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const t=k.L.value||"50",r=k.A.value||"0",n=k.B.value||"0";e&&(e.style.background=`linear-gradient(to right in lab, lab(${t}% ${r} ${n} / 0%), lab(${t}% ${r} ${n} / 100%)), var(--checker)`)}))}else if("lch"===w){F(this,y).append(x("L","L",0,100,1,"linear-gradient(in lab to right, black, white)"),x("C","C",0,100,1,`linear-gradient(in lch to right, lch(${null!=(i=M.L)?i:0}% 1% ${null!=(s=M.H)?s:0}), lch(${null!=(l=M.L)?l:0}% 100% ${null!=(c=M.H)?c:0}))`),x("H","H",0,359,1,"linear-gradient(to right in lch longer hue, lch(90% 75% 0), lch(90% 75% 0))"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-c'),t=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const r=k.L.value||"50",n=k.C.value||"0",a=k.H.value||"0";e&&(e.style.backgroundImage=`linear-gradient(in lch to right, lch(${r}% 1% ${a}), lch(${r}% 100% ${a}))`),t&&(t.style.background=`linear-gradient(to right in lch, lch(${r}% ${n}% ${a} / 0%), lch(${r}% ${n}% ${a} / 100%)), var(--checker)`)}))}else if("hsl"===w){F(this,y).append(x("H","H",0,359,1,"linear-gradient(to right in hsl longer hue, hsl(0 100% 50%), hsl(360 100% 50%))"),x("S","S",0,100,1,`linear-gradient(in hsl to right, hsl(${null!=(h=M.H)?h:0} 0% ${null!=(u=M.L)?u:50}% / 100%), hsl(${null!=(p=M.H)?p:0} 100% ${null!=(d=M.L)?d:50}% / 100%))`),x("L","L",0,100,1,`linear-gradient(in oklab to right, hsl(${null!=(f=M.H)?f:0} ${null!=(m=M.S)?m:100}% 0%), hsl(${null!=(b=M.H)?b:0} ${null!=(v=M.S)?v:100}% 100%))`),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-s'),t=F(this,y).querySelector('input[type="range"].ch-l'),r=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const n=k.H.value||"0",a=k.S.value||"100",o=k.L.value||"50";e&&(e.style.backgroundImage=`linear-gradient(in hsl to right, hsl(${n} 0% ${o}% / 100%), hsl(${n} 100% ${o}% / 100%))`),t&&(t.style.backgroundImage=`linear-gradient(in oklab to right, hsl(${n} ${a}% 0%), hsl(${n} ${a}% 100%))`),r&&(r.style.background=`linear-gradient(to right in hsl, hsl(${n} ${a}% ${o}% / 0%), hsl(${n} ${a}% ${o}% / 100%)), var(--checker)`)}))}else if("hwb"===w){F(this,y).append(x("H","H",0,359,1,"linear-gradient(to right in hsl longer hue, hsl(0 100% 50%), hsl(360 100% 50%))"),x("W","W",0,100,1,"linear-gradient(to right in oklab, #fff0, #fff)","black"),x("B","B",0,100,1,"linear-gradient(to right in oklab, #0000, #000)","white"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const t=k.H.value||"0",r=k.W.value||"0",n=k.B.value||"0";e&&(e.style.background=`linear-gradient(to right in hwb, hwb(${t} ${r}% ${n}% / 0%), hwb(${t} ${r}% ${n}% / 100%)), var(--checker)`)}))}else if("srgb"===w||"hex"===w){F(this,y).append(x("R","R",0,100,1,"linear-gradient(to right in oklab, #f000, #f00)","black"),x("G","G",0,100,1,"linear-gradient(to right in oklab, #0f00, #0f0)","black"),x("B","B",0,100,1,"linear-gradient(to right in oklab, #00f0, #00f)","black"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const t=k.R.value||"0",r=k.G.value||"0",n=k.B.value||"0";e&&(e.style.background=`linear-gradient(to right in srgb, rgb(${t}% ${r}% ${n}% / 0%), rgb(${t}% ${r}% ${n}% / 100%)), var(--checker)`)}))}else if(ya(w)){F(this,y).append(x("R","R",0,100,1,"linear-gradient(to right in oklab, #f000, #f00)","black"),x("G","G",0,100,1,"linear-gradient(to right in oklab, #0f00, #0f0)","black"),x("B","B",0,100,1,"linear-gradient(to right in oklab, #00f0, #00f)","black"),x("A","ALP",0,100,1));const e=F(this,y).querySelector('input[type="range"].ch-alp');X(this,g,ge(()=>{const t=k.R.value||"0",r=k.G.value||"0",n=k.B.value||"0";if(e){const a=Ma(w,{...M,R:t,G:r,B:n,ALP:"0"}),o=Ma(w,{...M,R:t,G:r,B:n,ALP:"100"});e.style.background=`linear-gradient(to right, ${a}, ${o}), var(--checker)`}}))}},customElements.define("color-input",Ea),e.ColorInput=Ea,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
+//# sourceMappingURL=color-input.min.js.map