@lrnwebcomponents/simple-colors - npm Package Compare versions

Comparing version 2.1.2 to 2.1.4

lib/simple-colors-picker.js

@@ -138,3 +138,3 @@ /**
         name: "label",
-        type: "String",
+        type: String,
         value: null,
@@ -141,0 +141,0 @@ reflectToAttribute: true,

lib/simple-colors-styles.js

@@ -16,3 +16,2 @@ /**
 import { html, PolymerElement } from "@polymer/polymer/polymer-element.js";
-import { afterNextRender } from "@polymer/polymer/lib/utils/render-status.js";
 window.SimpleColorsStyles = {};
@@ -552,13 +551,2 @@ window.SimpleColorsStyles.instance = null;
   }
-  /**
-   * life cycle, element is afixed to the DOM
-   * /
-  connectedCallback() {
-    super.connectedCallback();
-    /**
-     * append and register the shared styles
-     * /
-    afterNextRender(this, function() {
-    });
-  }
 
@@ -587,2 +575,13 @@ /**
   /**
+   * returns a variable based on color name, shade, and fixed theme
+   *
+   * @param {string} the color name
+   * @param {number} the color shade
+   * @param {boolean} the color shade
+   * @returns {string} the CSS Variable
+   */
+  makeVariable(color = "grey", shade = 1, theme = "default") {
+    return ["--simple-colors", theme, "theme", color, shade].join("-");
+  }
+  /**
    * for large or small text given a color and its shade,
@@ -691,2 +690,4 @@ * lists all the shades of another color that would be
 }
+window.customElements.define(SimpleColorsStyles.tag, SimpleColorsStyles);
+export { SimpleColorsStyles };
 /**
@@ -693,0 +694,0 @@ * Checks to see if there is an instance available, and if not appends one

package.json

@@ -19,3 +19,3 @@ {
   },
-  "version": "2.1.2",
+  "version": "2.1.4",
   "description": "Automated conversion of simple-colors/",
@@ -43,3 +43,3 @@ "repository": {
   "dependencies": {
-    "@lrnwebcomponents/simple-picker": "^2.1.2",
+    "@lrnwebcomponents/simple-picker": "^2.1.4",
     "@polymer/iron-icons": "^3.0.1",
@@ -50,7 +50,7 @@ "@polymer/polymer": "^3.2.0"
     "@lrnwebcomponents/deduping-fix": "^2.1.1",
-    "@lrnwebcomponents/simple-modal": "^2.1.2",
+    "@lrnwebcomponents/simple-modal": "^2.1.4",
     "@lrnwebcomponents/storybook-utilities": "^2.1.2",
     "@polymer/iron-component-page": "github:PolymerElements/iron-component-page",
-    "@polymer/iron-demo-helpers": "^3.1.0",
-    "@webcomponents/webcomponentsjs": "2.2.10",
+    "@polymer/iron-demo-helpers": "3.1.0",
+    "@webcomponents/webcomponentsjs": "^2.2.10",
     "concurrently": "4.1.0",
@@ -71,3 +71,3 @@ "gulp-babel": "8.0.0",
   ],
-  "gitHead": "d857f1d834ec0bd10fee57ad11f60eb37416db07"
+  "gitHead": "ff737f87266a717930bde80432ceb95c1d64c6e8"
 }

simple-colors.es6.js

@@ -6,3 +6,3 @@ /**
 import { html, PolymerElement } from "@polymer/polymer/polymer-element.js";
-import "./lib/simple-colors-styles.js";
+import { SimpleColorsStyles } from "./lib/simple-colors-styles.js";
 /**
@@ -40,3 +40,3 @@ * `simple-colors`
         name: "accentColor",
-        type: "String",
+        type: String,
         value: "grey",
@@ -51,3 +51,3 @@ reflectToAttribute: true,
         name: "dark",
-        type: "Boolean",
+        type: Boolean,
         value: false,
@@ -62,3 +62,3 @@ reflectToAttribute: true,
         name: "colors",
-        type: "Object",
+        type: Object,
         value: window.SimpleColorsStyles.colors,
@@ -75,2 +75,5 @@ notify: true
         reflectToAttribute: true
+      },
+      __utils: {
+        type: Object,
       }
@@ -83,9 +86,12 @@ };
   }
-
+  constructor() {
+    super();
+    this.__styles = window.SimpleColorsStyles.requestAvailability();
+    this.__utils = new SimpleColorsStyles();
+  }
   ready() {
     super.ready();
-    let styles = window.SimpleColorsStyles.requestAvailability();
     if (!this.inheritStyles) {
       let style = document.createElement("style"),
-        ruleList = styles.cssRules;
+        ruleList = this.__styles.cssRules;
       this.shadowRoot.appendChild(style);
@@ -101,12 +107,2 @@
   /**
-   * returns the maximum contrast to the shade
-   *
-   * @param {string} the shade
-   * @param {number} the shade with maximum contrast
-   */
-  maxContrastShade(shade) {
-    return this.__utils.maxContrastShade(shade);
-  }
-
-  /**
    * gets the current shade
@@ -207,3 +203,3 @@ *
 }
-customElements.define(SimpleColors.tag, SimpleColors);
+window.customElements.define(SimpleColors.tag, SimpleColors);
 export { SimpleColors };

simple-colors.js

@@ -6,3 +6,3 @@ /**
 import { html, PolymerElement } from "@polymer/polymer/polymer-element.js";
-import "./lib/simple-colors-styles.js";
+import { SimpleColorsStyles } from "./lib/simple-colors-styles.js";
 /**
@@ -40,3 +40,3 @@ * `simple-colors`
         name: "accentColor",
-        type: "String",
+        type: String,
         value: "grey",
@@ -51,3 +51,3 @@ reflectToAttribute: true,
         name: "dark",
-        type: "Boolean",
+        type: Boolean,
         value: false,
@@ -62,3 +62,3 @@ reflectToAttribute: true,
         name: "colors",
-        type: "Object",
+        type: Object,
         value: window.SimpleColorsStyles.colors,
@@ -75,2 +75,5 @@ notify: true
         reflectToAttribute: true
+      },
+      __utils: {
+        type: Object
       }
@@ -83,9 +86,12 @@ };
   }
-
+  constructor() {
+    super();
+    this.__styles = window.SimpleColorsStyles.requestAvailability();
+    this.__utils = new SimpleColorsStyles();
+  }
   ready() {
     super.ready();
-    let styles = window.SimpleColorsStyles.requestAvailability();
     if (!this.inheritStyles) {
       let style = document.createElement("style"),
-        ruleList = styles.cssRules;
+        ruleList = this.__styles.cssRules;
       this.shadowRoot.appendChild(style);
@@ -101,12 +107,2 @@
   /**
-   * returns the maximum contrast to the shade
-   *
-   * @param {string} the shade
-   * @param {number} the shade with maximum contrast
-   */
-  maxContrastShade(shade) {
-    return this.__utils.maxContrastShade(shade);
-  }
-
-  /**
    * gets the current shade
@@ -207,3 +203,3 @@ *
 }
-customElements.define(SimpleColors.tag, SimpleColors);
+window.customElements.define(SimpleColors.tag, SimpleColors);
 export { SimpleColors };

simple-colors.umd.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@polymer/polymer/polymer-element.js"),require("@polymer/polymer/lib/utils/render-status.js")):"function"==typeof define&&define.amd?define(["exports","@polymer/polymer/polymer-element.js","@polymer/polymer/lib/utils/render-status.js"],t):t((e=e||self).SimpleColors={},e.polymerElement_js)}(this,function(e,t){"use strict";function o(e){return(o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function f(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function l(e,t){for(var o=0;o<t.length;o++){var f=t[o];f.enumerable=f.enumerable||!1,f.configurable=!0,"value"in f&&(f.writable=!0),Object.defineProperty(e,f.key,f)}}function n(e,t,o){return t&&l(e.prototype,t),o&&l(e,o),e}function r(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&a(e,t)}function i(e){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function s(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function d(e,t,o){return(d="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,o){var f=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=i(e)););return e}(e,t);if(f){var l=Object.getOwnPropertyDescriptor(f,t);return l.get?l.get.call(o):l.value}})(e,t,o||e)}window.SimpleColorsStyles={},window.SimpleColorsStyles.instance=null,window.SimpleColorsStyles.colors={grey:["#ffffff","#eeeeee","#dddddd","#cccccc","#bbbbbb","#999999","#666666","#444444","#333333","#222222","#111111","#000000"],red:["#ffdddd","#ffaeae","#ff8f8f","#ff7474","#fd5151","#ff2222","#ee0000","#ac0000","#850000","#670000","#520000","#3f0000"],pink:["#ffe6f1","#ffa5cf","#ff87c0","#ff73b5","#fd60aa","#ff3996","#da004e","#b80042","#980036","#78002b","#5a0020","#440019"],purple:["#fce6ff","#f4affd","#f394ff","#f07cff","#ed61ff","#e200ff","#a500ba","#8a009b","#6c0079","#490052","#33003a","#200025"],"deep-purple":["#f3e4ff","#ddacff","#c97eff","#bb63f9","#b44aff","#a931ff","#7e00d8","#5d009f","#4c0081","#3a0063","#2a0049","#1d0033"],indigo:["#e5ddff","#c3b2ff","#af97ff","#9e82ff","#9373ff","#835fff","#3a00ff","#2801b0","#20008c","#160063","#100049","#0a0030"],blue:["#e2ecff","#acc9ff","#95baff","#74a5ff","#5892fd","#4083ff","#0059ff","#0041bb","#003494","#002569","#001947","#001333"],"light-blue":["#ddefff","#a1d1ff","#92c9ff","#65b3ff","#58adff","#41a1ff","#007ffc","#0066ca","#0055a8","#003f7d","#002850","#001b36"],cyan:["#ddf8ff","#9beaff","#77e2ff","#33d4ff","#1ccfff","#00c9ff","#009dc7","#007999","#005970","#003f50","#002c38","#001a20"],teal:["#d9fff0","#98ffd7","#79ffcb","#56ffbd","#29ffac","#00ff9c","#009d75","#007658","#004e3a","#003829","#002a20","#001b14"],green:["#e1ffeb","#acffc9","#79ffa7","#49ff88","#24ff70","#00f961","#008c37","#00762e","#005a23","#003d18","#002a11","#001d0c"],"light-green":["#ebffdb","#c7ff9b","#b1ff75","#a1fd5a","#8efd38","#6fff00","#429d00","#357f00","#296100","#1b3f00","#143000","#0d2000"],lime:["#f1ffd2","#dfff9b","#d4ff77","#caff58","#bdff2d","#aeff00","#649900","#4d7600","#3b5a00","#293f00","#223400","#182400"],yellow:["#ffffd5","#ffffac","#ffff90","#ffff7c","#ffff3a","#f6f600","#929100","#787700","#585700","#454400","#303000","#242400"],amber:["#fff2d4","#ffdf92","#ffd677","#ffcf5e","#ffc235","#ffc500","#b28900","#876800","#614b00","#413200","#302500","#221a00"],orange:["#ffebd7","#ffca92","#ffbd75","#ffb05c","#ff9e36","#ff9625","#e56a00","#ae5100","#833d00","#612d00","#3d1c00","#2c1400"],"deep-orange":["#ffe7e0","#ffb299","#ffa588","#ff8a64","#ff7649","#ff6c3c","#f53100","#b92500","#8a1c00","#561100","#3a0c00","#240700"],brown:["#f0e2de","#e5b8aa","#c59485","#b68373","#ac7868","#a47060","#85574a","#724539","#5b3328","#3b1e15","#2c140e","#200e09"],"blue-grey":["#e7eff1","#b1c5ce","#9badb6","#8d9fa7","#7a8f98","#718892","#56707c","#40535b","#2f3e45","#1e282c","#182023","#0f1518"]},window.SimpleColorsStyles.makeVariable=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"grey",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1;return["--simple-colors",arguments.length>2&&void 0!==arguments[2]?arguments[2]:"default","theme",e,t].join("-")},window.SimpleColorsStyles.addThemeVariables=function(e,t){var o=[];for(var f in window.SimpleColorsStyles.colors)o.push(window.SimpleColorsStyles.addColorShades(e,f,window.SimpleColorsStyles.colors[f],t));return o.join("")},window.SimpleColorsStyles.addColorShades=function(e,t,o,f){for(var l=[],n=0;n<o.length;n++){var r=window.SimpleColorsStyles.makeVariable(t,n+1,e),i=f?o[window.SimpleColorsStyles.invertIndex(n)]:o[n];l.push(r+":"+i+"; ")}return l.join("")},window.SimpleColorsStyles.addCssVariables=function(e){if("undefined"!==o(e)){var t=window.SimpleColorsStyles.colors.grey;return e.insertRule(window.SimpleColorsStyles.makeRule("html",window.SimpleColorsStyles.addColorShades("default","accent",t,!1)+window.SimpleColorsStyles.addThemeVariables("default",!1)),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule("body",window.SimpleColorsStyles.addColorShades("fixed","accent",t,!1)+window.SimpleColorsStyles.addThemeVariables("fixed",!1)),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule("body[dark], [dark]",window.SimpleColorsStyles.addColorShades("default","accent",t,!0)+window.SimpleColorsStyles.addThemeVariables("default",!0)),e.cssRules.length),e}},window.SimpleColorsStyles.addAccentVariables=function(e){if("undefined"!==o(e)){for(var t in window.SimpleColorsStyles.colors)e.insertRule(window.SimpleColorsStyles.makeRule('body[accent-color="'.concat(t,'"], [accent-color="').concat(t,'"]'),[window.SimpleColorsStyles.addColorShades("default","accent",window.SimpleColorsStyles.colors[t],!1),window.SimpleColorsStyles.addColorShades("fixed","accent",window.SimpleColorsStyles.colors[t],!1)].join("")),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule('body[dark][accent-color="'.concat(t,'"], [dark][accent-color="').concat(t,'"]'),[window.SimpleColorsStyles.addColorShades("default","accent",window.SimpleColorsStyles.colors[t],!0)].join("")),e.cssRules.length);return e}},window.SimpleColorsStyles.makeRule=function(e,t){return e+" {\n"+t+"\n}\n"},window.SimpleColorsStyles.invertIndex=function(e){return window.SimpleColorsStyles.colors.grey.length-1-parseInt(e)};function c(){var e,t,o=(e=["\n      <style></style>\n      <slot></slot>\n    "],t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}})));return c=function(){return o},o}window.SimpleColorsStyles.requestAvailability=function(){if(null==window.SimpleColorsStyles.instance){var e=document.createElement("style");document.head.appendChild(e),window.SimpleColorsStyles.addCssVariables(e.sheet),window.SimpleColorsStyles.addAccentVariables(e.sheet),window.SimpleColorsStyles.instance=e.sheet}return window.SimpleColorsStyles.instance};var u=function(e){function o(){return f(this,o),s(this,i(o).apply(this,arguments))}return r(o,t.PolymerElement),n(o,[{key:"ready",value:function(){d(i(o.prototype),"ready",this).call(this);var e=window.SimpleColorsStyles.requestAvailability();if(!this.inheritStyles){var t=document.createElement("style"),f=e.cssRules;this.shadowRoot.appendChild(t);var l=!0,n=!1,r=void 0;try{for(var a,s=f[Symbol.iterator]();!(l=(a=s.next()).done);l=!0){var c=a.value.cssText;t.innerText+=c}}catch(e){n=!0,r=e}finally{try{l||null==s.return||s.return()}finally{if(n)throw r}}}}},{key:"maxContrastShade",value:function(e){return this.__utils.maxContrastShade(e)}},{key:"invertShade",value:function(e){return this.__utils.invertShade(e)}},{key:"getColorInfo",value:function(e){return this.__utils.getColorInfo(e)}},{key:"makeVariable",value:function(){arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]&&arguments[1],arguments.length>2&&void 0!==arguments[2]&&arguments[2];return this.__utils.makeVariable("grey",1,"default")}},{key:"getContrastingColors",value:function(e,t,o){return this.__utils.getContrastingColors(e,t,o)}},{key:"getContrastingShades",value:function(e,t,o,f){return this.__utils.getContrastingShades(e,t,o,f)}},{key:"isContrastCompliant",value:function(e,t,o,f,l){return this.__utils.isContrastCompliant(e,t,o,f,l)}}],[{key:"template",get:function(){return t.html(c())}},{key:"properties",get:function(){return{accentColor:{name:"accentColor",type:"String",value:"grey",reflectToAttribute:!0,notify:!0},dark:{name:"dark",type:"Boolean",value:!1,reflectToAttribute:!0,notify:!0},colors:{name:"colors",type:"Object",value:window.SimpleColorsStyles.colors,notify:!0},inheritStyles:{name:"inheritStyles",type:Boolean,value:!1,reflectToAttribute:!0}}}},{key:"tag",get:function(){return"simple-colors"}}]),o}();customElements.define(u.tag,u),e.SimpleColors=u,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@polymer/polymer/polymer-element.js")):"function"==typeof define&&define.amd?define(["exports","@polymer/polymer/polymer-element.js"],t):t((e=e||self).SimpleColors={},e.polymerElement_js)}(this,function(e,t){"use strict";function o(e){return(o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function l(e,t){for(var o=0;o<t.length;o++){var n=t[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function r(e,t,o){return t&&l(e.prototype,t),o&&l(e,o),e}function f(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&a(e,t)}function i(e){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function s(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function c(e,t,o){return(c="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,o){var n=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=i(e)););return e}(e,t);if(n){var l=Object.getOwnPropertyDescriptor(n,t);return l.get?l.get.call(o):l.value}})(e,t,o||e)}window.SimpleColorsStyles={},window.SimpleColorsStyles.instance=null,window.SimpleColorsStyles.colors={grey:["#ffffff","#eeeeee","#dddddd","#cccccc","#bbbbbb","#999999","#666666","#444444","#333333","#222222","#111111","#000000"],red:["#ffdddd","#ffaeae","#ff8f8f","#ff7474","#fd5151","#ff2222","#ee0000","#ac0000","#850000","#670000","#520000","#3f0000"],pink:["#ffe6f1","#ffa5cf","#ff87c0","#ff73b5","#fd60aa","#ff3996","#da004e","#b80042","#980036","#78002b","#5a0020","#440019"],purple:["#fce6ff","#f4affd","#f394ff","#f07cff","#ed61ff","#e200ff","#a500ba","#8a009b","#6c0079","#490052","#33003a","#200025"],"deep-purple":["#f3e4ff","#ddacff","#c97eff","#bb63f9","#b44aff","#a931ff","#7e00d8","#5d009f","#4c0081","#3a0063","#2a0049","#1d0033"],indigo:["#e5ddff","#c3b2ff","#af97ff","#9e82ff","#9373ff","#835fff","#3a00ff","#2801b0","#20008c","#160063","#100049","#0a0030"],blue:["#e2ecff","#acc9ff","#95baff","#74a5ff","#5892fd","#4083ff","#0059ff","#0041bb","#003494","#002569","#001947","#001333"],"light-blue":["#ddefff","#a1d1ff","#92c9ff","#65b3ff","#58adff","#41a1ff","#007ffc","#0066ca","#0055a8","#003f7d","#002850","#001b36"],cyan:["#ddf8ff","#9beaff","#77e2ff","#33d4ff","#1ccfff","#00c9ff","#009dc7","#007999","#005970","#003f50","#002c38","#001a20"],teal:["#d9fff0","#98ffd7","#79ffcb","#56ffbd","#29ffac","#00ff9c","#009d75","#007658","#004e3a","#003829","#002a20","#001b14"],green:["#e1ffeb","#acffc9","#79ffa7","#49ff88","#24ff70","#00f961","#008c37","#00762e","#005a23","#003d18","#002a11","#001d0c"],"light-green":["#ebffdb","#c7ff9b","#b1ff75","#a1fd5a","#8efd38","#6fff00","#429d00","#357f00","#296100","#1b3f00","#143000","#0d2000"],lime:["#f1ffd2","#dfff9b","#d4ff77","#caff58","#bdff2d","#aeff00","#649900","#4d7600","#3b5a00","#293f00","#223400","#182400"],yellow:["#ffffd5","#ffffac","#ffff90","#ffff7c","#ffff3a","#f6f600","#929100","#787700","#585700","#454400","#303000","#242400"],amber:["#fff2d4","#ffdf92","#ffd677","#ffcf5e","#ffc235","#ffc500","#b28900","#876800","#614b00","#413200","#302500","#221a00"],orange:["#ffebd7","#ffca92","#ffbd75","#ffb05c","#ff9e36","#ff9625","#e56a00","#ae5100","#833d00","#612d00","#3d1c00","#2c1400"],"deep-orange":["#ffe7e0","#ffb299","#ffa588","#ff8a64","#ff7649","#ff6c3c","#f53100","#b92500","#8a1c00","#561100","#3a0c00","#240700"],brown:["#f0e2de","#e5b8aa","#c59485","#b68373","#ac7868","#a47060","#85574a","#724539","#5b3328","#3b1e15","#2c140e","#200e09"],"blue-grey":["#e7eff1","#b1c5ce","#9badb6","#8d9fa7","#7a8f98","#718892","#56707c","#40535b","#2f3e45","#1e282c","#182023","#0f1518"]},window.SimpleColorsStyles.makeVariable=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"grey",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1;return["--simple-colors",arguments.length>2&&void 0!==arguments[2]?arguments[2]:"default","theme",e,t].join("-")},window.SimpleColorsStyles.addThemeVariables=function(e,t){var o=[];for(var n in window.SimpleColorsStyles.colors)o.push(window.SimpleColorsStyles.addColorShades(e,n,window.SimpleColorsStyles.colors[n],t));return o.join("")},window.SimpleColorsStyles.addColorShades=function(e,t,o,n){for(var l=[],r=0;r<o.length;r++){var f=window.SimpleColorsStyles.makeVariable(t,r+1,e),i=n?o[window.SimpleColorsStyles.invertIndex(r)]:o[r];l.push(f+":"+i+"; ")}return l.join("")},window.SimpleColorsStyles.addCssVariables=function(e){if("undefined"!==o(e)){var t=window.SimpleColorsStyles.colors.grey;return e.insertRule(window.SimpleColorsStyles.makeRule("html",window.SimpleColorsStyles.addColorShades("default","accent",t,!1)+window.SimpleColorsStyles.addThemeVariables("default",!1)),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule("body",window.SimpleColorsStyles.addColorShades("fixed","accent",t,!1)+window.SimpleColorsStyles.addThemeVariables("fixed",!1)),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule("body[dark], [dark]",window.SimpleColorsStyles.addColorShades("default","accent",t,!0)+window.SimpleColorsStyles.addThemeVariables("default",!0)),e.cssRules.length),e}},window.SimpleColorsStyles.addAccentVariables=function(e){if("undefined"!==o(e)){for(var t in window.SimpleColorsStyles.colors)e.insertRule(window.SimpleColorsStyles.makeRule('body[accent-color="'.concat(t,'"], [accent-color="').concat(t,'"]'),[window.SimpleColorsStyles.addColorShades("default","accent",window.SimpleColorsStyles.colors[t],!1),window.SimpleColorsStyles.addColorShades("fixed","accent",window.SimpleColorsStyles.colors[t],!1)].join("")),e.cssRules.length),e.insertRule(window.SimpleColorsStyles.makeRule('body[dark][accent-color="'.concat(t,'"], [dark][accent-color="').concat(t,'"]'),[window.SimpleColorsStyles.addColorShades("default","accent",window.SimpleColorsStyles.colors[t],!0)].join("")),e.cssRules.length);return e}},window.SimpleColorsStyles.makeRule=function(e,t){return e+" {\n"+t+"\n}\n"},window.SimpleColorsStyles.invertIndex=function(e){return window.SimpleColorsStyles.colors.grey.length-1-parseInt(e)};var d=function(e){function o(){return n(this,o),s(this,i(o).apply(this,arguments))}return f(o,t.PolymerElement),r(o,[{key:"getColorInfo",value:function(e){var t=e.replace(/(simple-colors-)?(-text)?(-border)?/g,"").split("-theme-"),o=t.length>0?t[0]:"default",n=t.length>0?t[1].split("-"):t[0].split("-");return{theme:o,color:n.length>1?n.slice(1,n.length-1).join("-"):"grey",shade:n.length>1?n[n.length-1]:"1"}}},{key:"makeVariable",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"grey",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1;return["--simple-colors",arguments.length>2&&void 0!==arguments[2]?arguments[2]:"default","theme",e,t].join("-")}},{key:"getContrastingShades",value:function(e,t,o,n){var l="grey"===t||"grey"===n?"greyColor":"colorColor",r=e?"aaLarge":"aa",f=parseInt(o)+1,i=this.contrasts[l][r][f];return Array(i.max-i.min+1).fill().map(function(e,t){return i.min+t})}},{key:"getContrastingColors",value:function(e,t,o){var n=this,l={};return Object.keys(this.colors).forEach(function(r){l[r]=n.getContrastingShades(o,e,t,r)}),l.color}},{key:"isContrastCompliant",value:function(e,t,o,n,l){var r="grey"===t||"grey"===n?"greyColor":"colorColor",f=e?"aaLarge":"aa",i=parseInt(o)+1,a=this.contrasts[r][f][i];return l>=a.min&&ontrastShade>=a.max}},{key:"indexToShade",value:function(e){return parseInt(e)+1}},{key:"shadeToIndex",value:function(e){return parseInt(e)-1}},{key:"invertShade",value:function(e){return this.colors.grey.length+1-parseInt(e)}}],[{key:"properties",get:function(){return{colors:{type:Object,value:window.SimpleColorsStyles.colors},contrasts:{type:Object,value:{greyColor:{aaLarge:[{min:7,max:12},{min:7,max:12},{min:7,max:12},{min:7,max:12},{min:8,max:12},{min:10,max:12},{min:1,max:3},{min:1,max:5},{min:1,max:6},{min:1,max:6},{min:1,max:6},{min:1,max:6}],aa:[{min:7,max:12},{min:7,max:12},{min:7,max:12},{min:8,max:12},{min:8,max:12},{min:11,max:12},{min:1,max:2},{min:1,max:7},{min:1,max:7},{min:1,max:6},{min:1,max:6},{min:1,max:6}]},colorColor:{aaLarge:[{min:7,max:12},{min:7,max:12},{min:8,max:12},{min:9,max:12},{min:10,max:12},{min:11,max:12},{min:1,max:2},{min:1,max:3},{min:1,max:4},{min:1,max:5},{min:1,max:6},{min:1,max:6}],aa:[{min:8,max:12},{min:8,max:12},{min:9,max:12},{min:9,max:12},{min:11,max:12},{min:12,max:12},{min:1,max:1},{min:1,max:2},{min:1,max:4},{min:1,max:4},{min:1,max:5},{min:1,max:5}]}}}}}},{key:"tag",get:function(){return"simple-colors-styles"}}]),o}();function m(){var e,t,o=(e=["\n      <style></style>\n      <slot></slot>\n    "],t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}})));return m=function(){return o},o}window.customElements.define(d.tag,d),window.SimpleColorsStyles.requestAvailability=function(){if(null==window.SimpleColorsStyles.instance){var e=document.createElement("style");document.head.appendChild(e),window.SimpleColorsStyles.addCssVariables(e.sheet),window.SimpleColorsStyles.addAccentVariables(e.sheet),window.SimpleColorsStyles.instance=e.sheet}return window.SimpleColorsStyles.instance};var u=function(e){function o(){var e;return n(this,o),(e=s(this,i(o).call(this))).__styles=window.SimpleColorsStyles.requestAvailability(),e.__utils=new d,e}return f(o,t.PolymerElement),r(o,null,[{key:"template",get:function(){return t.html(m())}},{key:"properties",get:function(){return{accentColor:{name:"accentColor",type:String,value:"grey",reflectToAttribute:!0,notify:!0},dark:{name:"dark",type:Boolean,value:!1,reflectToAttribute:!0,notify:!0},colors:{name:"colors",type:Object,value:window.SimpleColorsStyles.colors,notify:!0},inheritStyles:{name:"inheritStyles",type:Boolean,value:!1,reflectToAttribute:!0},__utils:{type:Object}}}},{key:"tag",get:function(){return"simple-colors"}}]),r(o,[{key:"ready",value:function(){if(c(i(o.prototype),"ready",this).call(this),!this.inheritStyles){var e=document.createElement("style"),t=this.__styles.cssRules;this.shadowRoot.appendChild(e);var n=!0,l=!1,r=void 0;try{for(var f,a=t[Symbol.iterator]();!(n=(f=a.next()).done);n=!0){var s=f.value.cssText;e.innerText+=s}}catch(e){l=!0,r=e}finally{try{n||null==a.return||a.return()}finally{if(l)throw r}}}}},{key:"invertShade",value:function(e){return this.__utils.invertShade(e)}},{key:"getColorInfo",value:function(e){return this.__utils.getColorInfo(e)}},{key:"makeVariable",value:function(){arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]&&arguments[1],arguments.length>2&&void 0!==arguments[2]&&arguments[2];return this.__utils.makeVariable("grey",1,"default")}},{key:"getContrastingColors",value:function(e,t,o){return this.__utils.getContrastingColors(e,t,o)}},{key:"getContrastingShades",value:function(e,t,o,n){return this.__utils.getContrastingShades(e,t,o,n)}},{key:"isContrastCompliant",value:function(e,t,o,n,l){return this.__utils.isContrastCompliant(e,t,o,n,l)}}]),o}();window.customElements.define(u.tag,u),e.SimpleColors=u,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=simple-colors.umd.js.map

src/simple-colors.js

@@ -6,3 +6,3 @@ /**
 import { html, PolymerElement } from "@polymer/polymer/polymer-element.js";
-import "./lib/simple-colors-styles.js";
+import { SimpleColorsStyles } from "./lib/simple-colors-styles.js";
 /**
@@ -40,3 +40,3 @@ * `simple-colors`
         name: "accentColor",
-        type: "String",
+        type: String,
         value: "grey",
@@ -51,3 +51,3 @@ reflectToAttribute: true,
         name: "dark",
-        type: "Boolean",
+        type: Boolean,
         value: false,
@@ -62,3 +62,3 @@ reflectToAttribute: true,
         name: "colors",
-        type: "Object",
+        type: Object,
         value: window.SimpleColorsStyles.colors,
@@ -75,2 +75,5 @@ notify: true
         reflectToAttribute: true
+      },
+      __utils: {
+        type: Object
       }
@@ -83,9 +86,12 @@ };
   }
-
+  constructor() {
+    super();
+    this.__styles = window.SimpleColorsStyles.requestAvailability();
+    this.__utils = new SimpleColorsStyles();
+  }
   ready() {
     super.ready();
-    let styles = window.SimpleColorsStyles.requestAvailability();
     if (!this.inheritStyles) {
       let style = document.createElement("style"),
-        ruleList = styles.cssRules;
+        ruleList = this.__styles.cssRules;
       this.shadowRoot.appendChild(style);
@@ -101,12 +107,2 @@
   /**
-   * returns the maximum contrast to the shade
-   *
-   * @param {string} the shade
-   * @param {number} the shade with maximum contrast
-   */
-  maxContrastShade(shade) {
-    return this.__utils.maxContrastShade(shade);
-  }
-
-  /**
    * gets the current shade
@@ -207,3 +203,3 @@ *
 }
-customElements.define(SimpleColors.tag, SimpleColors);
+window.customElements.define(SimpleColors.tag, SimpleColors);
 export { SimpleColors };

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

Improved metrics

Total package byte prevSize

595003

increased by1.15%

Lines of code

15287

increased by0.34%

Dependency changes

• Updated@lrnwebcomponents/simple-picker@^2.1.4