@taprootio/espalier 4.0.0 → 4.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +5764 -5720
- package/dist/root/esp-root.d.ts +6 -0
- package/dist/section/esp-section.d.ts +27 -0
- package/dist/section/esp-section.js +23 -2
- package/dist/shared/scale-engine.js +1 -1
- package/dist/shared/theme.d.ts +13 -4
- package/dist/shared/theme.js +1 -1
- package/dist/shared/visual-overlay.js +12 -5
- package/espalier.css-data.json +1585 -438
- package/espalier.token-manifest.json +60 -0
- package/package.json +1 -1
package/dist/root/esp-root.d.ts
CHANGED
|
@@ -116,6 +116,12 @@ export type { SchemeEvents } from "../shared/bus-events.js";
|
|
|
116
116
|
* @cssprop --esp-type-caption-font-weight - Font weight for captions.
|
|
117
117
|
* @cssprop --esp-type-caption-letter-spacing - Letter spacing for captions.
|
|
118
118
|
* @cssprop --esp-type-caption-color - Context-local color alias for captions.
|
|
119
|
+
* @cssprop --esp-type-display-font-family - Heading font family for opt-in display text.
|
|
120
|
+
* @cssprop --esp-type-display-font-size - Fluid display size spanning the large mobile floor through the huge desktop ceiling.
|
|
121
|
+
* @cssprop --esp-type-display-font-weight - Heading font weight for opt-in display text.
|
|
122
|
+
* @cssprop --esp-type-display-line-height - Line height for opt-in display text.
|
|
123
|
+
* @cssprop --esp-type-display-letter-spacing - Letter spacing for opt-in display text.
|
|
124
|
+
* @cssprop --esp-type-display-color - Context-local heading-color alias for opt-in display text.
|
|
119
125
|
*
|
|
120
126
|
* @docPageTitle Root
|
|
121
127
|
* @docUrl /components/root
|
|
@@ -31,6 +31,28 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
|
|
|
31
31
|
* and drop `--esp-section-padding-block` too when the media should
|
|
32
32
|
* meet the band's edges; the band's zone behavior is unaffected.
|
|
33
33
|
*
|
|
34
|
+
* A section may also tint one raster alpha mask behind its content.
|
|
35
|
+
* The component owns clipping, no-repeat mask behavior, stacking, and
|
|
36
|
+
* interaction isolation; consumers supply only the image, semantic tint,
|
|
37
|
+
* position, size, and opacity:
|
|
38
|
+
*
|
|
39
|
+
* ```html
|
|
40
|
+
* <esp-section
|
|
41
|
+
* style="
|
|
42
|
+
* --esp-section-decoration-image: url('/assets/brand-mark.png');
|
|
43
|
+
* --esp-section-decoration-position: calc(100% + 2rem) -2rem;
|
|
44
|
+
* --esp-section-decoration-size: min(34rem, 62%);
|
|
45
|
+
* --esp-section-decoration-opacity: 0.09;
|
|
46
|
+
* "
|
|
47
|
+
* >
|
|
48
|
+
* <h1>Rooted in warmth</h1>
|
|
49
|
+
* </esp-section>
|
|
50
|
+
* ```
|
|
51
|
+
*
|
|
52
|
+
* CSS image values are trusted stylesheet input. Products that accept image
|
|
53
|
+
* references from documents or users must enforce their own asset ownership
|
|
54
|
+
* and URL policy before mapping a value to this hook.
|
|
55
|
+
*
|
|
34
56
|
* @customElement esp-section
|
|
35
57
|
* @slot - The section's content, centered in the well.
|
|
36
58
|
* @csspart section - The full-bleed band.
|
|
@@ -39,6 +61,11 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
|
|
|
39
61
|
* @cssprop --esp-section-max-width - The content well's cap. Defaults to `var(--esp-page-well-max-width, 72rem)`; `none` lets content span the band.
|
|
40
62
|
* @cssprop --esp-section-padding-block - Vertical rhythm above and below the well. Defaults to `var(--esp-size-section)`.
|
|
41
63
|
* @cssprop --esp-section-padding-inline - Horizontal breathing room inside the band at narrow viewports. Defaults to `var(--esp-size-medium)`.
|
|
64
|
+
* @cssprop --esp-section-decoration-image - Raster alpha mask painted behind the well. Defaults to `none`.
|
|
65
|
+
* @cssprop --esp-section-decoration-color - Semantic tint applied through the mask. Defaults to the local `--esp-color-headings`.
|
|
66
|
+
* @cssprop --esp-section-decoration-position - Mask position, including responsive or bleeding values. Defaults to `center`.
|
|
67
|
+
* @cssprop --esp-section-decoration-size - Mask size. Defaults to `contain`.
|
|
68
|
+
* @cssprop --esp-section-decoration-opacity - Decoration opacity from `0` through `1`. Defaults to `1`.
|
|
42
69
|
* @docPageTitle Section
|
|
43
70
|
* @docUrl /components/section
|
|
44
71
|
* @menuGroup Structure
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
var
|
|
1
|
+
var c=function(i,o,t,n){var a=arguments.length,e=a<3?o:n===null?n=Object.getOwnPropertyDescriptor(o,t):n,s;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")e=Reflect.decorate(i,o,t,n);else for(var l=i.length-1;l>=0;l--)(s=i[l])&&(e=(a<3?s(e):a>3?s(o,t,e):s(o,t))||e);return a>3&&e&&Object.defineProperty(o,t,e),e};import{css as d,html as v}from"lit";import{customElement as m}from"lit/decorators.js";import{EspalierElementBase as p}from"../shared/esp-element-base.js";import{renderVisualOverlay as u,visualOverlayStyles as y}from"../shared/visual-overlay.js";let r=class extends p{render(){return v`
|
|
2
2
|
<div class="esp-section" part="section">
|
|
3
|
+
${u({className:"decoration"})}
|
|
3
4
|
<div class="esp-section-well" part="well">
|
|
4
5
|
<slot></slot>
|
|
5
6
|
</div>
|
|
@@ -11,12 +12,32 @@ var a=function(t,i,s,n){var o=arguments.length,e=o<3?i:n===null?n=Object.getOwnP
|
|
|
11
12
|
|
|
12
13
|
.esp-section {
|
|
13
14
|
background: var(--esp-section-background, var(--esp-color-background));
|
|
15
|
+
isolation: isolate;
|
|
14
16
|
padding-block: var(--esp-section-padding-block, var(--esp-size-section));
|
|
15
17
|
padding-inline: var(--esp-section-padding-inline, var(--esp-size-medium));
|
|
18
|
+
position: relative;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.decoration {
|
|
22
|
+
--_esp-overlay-z-index: 0;
|
|
23
|
+
--_esp-overlay-texture: none;
|
|
24
|
+
--_esp-overlay-texture-color: var(
|
|
25
|
+
--esp-section-decoration-color,
|
|
26
|
+
var(--esp-color-headings)
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
--_esp-overlay-texture-mask:
|
|
30
|
+
var(--esp-section-decoration-image, none), linear-gradient(transparent, transparent);
|
|
31
|
+
--_esp-overlay-texture-mask-position: var(--esp-section-decoration-position, center);
|
|
32
|
+
--_esp-overlay-texture-mask-repeat: no-repeat;
|
|
33
|
+
--_esp-overlay-texture-mask-size: var(--esp-section-decoration-size, contain);
|
|
34
|
+
--_esp-overlay-texture-opacity: var(--esp-section-decoration-opacity, 1);
|
|
16
35
|
}
|
|
17
36
|
|
|
18
37
|
.esp-section-well {
|
|
19
38
|
max-inline-size: var(--esp-section-max-width, var(--esp-page-well-max-width, 72rem));
|
|
20
39
|
margin-inline: auto;
|
|
40
|
+
position: relative;
|
|
41
|
+
z-index: 1;
|
|
21
42
|
}
|
|
22
|
-
|
|
43
|
+
`,y],r=c([m("esp-section")],r);export{r as EspalierSection};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const l=["tiny","small","normal","medium","big","large","huge"],O=2,b=1.125,
|
|
1
|
+
const l=["tiny","small","normal","medium","big","large","huge"],O=2,b=1.125,f=1.3333333333333333,h=[["tiny","small"],["small","normal"],["normal","medium"],["medium","big"],["big","large"],["large","huge"]],u=.375,z={rootFontSize:16,typeRatio:1.25,spaceRatio:1.618,borderRadius:.2,viewportMin:320,viewportMax:1200};function c(s,e=4){const t=10**e;return Math.round(s*t)/t}function m(s,e,t,p,o){if(Math.abs(e-s)<1e-4)return`${c(s)}rem`;const y=(e-s)*t*100/(o-p),n=s-y*p/(100*t);return`clamp(${c(s)}rem, ${c(n)}rem + ${c(y)}vw, ${c(e)}rem)`}function E(s){const e={};for(let t=0;t<l.length;t++){const p=t-2,o=1.125*s.typeRatio**p;e[l[t]]={min:o,max:o*f}}return e}function x(s){const e={};for(let t=0;t<l.length;t++){const p=u*s.spaceRatio**t;e[l[t]]={min:p,max:p*f}}return e}const w={"--esp-shadow-1":"1px 1px 4px var(--esp-color-shadow)","--esp-shadow-2":"0 2px 8px var(--esp-color-shadow)","--esp-shadow-3":"0 6px 20px var(--esp-color-shadow)"},S={"--esp-type-overline-color":"var(--esp-color-type-overline, var(--esp-color-text))","--esp-type-label-color":"var(--esp-color-type-label, var(--esp-color-text))","--esp-type-lead-color":"var(--esp-color-type-lead, var(--esp-color-text))","--esp-type-caption-color":"var(--esp-color-type-caption, var(--esp-color-text))","--esp-type-display-color":"var(--esp-color-headings, var(--esp-color-text))"},_={"--esp-type-overline-font-size":"var(--esp-type-tiny)","--esp-type-overline-font-weight":"var(--esp-font-weight-headings)","--esp-type-overline-letter-spacing":"0.08em","--esp-type-overline-text-transform":"uppercase","--esp-type-label-font-size":"var(--esp-type-normal)","--esp-type-label-font-weight":"var(--esp-font-weight-headings)","--esp-type-label-letter-spacing":"0.01em","--esp-type-lead-font-size":"var(--esp-type-medium)","--esp-type-lead-font-weight":"var(--esp-font-weight-body)","--esp-type-lead-letter-spacing":"normal","--esp-type-caption-font-size":"var(--esp-type-small)","--esp-type-caption-font-weight":"var(--esp-font-weight-body)","--esp-type-caption-letter-spacing":"normal","--esp-type-display-font-family":"var(--esp-font-headings)","--esp-type-display-font-weight":"var(--esp-font-weight-headings)","--esp-type-display-line-height":"1.1","--esp-type-display-letter-spacing":"normal",...S};function P(s){const e={},{rootFontSize:t,viewportMin:p,viewportMax:o,borderRadius:y}=s,n=16,r=t/n,d=E(s);for(const a of l){const{min:i,max:v}=d[a];e[`--esp-type-${a}`]=m(i*r,v*r,n,p,o)}e["--esp-type-display-font-size"]=m(d.large.min*r,d.huge.max*r,n,p,o),Object.assign(e,_);const g=x(s);for(const a of l){const{min:i,max:v}=g[a];e[`--esp-size-${a}`]=m(i*r,v*r,n,p,o)}for(const[a,i]of h)e[`--esp-size-${a}-to-${i}`]=m(g[a].min*r,g[i].max*r,n,p,o);return e["--esp-size-font"]="var(--esp-type-normal)",e["--esp-size-padding"]="var(--esp-size-tiny-to-small)",e["--esp-size-padding-page"]="var(--esp-size-small-to-normal)",e["--esp-size-border-radius"]=`${c(y*r)}rem`,e["--esp-measure"]="66ch",e["--esp-measure-wide"]="90ch",e["--esp-size-section"]="clamp(var(--esp-size-big), 7vw, var(--esp-size-huge))",Object.assign(e,w),e["--esp-card-min"]="16rem",e}export{z as DEFAULT_SCALE_CONFIG,w as ELEVATION_PROPERTIES,l as STEP_NAMES,S as TYPE_ROLE_COLOR_PROPERTIES,_ as TYPE_ROLE_PROPERTIES,P as generateScaleProperties};
|
package/dist/shared/theme.d.ts
CHANGED
|
@@ -480,6 +480,15 @@ export interface EspalierTheme {
|
|
|
480
480
|
chroma: Record<SemanticColorName, ChromaRange>;
|
|
481
481
|
/** Maps each semantic token to its color source + lightness. */
|
|
482
482
|
semanticMappings: SemanticMappings;
|
|
483
|
+
/**
|
|
484
|
+
* Tokens in {@link semanticMappings} that were authored as explicit pins.
|
|
485
|
+
*
|
|
486
|
+
* A resolved theme also contains mappings generated by {@link roles}. This
|
|
487
|
+
* compact marker preserves that distinction when a complete theme document
|
|
488
|
+
* is serialized, then rehydrated through {@link mergeTheme}. Consumers
|
|
489
|
+
* normally do not author this field; `mergeTheme` maintains it.
|
|
490
|
+
*/
|
|
491
|
+
explicitMappingTokens?: SemanticColorName[];
|
|
483
492
|
/**
|
|
484
493
|
* Named brand colors available to semantic mappings as
|
|
485
494
|
* `anchor:<name>` sources. Empty by default — a single-color brand
|
|
@@ -679,10 +688,10 @@ export declare function encodeTheme(partial: PartialTheme): string;
|
|
|
679
688
|
/**
|
|
680
689
|
* Recover explicit mapping provenance from a resolved theme.
|
|
681
690
|
*
|
|
682
|
-
* Themes produced in this process carry exact provenance in the WeakMap
|
|
683
|
-
* The comparison fallback preserves
|
|
684
|
-
*
|
|
685
|
-
*
|
|
691
|
+
* Themes produced in this process carry exact provenance in the WeakMap and
|
|
692
|
+
* serialize it in `explicitMappingTokens`. The comparison fallback preserves
|
|
693
|
+
* historical behavior for a legacy or manually reconstructed resolved theme
|
|
694
|
+
* that carries neither form.
|
|
686
695
|
*
|
|
687
696
|
* Exported for the fit report (ESP0175), which marks explicit tokens so
|
|
688
697
|
* a zone's surprising value traces to the mapping that pinned it.
|
package/dist/shared/theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{UNSAFE_KEYS as ut,isSafeKey as A}from"./unsafe-keys.js";import{ACCEPTED_COLOR_FORMS as oe,apcaContrast as ft,clampChannel as de,deltaEOK as lt,deriveSemantic as ae,gamutMapToSRGB as he,linearRgbToOklab as pt,oklchToSRGB as mt,parseCssColor as W,parseOklch as dt,serializeOklch as ce,srgbToLinearRGB as ht}from"./color-engine.js";import{computeVariants as ge,parseAnchorSource as gt,resolveAnchorColor as yt,resolveMappingSource as ue}from"./variant-engine.js";import{auditColorDistances as De,auditDataPalette as bt,DATA_SERIES_KEYS as fe,DEFAULT_DATA_PALETTE as ye,DEFAULT_DATA_RAMP_STEPS as $t,MAX_DATA_RAMP_STEPS as be,MIN_DATA_RAMP_LIGHTNESS_STEP as Fe,MIN_DATA_RAMP_STEPS as $e}from"./data-colors.js";const j=/^[a-z][a-z0-9-]*$/;function xe(e){return gt(e)}function We(e,n){return yt(e,n)}function xt(e,n){const t=xe(e);if(t){const o=We(n,t);return o&&W(o)?o:null}return W(e)?e:null}const se=["canvas","ink","accent","action","structure"],Se={canvas:{color:[["background","surface"],["layer1","raised1"],["layer2","raised2"],["layer3","raised3"],["layer4","raised4"]]},ink:{color:[["text","text"],["typeOverline","text"],["typeLabel","text"],["typeLead","text"],["typeCaption","text"],["inputSelection","text"]],heading:[["headings","muted"],["headingsHover","ink"]]},accent:{color:[["linkHoverBg","raised2"],["inputSelectionBg","raised2"],["inputCaret","ink"]],text:[["link","accent"]],hover:[["linkHover","text"]]},action:{color:[["actionBackground","muted"]],ink:[["actionText","surface"]]},structure:{color:[["border","border"],["shadow","shadow"]]}},St=new Set(["action.color"]),kt={canvas:"background",ink:"text",accent:"link",action:"actionBackground",structure:"border"},At={"action.ink":{role:"canvas",slot:"color"}},Mt=.45,Ot=.045;function je(e,n,t){const o=Ue.actionText,r=[...U].sort((y,M)=>e[y]-e[M]||U.indexOf(y)-U.indexOf(M)),c=n?r.filter(y=>n(y)>=o.targetLc):r,f=t?c.filter(y=>t(y)>=Ot):c,m=f.length>0?f:c,d=m.length>0?m:r;let R,k=1/0;for(const y of d){const M=Math.abs(e[y]-Mt);M<k&&(k=M,R=y)}return R??"muted"}function vt(e,n,t){const o=Me(n,t,e)>.5;let r=U[0];for(const c of U)(o?n[c]<n[r]:n[c]>n[r])&&(r=c);return r}const Ct={"accent.hover":"text"};function Rt(e,n){const t=new Map;try{const o=pe(n,e),r=(c,f,m,d)=>{const R=xe(f),k=R?We(d,R):null,y=k===null?null:W(k),M=t.get(c)??[];M.some(_=>_.source===f&&_.chroma===y?.c)||(M.push({source:f,where:m,chroma:y?.c}),t.set(c,M))};for(const[c,f]of Object.entries(o.semanticMappings))f.source.startsWith("anchor:")&&r(c,f.source,"the root table",o.anchors);for(const c of Object.keys(o.contexts)){const f=nt(o,c);if(f)for(const[m,d]of Object.entries(f.semanticMappings))d.source.startsWith("anchor:")&&r(m,d.source,`contexts.${c}`,f.anchors)}}catch{return new Map}return t}function q(e,n){if(e===void 0)return;if(typeof e=="string")return n==="color"?e:void 0;const t=e[n];return typeof t=="string"?t:void 0}function Ke(e,n,t,o={}){const r={},c={};for(const[f,m]of Object.entries(o.explicitMappings??{}))m!==void 0&&(c[f]=m.lightness);for(const f of se){const m=e[f];if(m!==void 0)for(const[d,R]of Object.entries(Se[f])){const k=At[`${f}.${d}`];let y=q(m,d),M=!1;if(y===void 0){k&&(y=q(e[k.role],k.slot),y??=t[kt[k.role]]?.source,M=y!==void 0);const _=Ct[`${f}.${d}`];_!==void 0&&(y??=q(m,_)),y??=q(m,"color")}if(y!==void 0)for(const[_,K]of R){let N=K;if(St.has(`${f}.${d}`))N=je(n,o.actionSurfaceContrast?s=>o.actionSurfaceContrast(y,s):void 0,o.actionSurfaceSeparation?s=>o.actionSurfaceSeparation(y,s):void 0);else if(M&&k){const s=Ue[_],i=(s&&c[s.bg])??je(n,o.actionSurfaceContrast?a=>o.actionSurfaceContrast(q(m,"color"),a):void 0,o.actionSurfaceSeparation?a=>o.actionSurfaceSeparation(q(m,"color"),a):void 0);N=vt(i,n,o.tones??{})}r[_]={source:y,lightness:N}}}}return r}const Ue={text:{bg:"background",targetLc:75},typeOverline:{bg:"background",targetLc:90},typeLabel:{bg:"background",targetLc:75},typeLead:{bg:"background",targetLc:75},typeCaption:{bg:"background",targetLc:90},dangerText:{bg:"background",targetLc:75},headings:{bg:"background",targetLc:60},headingsHover:{bg:"background",targetLc:60},link:{bg:"background",targetLc:75},linkHover:{bg:"linkHoverBg",targetLc:75},actionText:{bg:"actionBackground",targetLc:75},inputCaret:{bg:"layer2",targetLc:60},inputSelection:{bg:"inputSelectionBg",targetLc:60}},Q=["background","layer1","layer2","layer3","layer4","actionBackground","actionText","border","shadow","text","typeOverline","typeLabel","typeLead","typeCaption","dangerText","headings","headingsHover","link","linkHover","linkHoverBg","inputCaret","inputSelection","inputSelectionBg"],Tt=["typeOverline","typeLabel","typeLead","typeCaption"],ke=["primary","analogous-left","analogous-right","complementary","split-complementary-left","split-complementary-right","triadic-left","triadic-right","danger","success","warning","info"],ee=["danger","success","warning","info"],wt=["analogous-left","analogous-right","complementary","split-complementary-left","split-complementary-right","triadic-left","triadic-right","danger","success","warning","info"],U=["surface","raised1","raised2","raised3","raised4","accent","muted","text","border","ink","shadow"],ze="tone:";function Ae(e){if(typeof e!="string"||!e.startsWith(ze))return null;const n=e.slice(ze.length);return A(n)&&j.test(n)?n:null}function te(e){return typeof e!="string"?!1:U.includes(e)}function Me(e,n,t){if(te(t))return e[t];const o=Ae(t);return o===null?e.surface:n?.[o]??e.surface}const Bt={surface:.99,raised1:.97,raised2:.9,raised3:.8,raised4:.72,accent:.5,muted:.45,text:.35,border:.3,ink:.25,shadow:.2},Et={surface:.15,raised1:.2,raised2:.3,raised3:.4,raised4:.36,accent:.6,muted:.75,text:.85,border:.7,ink:.95,shadow:.6},Oe={background:{source:"primary",lightness:"surface"},layer1:{source:"primary",lightness:"raised1"},layer2:{source:"primary",lightness:"raised2"},layer3:{source:"primary",lightness:"raised3"},layer4:{source:"primary",lightness:"raised4"},actionBackground:{source:"primary",lightness:"raised3"},actionText:{source:"primary",lightness:"ink"},border:{source:"primary",lightness:"border"},shadow:{source:"primary",lightness:"shadow"},text:{source:"primary",lightness:"text"},typeOverline:{source:"primary",lightness:"text"},typeLabel:{source:"primary",lightness:"text"},typeLead:{source:"primary",lightness:"text"},typeCaption:{source:"primary",lightness:"text"},dangerText:{source:"danger",lightness:"text"},headings:{source:"primary",lightness:"muted"},headingsHover:{source:"primary",lightness:"text"},link:{source:"complementary",lightness:"accent"},linkHover:{source:"complementary",lightness:"text"},linkHoverBg:{source:"triadic-left",lightness:"raised2"},inputCaret:{source:"triadic-right",lightness:"ink"},inputSelection:{source:"complementary",lightness:"text"},inputSelectionBg:{source:"triadic-left",lightness:"raised2"}},J=.4;function ve(){const e={};for(const n of Q)e[n]={min:0,max:J};return e}const Ge={seedColor:"oklch(0.7 0.125 216)",fontBody:"",fontHeadings:"",fontBrand:"",fontMonospace:"",fontWeightBody:"normal",fontWeightHeadings:"bold",fontWeightBrand:"bold",fontWeightMonospace:"normal",stylesheets:[],rootFontSize:16,typeRatio:1.25,spaceRatio:1.618,borderRadius:.2,viewportMin:320,viewportMax:1200,angles:{analogous:30,complementary:180,splitComplementary:30,triadic:120},semanticHues:{danger:27,success:150,warning:90,info:244},variantChroma:{},intents:{},tones:{},chroma:ve(),semanticMappings:{...Oe},anchors:{},roles:{},contexts:{},dataPalette:{...ye},dataRamps:{}},Ce={...Ge,chroma:ve(),semanticMappings:{...Oe},anchors:{},roles:{},contexts:{},tones:{},dataPalette:{...ye},dataRamps:{},lightness:{...Bt}},Ve={...Ge,chroma:ve(),semanticMappings:{...Oe},anchors:{},roles:{},contexts:{},tones:{},dataPalette:{...ye},dataRamps:{},lightness:{...Et}},le=new WeakMap;le.set(Ce,new Set),le.set(Ve,new Set);function _t(e,n){return ut.has(e)?void 0:n}function nn(e){return`--esp-color-${e.replace(/([A-Z])/g,"-$1").replace(/(\d)/g,"-$1").toLowerCase()}`}function Lt(e){try{const n=Je(e),t=JSON.parse(n,_t);return typeof t!="object"||t===null||Array.isArray(t)?null:t}catch{return null}}const Re="\xEF\xBB\xBF";function It(e){if(/^[\u0000-\u007f]*$/.test(e))return btoa(e);const n=new TextEncoder().encode(e);let t=Re;for(const o of n)t+=String.fromCharCode(o);return btoa(t)}function Je(e){const n=atob(e);if(!n.startsWith(Re))return n;const t=Uint8Array.from(n.slice(Re.length),o=>o.charCodeAt(0));return new TextDecoder("utf-8",{fatal:!0}).decode(t)}function Te(e){return It(JSON.stringify(e))}function Ht(e){const n={};for(const t of ee){const o=e[t];typeof o=="string"&&(n[t]=o.startsWith("anchor:")?o:re(o))}return n}function re(e){if(dt(e))return e;const n=W(e);return n?ce(n):e}function Ye(e,n){const t={};for(const[o,r]of Object.entries(e))A(o)&&(t[o]=r);if(!n)return t;for(const[o,r]of Object.entries(n)){if(r===void 0||!A(o))continue;const c=t[o];if(c!==void 0&&typeof r=="object"&&r!==null){const f={};if(typeof c=="string")f.color=c;else for(const[m,d]of Object.entries(c))A(m)&&(f[m]=d);for(const[m,d]of Object.entries(r))d!==void 0&&A(m)&&(f[m]=d);t[o]=f;continue}t[o]=r}return t}function we(e){const n={};if(!H(e))return n;for(const[t,o]of Object.entries(e))A(t)&&j.test(t)&&!te(t)&&typeof o=="number"&&Number.isFinite(o)&&o>=0&&o<=1&&(n[t]=o);return n}function Nt(e,n){return{...we(e),...we(n)}}function Pt(e,n){const t={...e};if(!H(n))return t;for(const o of U){const r=n[o];typeof r=="number"&&Number.isFinite(r)&&r>=0&&r<=1&&(t[o]=r)}return t}function qe(e){if(typeof e!="object"||e===null||Array.isArray(e))return null;const n=e,t={};for(const o of se){const r=n[o];r!==void 0&&(t[o]=r)}if(typeof n.lightness=="object"&&n.lightness!==null&&!Array.isArray(n.lightness)){const o={};for(const r of U){const c=n.lightness[r];c!==void 0&&(o[r]=c)}t.lightness=o}if(n.tones!==void 0){const o=we(n.tones);Object.keys(o).length>0&&(t.tones=o)}if(typeof n.semanticMappings=="object"&&n.semanticMappings!==null&&!Array.isArray(n.semanticMappings)){const o={};for(const[r,c]of Object.entries(n.semanticMappings)){if(!A(r)||!Q.includes(r)||typeof c!="object"||c===null||Array.isArray(c))continue;const{source:f,lightness:m}=c;typeof f=="string"&&(typeof m!="string"||!te(m)&&Ae(m)===null||(o[r]={source:f,lightness:m}))}Object.keys(o).length>0&&(t.semanticMappings=o)}return t}function Dt(e,n){const t={};for(const[o,r]of Object.entries(e)){if(!A(o)||!j.test(o))continue;const c=qe(r);c&&(t[o]=c)}if(!n)return t;for(const[o,r]of Object.entries(n)){if(!A(o)||!j.test(o)||r===void 0)continue;const c=qe(r);if(!c)continue;const f=t[o];t[o]={...f??{},...c,...f?.lightness||c.lightness?{lightness:{...f?.lightness,...c.lightness}}:{},...f?.tones||c.tones?{tones:{...f?.tones,...c.tones}}:{},...f?.semanticMappings||c.semanticMappings?{semanticMappings:{...f?.semanticMappings,...c.semanticMappings}}:{}}}return t}function H(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)}function F(e){const n={};for(const[t,o]of Object.entries(e))o!==void 0&&A(t)&&(n[t]=o);return n}function Xe(e){if(!H(e))return e;const n=F(e);return H(e.lightness)&&(n.lightness=F(e.lightness)),H(e.tones)&&(n.tones=F(e.tones)),n}function Ft(e,n){const t={};for(const[o,r]of Object.entries(e))A(o)&&(t[o]=Xe(r));if(!n)return t;for(const[o,r]of Object.entries(n)){if(!A(o)||r===void 0)continue;const c=t[o];if(!H(c)||!H(r)){t[o]=Xe(r);continue}const f={...F(c),...F(r)};H(c.lightness)&&H(r.lightness)?f.lightness={...F(c.lightness),...F(r.lightness)}:H(r.lightness)&&(f.lightness=F(r.lightness)),H(c.tones)&&H(r.tones)?f.tones={...F(c.tones),...F(r.tones)}:H(r.tones)&&(f.tones=F(r.tones)),H(c.semanticMappings)&&H(r.semanticMappings)?f.semanticMappings={...F(c.semanticMappings),...F(r.semanticMappings)}:H(r.semanticMappings)&&(f.semanticMappings=F(r.semanticMappings)),t[o]=f}return t}function Wt(e){const n={};for(const[t,o]of Object.entries(e)){if(!A(t))continue;if(typeof o=="string"){n[t]=re(o);continue}const r={};for(const[c,f]of Object.entries(o))A(c)&&(r[c]=typeof f=="string"?re(f):f);n[t]=r}return n}function ie(e){return typeof e!="string"?"":e.startsWith("anchor:")?e:re(e)}function jt(e){const n={};for(const t of fe)n[t]=ie(e[t]);return n}function Ze(e,n){const t={};for(const[o,r]of Object.entries(e))A(o)&&j.test(o)&&r&&typeof r=="object"&&!Array.isArray(r)&&(t[o]={...r});if(!n)return t;for(const[o,r]of Object.entries(n)){if(!A(o)||!j.test(o)||!r||typeof r!="object"||Array.isArray(r))continue;const c=t[o],f=c!==void 0&&r.type!==void 0&&r.type!==c.type;t[o]={...f?{}:c??{},...r}}return t}function Kt(e){const n={};for(const[t,o]of Object.entries(e))if(A(t)){if(o.type==="sequential"&&typeof o.source=="string"){n[t]={...o,source:ie(o.source)};continue}if(o.type==="diverging"&&typeof o.start=="string"&&typeof o.end=="string"){n[t]={...o,start:ie(o.start),end:ie(o.end),...typeof o.neutral=="string"?{neutral:ie(o.neutral)}:{}};continue}n[t]={...o}}return n}function Qe(e){const n=W(e.seedColor);if(!n)return;const t=ge(n,e);return(o,r)=>{const c=ue(o,t,e.anchors)??t.primary,f=e.chroma.actionBackground,m=ae(c,e.lightness[r],f.min,f.max),d={l:m.l>.5?0:1,c:0,h:0};return Math.abs(ft(d,m))}}function Ut(e,n,t){if(n?.background)return n.background;const o=q(e.canvas,"color");if(o!==void 0){const r=Se.canvas.color?.find(([c])=>c==="background");if(r)return{source:o,lightness:r[1]}}return t.background}function et(e,n){const t=W(e.seedColor);if(!t||!n)return;const o=ge(t,e),r=ue(n.source,o,e.anchors)??o.primary,c=e.chroma.background,f=ae(r,Me(e.lightness,e.tones,n.lightness),c.min,c.max);return(m,d)=>{const R=ue(m,o,e.anchors)??o.primary,k=e.chroma.actionBackground,y=ae(R,e.lightness[d],k.min,k.max);return lt(y,f)}}function zt(e){const n=le.get(e);if(n)return new Set(n);const t=new Set,o=Ke(e.roles,e.lightness,e.semanticMappings,{tones:e.tones,actionSurfaceContrast:Qe(e),actionSurfaceSeparation:et(e,e.semanticMappings.background)});for(const[r,c]of Object.entries(o)){const f=e.semanticMappings[r];(f.source!==c.source||f.lightness!==c.lightness)&&t.add(r)}return t}function pe(e,n){const t={...e.roles,...n.roles},o=Dt(e.contexts,n.contexts),r=Pt(e.lightness,n.lightness),c=Nt(e.tones,n.tones),f=Wt(Ye(e.anchors,n.anchors)),m=typeof n.seedColor=="string"?re(n.seedColor):e.seedColor,d=n.semanticMappings,R={...e.angles,...n.angles},k={...e.semanticHues,...n.semanticHues},y={...e.variantChroma,...n.variantChroma},M=Ht({...e.intents,...n.intents}),_=n.chroma,K=ne(e.chroma,_),N=jt(ne(e.dataPalette,n.dataPalette)),s=Kt(Ze(e.dataRamps,n.dataRamps)),i=zt(e),a=new Set(i),u={};for(const x of i)u[x]=e.semanticMappings[x];for(const[x,T]of Object.entries(d??{}))T!==void 0&&(a.add(x),u[x]=T);const p=ne(e.semanticMappings,d),h={angles:R,anchors:f,chroma:K,intents:M,lightness:r,tones:c,seedColor:m,semanticHues:k,variantChroma:y},l=Qe(h),g=et(h,Ut(t,u,p)),$=Ke(t,r,p,{explicitMappings:u,tones:c,actionSurfaceContrast:l,actionSurfaceSeparation:g}),b={};for(const[x,T]of Object.entries($))a.has(x)||(b[x]=T);const C={};for(const x of Tt)!a.has(x)&&b[x]===void 0&&(C[x]={source:p.text.source,lightness:p.text.lightness},_?.text!==void 0&&_[x]===void 0&&(K[x]={...K.text}));const O=ne(ne(ne(e.semanticMappings,C),b),d),S={...e,seedColor:m,fontBody:n.fontBody??e.fontBody,fontHeadings:n.fontHeadings??e.fontHeadings,fontBrand:n.fontBrand??e.fontBrand,fontMonospace:n.fontMonospace??e.fontMonospace,fontWeightBody:String(n.fontWeightBody??e.fontWeightBody),fontWeightHeadings:String(n.fontWeightHeadings??e.fontWeightHeadings),fontWeightBrand:String(n.fontWeightBrand??e.fontWeightBrand),fontWeightMonospace:String(n.fontWeightMonospace??e.fontWeightMonospace),stylesheets:n.stylesheets??[...e.stylesheets],rootFontSize:n.rootFontSize??e.rootFontSize,typeRatio:n.typeRatio??e.typeRatio,spaceRatio:n.spaceRatio??e.spaceRatio,borderRadius:n.borderRadius??e.borderRadius,viewportMin:n.viewportMin??e.viewportMin,viewportMax:n.viewportMax??e.viewportMax,angles:R,semanticHues:k,variantChroma:y,intents:M,lightness:r,tones:c,chroma:K,semanticMappings:O,anchors:f,roles:t,contexts:o,dataPalette:N,dataRamps:s};return n.pageBackgroundImage!==void 0&&(S.pageBackgroundImage=n.pageBackgroundImage),n.pageBackgroundImageOpacity!==void 0&&(S.pageBackgroundImageOpacity=n.pageBackgroundImageOpacity),n.boxBackgroundImage!==void 0&&(S.boxBackgroundImage=n.boxBackgroundImage),n.boxBackgroundImageOpacity!==void 0&&(S.boxBackgroundImageOpacity=n.boxBackgroundImageOpacity),n.vellumOpacity!==void 0&&(S.vellumOpacity=n.vellumOpacity),n.vellumBackgroundImage!==void 0&&(S.vellumBackgroundImage=n.vellumBackgroundImage),n.vellumBackgroundImageOpacity!==void 0&&(S.vellumBackgroundImageOpacity=n.vellumBackgroundImageOpacity),le.set(S,new Set(a)),S}const tt=new WeakMap;function nt(e,n){const t=e.contexts&&Object.prototype.hasOwnProperty.call(e.contexts,n)?e.contexts[n]:void 0;if(!t)return null;let o=tt.get(e);const r=o?.get(n);if(r)return r;const c={};for(const m of se){const d=t[m];d!==void 0&&(c[m]=d)}const f=pe(e,{lightness:t.lightness,tones:t.tones,roles:c,semanticMappings:t.semanticMappings});return o||(o=new Map,tt.set(e,o)),o.set(n,f),f}function ne(e,n){if(!n)return{...e};const t={...e};for(const o of Object.keys(n)){const r=n[o];r!==void 0&&(t[o]=r)}return t}function Be(e){let n;try{n=Je(e)}catch{return{error:"Failed to decode Base64 string."}}let t;try{t=JSON.parse(n)}catch{return{error:"Decoded string is not valid JSON."}}return typeof t!="object"||t===null||Array.isArray(t)?{error:"Theme must be a JSON object."}:{value:t}}function on(e){const n=Be(e);return n.error!==void 0?{valid:!1,errors:[n.error],warnings:[]}:Ee(n.value)}function Ee(e,n=Ce){const t=[],o=[];"seedColor"in e&&(typeof e.seedColor!="string"?t.push("seedColor must be a string."):W(e.seedColor)||t.push(`seedColor is not a valid CSS color: "${e.seedColor}". Accepted forms: ${oe}.`));for(const s of["fontBody","fontHeadings","fontBrand","fontMonospace"])s in e&&typeof e[s]!="string"&&t.push(`${s} must be a string.`);const r=["normal","bold","lighter","bolder"],c=["inherit","initial","unset","revert","revert-layer"];for(const s of["fontWeightBody","fontWeightHeadings","fontWeightBrand","fontWeightMonospace"])if(s in e){const i=e[s];if(typeof i=="number")(i<1||i>1e3)&&t.push(`${s} numeric value must be 1\u20131000 (got ${i}).`);else if(typeof i=="string"){const a=r.includes(i)||c.includes(i);if(/^\d+$/.test(i)){const p=Number(i);(p<1||p>1e3)&&t.push(`${s} numeric value must be 1\u20131000 (got "${i}").`)}else a||o.push(`${s} = "${i}" is not a standard font-weight value.`)}else t.push(`${s} must be a string or number.`)}"stylesheets"in e&&(Array.isArray(e.stylesheets)?e.stylesheets.some(s=>typeof s!="string")&&t.push("Every entry in stylesheets must be a string."):t.push("stylesheets must be an array of strings."));const f=[["rootFontSize",1,100],["borderRadius",0,10],["viewportMin",100,1e4],["viewportMax",200,1e4]];for(const[s,i,a]of f)if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const u=e[s];i!==void 0&&u<i&&t.push(`${s} must be \u2265 ${i} (got ${u}).`),a!==void 0&&u>a&&o.push(`${s} = ${u} is unusually high (max ${a}).`)}for(const s of["typeRatio","spaceRatio"])if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const i=e[s];i<=1&&t.push(`${s} must be > 1 (got ${i}).`);const a=s==="typeRatio"?1.3:2;i>a&&o.push(`${s} = ${i} is very high (max ${a}); scales may be extreme.`)}if("viewportMin"in e&&"viewportMax"in e){const s=e.viewportMin,i=e.viewportMax;typeof s=="number"&&typeof i=="number"&&s>=i&&t.push(`viewportMin (${s}) must be less than viewportMax (${i}).`)}if("angles"in e)if(typeof e.angles!="object"||e.angles===null)t.push("angles must be an object.");else{const s=e.angles;for(const i of["analogous","complementary","splitComplementary","triadic"])if(i in s)if(typeof s[i]!="number"||!isFinite(s[i]))t.push(`angles.${i} must be a finite number.`);else{const a=s[i];(a<0||a>360)&&o.push(`angles.${i} = ${a} is outside 0\u2013360.`)}}if("semanticHues"in e)if(typeof e.semanticHues!="object"||e.semanticHues===null)t.push("semanticHues must be an object.");else{const s=e.semanticHues;for(const i of["danger","success","warning","info"])if(i in s)if(typeof s[i]!="number"||!isFinite(s[i]))t.push(`semanticHues.${i} must be a finite number.`);else{const a=s[i];(a<0||a>360)&&o.push(`semanticHues.${i} = ${a} is outside 0\u2013360.`)}}if("variantChroma"in e)if(typeof e.variantChroma!="object"||e.variantChroma===null)t.push("variantChroma must be an object.");else{const s=e.variantChroma;for(const i of wt)if(i in s)if(typeof s[i]!="number"||!isFinite(s[i]))t.push(`variantChroma["${i}"] must be a finite number.`);else{const a=s[i];a<0&&t.push(`variantChroma["${i}"] must be \u2265 0 (got ${a}).`),a>J&&o.push(`variantChroma["${i}"] = ${a} exceeds ${J}.`)}}function m(s,i){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${i} must be an object.`);return}const a=s;for(const u of Object.keys(a))(!A(u)||!te(u))&&t.push(`${i}.${u} is not a built-in lightness stop; expected one of: ${U.join(", ")}.`);for(const u of U)if(u in a)if(typeof a[u]!="number"||!isFinite(a[u]))t.push(`${i}.${u} must be a finite number.`);else{const p=a[u];(p<0||p>1)&&t.push(`${i}.${u} must be 0\u20131 (got ${p}).`)}}"lightness"in e&&m(e.lightness,"lightness");function d(s,i){const a=new Set;if(!H(s))return t.push(`${i} must be an object.`),a;for(const[u,p]of Object.entries(s)){if(!A(u)||!j.test(u)){t.push(`${i}.${u} must be a lowercase slug matching ${j.source}.`);continue}if(te(u)){t.push(`${i}.${u} conflicts with the built-in "${u}" lightness stop; choose a distinct custom tone name.`);continue}a.add(u),typeof p!="number"||!Number.isFinite(p)?t.push(`${i}.${u} must be a finite number.`):(p<0||p>1)&&t.push(`${i}.${u} must be 0\u20131 (got ${p}).`)}return a}const R=new Set(Object.keys(n.tones??{}));if("tones"in e)for(const s of d(e.tones,"tones"))R.add(s);if("chroma"in e)if(typeof e.chroma!="object"||e.chroma===null)t.push("chroma must be an object.");else{const s=e.chroma,i=Rt(e,n);for(const a of Q)if(a in s){const u=s[a];if(typeof u!="object"||u===null){t.push(`chroma.${a} must be { min, max }.`);continue}const p=u;for(const l of i.get(a)??[])l.chroma!==void 0&&typeof p.min=="number"&&typeof p.max=="number"&&(l.chroma<p.min-1e-9||l.chroma>p.max+1e-9)&&o.push(`chroma.${a} clamps the anchor-sourced token ${a} ("${l.source}", effective in ${l.where}) and moves it off its declared swatch. Remove the band if that is unintended \u2014 anchors otherwise keep their own chroma.`);const h=u;(typeof h.min!="number"||h.min<0)&&t.push(`chroma.${a}.min must be \u2265 0.`),(typeof h.max!="number"||h.max<0||h.max>J)&&t.push(`chroma.${a}.max must be 0\u2013${J}.`),typeof h.min=="number"&&typeof h.max=="number"&&h.min>h.max&&t.push(`chroma.${a}.min (${h.min}) must be \u2264 max (${h.max}).`)}}if("anchors"in e)if(typeof e.anchors!="object"||e.anchors===null||Array.isArray(e.anchors))t.push("anchors must be an object of named colors.");else for(const[s,i]of Object.entries(e.anchors))if(A(s)?j.test(s)||t.push(`anchors: "${s}" is not a valid anchor name; use a lowercase slug (letters, digits, hyphens).`):t.push(`anchors: "${s}" is a reserved JavaScript property name and cannot be an anchor name; rename it.`),ke.includes(s)&&t.push(`anchors: "${s}" collides with a reserved color source name.`),typeof i=="string")W(i)||t.push(`anchors.${s} is not a valid CSS color: "${i}". Accepted forms: ${oe}.`);else if(typeof i=="object"&&i!==null&&!Array.isArray(i)){const a=i;typeof a.color!="string"&&t.push(`anchors.${s} must declare its base "color".`);for(const[u,p]of Object.entries(a))A(u)?u!=="color"&&!j.test(u)&&t.push(`anchors.${s}: "${u}" is not a valid slot name; use a lowercase slug.`):t.push(`anchors.${s}: "${u}" is a reserved JavaScript property name and cannot be a slot name; rename it.`),typeof p!="string"?t.push(`anchors.${s}.${u} must be a CSS color string.`):W(p)||t.push(`anchors.${s}.${u} is not a valid CSS color: "${p}". Accepted forms: ${oe}.`)}else t.push(`anchors.${s} must be a color string or a { color, \u2026slots } object.`);const k=new Map;if("anchors"in e&&typeof e.anchors=="object"&&e.anchors!==null&&!Array.isArray(e.anchors))for(const[s,i]of Object.entries(e.anchors))k.set(s,i);function y(s,i){const a=xe(s);if(!a){t.push(`${i} "${s}" is not valid anchor syntax; use anchor:<name> or anchor:<name>.<slot>.`);return}if(!k.has(a.name)){const u=[...k.keys()];t.push(`${i} references undeclared anchor "${a.name}". Declared anchors: ${u.length>0?u.join(", "):"(none)"}.`);return}if(a.slot!==void 0){const u=k.get(a.name);if(typeof(typeof u=="object"&&u!==null&&!Array.isArray(u)?u[a.slot]:void 0)!="string"){const h=typeof u=="object"&&u!==null?Object.keys(u).filter(l=>l!=="color"):[];t.push(`${i} references unknown slot "${a.slot}" on anchor "${a.name}". Declared slots: ${h.length>0?h.join(", "):"(none)"}.`)}}}function M(s,i){if(s.startsWith("anchor:")){y(s,i);return}ke.includes(s)||t.push(`${i} must be one of: ${ke.join(", ")}, or a declared anchor as anchor:<name> / anchor:<name>.<slot>.`)}if("intents"in e)if(typeof e.intents!="object"||e.intents===null||Array.isArray(e.intents))t.push("intents must be an object.");else for(const[s,i]of Object.entries(e.intents)){const a=`intents.${s}`;if(!ee.includes(s)){t.push(`${a} is not a status family; expected one of: ${ee.join(", ")}.`);continue}if(typeof i!="string"){t.push(`${a} must be a string (a CSS color or an anchor: reference).`);continue}if(i.startsWith("anchor:")){y(i,a);continue}W(i)||t.push(`${a} "${i}" is not a supported color form or anchor: reference. Accepted forms: ${oe}, or anchor:<name> / anchor:<name>.<slot>. An override retunes a family with a declared color; it never points one family at another \u2014 retune, never reassign.`)}function _(s,i){if(s.startsWith("anchor:")){y(s,i);return}W(s)||t.push(`${i} is not a valid CSS color: "${s}". Accepted forms: ${oe}, or a declared anchor as anchor:<name> / anchor:<name>.<slot>.`)}if("dataPalette"in e)if(typeof e.dataPalette!="object"||e.dataPalette===null||Array.isArray(e.dataPalette))t.push("dataPalette must be an object with series1\u2013series8 color values.");else{const s=e.dataPalette;for(const[i,a]of Object.entries(s)){if(!fe.includes(i)){t.push(`dataPalette.${i} is not a series slot; expected one of: ${fe.join(", ")}.`);continue}typeof a!="string"?t.push(`dataPalette.${i} must be a CSS color or anchor reference string.`):_(a,`dataPalette.${i}`)}}if("dataRamps"in e)if(typeof e.dataRamps!="object"||e.dataRamps===null||Array.isArray(e.dataRamps))t.push("dataRamps must be an object of named ramp declarations.");else for(const[s,i]of Object.entries(e.dataRamps)){if(A(s)?j.test(s)||t.push(`dataRamps: "${s}" is not a valid ramp name; use a lowercase slug (letters, digits, hyphens).`):t.push(`dataRamps: "${s}" is a reserved JavaScript property name and cannot be a ramp name; rename it.`),typeof i!="object"||i===null||Array.isArray(i)){t.push(`dataRamps.${s} must be a sequential or diverging ramp object.`);continue}const a=i,u=a.steps??$t;if((typeof u!="number"||!Number.isInteger(u)||u<$e||u>be)&&t.push(`dataRamps.${s}.steps must be an integer from ${$e} through ${be}.`),a.type==="sequential"){typeof a.source!="string"?t.push(`dataRamps.${s}.source must be a CSS color or anchor reference string.`):_(a.source,`dataRamps.${s}.source`);const p=a.lightnessStart??.95,h=a.lightnessEnd??.25;for(const[l,g]of[["lightnessStart",p],["lightnessEnd",h]])(typeof g!="number"||!Number.isFinite(g)||g<0||g>1)&&t.push(`dataRamps.${s}.${l} must be a finite number from 0 through 1.`);typeof p=="number"&&typeof h=="number"&&p<=h?t.push(`dataRamps.${s}.lightnessStart must be greater than lightnessEnd.`):typeof p=="number"&&Number.isFinite(p)&&typeof h=="number"&&Number.isFinite(h)&&typeof u=="number"&&Number.isInteger(u)&&u>=$e&&u<=be&&(p-h)/(u-1)<=Fe&&t.push(`dataRamps.${s} lightness bounds must leave more than ${Fe} lightness between serialized stops.`);continue}if(a.type==="diverging"){typeof u=="number"&&Number.isInteger(u)&&u%2===0&&t.push(`dataRamps.${s}.steps must be odd so the neutral is the exact midpoint.`);for(const p of["start","end"])typeof a[p]!="string"?t.push(`dataRamps.${s}.${p} must be a CSS color or anchor reference string.`):_(a[p],`dataRamps.${s}.${p}`);"neutral"in a&&(typeof a.neutral!="string"?t.push(`dataRamps.${s}.neutral must be a CSS color or anchor reference string.`):_(a.neutral,`dataRamps.${s}.neutral`));continue}t.push(`dataRamps.${s}.type must be "sequential" or "diverging".`)}if("dataPalette"in e&&t.length===0){const s=pe(Ce,e),i={};let a=!0;for(const u of fe){const p=xt(s.dataPalette[u],s.anchors);if(!p){a=!1;break}i[u]=p}if(a)for(const u of bt(i))o.push(`dataPalette.${u.series[0]} and dataPalette.${u.series[1]} are only ${u.distance.toFixed(4)} apart under ${u.simulation} simulation (minimum ${u.threshold.toFixed(4)}); also distinguish the series with labels, shapes, or patterns.`)}function K(s,i){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${i} must be an object.`);return}const a=s;for(const[u,p]of Object.entries(a)){const h=`${i}.${u}`;if(!se.includes(u)){t.push(`${h} is not a role; expected one of: ${se.join(", ")}. (The status family is reserved and is not a role.)`);continue}const l=u,g=Se[l];if(typeof p=="string"){M(p,h);continue}if(typeof p!="object"||p===null||Array.isArray(p)){t.push(`${h} must be a color source or a { color, \u2026slots } object.`);continue}const $=p;typeof $.color!="string"&&t.push(`${h} must declare its base "color".`);for(const[b,C]of Object.entries($)){if(!Object.prototype.hasOwnProperty.call(g,b)||!A(b)){const O=Object.keys(g).filter(S=>S!=="color");t.push(`${h}.${b} is not a slot of the ${l} role. Declared slots: ${O.length>0?O.join(", "):"(none)"}.`);continue}typeof C!="string"?t.push(`${h}.${b} must be a color source string.`):M(C,`${h}.${b}`)}}}if("roles"in e&&K(e.roles,"roles"),"contexts"in e)if(typeof e.contexts!="object"||e.contexts===null||Array.isArray(e.contexts))t.push("contexts must be an object.");else for(const[s,i]of Object.entries(e.contexts)){if(!A(s)||!j.test(s)){t.push(`contexts.${s} must be a lowercase slug matching ${j.source}.`);continue}if(typeof i!="object"||i===null||Array.isArray(i)){K(i,`contexts.${s}`);continue}const a=i,u=Object.fromEntries(Object.entries(a).filter(([h])=>h!=="lightness"&&h!=="tones"&&h!=="semanticMappings"));K(u,`contexts.${s}`),"lightness"in a&&m(a.lightness,`contexts.${s}.lightness`);const p=new Set(R);if("tones"in a)for(const h of d(a.tones,`contexts.${s}.tones`))p.add(h);"semanticMappings"in a&&N(a.semanticMappings,`contexts.${s}.semanticMappings`,p)}function N(s,i,a){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${i} must be an object.`);return}const u=s;for(const p of Object.keys(u))Q.includes(p)||t.push(`${i}.${p} is not a semantic token; expected one of: ${Q.join(", ")}.`);for(const p of Q)if(p in u){const h=u[p];if(typeof h!="object"||h===null){t.push(`${i}.${p} must be { source, lightness }.`);continue}const l=h;if(typeof l.source!="string"?t.push(`${i}.${p}.source must be a string.`):M(l.source,`${i}.${p}.source`),typeof l.lightness!="string")t.push(`${i}.${p}.lightness must be one of: ${U.join(", ")}, or a declared tone:<name>.`);else if(!te(l.lightness)){const g=Ae(l.lightness);if(g===null)t.push(`${i}.${p}.lightness must be one of: ${U.join(", ")}, or a declared tone:<name>.`);else if(!a.has(g)){const $=[...a].sort();t.push(`${i}.${p}.lightness references undeclared tone "${g}". Declared tones: ${$.length>0?$.join(", "):"(none)"}.`)}}}}"semanticMappings"in e&&N(e.semanticMappings,"semanticMappings",R);for(const s of["pageBackgroundImage","boxBackgroundImage","vellumBackgroundImage"])s in e&&typeof e[s]!="string"&&t.push(`${s} must be a string.`);for(const s of["pageBackgroundImageOpacity","boxBackgroundImageOpacity","vellumOpacity","vellumBackgroundImageOpacity"])if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const i=e[s];(i<0||i>1)&&t.push(`${s} must be 0\u20131 (got ${i}).`)}return o.push(...Gt(e,n)),{valid:t.length===0,errors:t,warnings:o}}const E=.045;function Gt(e,n){try{return Vt(e,n)}catch{return[]}}function Vt(e,n){const t=pe(n,e),o=rt(t),r=[...o],c=new Set(o);for(const f of Object.keys(t.contexts)){const m=nt(t,f);if(m)for(const d of rt(m))c.has(d)||r.push(`contexts.${f}: ${d}`)}return r}function Jt(e){const n=mt(he(e)),t=ht(n);return pt({r:de(t.r),g:de(t.g),b:de(t.b)})}function X(e,n){return Math.hypot(e.L-n.L,e.a-n.a,e.b-n.b)}function Y(e){return Jt(W(ce(he(e))))}function ot(e){return(Math.floor(e*1e4)/1e4).toFixed(4)}const Z=2,st=1e-4;function rt(e){const n=W(e.seedColor);if(!n)return[];const t=ge(n,e),o=e.semanticMappings.actionBackground,r=e.chroma.actionBackground,c=Me(e.lightness,e.tones,o.lightness),f=(l,g,$,b)=>he(ae(l,g,$,b)),m=ee.map(l=>({name:l,base:t[l]})),d=[];if(ee.includes(o.source))d.push(`actionBackground is sourced from the "${o.source}" status family: ordinary and ${o.source}-intent action surfaces render identically (their labels may still differ). Remap the action to a non-status source \u2014 retuning "${o.source}" via intents moves both colors together.`);else{const l=ue(o.source,t,e.anchors);l&&m.push({name:"action",base:l})}const R=De(m.map(({name:l,base:g})=>[l,ce(f(g,c,r.min,r.max))]),E,["normal"]);if(R.length===0)return d;const k=new Map,y=(l,g)=>{const $=`${l}:${g}`;let b=k.get($);if(!b){b=[];for(let C=0;C<360;C+=Z)b.push(Y({l,c:g,h:C}));k.set($,b)}return b},M=E-.002,_=(l,g,$,b)=>{const C=Math.hypot(l.a,l.b),O=Math.atan2(l.b,l.a)*180/Math.PI+180;let S=0;for(const x of $===b?[b]:[$,b]){if(x+C<E-1e-4)continue;let T=O,B=X(Y({l:g,c:x,h:O}),l);if(B>=E)return B;const D=y(g,x);for(let w=0;w<D.length;w+=1){const v=X(D[w],l);if(v>=E)return v;v>B&&(B=v,T=w*Z)}let P=T;for(let w=T-Z;w<=T+Z;w+=.1){const v=X(Y({l:g,c:x,h:w}),l);if(v>=E)return v;v>B&&(B=v,P=w)}if(B>=M)for(let w=P-.1;w<=P+.1;w+=.001){const v=X(Y({l:g,c:x,h:w}),l);if(v>=E)return v;v>B&&(B=v)}B>S&&(S=B)}return S},K=(l,g,$)=>{const b=g===$?[$]:[g,$];let C=0;for(const O of b)for(const S of b){if(O+S<E-1e-4)continue;const x=y(l,O),T=y(l,S);let B=0,D=0,P=-1;for(let I=0;I<x.length;I+=1)for(let z=0;z<T.length;z+=1){const G=X(x[I],T[z]);if(G>=E)return G;G>P&&(P=G,B=I*Z,D=z*Z)}const w=(I,z,G,_e)=>{const Le=[];for(let V=z-G;V<=z+G;V+=_e)Le.push({h:V,lab:Y({l,c:S,h:V})});let me=-1,Ie=I,He=z;for(let V=I-G;V<=I+G;V+=_e){const ct=Y({l,c:O,h:V});for(const Ne of Le){const Pe=X(ct,Ne.lab);Pe>me&&(me=Pe,Ie=V,He=Ne.h)}}return{distance:me,hueA:Ie,hueB:He}},v=w(B,D,Z,.1);if(v.distance>=E)return v.distance;let L=Math.max(P,v.distance);if(L>=M){const I=w(v.hueA,v.hueB,.1,.001);if(I.distance>L&&(L=I.distance),L>=E)return L}L>C&&(C=L)}return C},N=l=>ee.includes(l),s=(l,g,$,b,C)=>{const O=Y(f(l.base,$,b,C)),S=Y(f(g.base,$,b,C));if(X(O,S)>=E)return{outcome:"direct"};const x=N(l.name)&&N(g.name),T=[l,g].filter(P=>N(P.name)),B=x?"one of them":`"${N(l.name)?l.name:g.name}"`;let D;for(const P of T){const w=_(P===l?S:O,$,b,C);if(w>=E)return{outcome:"retune",target:B};w>=E-st&&(D=D??B)}if(x){const P=K($,b,C);if(P>=E)return{outcome:"retune",target:"both"};P>=E-st&&(D=D??"both")}return D!==void 0?{outcome:"near",target:D}:{outcome:"no"}},i=l=>l.outcome==="direct"?4:l.outcome==="retune"?l.target==="both"?2:3:l.outcome==="near"?1:0,a=l=>[...l].sort().join("|"),u=new Set(De(m.map(({name:l,base:g})=>[l,ce(f(g,c,0,J))]),E,["normal"]).map(l=>a(l.pair))),p=new Map(m.map(l=>[l.name,l])),h=new Map;for(const{pair:l,distance:g}of R){const $=p.get(l[0]),b=p.get(l[1]),C=N($.name)&&N(b.name),O=s($,b,c,r.min,r.max);if(O.outcome==="direct"||O.outcome==="retune"){const L=O.target??(C?"one of them":`"${N($.name)?$.name:b.name}"`);u.has(a(l))?d.push(`Status colors "${l[0]}" and "${l[1]}" are hard to distinguish under normal vision (distance ${ot(g)} < ${E}); status meanings must stay distinguishable \u2014 retune ${L} via intents.`):d.push(`Status colors "${l[0]}" and "${l[1]}" are hard to distinguish as rendered (distance ${ot(g)} < ${E}); the actionBackground chroma band ({ min: ${r.min}, max: ${r.max} }) pushes them together \u2014 widen the band, or retune ${L} via intents.`);continue}const S=s($,b,c,0,J);let x={outcome:"no"};for(let L=1;L<=19&&x.outcome!=="direct";L+=1){const I=L*.05;if(Math.abs(I-c)<.001)continue;const z=s($,b,I,r.min,r.max);i(z)>i(x)&&(x=z)}let T={outcome:"no"};const B=S.outcome==="direct"||S.outcome==="retune",D=x.outcome==="direct"||x.outcome==="retune";if(!B&&!D)for(let L=1;L<=19&&T.outcome!=="direct";L+=1){const I=s($,b,L*.05,0,J);i(I)>i(T)&&(T=I)}const P=Yt(S,x,T),w=`${O.outcome}|${P}`;let v=h.get(w);v||(v=[],h.set(w,v)),v.push(l)}for(const[l,g]of h){const $=l.indexOf("|"),b=l.slice(0,$),C=l.slice($+1),O=g.map(([T,B])=>`"${T}"/"${B}"`),S=O.length>1?`${O.slice(0,-1).join(", ")} and ${O[O.length-1]}`:O[0],x=b==="near"?`Status colors ${S} may not separate by retuning as rendered: at the action stop's lightness (${c}) with the actionBackground chroma band ({ min: ${r.min}, max: ${r.max} }), the closest reachable retune found comes within the audit's search margin of the ${E} threshold`:`Status colors ${S} cannot be separated as rendered: at the action stop's lightness (${c}) with the actionBackground chroma band ({ min: ${r.min}, max: ${r.max} }), no intent retuning can pull ${g.length>1?"these pairs":"the pair"} ${E} apart`;d.push(x+C)}return d}function Yt(e,n,t){if(e.outcome==="direct"&&n.outcome==="direct")return" \u2014 widen the chroma band or move the action lightness stop.";if(e.outcome==="direct")return n.outcome==="no"?"; no other action lightness stop can help while the band holds \u2014 widen the chroma band.":" \u2014 widen the chroma band.";if(n.outcome==="direct")return e.outcome==="no"?"; no wider chroma band can help at this lightness \u2014 move the action lightness stop.":" \u2014 move the action lightness stop.";if(e.outcome==="retune"&&n.outcome==="retune")return` \u2014 widen the chroma band or move the action lightness stop, then retune ${e.target} via intents.`;if(e.outcome==="retune")return n.outcome==="no"?`; no other action lightness stop can help while the band holds \u2014 widen the chroma band, then retune ${e.target} via intents.`:` \u2014 widen the chroma band, then retune ${e.target} via intents.`;if(n.outcome==="retune")return e.outcome==="no"?`; no wider chroma band can help at this lightness \u2014 move the action lightness stop, then retune ${n.target} via intents.`:` \u2014 move the action lightness stop, then retune ${n.target} via intents.`;const o=e.outcome==="no"&&n.outcome==="no"?"; neither a wider chroma band alone nor another stop alone can help":"; neither a wider chroma band alone nor another stop alone provably helps";return t.outcome==="direct"?`${o} \u2014 change the band and the stop together.`:t.outcome==="retune"?`${o} \u2014 change the band and the stop together, then retune ${t.target} via intents.`:"; no explored band or stop change provably separates this pair."}function sn(e,n){const t=Be(e),o=Be(n),r=t.error!==void 0?{valid:!1,errors:[t.error],warnings:[]}:Ee(t.value),c=o.error!==void 0?{valid:!1,errors:[o.error],warnings:[]}:Ee(o.value,Ve),f=[...r.errors.map(d=>`light: ${d}`),...c.errors.map(d=>`dark: ${d}`)],m=[...r.warnings.map(d=>`light: ${d}`),...c.warnings.map(d=>`dark: ${d}`)];if(r.valid&&c.valid){const d=new Set(Object.keys(t.value?.contexts??{})),R=new Set(Object.keys(o.value?.contexts??{})),k=[...R].filter(M=>!d.has(M)).sort(),y=[...d].filter(M=>!R.has(M)).sort();(k.length>0||y.length>0)&&f.push(`contexts must declare the same names in both schemes. Missing from light: ${k.join(", ")||"(none)"}. Missing from dark: ${y.join(", ")||"(none)"}.`)}return{valid:f.length===0,errors:f,warnings:m}}const qt=["anchors","angles","contexts","dataPalette","dataRamps","intents","roles","chroma","lightness","tones","semanticHues","semanticMappings","variantChroma"];function Xt(e,n){const t={};for(const[o,r]of Object.entries(e))A(o)&&(t[o]=r);for(const[o,r]of Object.entries(n))r!==void 0&&A(o)&&(t[o]=r);for(const o of qt){const r=e[o],c=n[o];if(r&&typeof r=="object"&&!Array.isArray(r)&&c&&typeof c=="object"&&!Array.isArray(c)){if(o==="anchors"){t[o]=Ye(r,c);continue}if(o==="contexts"){t[o]=Ft(r,c);continue}if(o==="dataRamps"){t[o]=Ze(r,c);continue}const f={};for(const[m,d]of Object.entries(r))A(m)&&(f[m]=d);for(const[m,d]of Object.entries(c))d!==void 0&&A(m)&&(f[m]=d);t[o]=f}}return t}function rn(...e){let n={};for(const t of e){if(!t)continue;const o=Lt(t);o&&(n=Xt(n,o))}return Te(n)}function it(e){return e.replace(/\\/g,"\\\\").replace(/"/g,'\\"').replace(/\n/g,"\\n").replace(/\r/g,"\\r")}const at={borderRadius:.1,fontBody:'"Noto Sans", sans-serif',fontWeightBody:"normal",fontHeadings:'"Inika", serif',fontWeightHeadings:"normal",fontBrand:'"Inika", serif',fontWeightBrand:"normal",fontMonospace:'"JetBrains Mono", monospace',fontWeightMonospace:"normal",seedColor:"oklch(.07 0.15 216)"};function an(e){return Te({...at,pageBackgroundImage:`url("${it(e)}")`,pageBackgroundImageOpacity:.5})}function cn(e){return Te({...at,pageBackgroundImage:`url("${it(e)}")`,pageBackgroundImageOpacity:.55})}export{j as ANCHOR_SLUG_PATTERN,ke as COLOR_SOURCES,Et as DEFAULT_DARK_LIGHTNESS,Ve as DEFAULT_DARK_THEME,Bt as DEFAULT_LIGHT_LIGHTNESS,Ce as DEFAULT_LIGHT_THEME,Oe as DEFAULT_SEMANTIC_MAPPINGS,U as LIGHTNESS_KEYS,qt as NESTED_THEME_KEYS,se as ROLE_NAMES,At as ROLE_PAIRED_INK,Se as ROLE_TOKEN_PLAN,Q as SEMANTIC_COLOR_NAMES,ee as STATUS_COLOR_SOURCES,Ue as TOKEN_PAIRINGS,wt as VARIANT_COLOR_SOURCES,cn as buildTaprootDarkTheme,an as buildTaprootLightTheme,Ke as compileRoles,Te as encodeTheme,zt as explicitMappingTokens,te as isLightnessKey,rn as layerThemes,Xt as mergePartials,pe as mergeTheme,xe as parseAnchorSource,Lt as parseTheme,We as resolveAnchorColor,nt as resolveContextTheme,xt as resolveDataColorSource,Me as resolveLightnessReference,nn as semanticToCSS,Ae as toneReferenceName,on as validateTheme,sn as validateThemePair};
|
|
1
|
+
import{UNSAFE_KEYS as lt,isSafeKey as M}from"./unsafe-keys.js";import{ACCEPTED_COLOR_FORMS as oe,apcaContrast as pt,clampChannel as ge,deltaEOK as dt,deriveSemantic as ae,gamutMapToSRGB as he,linearRgbToOklab as mt,oklchToSRGB as gt,parseCssColor as W,parseOklch as ht,serializeOklch as ce,srgbToLinearRGB as yt}from"./color-engine.js";import{computeVariants as ye,parseAnchorSource as bt,resolveAnchorColor as $t,resolveMappingSource as ue}from"./variant-engine.js";import{auditColorDistances as Fe,auditDataPalette as xt,DATA_SERIES_KEYS as fe,DEFAULT_DATA_PALETTE as be,DEFAULT_DATA_RAMP_STEPS as kt,MAX_DATA_RAMP_STEPS as $e,MIN_DATA_RAMP_LIGHTNESS_STEP as We,MIN_DATA_RAMP_STEPS as xe}from"./data-colors.js";const j=/^[a-z][a-z0-9-]*$/;function ke(e){return bt(e)}function je(e,n){return $t(e,n)}function St(e,n){const t=ke(e);if(t){const o=je(n,t);return o&&W(o)?o:null}return W(e)?e:null}const se=["canvas","ink","accent","action","structure"],Se={canvas:{color:[["background","surface"],["layer1","raised1"],["layer2","raised2"],["layer3","raised3"],["layer4","raised4"]]},ink:{color:[["text","text"],["typeOverline","text"],["typeLabel","text"],["typeLead","text"],["typeCaption","text"],["inputSelection","text"]],heading:[["headings","muted"],["headingsHover","ink"]]},accent:{color:[["linkHoverBg","raised2"],["inputSelectionBg","raised2"],["inputCaret","ink"]],text:[["link","accent"]],hover:[["linkHover","text"]]},action:{color:[["actionBackground","muted"]],ink:[["actionText","surface"]]},structure:{color:[["border","border"],["shadow","shadow"]]}},At=new Set(["action.color"]),Mt={canvas:"background",ink:"text",accent:"link",action:"actionBackground",structure:"border"},Ot={"action.ink":{role:"canvas",slot:"color"}},Tt=.45,Ct=.045;function ze(e,n,t){const o=Ue.actionText,i=[...K].sort((y,T)=>e[y]-e[T]||K.indexOf(y)-K.indexOf(T)),a=n?i.filter(y=>n(y)>=o.targetLc):i,u=t?a.filter(y=>t(y)>=Ct):a,d=u.length>0?u:a,m=d.length>0?d:i;let A,k=1/0;for(const y of m){const T=Math.abs(e[y]-Tt);T<k&&(k=T,A=y)}return A??"muted"}function Rt(e,n,t){const o=Oe(n,t,e)>.5;let i=K[0];for(const a of K)(o?n[a]<n[i]:n[a]>n[i])&&(i=a);return i}const vt={"accent.hover":"text"};function wt(e,n){const t=new Map;try{const o=de(n,e),i=(a,u,d,m)=>{const A=ke(u),k=A?je(m,A):null,y=k===null?null:W(k),T=t.get(a)??[];T.some(_=>_.source===u&&_.chroma===y?.c)||(T.push({source:u,where:d,chroma:y?.c}),t.set(a,T))};for(const[a,u]of Object.entries(o.semanticMappings))u.source.startsWith("anchor:")&&i(a,u.source,"the root table",o.anchors);for(const a of Object.keys(o.contexts)){const u=st(o,a);if(u)for(const[d,m]of Object.entries(u.semanticMappings))m.source.startsWith("anchor:")&&i(d,m.source,`contexts.${a}`,u.anchors)}}catch{return new Map}return t}function X(e,n){if(e===void 0)return;if(typeof e=="string")return n==="color"?e:void 0;const t=e[n];return typeof t=="string"?t:void 0}function Ke(e,n,t,o={}){const i={},a={};for(const[u,d]of Object.entries(o.explicitMappings??{}))d!==void 0&&(a[u]=d.lightness);for(const u of se){const d=e[u];if(d!==void 0)for(const[m,A]of Object.entries(Se[u])){const k=Ot[`${u}.${m}`];let y=X(d,m),T=!1;if(y===void 0){k&&(y=X(e[k.role],k.slot),y??=t[Mt[k.role]]?.source,T=y!==void 0);const _=vt[`${u}.${m}`];_!==void 0&&(y??=X(d,_)),y??=X(d,"color")}if(y!==void 0)for(const[_,z]of A){let N=z;if(At.has(`${u}.${m}`))N=ze(n,o.actionSurfaceContrast?s=>o.actionSurfaceContrast(y,s):void 0,o.actionSurfaceSeparation?s=>o.actionSurfaceSeparation(y,s):void 0);else if(T&&k){const s=Ue[_],r=(s&&a[s.bg])??ze(n,o.actionSurfaceContrast?c=>o.actionSurfaceContrast(X(d,"color"),c):void 0,o.actionSurfaceSeparation?c=>o.actionSurfaceSeparation(X(d,"color"),c):void 0);N=Rt(r,n,o.tones??{})}i[_]={source:y,lightness:N}}}}return i}const Ue={text:{bg:"background",targetLc:75},typeOverline:{bg:"background",targetLc:90},typeLabel:{bg:"background",targetLc:75},typeLead:{bg:"background",targetLc:75},typeCaption:{bg:"background",targetLc:90},dangerText:{bg:"background",targetLc:75},headings:{bg:"background",targetLc:60},headingsHover:{bg:"background",targetLc:60},link:{bg:"background",targetLc:75},linkHover:{bg:"linkHoverBg",targetLc:75},actionText:{bg:"actionBackground",targetLc:75},inputCaret:{bg:"layer2",targetLc:60},inputSelection:{bg:"inputSelectionBg",targetLc:60}},G=["background","layer1","layer2","layer3","layer4","actionBackground","actionText","border","shadow","text","typeOverline","typeLabel","typeLead","typeCaption","dangerText","headings","headingsHover","link","linkHover","linkHoverBg","inputCaret","inputSelection","inputSelectionBg"],Et=["typeOverline","typeLabel","typeLead","typeCaption"],Ae=["primary","analogous-left","analogous-right","complementary","split-complementary-left","split-complementary-right","triadic-left","triadic-right","danger","success","warning","info"],ee=["danger","success","warning","info"],Bt=["analogous-left","analogous-right","complementary","split-complementary-left","split-complementary-right","triadic-left","triadic-right","danger","success","warning","info"],K=["surface","raised1","raised2","raised3","raised4","accent","muted","text","border","ink","shadow"],Ge="tone:";function Me(e){if(typeof e!="string"||!e.startsWith(Ge))return null;const n=e.slice(Ge.length);return M(n)&&j.test(n)?n:null}function te(e){return typeof e!="string"?!1:K.includes(e)}function Oe(e,n,t){if(te(t))return e[t];const o=Me(t);return o===null?e.surface:n?.[o]??e.surface}const _t={surface:.99,raised1:.97,raised2:.9,raised3:.8,raised4:.72,accent:.5,muted:.45,text:.35,border:.3,ink:.25,shadow:.2},Lt={surface:.15,raised1:.2,raised2:.3,raised3:.4,raised4:.36,accent:.6,muted:.75,text:.85,border:.7,ink:.95,shadow:.6},Te={background:{source:"primary",lightness:"surface"},layer1:{source:"primary",lightness:"raised1"},layer2:{source:"primary",lightness:"raised2"},layer3:{source:"primary",lightness:"raised3"},layer4:{source:"primary",lightness:"raised4"},actionBackground:{source:"primary",lightness:"raised3"},actionText:{source:"primary",lightness:"ink"},border:{source:"primary",lightness:"border"},shadow:{source:"primary",lightness:"shadow"},text:{source:"primary",lightness:"text"},typeOverline:{source:"primary",lightness:"text"},typeLabel:{source:"primary",lightness:"text"},typeLead:{source:"primary",lightness:"text"},typeCaption:{source:"primary",lightness:"text"},dangerText:{source:"danger",lightness:"text"},headings:{source:"primary",lightness:"muted"},headingsHover:{source:"primary",lightness:"text"},link:{source:"complementary",lightness:"accent"},linkHover:{source:"complementary",lightness:"text"},linkHoverBg:{source:"triadic-left",lightness:"raised2"},inputCaret:{source:"triadic-right",lightness:"ink"},inputSelection:{source:"complementary",lightness:"text"},inputSelectionBg:{source:"triadic-left",lightness:"raised2"}},Y=.4;function Ce(){const e={};for(const n of G)e[n]={min:0,max:Y};return e}const Ve={seedColor:"oklch(0.7 0.125 216)",fontBody:"",fontHeadings:"",fontBrand:"",fontMonospace:"",fontWeightBody:"normal",fontWeightHeadings:"bold",fontWeightBrand:"bold",fontWeightMonospace:"normal",stylesheets:[],rootFontSize:16,typeRatio:1.25,spaceRatio:1.618,borderRadius:.2,viewportMin:320,viewportMax:1200,angles:{analogous:30,complementary:180,splitComplementary:30,triadic:120},semanticHues:{danger:27,success:150,warning:90,info:244},variantChroma:{},intents:{},tones:{},chroma:Ce(),semanticMappings:{...Te},explicitMappingTokens:[],anchors:{},roles:{},contexts:{},dataPalette:{...be},dataRamps:{}},Re={...Ve,chroma:Ce(),semanticMappings:{...Te},anchors:{},roles:{},contexts:{},tones:{},dataPalette:{...be},dataRamps:{},lightness:{..._t}},Je={...Ve,chroma:Ce(),semanticMappings:{...Te},anchors:{},roles:{},contexts:{},tones:{},dataPalette:{...be},dataRamps:{},lightness:{...Lt}},le=new WeakMap;le.set(Re,new Set),le.set(Je,new Set);function It(e,n){return lt.has(e)?void 0:n}function pe(e){const n=e.explicitMappingTokens;if(!Array.isArray(n)||n.some(o=>typeof o!="string"||!G.includes(o)))return;const t=new Set(n);if(t.size===n.length&&!(t.size>0&&(!L(e.semanticMappings)||[...t].some(o=>!Object.prototype.hasOwnProperty.call(e.semanticMappings,o)))))return t}function Ye(e){return G.filter(n=>e.has(n))}function sn(e){return`--esp-color-${e.replace(/([A-Z])/g,"-$1").replace(/(\d)/g,"-$1").toLowerCase()}`}function Ht(e){try{const n=qe(e),t=JSON.parse(n,It);return typeof t!="object"||t===null||Array.isArray(t)?null:t}catch{return null}}const ve="\xEF\xBB\xBF";function Nt(e){if(/^[\u0000-\u007f]*$/.test(e))return btoa(e);const n=new TextEncoder().encode(e);let t=ve;for(const o of n)t+=String.fromCharCode(o);return btoa(t)}function qe(e){const n=atob(e);if(!n.startsWith(ve))return n;const t=Uint8Array.from(n.slice(ve.length),o=>o.charCodeAt(0));return new TextDecoder("utf-8",{fatal:!0}).decode(t)}function we(e){return Nt(JSON.stringify(e))}function Pt(e){const n={};for(const t of ee){const o=e[t];typeof o=="string"&&(n[t]=o.startsWith("anchor:")?o:re(o))}return n}function re(e){if(ht(e))return e;const n=W(e);return n?ce(n):e}function Xe(e,n){const t={};for(const[o,i]of Object.entries(e))M(o)&&(t[o]=i);if(!n)return t;for(const[o,i]of Object.entries(n)){if(i===void 0||!M(o))continue;const a=t[o];if(a!==void 0&&typeof i=="object"&&i!==null){const u={};if(typeof a=="string")u.color=a;else for(const[d,m]of Object.entries(a))M(d)&&(u[d]=m);for(const[d,m]of Object.entries(i))m!==void 0&&M(d)&&(u[d]=m);t[o]=u;continue}t[o]=i}return t}function Ee(e){const n={};if(!L(e))return n;for(const[t,o]of Object.entries(e))M(t)&&j.test(t)&&!te(t)&&typeof o=="number"&&Number.isFinite(o)&&o>=0&&o<=1&&(n[t]=o);return n}function Dt(e,n){return{...Ee(e),...Ee(n)}}function Ft(e,n){const t={...e};if(!L(n))return t;for(const o of K){const i=n[o];typeof i=="number"&&Number.isFinite(i)&&i>=0&&i<=1&&(t[o]=i)}return t}function Ze(e){if(typeof e!="object"||e===null||Array.isArray(e))return null;const n=e,t={};for(const o of se){const i=n[o];i!==void 0&&(t[o]=i)}if(typeof n.lightness=="object"&&n.lightness!==null&&!Array.isArray(n.lightness)){const o={};for(const i of K){const a=n.lightness[i];a!==void 0&&(o[i]=a)}t.lightness=o}if(n.tones!==void 0){const o=Ee(n.tones);Object.keys(o).length>0&&(t.tones=o)}if(typeof n.semanticMappings=="object"&&n.semanticMappings!==null&&!Array.isArray(n.semanticMappings)){const o={};for(const[i,a]of Object.entries(n.semanticMappings)){if(!M(i)||!G.includes(i)||typeof a!="object"||a===null||Array.isArray(a))continue;const{source:u,lightness:d}=a;typeof u=="string"&&(typeof d!="string"||!te(d)&&Me(d)===null||(o[i]={source:u,lightness:d}))}Object.keys(o).length>0&&(t.semanticMappings=o)}return t}function Wt(e,n){const t={};for(const[o,i]of Object.entries(e)){if(!M(o)||!j.test(o))continue;const a=Ze(i);a&&(t[o]=a)}if(!n)return t;for(const[o,i]of Object.entries(n)){if(!M(o)||!j.test(o)||i===void 0)continue;const a=Ze(i);if(!a)continue;const u=t[o];t[o]={...u??{},...a,...u?.lightness||a.lightness?{lightness:{...u?.lightness,...a.lightness}}:{},...u?.tones||a.tones?{tones:{...u?.tones,...a.tones}}:{},...u?.semanticMappings||a.semanticMappings?{semanticMappings:{...u?.semanticMappings,...a.semanticMappings}}:{}}}return t}function L(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)}function F(e){const n={};for(const[t,o]of Object.entries(e))o!==void 0&&M(t)&&(n[t]=o);return n}function Qe(e){if(!L(e))return e;const n=F(e);return L(e.lightness)&&(n.lightness=F(e.lightness)),L(e.tones)&&(n.tones=F(e.tones)),n}function jt(e,n){const t={};for(const[o,i]of Object.entries(e))M(o)&&(t[o]=Qe(i));if(!n)return t;for(const[o,i]of Object.entries(n)){if(!M(o)||i===void 0)continue;const a=t[o];if(!L(a)||!L(i)){t[o]=Qe(i);continue}const u={...F(a),...F(i)};L(a.lightness)&&L(i.lightness)?u.lightness={...F(a.lightness),...F(i.lightness)}:L(i.lightness)&&(u.lightness=F(i.lightness)),L(a.tones)&&L(i.tones)?u.tones={...F(a.tones),...F(i.tones)}:L(i.tones)&&(u.tones=F(i.tones)),L(a.semanticMappings)&&L(i.semanticMappings)?u.semanticMappings={...F(a.semanticMappings),...F(i.semanticMappings)}:L(i.semanticMappings)&&(u.semanticMappings=F(i.semanticMappings)),t[o]=u}return t}function zt(e){const n={};for(const[t,o]of Object.entries(e)){if(!M(t))continue;if(typeof o=="string"){n[t]=re(o);continue}const i={};for(const[a,u]of Object.entries(o))M(a)&&(i[a]=typeof u=="string"?re(u):u);n[t]=i}return n}function ie(e){return typeof e!="string"?"":e.startsWith("anchor:")?e:re(e)}function Kt(e){const n={};for(const t of fe)n[t]=ie(e[t]);return n}function et(e,n){const t={};for(const[o,i]of Object.entries(e))M(o)&&j.test(o)&&i&&typeof i=="object"&&!Array.isArray(i)&&(t[o]={...i});if(!n)return t;for(const[o,i]of Object.entries(n)){if(!M(o)||!j.test(o)||!i||typeof i!="object"||Array.isArray(i))continue;const a=t[o],u=a!==void 0&&i.type!==void 0&&i.type!==a.type;t[o]={...u?{}:a??{},...i}}return t}function Ut(e){const n={};for(const[t,o]of Object.entries(e))if(M(t)){if(o.type==="sequential"&&typeof o.source=="string"){n[t]={...o,source:ie(o.source)};continue}if(o.type==="diverging"&&typeof o.start=="string"&&typeof o.end=="string"){n[t]={...o,start:ie(o.start),end:ie(o.end),...typeof o.neutral=="string"?{neutral:ie(o.neutral)}:{}};continue}n[t]={...o}}return n}function tt(e){const n=W(e.seedColor);if(!n)return;const t=ye(n,e);return(o,i)=>{const a=ue(o,t,e.anchors)??t.primary,u=e.chroma.actionBackground,d=ae(a,e.lightness[i],u.min,u.max),m={l:d.l>.5?0:1,c:0,h:0};return Math.abs(pt(m,d))}}function Gt(e,n,t){if(n?.background)return n.background;const o=X(e.canvas,"color");if(o!==void 0){const i=Se.canvas.color?.find(([a])=>a==="background");if(i)return{source:o,lightness:i[1]}}return t.background}function nt(e,n){const t=W(e.seedColor);if(!t||!n)return;const o=ye(t,e),i=ue(n.source,o,e.anchors)??o.primary,a=e.chroma.background,u=ae(i,Oe(e.lightness,e.tones,n.lightness),a.min,a.max);return(d,m)=>{const A=ue(d,o,e.anchors)??o.primary,k=e.chroma.actionBackground,y=ae(A,e.lightness[m],k.min,k.max);return dt(y,u)}}function Vt(e){const n=le.get(e);if(n)return new Set(n);const t=pe(e);if(t)return t;const o=new Set,i=Ke(e.roles,e.lightness,e.semanticMappings,{tones:e.tones,actionSurfaceContrast:tt(e),actionSurfaceSeparation:nt(e,e.semanticMappings.background)});for(const[a,u]of Object.entries(i)){const d=e.semanticMappings[a];(d.source!==u.source||d.lightness!==u.lightness)&&o.add(a)}return o}function de(e,n){const t={...e.roles,...n.roles},o=Wt(e.contexts,n.contexts),i=Ft(e.lightness,n.lightness),a=Dt(e.tones,n.tones),u=zt(Xe(e.anchors,n.anchors)),d=typeof n.seedColor=="string"?re(n.seedColor):e.seedColor,m=n.semanticMappings,A={...e.angles,...n.angles},k={...e.semanticHues,...n.semanticHues},y={...e.variantChroma,...n.variantChroma},T=Pt({...e.intents,...n.intents}),_=n.chroma,z=ne(e.chroma,_),N=Kt(ne(e.dataPalette,n.dataPalette)),s=Ut(et(e.dataRamps,n.dataRamps)),r=Vt(e),c=new Set(r),f=pe(n),p={};for(const x of r)p[x]=e.semanticMappings[x];for(const[x,O]of Object.entries(m??{}))O!==void 0&&(f===void 0||f.has(x)?(c.add(x),p[x]=O):(c.delete(x),delete p[x]));const g=ne(e.semanticMappings,m),l={angles:A,anchors:u,chroma:z,intents:T,lightness:i,tones:a,seedColor:d,semanticHues:k,variantChroma:y},h=tt(l),$=nt(l,Gt(t,p,g)),b=Ke(t,i,g,{explicitMappings:p,tones:a,actionSurfaceContrast:h,actionSurfaceSeparation:$}),R={};for(const[x,O]of Object.entries(b))c.has(x)||(R[x]=O);const C={};for(const x of Et)!c.has(x)&&R[x]===void 0&&(C[x]={source:g.text.source,lightness:g.text.lightness},_?.text!==void 0&&_[x]===void 0&&(z[x]={...z.text}));const E=ne(ne(ne(e.semanticMappings,C),R),m),S={...e,seedColor:d,fontBody:n.fontBody??e.fontBody,fontHeadings:n.fontHeadings??e.fontHeadings,fontBrand:n.fontBrand??e.fontBrand,fontMonospace:n.fontMonospace??e.fontMonospace,fontWeightBody:String(n.fontWeightBody??e.fontWeightBody),fontWeightHeadings:String(n.fontWeightHeadings??e.fontWeightHeadings),fontWeightBrand:String(n.fontWeightBrand??e.fontWeightBrand),fontWeightMonospace:String(n.fontWeightMonospace??e.fontWeightMonospace),stylesheets:n.stylesheets??[...e.stylesheets],rootFontSize:n.rootFontSize??e.rootFontSize,typeRatio:n.typeRatio??e.typeRatio,spaceRatio:n.spaceRatio??e.spaceRatio,borderRadius:n.borderRadius??e.borderRadius,viewportMin:n.viewportMin??e.viewportMin,viewportMax:n.viewportMax??e.viewportMax,angles:A,semanticHues:k,variantChroma:y,intents:T,lightness:i,tones:a,chroma:z,semanticMappings:E,explicitMappingTokens:Ye(c),anchors:u,roles:t,contexts:o,dataPalette:N,dataRamps:s};return n.pageBackgroundImage!==void 0&&(S.pageBackgroundImage=n.pageBackgroundImage),n.pageBackgroundImageOpacity!==void 0&&(S.pageBackgroundImageOpacity=n.pageBackgroundImageOpacity),n.boxBackgroundImage!==void 0&&(S.boxBackgroundImage=n.boxBackgroundImage),n.boxBackgroundImageOpacity!==void 0&&(S.boxBackgroundImageOpacity=n.boxBackgroundImageOpacity),n.vellumOpacity!==void 0&&(S.vellumOpacity=n.vellumOpacity),n.vellumBackgroundImage!==void 0&&(S.vellumBackgroundImage=n.vellumBackgroundImage),n.vellumBackgroundImageOpacity!==void 0&&(S.vellumBackgroundImageOpacity=n.vellumBackgroundImageOpacity),le.set(S,new Set(c)),S}const ot=new WeakMap;function st(e,n){const t=e.contexts&&Object.prototype.hasOwnProperty.call(e.contexts,n)?e.contexts[n]:void 0;if(!t)return null;let o=ot.get(e);const i=o?.get(n);if(i)return i;const a={};for(const d of se){const m=t[d];m!==void 0&&(a[d]=m)}const u=de(e,{lightness:t.lightness,tones:t.tones,roles:a,semanticMappings:t.semanticMappings});return o||(o=new Map,ot.set(e,o)),o.set(n,u),u}function ne(e,n){if(!n)return{...e};const t={...e};for(const o of Object.keys(n)){const i=n[o];i!==void 0&&(t[o]=i)}return t}function Be(e){let n;try{n=qe(e)}catch{return{error:"Failed to decode Base64 string."}}let t;try{t=JSON.parse(n)}catch{return{error:"Decoded string is not valid JSON."}}return typeof t!="object"||t===null||Array.isArray(t)?{error:"Theme must be a JSON object."}:{value:t}}function rn(e){const n=Be(e);return n.error!==void 0?{valid:!1,errors:[n.error],warnings:[]}:_e(n.value)}function _e(e,n=Re){const t=[],o=[];"seedColor"in e&&(typeof e.seedColor!="string"?t.push("seedColor must be a string."):W(e.seedColor)||t.push(`seedColor is not a valid CSS color: "${e.seedColor}". Accepted forms: ${oe}.`));for(const s of["fontBody","fontHeadings","fontBrand","fontMonospace"])s in e&&typeof e[s]!="string"&&t.push(`${s} must be a string.`);const i=["normal","bold","lighter","bolder"],a=["inherit","initial","unset","revert","revert-layer"];for(const s of["fontWeightBody","fontWeightHeadings","fontWeightBrand","fontWeightMonospace"])if(s in e){const r=e[s];if(typeof r=="number")(r<1||r>1e3)&&t.push(`${s} numeric value must be 1\u20131000 (got ${r}).`);else if(typeof r=="string"){const c=i.includes(r)||a.includes(r);if(/^\d+$/.test(r)){const p=Number(r);(p<1||p>1e3)&&t.push(`${s} numeric value must be 1\u20131000 (got "${r}").`)}else c||o.push(`${s} = "${r}" is not a standard font-weight value.`)}else t.push(`${s} must be a string or number.`)}"stylesheets"in e&&(Array.isArray(e.stylesheets)?e.stylesheets.some(s=>typeof s!="string")&&t.push("Every entry in stylesheets must be a string."):t.push("stylesheets must be an array of strings."));const u=[["rootFontSize",1,100],["borderRadius",0,10],["viewportMin",100,1e4],["viewportMax",200,1e4]];for(const[s,r,c]of u)if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const f=e[s];r!==void 0&&f<r&&t.push(`${s} must be \u2265 ${r} (got ${f}).`),c!==void 0&&f>c&&o.push(`${s} = ${f} is unusually high (max ${c}).`)}for(const s of["typeRatio","spaceRatio"])if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const r=e[s];r<=1&&t.push(`${s} must be > 1 (got ${r}).`);const c=s==="typeRatio"?1.3:2;r>c&&o.push(`${s} = ${r} is very high (max ${c}); scales may be extreme.`)}if("viewportMin"in e&&"viewportMax"in e){const s=e.viewportMin,r=e.viewportMax;typeof s=="number"&&typeof r=="number"&&s>=r&&t.push(`viewportMin (${s}) must be less than viewportMax (${r}).`)}if("angles"in e)if(typeof e.angles!="object"||e.angles===null)t.push("angles must be an object.");else{const s=e.angles;for(const r of["analogous","complementary","splitComplementary","triadic"])if(r in s)if(typeof s[r]!="number"||!isFinite(s[r]))t.push(`angles.${r} must be a finite number.`);else{const c=s[r];(c<0||c>360)&&o.push(`angles.${r} = ${c} is outside 0\u2013360.`)}}if("semanticHues"in e)if(typeof e.semanticHues!="object"||e.semanticHues===null)t.push("semanticHues must be an object.");else{const s=e.semanticHues;for(const r of["danger","success","warning","info"])if(r in s)if(typeof s[r]!="number"||!isFinite(s[r]))t.push(`semanticHues.${r} must be a finite number.`);else{const c=s[r];(c<0||c>360)&&o.push(`semanticHues.${r} = ${c} is outside 0\u2013360.`)}}if("variantChroma"in e)if(typeof e.variantChroma!="object"||e.variantChroma===null)t.push("variantChroma must be an object.");else{const s=e.variantChroma;for(const r of Bt)if(r in s)if(typeof s[r]!="number"||!isFinite(s[r]))t.push(`variantChroma["${r}"] must be a finite number.`);else{const c=s[r];c<0&&t.push(`variantChroma["${r}"] must be \u2265 0 (got ${c}).`),c>Y&&o.push(`variantChroma["${r}"] = ${c} exceeds ${Y}.`)}}function d(s,r){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${r} must be an object.`);return}const c=s;for(const f of Object.keys(c))(!M(f)||!te(f))&&t.push(`${r}.${f} is not a built-in lightness stop; expected one of: ${K.join(", ")}.`);for(const f of K)if(f in c)if(typeof c[f]!="number"||!isFinite(c[f]))t.push(`${r}.${f} must be a finite number.`);else{const p=c[f];(p<0||p>1)&&t.push(`${r}.${f} must be 0\u20131 (got ${p}).`)}}"lightness"in e&&d(e.lightness,"lightness");function m(s,r){const c=new Set;if(!L(s))return t.push(`${r} must be an object.`),c;for(const[f,p]of Object.entries(s)){if(!M(f)||!j.test(f)){t.push(`${r}.${f} must be a lowercase slug matching ${j.source}.`);continue}if(te(f)){t.push(`${r}.${f} conflicts with the built-in "${f}" lightness stop; choose a distinct custom tone name.`);continue}c.add(f),typeof p!="number"||!Number.isFinite(p)?t.push(`${r}.${f} must be a finite number.`):(p<0||p>1)&&t.push(`${r}.${f} must be 0\u20131 (got ${p}).`)}return c}const A=new Set(Object.keys(n.tones??{}));if("tones"in e)for(const s of m(e.tones,"tones"))A.add(s);if("chroma"in e)if(typeof e.chroma!="object"||e.chroma===null)t.push("chroma must be an object.");else{const s=e.chroma,r=wt(e,n);for(const c of G)if(c in s){const f=s[c];if(typeof f!="object"||f===null){t.push(`chroma.${c} must be { min, max }.`);continue}const p=f;for(const l of r.get(c)??[])l.chroma!==void 0&&typeof p.min=="number"&&typeof p.max=="number"&&(l.chroma<p.min-1e-9||l.chroma>p.max+1e-9)&&o.push(`chroma.${c} clamps the anchor-sourced token ${c} ("${l.source}", effective in ${l.where}) and moves it off its declared swatch. Remove the band if that is unintended \u2014 anchors otherwise keep their own chroma.`);const g=f;(typeof g.min!="number"||g.min<0)&&t.push(`chroma.${c}.min must be \u2265 0.`),(typeof g.max!="number"||g.max<0||g.max>Y)&&t.push(`chroma.${c}.max must be 0\u2013${Y}.`),typeof g.min=="number"&&typeof g.max=="number"&&g.min>g.max&&t.push(`chroma.${c}.min (${g.min}) must be \u2264 max (${g.max}).`)}}if("anchors"in e)if(typeof e.anchors!="object"||e.anchors===null||Array.isArray(e.anchors))t.push("anchors must be an object of named colors.");else for(const[s,r]of Object.entries(e.anchors))if(M(s)?j.test(s)||t.push(`anchors: "${s}" is not a valid anchor name; use a lowercase slug (letters, digits, hyphens).`):t.push(`anchors: "${s}" is a reserved JavaScript property name and cannot be an anchor name; rename it.`),Ae.includes(s)&&t.push(`anchors: "${s}" collides with a reserved color source name.`),typeof r=="string")W(r)||t.push(`anchors.${s} is not a valid CSS color: "${r}". Accepted forms: ${oe}.`);else if(typeof r=="object"&&r!==null&&!Array.isArray(r)){const c=r;typeof c.color!="string"&&t.push(`anchors.${s} must declare its base "color".`);for(const[f,p]of Object.entries(c))M(f)?f!=="color"&&!j.test(f)&&t.push(`anchors.${s}: "${f}" is not a valid slot name; use a lowercase slug.`):t.push(`anchors.${s}: "${f}" is a reserved JavaScript property name and cannot be a slot name; rename it.`),typeof p!="string"?t.push(`anchors.${s}.${f} must be a CSS color string.`):W(p)||t.push(`anchors.${s}.${f} is not a valid CSS color: "${p}". Accepted forms: ${oe}.`)}else t.push(`anchors.${s} must be a color string or a { color, \u2026slots } object.`);const k=new Map;if("anchors"in e&&typeof e.anchors=="object"&&e.anchors!==null&&!Array.isArray(e.anchors))for(const[s,r]of Object.entries(e.anchors))k.set(s,r);function y(s,r){const c=ke(s);if(!c){t.push(`${r} "${s}" is not valid anchor syntax; use anchor:<name> or anchor:<name>.<slot>.`);return}if(!k.has(c.name)){const f=[...k.keys()];t.push(`${r} references undeclared anchor "${c.name}". Declared anchors: ${f.length>0?f.join(", "):"(none)"}.`);return}if(c.slot!==void 0){const f=k.get(c.name);if(typeof(typeof f=="object"&&f!==null&&!Array.isArray(f)?f[c.slot]:void 0)!="string"){const g=typeof f=="object"&&f!==null?Object.keys(f).filter(l=>l!=="color"):[];t.push(`${r} references unknown slot "${c.slot}" on anchor "${c.name}". Declared slots: ${g.length>0?g.join(", "):"(none)"}.`)}}}function T(s,r){if(s.startsWith("anchor:")){y(s,r);return}Ae.includes(s)||t.push(`${r} must be one of: ${Ae.join(", ")}, or a declared anchor as anchor:<name> / anchor:<name>.<slot>.`)}if("intents"in e)if(typeof e.intents!="object"||e.intents===null||Array.isArray(e.intents))t.push("intents must be an object.");else for(const[s,r]of Object.entries(e.intents)){const c=`intents.${s}`;if(!ee.includes(s)){t.push(`${c} is not a status family; expected one of: ${ee.join(", ")}.`);continue}if(typeof r!="string"){t.push(`${c} must be a string (a CSS color or an anchor: reference).`);continue}if(r.startsWith("anchor:")){y(r,c);continue}W(r)||t.push(`${c} "${r}" is not a supported color form or anchor: reference. Accepted forms: ${oe}, or anchor:<name> / anchor:<name>.<slot>. An override retunes a family with a declared color; it never points one family at another \u2014 retune, never reassign.`)}function _(s,r){if(s.startsWith("anchor:")){y(s,r);return}W(s)||t.push(`${r} is not a valid CSS color: "${s}". Accepted forms: ${oe}, or a declared anchor as anchor:<name> / anchor:<name>.<slot>.`)}if("dataPalette"in e)if(typeof e.dataPalette!="object"||e.dataPalette===null||Array.isArray(e.dataPalette))t.push("dataPalette must be an object with series1\u2013series8 color values.");else{const s=e.dataPalette;for(const[r,c]of Object.entries(s)){if(!fe.includes(r)){t.push(`dataPalette.${r} is not a series slot; expected one of: ${fe.join(", ")}.`);continue}typeof c!="string"?t.push(`dataPalette.${r} must be a CSS color or anchor reference string.`):_(c,`dataPalette.${r}`)}}if("dataRamps"in e)if(typeof e.dataRamps!="object"||e.dataRamps===null||Array.isArray(e.dataRamps))t.push("dataRamps must be an object of named ramp declarations.");else for(const[s,r]of Object.entries(e.dataRamps)){if(M(s)?j.test(s)||t.push(`dataRamps: "${s}" is not a valid ramp name; use a lowercase slug (letters, digits, hyphens).`):t.push(`dataRamps: "${s}" is a reserved JavaScript property name and cannot be a ramp name; rename it.`),typeof r!="object"||r===null||Array.isArray(r)){t.push(`dataRamps.${s} must be a sequential or diverging ramp object.`);continue}const c=r,f=c.steps??kt;if((typeof f!="number"||!Number.isInteger(f)||f<xe||f>$e)&&t.push(`dataRamps.${s}.steps must be an integer from ${xe} through ${$e}.`),c.type==="sequential"){typeof c.source!="string"?t.push(`dataRamps.${s}.source must be a CSS color or anchor reference string.`):_(c.source,`dataRamps.${s}.source`);const p=c.lightnessStart??.95,g=c.lightnessEnd??.25;for(const[l,h]of[["lightnessStart",p],["lightnessEnd",g]])(typeof h!="number"||!Number.isFinite(h)||h<0||h>1)&&t.push(`dataRamps.${s}.${l} must be a finite number from 0 through 1.`);typeof p=="number"&&typeof g=="number"&&p<=g?t.push(`dataRamps.${s}.lightnessStart must be greater than lightnessEnd.`):typeof p=="number"&&Number.isFinite(p)&&typeof g=="number"&&Number.isFinite(g)&&typeof f=="number"&&Number.isInteger(f)&&f>=xe&&f<=$e&&(p-g)/(f-1)<=We&&t.push(`dataRamps.${s} lightness bounds must leave more than ${We} lightness between serialized stops.`);continue}if(c.type==="diverging"){typeof f=="number"&&Number.isInteger(f)&&f%2===0&&t.push(`dataRamps.${s}.steps must be odd so the neutral is the exact midpoint.`);for(const p of["start","end"])typeof c[p]!="string"?t.push(`dataRamps.${s}.${p} must be a CSS color or anchor reference string.`):_(c[p],`dataRamps.${s}.${p}`);"neutral"in c&&(typeof c.neutral!="string"?t.push(`dataRamps.${s}.neutral must be a CSS color or anchor reference string.`):_(c.neutral,`dataRamps.${s}.neutral`));continue}t.push(`dataRamps.${s}.type must be "sequential" or "diverging".`)}if("dataPalette"in e&&t.length===0){const s=de(Re,e),r={};let c=!0;for(const f of fe){const p=St(s.dataPalette[f],s.anchors);if(!p){c=!1;break}r[f]=p}if(c)for(const f of xt(r))o.push(`dataPalette.${f.series[0]} and dataPalette.${f.series[1]} are only ${f.distance.toFixed(4)} apart under ${f.simulation} simulation (minimum ${f.threshold.toFixed(4)}); also distinguish the series with labels, shapes, or patterns.`)}function z(s,r){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${r} must be an object.`);return}const c=s;for(const[f,p]of Object.entries(c)){const g=`${r}.${f}`;if(!se.includes(f)){t.push(`${g} is not a role; expected one of: ${se.join(", ")}. (The status family is reserved and is not a role.)`);continue}const l=f,h=Se[l];if(typeof p=="string"){T(p,g);continue}if(typeof p!="object"||p===null||Array.isArray(p)){t.push(`${g} must be a color source or a { color, \u2026slots } object.`);continue}const $=p;typeof $.color!="string"&&t.push(`${g} must declare its base "color".`);for(const[b,R]of Object.entries($)){if(!Object.prototype.hasOwnProperty.call(h,b)||!M(b)){const C=Object.keys(h).filter(E=>E!=="color");t.push(`${g}.${b} is not a slot of the ${l} role. Declared slots: ${C.length>0?C.join(", "):"(none)"}.`);continue}typeof R!="string"?t.push(`${g}.${b} must be a color source string.`):T(R,`${g}.${b}`)}}}if("roles"in e&&z(e.roles,"roles"),"contexts"in e)if(typeof e.contexts!="object"||e.contexts===null||Array.isArray(e.contexts))t.push("contexts must be an object.");else for(const[s,r]of Object.entries(e.contexts)){if(!M(s)||!j.test(s)){t.push(`contexts.${s} must be a lowercase slug matching ${j.source}.`);continue}if(typeof r!="object"||r===null||Array.isArray(r)){z(r,`contexts.${s}`);continue}const c=r,f=Object.fromEntries(Object.entries(c).filter(([g])=>g!=="lightness"&&g!=="tones"&&g!=="semanticMappings"));z(f,`contexts.${s}`),"lightness"in c&&d(c.lightness,`contexts.${s}.lightness`);const p=new Set(A);if("tones"in c)for(const g of m(c.tones,`contexts.${s}.tones`))p.add(g);"semanticMappings"in c&&N(c.semanticMappings,`contexts.${s}.semanticMappings`,p)}function N(s,r,c){if(typeof s!="object"||s===null||Array.isArray(s)){t.push(`${r} must be an object.`);return}const f=s;for(const p of Object.keys(f))G.includes(p)||t.push(`${r}.${p} is not a semantic token; expected one of: ${G.join(", ")}.`);for(const p of G)if(p in f){const g=f[p];if(typeof g!="object"||g===null){t.push(`${r}.${p} must be { source, lightness }.`);continue}const l=g;if(typeof l.source!="string"?t.push(`${r}.${p}.source must be a string.`):T(l.source,`${r}.${p}.source`),typeof l.lightness!="string")t.push(`${r}.${p}.lightness must be one of: ${K.join(", ")}, or a declared tone:<name>.`);else if(!te(l.lightness)){const h=Me(l.lightness);if(h===null)t.push(`${r}.${p}.lightness must be one of: ${K.join(", ")}, or a declared tone:<name>.`);else if(!c.has(h)){const $=[...c].sort();t.push(`${r}.${p}.lightness references undeclared tone "${h}". Declared tones: ${$.length>0?$.join(", "):"(none)"}.`)}}}}if("semanticMappings"in e&&N(e.semanticMappings,"semanticMappings",A),"explicitMappingTokens"in e)if(!Array.isArray(e.explicitMappingTokens))t.push("explicitMappingTokens must be an array of semantic token names.");else{const s=new Set,r=L(e.semanticMappings)?e.semanticMappings:void 0;for(const c of e.explicitMappingTokens){if(typeof c!="string"||!G.includes(c)){t.push(`explicitMappingTokens entries must be one of: ${G.join(", ")}.`);continue}s.has(c)&&t.push(`explicitMappingTokens contains duplicate token "${c}".`),s.add(c),(!r||!Object.prototype.hasOwnProperty.call(r,c))&&t.push(`explicitMappingTokens names "${c}" without a semanticMappings entry.`)}}for(const s of["pageBackgroundImage","boxBackgroundImage","vellumBackgroundImage"])s in e&&typeof e[s]!="string"&&t.push(`${s} must be a string.`);for(const s of["pageBackgroundImageOpacity","boxBackgroundImageOpacity","vellumOpacity","vellumBackgroundImageOpacity"])if(s in e)if(typeof e[s]!="number"||!isFinite(e[s]))t.push(`${s} must be a finite number.`);else{const r=e[s];(r<0||r>1)&&t.push(`${s} must be 0\u20131 (got ${r}).`)}return o.push(...Jt(e,n)),{valid:t.length===0,errors:t,warnings:o}}const B=.045;function Jt(e,n){try{return Yt(e,n)}catch{return[]}}function Yt(e,n){const t=de(n,e),o=at(t),i=[...o],a=new Set(o);for(const u of Object.keys(t.contexts)){const d=st(t,u);if(d)for(const m of at(d))a.has(m)||i.push(`contexts.${u}: ${m}`)}return i}function qt(e){const n=gt(he(e)),t=yt(n);return mt({r:ge(t.r),g:ge(t.g),b:ge(t.b)})}function Z(e,n){return Math.hypot(e.L-n.L,e.a-n.a,e.b-n.b)}function q(e){return qt(W(ce(he(e))))}function rt(e){return(Math.floor(e*1e4)/1e4).toFixed(4)}const Q=2,it=1e-4;function at(e){const n=W(e.seedColor);if(!n)return[];const t=ye(n,e),o=e.semanticMappings.actionBackground,i=e.chroma.actionBackground,a=Oe(e.lightness,e.tones,o.lightness),u=(l,h,$,b)=>he(ae(l,h,$,b)),d=ee.map(l=>({name:l,base:t[l]})),m=[];if(ee.includes(o.source))m.push(`actionBackground is sourced from the "${o.source}" status family: ordinary and ${o.source}-intent action surfaces render identically (their labels may still differ). Remap the action to a non-status source \u2014 retuning "${o.source}" via intents moves both colors together.`);else{const l=ue(o.source,t,e.anchors);l&&d.push({name:"action",base:l})}const A=Fe(d.map(({name:l,base:h})=>[l,ce(u(h,a,i.min,i.max))]),B,["normal"]);if(A.length===0)return m;const k=new Map,y=(l,h)=>{const $=`${l}:${h}`;let b=k.get($);if(!b){b=[];for(let R=0;R<360;R+=Q)b.push(q({l,c:h,h:R}));k.set($,b)}return b},T=B-.002,_=(l,h,$,b)=>{const R=Math.hypot(l.a,l.b),C=Math.atan2(l.b,l.a)*180/Math.PI+180;let E=0;for(const S of $===b?[b]:[$,b]){if(S+R<B-1e-4)continue;let x=C,O=Z(q({l:h,c:S,h:C}),l);if(O>=B)return O;const D=y(h,S);for(let w=0;w<D.length;w+=1){const v=Z(D[w],l);if(v>=B)return v;v>O&&(O=v,x=w*Q)}let P=x;for(let w=x-Q;w<=x+Q;w+=.1){const v=Z(q({l:h,c:S,h:w}),l);if(v>=B)return v;v>O&&(O=v,P=w)}if(O>=T)for(let w=P-.1;w<=P+.1;w+=.001){const v=Z(q({l:h,c:S,h:w}),l);if(v>=B)return v;v>O&&(O=v)}O>E&&(E=O)}return E},z=(l,h,$)=>{const b=h===$?[$]:[h,$];let R=0;for(const C of b)for(const E of b){if(C+E<B-1e-4)continue;const S=y(l,C),x=y(l,E);let O=0,D=0,P=-1;for(let H=0;H<S.length;H+=1)for(let U=0;U<x.length;U+=1){const V=Z(S[H],x[U]);if(V>=B)return V;V>P&&(P=V,O=H*Q,D=U*Q)}const w=(H,U,V,Le)=>{const Ie=[];for(let J=U-V;J<=U+V;J+=Le)Ie.push({h:J,lab:q({l,c:E,h:J})});let me=-1,He=H,Ne=U;for(let J=H-V;J<=H+V;J+=Le){const ft=q({l,c:C,h:J});for(const Pe of Ie){const De=Z(ft,Pe.lab);De>me&&(me=De,He=J,Ne=Pe.h)}}return{distance:me,hueA:He,hueB:Ne}},v=w(O,D,Q,.1);if(v.distance>=B)return v.distance;let I=Math.max(P,v.distance);if(I>=T){const H=w(v.hueA,v.hueB,.1,.001);if(H.distance>I&&(I=H.distance),I>=B)return I}I>R&&(R=I)}return R},N=l=>ee.includes(l),s=(l,h,$,b,R)=>{const C=q(u(l.base,$,b,R)),E=q(u(h.base,$,b,R));if(Z(C,E)>=B)return{outcome:"direct"};const S=N(l.name)&&N(h.name),x=[l,h].filter(P=>N(P.name)),O=S?"one of them":`"${N(l.name)?l.name:h.name}"`;let D;for(const P of x){const w=_(P===l?E:C,$,b,R);if(w>=B)return{outcome:"retune",target:O};w>=B-it&&(D=D??O)}if(S){const P=z($,b,R);if(P>=B)return{outcome:"retune",target:"both"};P>=B-it&&(D=D??"both")}return D!==void 0?{outcome:"near",target:D}:{outcome:"no"}},r=l=>l.outcome==="direct"?4:l.outcome==="retune"?l.target==="both"?2:3:l.outcome==="near"?1:0,c=l=>[...l].sort().join("|"),f=new Set(Fe(d.map(({name:l,base:h})=>[l,ce(u(h,a,0,Y))]),B,["normal"]).map(l=>c(l.pair))),p=new Map(d.map(l=>[l.name,l])),g=new Map;for(const{pair:l,distance:h}of A){const $=p.get(l[0]),b=p.get(l[1]),R=N($.name)&&N(b.name),C=s($,b,a,i.min,i.max);if(C.outcome==="direct"||C.outcome==="retune"){const I=C.target??(R?"one of them":`"${N($.name)?$.name:b.name}"`);f.has(c(l))?m.push(`Status colors "${l[0]}" and "${l[1]}" are hard to distinguish under normal vision (distance ${rt(h)} < ${B}); status meanings must stay distinguishable \u2014 retune ${I} via intents.`):m.push(`Status colors "${l[0]}" and "${l[1]}" are hard to distinguish as rendered (distance ${rt(h)} < ${B}); the actionBackground chroma band ({ min: ${i.min}, max: ${i.max} }) pushes them together \u2014 widen the band, or retune ${I} via intents.`);continue}const E=s($,b,a,0,Y);let S={outcome:"no"};for(let I=1;I<=19&&S.outcome!=="direct";I+=1){const H=I*.05;if(Math.abs(H-a)<.001)continue;const U=s($,b,H,i.min,i.max);r(U)>r(S)&&(S=U)}let x={outcome:"no"};const O=E.outcome==="direct"||E.outcome==="retune",D=S.outcome==="direct"||S.outcome==="retune";if(!O&&!D)for(let I=1;I<=19&&x.outcome!=="direct";I+=1){const H=s($,b,I*.05,0,Y);r(H)>r(x)&&(x=H)}const P=Xt(E,S,x),w=`${C.outcome}|${P}`;let v=g.get(w);v||(v=[],g.set(w,v)),v.push(l)}for(const[l,h]of g){const $=l.indexOf("|"),b=l.slice(0,$),R=l.slice($+1),C=h.map(([x,O])=>`"${x}"/"${O}"`),E=C.length>1?`${C.slice(0,-1).join(", ")} and ${C[C.length-1]}`:C[0],S=b==="near"?`Status colors ${E} may not separate by retuning as rendered: at the action stop's lightness (${a}) with the actionBackground chroma band ({ min: ${i.min}, max: ${i.max} }), the closest reachable retune found comes within the audit's search margin of the ${B} threshold`:`Status colors ${E} cannot be separated as rendered: at the action stop's lightness (${a}) with the actionBackground chroma band ({ min: ${i.min}, max: ${i.max} }), no intent retuning can pull ${h.length>1?"these pairs":"the pair"} ${B} apart`;m.push(S+R)}return m}function Xt(e,n,t){if(e.outcome==="direct"&&n.outcome==="direct")return" \u2014 widen the chroma band or move the action lightness stop.";if(e.outcome==="direct")return n.outcome==="no"?"; no other action lightness stop can help while the band holds \u2014 widen the chroma band.":" \u2014 widen the chroma band.";if(n.outcome==="direct")return e.outcome==="no"?"; no wider chroma band can help at this lightness \u2014 move the action lightness stop.":" \u2014 move the action lightness stop.";if(e.outcome==="retune"&&n.outcome==="retune")return` \u2014 widen the chroma band or move the action lightness stop, then retune ${e.target} via intents.`;if(e.outcome==="retune")return n.outcome==="no"?`; no other action lightness stop can help while the band holds \u2014 widen the chroma band, then retune ${e.target} via intents.`:` \u2014 widen the chroma band, then retune ${e.target} via intents.`;if(n.outcome==="retune")return e.outcome==="no"?`; no wider chroma band can help at this lightness \u2014 move the action lightness stop, then retune ${n.target} via intents.`:` \u2014 move the action lightness stop, then retune ${n.target} via intents.`;const o=e.outcome==="no"&&n.outcome==="no"?"; neither a wider chroma band alone nor another stop alone can help":"; neither a wider chroma band alone nor another stop alone provably helps";return t.outcome==="direct"?`${o} \u2014 change the band and the stop together.`:t.outcome==="retune"?`${o} \u2014 change the band and the stop together, then retune ${t.target} via intents.`:"; no explored band or stop change provably separates this pair."}function an(e,n){const t=Be(e),o=Be(n),i=t.error!==void 0?{valid:!1,errors:[t.error],warnings:[]}:_e(t.value),a=o.error!==void 0?{valid:!1,errors:[o.error],warnings:[]}:_e(o.value,Je),u=[...i.errors.map(m=>`light: ${m}`),...a.errors.map(m=>`dark: ${m}`)],d=[...i.warnings.map(m=>`light: ${m}`),...a.warnings.map(m=>`dark: ${m}`)];if(i.valid&&a.valid){const m=new Set(Object.keys(t.value?.contexts??{})),A=new Set(Object.keys(o.value?.contexts??{})),k=[...A].filter(T=>!m.has(T)).sort(),y=[...m].filter(T=>!A.has(T)).sort();(k.length>0||y.length>0)&&u.push(`contexts must declare the same names in both schemes. Missing from light: ${k.join(", ")||"(none)"}. Missing from dark: ${y.join(", ")||"(none)"}.`)}return{valid:u.length===0,errors:u,warnings:d}}const Zt=["anchors","angles","contexts","dataPalette","dataRamps","intents","roles","chroma","lightness","tones","semanticHues","semanticMappings","variantChroma"];function Qt(e,n){const t={};for(const[a,u]of Object.entries(e))M(a)&&(t[a]=u);for(const[a,u]of Object.entries(n))u!==void 0&&M(a)&&(t[a]=u);for(const a of Zt){const u=e[a],d=n[a];if(u&&typeof u=="object"&&!Array.isArray(u)&&d&&typeof d=="object"&&!Array.isArray(d)){if(a==="anchors"){t[a]=Xe(u,d);continue}if(a==="contexts"){t[a]=jt(u,d);continue}if(a==="dataRamps"){t[a]=et(u,d);continue}const m={};for(const[A,k]of Object.entries(u))M(A)&&(m[A]=k);for(const[A,k]of Object.entries(d))k!==void 0&&M(A)&&(m[A]=k);t[a]=m}}const o=pe(e),i=pe(n);if(o!==void 0||i!==void 0){const a=o??new Set(Object.keys(e.semanticMappings??{}).filter(u=>G.includes(u)));for(const u of Object.keys(n.semanticMappings??{}))i===void 0||i.has(u)?a.add(u):a.delete(u);t.explicitMappingTokens=Ye(a)}return t}function cn(...e){let n={};for(const t of e){if(!t)continue;const o=Ht(t);o&&(n=Qt(n,o))}return we(n)}function ct(e){return e.replace(/\\/g,"\\\\").replace(/"/g,'\\"').replace(/\n/g,"\\n").replace(/\r/g,"\\r")}const ut={borderRadius:.1,fontBody:'"Noto Sans", sans-serif',fontWeightBody:"normal",fontHeadings:'"Inika", serif',fontWeightHeadings:"normal",fontBrand:'"Inika", serif',fontWeightBrand:"normal",fontMonospace:'"JetBrains Mono", monospace',fontWeightMonospace:"normal",seedColor:"oklch(.07 0.15 216)"};function un(e){return we({...ut,pageBackgroundImage:`url("${ct(e)}")`,pageBackgroundImageOpacity:.5})}function fn(e){return we({...ut,pageBackgroundImage:`url("${ct(e)}")`,pageBackgroundImageOpacity:.55})}export{j as ANCHOR_SLUG_PATTERN,Ae as COLOR_SOURCES,Lt as DEFAULT_DARK_LIGHTNESS,Je as DEFAULT_DARK_THEME,_t as DEFAULT_LIGHT_LIGHTNESS,Re as DEFAULT_LIGHT_THEME,Te as DEFAULT_SEMANTIC_MAPPINGS,K as LIGHTNESS_KEYS,Zt as NESTED_THEME_KEYS,se as ROLE_NAMES,Ot as ROLE_PAIRED_INK,Se as ROLE_TOKEN_PLAN,G as SEMANTIC_COLOR_NAMES,ee as STATUS_COLOR_SOURCES,Ue as TOKEN_PAIRINGS,Bt as VARIANT_COLOR_SOURCES,fn as buildTaprootDarkTheme,un as buildTaprootLightTheme,Ke as compileRoles,we as encodeTheme,Vt as explicitMappingTokens,te as isLightnessKey,cn as layerThemes,Qt as mergePartials,de as mergeTheme,ke as parseAnchorSource,Ht as parseTheme,je as resolveAnchorColor,st as resolveContextTheme,St as resolveDataColorSource,Oe as resolveLightnessReference,sn as semanticToCSS,Me as toneReferenceName,rn as validateTheme,an as validateThemePair};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{css as r,html as o,nothing as a}from"lit";function
|
|
1
|
+
import{css as r,html as o,nothing as a}from"lit";function t(e={}){return o`
|
|
2
2
|
<div
|
|
3
3
|
class="esp-visual-overlay ${e.className??""}"
|
|
4
4
|
part=${e.rootPart||a}
|
|
@@ -8,7 +8,7 @@ import{css as r,html as o,nothing as a}from"lit";function i(e={}){return o`
|
|
|
8
8
|
<div class="esp-visual-overlay__scrim" part=${e.scrimPart||a}></div>
|
|
9
9
|
<div class="esp-visual-overlay__texture" part=${e.texturePart||a}></div>
|
|
10
10
|
</div>
|
|
11
|
-
`}const
|
|
11
|
+
`}const i=r`
|
|
12
12
|
.esp-visual-overlay {
|
|
13
13
|
position: absolute;
|
|
14
14
|
z-index: var(--_esp-overlay-z-index, auto);
|
|
@@ -41,11 +41,18 @@ import{css as r,html as o,nothing as a}from"lit";function i(e={}){return o`
|
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
.esp-visual-overlay__texture {
|
|
44
|
-
background: var(--_esp-overlay-texture,
|
|
44
|
+
background-color: var(--_esp-overlay-texture-color, transparent);
|
|
45
|
+
background-image: var(--_esp-overlay-texture, none);
|
|
46
|
+
background-position: var(--_esp-overlay-texture-position, 0 0);
|
|
47
|
+
background-repeat: var(--_esp-overlay-texture-repeat, repeat);
|
|
45
48
|
background-size: var(--_esp-overlay-texture-size, auto);
|
|
46
49
|
opacity: var(--_esp-overlay-texture-opacity, 1);
|
|
47
50
|
mix-blend-mode: var(--_esp-overlay-texture-blend-mode, normal);
|
|
48
51
|
filter: var(--_esp-overlay-texture-filter, none);
|
|
49
|
-
mask: var(--_esp-overlay-texture-mask, none);
|
|
52
|
+
mask-image: var(--_esp-overlay-texture-mask, none);
|
|
53
|
+
mask-mode: alpha;
|
|
54
|
+
mask-position: var(--_esp-overlay-texture-mask-position, 0 0);
|
|
55
|
+
mask-repeat: var(--_esp-overlay-texture-mask-repeat, repeat);
|
|
56
|
+
mask-size: var(--_esp-overlay-texture-mask-size, auto);
|
|
50
57
|
}
|
|
51
|
-
`;export{
|
|
58
|
+
`;export{t as renderVisualOverlay,i as visualOverlayStyles};
|