adopted-style-sheets/dist/index.cjs

This library implements functions to use the adopted style of web components for multiple themes.

"use strict";const c$1=require("loglevel");function _interopDefaultCompat(o){return o&&typeof o=="object"&&"default"in o?o.default:o}const c__default=_interopDefaultCompat(c$1),createTranslation=(o,a)=>n=>n(o,a),createTheme=(o,a)=>n=>n(o,a,{append:!1}),e=new Map,t=[],s=new Map,STORE={A11yUi:{CSS_STYLE_CACHE:e,HYDRATED_HISTORY:t,STYLING_TASK_QUEUE:s,Themes:{}}};let g$1=!0,h$1=!1;const p$1=/^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/,C$1=o=>typeof o=="string"&&p$1.test(o),m=o=>{if(C$1(o)===!1)throw new Error(`[Theming] The theme identifier "${typeof o=="string"?o:""}" (Type: ${typeof o}) is not valid. Please use only follow this pattern: /^[a-z][a-z0-9]{1,}(-[a-z0-9]+)?$/`)},patchThemeTag=(o,a,n,i)=>setThemeTag(o,a,n,i),setThemeTag=(o,a,n,i)=>{i=i??{},i.append=i.append??!1,m(o),g$1===!0&&h$1===!1&&(h$1=!0,c__default.warn(`[Theming] The theme process is locked. This means that the theme "${o}" should not be patched.

	import { register } from 'adopted-style-sheets';
	import { defineCustomElements } from '...';
	import { THEME } from '...';

	register(THEME, defineCustomElements)
	.then(() => {
		// run your app or website
	})
	.catch(console.warn);`)),(typeof STORE.A11yUi.Themes[o]!="object"||STORE.A11yUi.Themes[o]===null)&&(STORE.A11yUi.Themes[o]={}),i.append&&typeof STORE.A11yUi.Themes[o][a]=="string"?STORE.A11yUi.Themes[o][a]+=n:STORE.A11yUi.Themes[o][a]=n},patchTheme=(o,a,n,i)=>setTheme(o,a,n,i),setTheme=(o,a,n,i)=>(m(o),typeof a=="object"&&a!==null&&Object.getOwnPropertyNames(a).forEach(l=>{const b=a[l],w=l.toLowerCase(),N=typeof i?.transformTagName=="function"&&!["GLOBAL","PROPERTIES"].includes(l)?i.transformTagName(w):l;typeof b=="string"&&b.length>0&&setThemeTag(o,N.toUpperCase(),b,n)}),o),f$1=o=>{if(o instanceof HTMLElement){if(typeof o.dataset.theme=="string")return o;{let a=o.parentNode;for(;a instanceof ShadowRoot;)a=a.host;return f$1(a)}}else return null},T$1=(o={})=>o.themeEncroachCss==="false"||o.themeReset==="true"?!1:{mode:o.themeEncroachCssMode==="after"||o.themeEncroachCssMode==="before"?o.themeEncroachCssMode:"before"},d$1=()=>typeof STORE.A11yUi=="object"&&STORE.A11yUi!==null&&typeof STORE.A11yUi.Theme=="object"&&STORE.A11yUi.Theme!==null&&typeof STORE.A11yUi.Theme.cache=="boolean"&&typeof STORE.A11yUi.Theme.encroachCss=="object"&&STORE.A11yUi.Theme.encroachCss!==null&&typeof STORE.A11yUi.Theme.encroachCss.mode=="string"&&typeof STORE.A11yUi.Theme.name=="string",A$1=()=>!(typeof STORE.A11yUi=="object"&&STORE.A11yUi!==null)||!(typeof STORE.A11yUi.Theme=="object"&&STORE.A11yUi.Theme!==null)||STORE.A11yUi.Theme.name!=="default",getThemeDetails=o=>{if(d$1())return STORE.A11yUi.Theme;{const a={cache:!0,encroachCss:T$1(),loglevel:"silent",mode:"csr",name:null},n=f$1(o);return n instanceof HTMLElement&&(a.cache=n.dataset.themeCache!=="false",a.encroachCss=T$1(n.dataset),a.loglevel=n.dataset.themeLoglevel==="debug"?n.dataset.themeLoglevel:"silent",a.mode=n.dataset.themeMode==="ssr"?n.dataset.themeMode:"csr",a.name=n.dataset.theme||null),a}},getTheme=o=>getThemeDetails(o).name,E$1=(o,a)=>({cache:a.cache!==!1,detect:a.detect==="auto"?"auto":"fixed",encroachCss:a.encroachCss===!1?!1:typeof a.encroachCss=="object"&&a.encroachCss!=null&&(a.encroachCss.mode==="after"||a.encroachCss.mode==="before")?a.encroachCss:{mode:"before"},loglevel:a.loglevel==="debug"?a.loglevel:"silent",mode:a.mode==="ssr"?a.mode:"csr",name:typeof a.name=="string"?a.name:o}),R$1=(o,a)=>{d$1()===!1&&A$1()&&typeof a=="object"&&a!==null&&(a=E$1(o,a),a.detect==="fixed"?(a.name===null&&typeof o=="string"&&(a.name=o),o===a.name&&(STORE.A11yUi.Theme=a,c__default.info(`[Theming] Theme "${o}" was set as default theme.`))):h$1||(h$1=!0,c__default.warn("[Theming] The presetting of theme options is only relevant by using 'fixed' detection mode.")))},getRegisteredThemeNames=()=>Object.keys(STORE.A11yUi.Themes),getRegisteredThemes=()=>STORE.A11yUi.Themes,getRegisteredThemeByName=o=>STORE.A11yUi.Themes[o];let u$1=!1;const register=(o,a,n={})=>{u$1===!1&&(u$1=!0,g$1=!1),typeof o=="function"?o=new Set([o]):Array.isArray(o)&&(o=new Set(o)),o instanceof Set&&o.forEach(l=>{typeof l=="function"&&l.length===1?R$1(l((b,w,N)=>setTheme(b,w,N,n)),{cache:n.theme?.cache,detect:n.theme?.detect,encroachCss:n.theme?.encroachCss,mode:n.theme?.mode,name:n.theme?.name}):c__default.error("[Theming] An attempt was made to load an incompatible theme.")}),g$1=!0,typeof a=="function"?a=new Set([a]):Array.isArray(a)&&(a=new Set(a));const i=[];return a.forEach(l=>{const b=l();b instanceof Promise&&i.push(b)}),Promise.all(i)},r=class{constructor(o,a){this.store=this.createStore(o,a)}static getInstance(o,a){let n=r.instances.get(o);return n===void 0&&(n=new r(a,o),r.instances.set(o,n)),n}createStore(o,a){return Object.defineProperty(o,a,{enumerable:!1,value:{},writable:!1}),o[a]}recursiveSetItem(o,a,n,i=r.options){let l=typeof n=="object"&&n!==null?{}:n;if(Object.defineProperty(o,a,{enumerable:i.enumerable===!0,get:()=>l,set:i.immutable===!0?void 0:b=>l=b}),typeof n=="object"&&n!==null)for(const[b,w]of Object.entries(n))this.recursiveSetItem(o[a],b,w,i)}setItem(o,a,n=r.options){return this.recursiveSetItem(this.store,o,a,n),this}getItem(o){return Array.isArray(o)?o.map(a=>this.getItem(a)):this.store[o]}};let RobustStore=r;RobustStore.options={enumerable:!1,immutable:!1},RobustStore.instances=new Map;const S=new Set,g=/--[^;]+/g,f=/:/,L=(o,a)=>{let n=a.match(g);if(Array.isArray(n)){n=n.filter(l=>f.test(l));const i=document.createElement("style");i.innerHTML=`.${o} {${n.join(";")}}`,document.querySelector("head")?.appendChild(i)}S.add(o)},getCssStyle=(o,a)=>typeof STORE.A11yUi=="object"&&STORE.A11yUi!==null&&typeof STORE.A11yUi.Themes=="object"&&STORE.A11yUi.Themes!==null&&typeof STORE.A11yUi.Themes[o]=="object"&&STORE.A11yUi.Themes[o]!==null&&typeof STORE.A11yUi.Themes[o][a]=="string"?STORE.A11yUi.Themes[o][a].replace(/\r?\n/g,""):"",u=o=>{for(const a of Array.from(o.childNodes))if(a instanceof HTMLStyleElement&&a.tagName==="STYLE"&&a.dataset.themingFallback===void 0)o.removeChild(a);else break},A=(o,a)=>{try{if(STORE.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const n=[];a.forEach(i=>{const l=new CSSStyleSheet;l.replaceSync(i),n.push(l)}),o.adoptedStyleSheets=n}catch{[...a].reverse().forEach((n,i)=>{if(typeof n!="string"||n.length===0)return;const l=document.createElement("style");switch(l.dataset.themingFallback="",i){case 4:l.dataset.themingBaseA11y="";break;case 3:l.dataset.themingBaseGlobal="";break;case 2:l.dataset.themingBaseComponent="";break;case 1:l.dataset.themingCustomGlobal="";break;case 0:l.dataset.themingCustomComponent="";break;default:l.dataset.themingUnknown="";break}l.innerHTML=n,o.insertBefore(l,o.firstChild)})}},p=(o,a,n)=>{if(n!==!1){const i=[...Array.from(o.childNodes).filter(b=>b instanceof HTMLStyleElement&&b.tagName==="STYLE")];let l;try{l=[...Array.from(o.adoptedStyleSheets)]}catch{l=[]}n?.mode==="before"?(i.reverse().forEach(b=>a.unshift(b.innerHTML)),l.reverse().forEach(b=>a.unshift(Array.from(b.cssRules).map(w=>w.cssText).join("")))):n?.mode==="after"&&(i.forEach(b=>a.push(b.innerHTML)),l.forEach(b=>a.push(Array.from(b.cssRules).map(w=>w.cssText).join(""))))}},T=(o,a,n)=>{const i=a.name||"default";let l;try{if(o.shadowRoot===null)throw new Error("ShadowRoot is null");l=o.shadowRoot}catch{l=o}if(STORE.A11yUi.CSS_STYLE_CACHE.get(i)?.has(o.tagName))y(o,l,STORE.A11yUi.CSS_STYLE_CACHE.get(i)?.get(o.tagName),n);else{const b=getCssStyle(i,"PROPERTIES"),w=getCssStyle(i,"GLOBAL"),N=getCssStyle(i,o.tagName);S.has(i)===!1&&L(i,w);const j=[b,w,N];p(l,j,a.encroachCss),a.loglevel==="debug"&&console.log(o.tagName,j),a.cache===!0&&(STORE.A11yUi.CSS_STYLE_CACHE.has(i)===!1&&STORE.A11yUi.CSS_STYLE_CACHE.set(i,new Map),STORE.A11yUi.CSS_STYLE_CACHE.get(i)?.set(o.tagName,j)),y(o,l,j,n)}},y=(o,a,n,i)=>{u(a),A(a,n),o.style.display=i},E=o=>{o.loglevel==="debug"&&STORE.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:STORE.A11yUi.STYLING_TASK_QUEUE.size})},H=(o,a)=>{STORE.A11yUi.STYLING_TASK_QUEUE.set(o,{styleDisplay:o.style.display?`${o.style.display}`:null,themeDetails:a})},U=(o,a)=>{H(o,a),E(a)},_=o=>{STORE.A11yUi.STYLING_TASK_QUEUE.delete(o)},h=(o,a)=>{_(o),E(a)},d=o=>{const a=setTimeout(()=>{if(clearTimeout(a),STORE.A11yUi.STYLING_TASK_QUEUE.has(o)&&o.classList.contains("hydrated")){const{styleDisplay:n,themeDetails:i}=STORE.A11yUi.STYLING_TASK_QUEUE.get(o);T(o,i,n),h(o,i)}else d(o)},25)},R=o=>{for(const a of o)if(STORE.A11yUi.STYLING_TASK_QUEUE.has(a.target)&&a.target.classList.contains("hydrated")){const{styleDisplay:n,themeDetails:i}=STORE.A11yUi.STYLING_TASK_QUEUE.get(a.target);T(a.target,i,n),h(a.target,i)}},C={attributes:!0,attributeFilter:["class"],childList:!1,subtree:!1};let c;try{c=new MutationObserver(R)}catch{c=null}const setThemeStyle=(o,a)=>{a={...STORE.A11yUi.Theme,...a},U(o,a),c?c.observe(o,C):d(o),o.style.display="none"};class Theme{constructor(a,n,i){this.createTheme=(l,b)=>createTheme(l,b),this.createTranslation=(l,b)=>createTranslation(l,b),this.Prefix=a,this.Key=Object.getOwnPropertyNames(n),this.Tag=Object.getOwnPropertyNames(i)}}exports.RobustStore=RobustStore,exports.STORE=STORE,exports.Theme=Theme,exports.getCssStyle=getCssStyle,exports.getRegisteredThemeByName=getRegisteredThemeByName,exports.getRegisteredThemeNames=getRegisteredThemeNames,exports.getRegisteredThemes=getRegisteredThemes,exports.getTheme=getTheme,exports.getThemeDetails=getThemeDetails,exports.patchTheme=patchTheme,exports.patchThemeTag=patchThemeTag,exports.register=register,exports.setTheme=setTheme,exports.setThemeStyle=setThemeStyle,exports.setThemeTag=setThemeTag;