colorfully - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

dist/index.js

 /*!
   *
-  * colorfully 0.1.0
+  * colorfully 0.1.1
   *
@@ -301,3 +301,3 @@ * Copyright 2021-present, City.
         mode: options.mode || 'css',
-        root: options.root || document.querySelector('html')
+        root: options.root
       };
@@ -334,3 +334,3 @@ }
       const theme = this.schema.get(themeCode);
-      const html = this.options.root;
+      const html = this.options.root || document.querySelector('html');
       html?.getAttributeNames().forEach(name => {
@@ -337,0 +337,0 @@ if (name.includes('data-theme-')) html.removeAttribute(name);

dist/index.min.js

 /*!
   *
-  * colorfully 0.1.0
+  * colorfully 0.1.1
   *
@@ -9,2 +9,2 @@ * Copyright 2021-present, City.
   */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Colorfully={})}(this,(function(e){"use strict";class t{constructor(e,t,s){this.name=e,this.code=t,this.map=s}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,s){this.map[t]={name:e,code:t,value:s}}delete(e){delete this.map[e]}change(e,t){this.map[e].value=t}}class s{constructor(e,s,a){this.name=e,this.code=s,this.map=Object.keys(a).reduce(((e,s)=>{const r=a[s];return e[s]=new t(r.name,r.code,r.variables),e}),{})}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,s,a){this.map[s]=new t(e,s,a)}delete(e){delete this.map[e]}parcel(e,t){return`*[ data-theme-${this.code} = '${String(e)}' ] {\n${t}\n}`}toTypeString(e){return this.get(e).getAll().map((e=>`${e.code}: ${e.value};`)).join("\n")}toString(){return this.getAll().map((e=>this.parcel(e.code,this.toTypeString(e.code)))).join("\n\n")}}class a{constructor(e){this.map=e}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,a){this.map[t]=new s(e,t,a)}delete(e){delete this.map[e]}toStyleListByTheme(e){return Object.keys(e.map).map((t=>({code:t,css:this.map[t].parcel(e.map[t],this.map[t].toTypeString(e.map[t]))})))}toStyleList(){return Object.values(this.map).map((e=>({code:e.code,css:e.toString()})))}}class r{constructor(e,t,s){this.name=e,this.code=t,this.map=s}changeMap(e){this.map=e}}class o{constructor(e){this.map=e}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,s){this.map[t]=new r(e,t,s)}delete(e){delete this.map[e]}}class c{constructor({styleMap:e,schemaMap:t,...s}={}){this.style=new a({...e||{}}),this.schema=new o({...t||{}}),this.options={mode:s.mode||"css",root:s.root||document.querySelector("html")}}derive(e){const t=new c({...this.options,...e});return t.import(this.export()),t}createStyleTag(e){return e.map((e=>{const t=document.createElement("style");return t.setAttribute("type","text/css"),t.setAttribute("data-theme-style",e.code),t.innerHTML=e.css,t}))}init=!1;use(e){const t=this.schema.get(e),s=this.options.root;if(s?.getAttributeNames().forEach((e=>{e.includes("data-theme-")&&s.removeAttribute(e)})),Object.keys(t.map).forEach((e=>{const a=t.map[e];s?.setAttribute(`data-theme-${e}`,a)})),"css"===this.options.mode&&this.init)return;this.init=!0;const a=Array.from(document.querySelectorAll("style[data-theme-style]"));if("css"===this.options.mode){const e=this.style.toStyleList(),t=this.createStyleTag(e),s=document.querySelector("head"),r=s?.querySelector("style");return t.forEach((e=>s?.insertBefore(e,r))),void a.forEach((e=>e.parentElement?.removeChild(e)))}const r=this.style.toStyleListByTheme(t),o=this.createStyleTag(r),c=document.querySelector("head"),i=c?.querySelector("style");o.forEach((e=>c?.insertBefore(e,i))),a.forEach((e=>e.parentElement?.removeChild(e)))}import(e){const{styles:t,schemas:s}=e;for(const e of t)this.style.create(e.name,e.code,e.types.reduce(((e,t)=>(e[t.code]={name:t.name,code:t.code,variables:t.variables.reduce(((e,t)=>(e[t.code]={...t},e)),{})},e)),{}));for(const e of s)this.schema.create(e.name,e.code,e.map)}export(){return{styles:this.style.getAll().map((e=>({name:e.name,code:e.code,types:e.getAll().map((e=>({name:e.name,code:e.code,variables:e.getAll()})))}))),schemas:this.schema.getAll().map((e=>({name:e.name,code:e.code,map:e.map})))}}}e.CSSSchema=r,e.CSSStyle=s,e.CSSStyleType=t,e.Colorfully=c,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Colorfully={})}(this,(function(e){"use strict";class t{constructor(e,t,s){this.name=e,this.code=t,this.map=s}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,s){this.map[t]={name:e,code:t,value:s}}delete(e){delete this.map[e]}change(e,t){this.map[e].value=t}}class s{constructor(e,s,a){this.name=e,this.code=s,this.map=Object.keys(a).reduce(((e,s)=>{const r=a[s];return e[s]=new t(r.name,r.code,r.variables),e}),{})}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,s,a){this.map[s]=new t(e,s,a)}delete(e){delete this.map[e]}parcel(e,t){return`*[ data-theme-${this.code} = '${String(e)}' ] {\n${t}\n}`}toTypeString(e){return this.get(e).getAll().map((e=>`${e.code}: ${e.value};`)).join("\n")}toString(){return this.getAll().map((e=>this.parcel(e.code,this.toTypeString(e.code)))).join("\n\n")}}class a{constructor(e){this.map=e}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,a){this.map[t]=new s(e,t,a)}delete(e){delete this.map[e]}toStyleListByTheme(e){return Object.keys(e.map).map((t=>({code:t,css:this.map[t].parcel(e.map[t],this.map[t].toTypeString(e.map[t]))})))}toStyleList(){return Object.values(this.map).map((e=>({code:e.code,css:e.toString()})))}}class r{constructor(e,t,s){this.name=e,this.code=t,this.map=s}changeMap(e){this.map=e}}class o{constructor(e){this.map=e}getAll(){return Object.values(this.map)}get(e){return this.map[e]}create(e,t,s){this.map[t]=new r(e,t,s)}delete(e){delete this.map[e]}}class c{constructor({styleMap:e,schemaMap:t,...s}={}){this.style=new a({...e||{}}),this.schema=new o({...t||{}}),this.options={mode:s.mode||"css",root:s.root}}derive(e){const t=new c({...this.options,...e});return t.import(this.export()),t}createStyleTag(e){return e.map((e=>{const t=document.createElement("style");return t.setAttribute("type","text/css"),t.setAttribute("data-theme-style",e.code),t.innerHTML=e.css,t}))}init=!1;use(e){const t=this.schema.get(e),s=this.options.root||document.querySelector("html");if(s?.getAttributeNames().forEach((e=>{e.includes("data-theme-")&&s.removeAttribute(e)})),Object.keys(t.map).forEach((e=>{const a=t.map[e];s?.setAttribute(`data-theme-${e}`,a)})),"css"===this.options.mode&&this.init)return;this.init=!0;const a=Array.from(document.querySelectorAll("style[data-theme-style]"));if("css"===this.options.mode){const e=this.style.toStyleList(),t=this.createStyleTag(e),s=document.querySelector("head"),r=s?.querySelector("style");return t.forEach((e=>s?.insertBefore(e,r))),void a.forEach((e=>e.parentElement?.removeChild(e)))}const r=this.style.toStyleListByTheme(t),o=this.createStyleTag(r),c=document.querySelector("head"),i=c?.querySelector("style");o.forEach((e=>c?.insertBefore(e,i))),a.forEach((e=>e.parentElement?.removeChild(e)))}import(e){const{styles:t,schemas:s}=e;for(const e of t)this.style.create(e.name,e.code,e.types.reduce(((e,t)=>(e[t.code]={name:t.name,code:t.code,variables:t.variables.reduce(((e,t)=>(e[t.code]={...t},e)),{})},e)),{}));for(const e of s)this.schema.create(e.name,e.code,e.map)}export(){return{styles:this.style.getAll().map((e=>({name:e.name,code:e.code,types:e.getAll().map((e=>({name:e.name,code:e.code,variables:e.getAll()})))}))),schemas:this.schema.getAll().map((e=>({name:e.name,code:e.code,map:e.map})))}}}e.CSSSchema=r,e.CSSStyle=s,e.CSSStyleType=t,e.Colorfully=c,Object.defineProperty(e,"__esModule",{value:!0})}));

es/index.js

@@ -23,3 +23,3 @@ import { __assign, __rest } from './_virtual/_tslib.js';
       mode: options.mode || 'css',
-      root: options.root || document.querySelector('html')
+      root: options.root
     };
@@ -50,3 +50,3 @@ }
     var theme = this.schema.get(themeCode);
-    var html = this.options.root;
+    var html = this.options.root || document.querySelector('html');
     html === null || html === void 0 ? void 0 : html.getAttributeNames().forEach(function (name) {
@@ -53,0 +53,0 @@ if (name.includes('data-theme-')) html.removeAttribute(name);

lib/index.js

@@ -27,3 +27,3 @@ 'use strict';
       mode: options.mode || 'css',
-      root: options.root || document.querySelector('html')
+      root: options.root
     };
@@ -54,3 +54,3 @@ }
     var theme = this.schema.get(themeCode);
-    var html = this.options.root;
+    var html = this.options.root || document.querySelector('html');
     html === null || html === void 0 ? void 0 : html.getAttributeNames().forEach(function (name) {
@@ -57,0 +57,0 @@ if (name.includes('data-theme-')) html.removeAttribute(name);

package.json

 {
   "name": "colorfully",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Use Colorfully to define your interface theme!",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No metric changes

No dependency changes