@glitz/core - npm Package Compare versions

Comparing version 1.1.0-beta.8 to 1.1.0-beta.9

cjs/index.development.js

@@ -544,5 +544,2 @@ 'use strict';
     function InjectorClient(styleElement, incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
-        if (incrementClassHash === void 0) { incrementClassHash = createHashCounter(); }
-        if (incrementKeyframesHash === void 0) { incrementKeyframesHash = createHashCounter(); }
-        if (incrementFontFaceHash === void 0) { incrementFontFaceHash = createHashCounter(); }
         var _this = this;
@@ -605,13 +602,15 @@ var plainDictionary = {};
         var _this = this;
-        var classHasher = createHashCounter(options.prefix);
-        var keyframesHasher = createHashCounter(options.prefix);
+        var prefix = options.prefix;
+        var classHasher = createHashCounter(prefix);
+        var keyframesHasher = createHashCounter(prefix);
+        var fontFaceHasher = createHashCounter(prefix);
         var mediaOrderOption = options.mediaOrder;
         var mediaSheets = {};
         var initialMediaSheet = null;
-        var mainInjector;
-        var mediaInjectors = {};
+        var plain;
+        var mediaIndex = {};
         var injector = function (media) {
             if (media) {
-                if (mediaInjectors[media]) {
-                    return mediaInjectors[media];
+                if (mediaIndex[media]) {
+                    return mediaIndex[media];
                 }
@@ -626,10 +625,10 @@ var element = (mediaSheets[media] = createStyleElement(media));
                 insertStyleElement(element, insertBefore);
-                return (mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher));
+                return (mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
             else {
-                if (mainInjector) {
-                    return mainInjector;
+                if (plain) {
+                    return plain;
                 }
                 var element = insertStyleElement(createStyleElement(media), initialMediaSheet);
-                return (mainInjector = new InjectorClient(element, classHasher, keyframesHasher));
+                return (plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
@@ -660,6 +659,6 @@ };
                     mediaSheets[media] = element;
-                    mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher);
+                    mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
                 else {
-                    mainInjector = new InjectorClient(element, classHasher, keyframesHasher);
+                    plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
@@ -666,0 +665,0 @@ }

cjs/index.production.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(r,n){r.__proto__=n}||function(r,n){for(var e in n)n.hasOwnProperty(e)&&(r[e]=n[e])};function n(n,e){function t(){this.constructor=n}r(n,e),n.prototype=null===e?Object.create(e):(t.prototype=e.prototype,new t)}var e=Object.assign||function(r){for(var n,e=1,t=arguments.length;e<t;e++)for(var i in n=arguments[e])Object.prototype.hasOwnProperty.call(n,i)&&(r[i]=n[i]);return r};function t(r){var n,e="";for(n in r){var t=r[n];if("object"==typeof t)for(var o=0,a=t;o<a.length;o++){var f=a[o];e&&(e+=";"),e+=i(n,f)}else e&&(e+=";"),e+=i(n,t)}return e}function i(r,n){return"string"==typeof n||"number"==typeof n?u(r)+":"+n:""}var o=/[A-Z]/g,a=/^(ms|moz|webkit)/,f={};function u(r){return r in f?f[r]:f[r]=r.replace(o,"-$&").replace(a,"-$&").toLowerCase()}var c="__glitz__",s="animationName",v="fontFamily",l=function(){return function(r,n,e){var t=function(n,e,i,o){for(var a in n){var f=n[a];if("string"!=typeof f&&"number"!=typeof f)if("object"!=typeof f);else{if(":"===a[0]){t(f,e,i,(o||"")+a);continue}if(0===a.indexOf("@media")){var u=(i?i+" and ":"")+a.slice(7);t(f,e,u,o);continue}if("@keyframes"===a||a===s){var c=y(e,i,o);if(s in c)continue;var l=r().injectKeyframesRule(f);c[s]=l;continue}if("@font-face"===a||a===v){if(c=y(e,i,o),v in c)continue;for(var p="",m=0,d=Array.isArray(f)?f:[f];m<d.length;m++){var g=d[m];p&&(p+=","),p+="string"==typeof g?g:r().injectFontFaceRule(g)}c[v]=p;continue}if(Array.isArray(f)){y(e,i,o)[a]=f;continue}var h=!0,j={};for(var x in f){var b=f[x],_=typeof b;if(!("string"===_||"number"===_||Array.isArray(b)||"object"===_&&"animation"===a&&"name"===x||"font"===a&&"family"===x)){h=!1;break}"x"!==x?"y"!==x?j[a+x[0].toUpperCase()+x.slice(1)]=b:(j[a+"Top"]=b,j[a+"Bottom"]=b):(j[a+"Left"]=b,j[a+"Right"]=b)}h&&t(j,e,i,o)}else a in(c=y(e,i,o))||(c[a]=f)}return e},i=function(r,e){var t,i=((t={})[r]=e,t);return n?n(i):i},o=[{},{},{},{}],a=!1===e?function(e,t,i){return" "+r(t).injectClassRule(n?n(e):e,i)}:function(n,e,t){var a="";for(var f in n){var u=n[f];if("string"!=typeof u&&"number"!=typeof u)Array.isArray(u)&&(a+=" "+r(e).injectClassRule(i(f,u),t));else{var c=y(o,e,t),s=c[f]=c[f]||{};if(s[u]){a+=" "+s[u];continue}var v=r(e).injectClassRule(i(f,u),t);v&&(s[u]=v),a+=" "+v}}return a};this.injectStyle=function(r){var n=[{},{},{},{}];if(Array.isArray(r))for(var e=r.length;e>=0;e--)t(r[e],n);else t(r,n);var i=a(n[0]);for(var o in n[1])i+=a(n[1][o],void 0,o);for(var f in n[2])i+=a(n[2][f],f);for(var f in n[3])for(var o in n[3][f])i+=a(n[3][f][o],f,o);return i.slice(1)}}}();function y(r,n,e){if(n&&e){var t=r[3][n]=r[3][n]||{};return t[e]=t[e]||{}}return n?r[2][n]=r[2][n]||{}:e?r[1][e]=r[1][e]||{}:r[0]}function p(r,n){var e=r.sheet;e.insertRule(n,e.cssRules.length)}function m(r){var n=document.createElement("style");return r&&(n.media=r),n}function d(r,n){return document.head.insertBefore(r,n),r}function g(r){void 0===r&&(r="");var n=0,e=10,t=35,i=1,o=function(){var a=n+e;return a===t&&(e+=9*(t+1),t=Math.pow(36,++i)-1),n++,373===a?o():r+a.toString(36)};return o}function h(r,n){return r+"{"+n+"}"}var j=/\.([a-z0-9])(:[^{]+)?\{([^}]+)\}/g,x=/@keyframes ([a-z0-9])\{((?:[a-z0-9%]+\{[^}]+\})+)\}/g,b=/@font-face \{([^}]+)\}/g,_=/;?font-family:([^;}]+)/,O=function(r){function e(n,e,t,i){void 0===e&&(e=g()),void 0===t&&(t=g()),void 0===i&&(i=g());var o={},a={},f={},u={},c={},s=n.textContent;if(s){for(var v=void 0;v=j.exec(s);){if(e(),v[2])(a[v[2]]=a[v[2]]||{})[v[3]]=v[1];else o[v[3]]=v[1]}for(;v=x.exec(s);)t(),f[v[2]]=v[1];for(;v=b.exec(s);){var l=_.exec(v[1]);i(),l&&(u[v[1]]=l[1],c[v[1].replace(_,"")]=l[1])}}return r.call(this,o,a,f,u,c,e,t,i,function(r,e,t){var i=function(r,n,e){return void 0===e&&(e=""),"."+h(r+e,n)}(r,e,t);p(n,i)},function(r,e){var t=function(r,n){return"@keyframes "+h(r,n)}(r,e);p(n,t)},function(r){var e=function(r){return"@font-face {"+r+"}"}(r);p(n,e)})||this}return n(e,r),e}(function(){return function(r,n,i,o,a,f,u,c,s,v,l){this.injectClassRule=function(e,i){var o=t(e);if(o){var a=i?n[i]=n[i]||{}:r,u=a[o];if(u)return u;var c=f();return a[o]=c,s&&s(c,o,i),c}return""},this.injectKeyframesRule=function(r){var n="";for(var e in r)n+=h(e,t(r[e]));if(n){var o=i[n];if(o)return o;var a=u();return i[n]=a,v&&v(a,n),a}return""},this.injectFontFaceRule=function(r){delete r.fontFamily;var n=t(r);if(n){var i=a[n];if(i)return i;var f=c(),u=t(e({},r,{fontFamily:f}));return o[u]=a[n]=f,l&&l(u),f}return""}}}()),A=function(r){function e(n,e){void 0===e&&(e={});var t,i,o=g(e.prefix),a=g(e.prefix),f=e.mediaOrder,u={},s=null,v={};if(t=r.call(this,function(r){if(r){if(v[r])return v[r];var n=u[r]=m(r),e=null;if(f){var t=Object.keys(u).sort(f);s=u[t[0]],e=u[t[t.indexOf(r)+1]]||null}return d(n,e),v[r]=new O(n,o,a)}if(i)return i;n=d(m(r),s);return i=new O(n,o,a)},e.transformer,e.atomic)||this,"auto"===n&&(n=document.getElementsByClassName(c)),n)for(var l=0,y=n;l<y.length;l++){var p=y[l],h=p.media;h?(s||(s=p),u[h]=p,v[h]=new O(p,o,a)):i=new O(p,o,a)}return t}return n(e,r),e}(l);function R(r){var n,e="";for(n in r){e&&(e+=" and ");var t=r[n];e+=!0===t?"("+u(n)+")":"("+u(n)+": "+("string"==typeof t?t:w(n,"h")||w(n,"t")?t+"px":w(n,"n")?t+"dpi":t)+")"}return e}function w(r,n){return r.indexOf(n)===r.length-1}exports.default=A,exports.media=function(r,n){return(e={})["@media "+("string"==typeof r?r:R(r))]=n,e;var e},exports.query=R,exports.pseudo=function(r,n){return(e={})[r]=n,e;var e},exports.compose=function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];return r.reduceRight(function(r,n){return function(e){return n(r(e))}})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(r,n){r.__proto__=n}||function(r,n){for(var e in n)n.hasOwnProperty(e)&&(r[e]=n[e])};function n(n,e){function t(){this.constructor=n}r(n,e),n.prototype=null===e?Object.create(e):(t.prototype=e.prototype,new t)}var e=Object.assign||function(r){for(var n,e=1,t=arguments.length;e<t;e++)for(var i in n=arguments[e])Object.prototype.hasOwnProperty.call(n,i)&&(r[i]=n[i]);return r};function t(r){var n,e="";for(n in r){var t=r[n];if("object"==typeof t)for(var o=0,a=t;o<a.length;o++){var f=a[o];e&&(e+=";"),e+=i(n,f)}else e&&(e+=";"),e+=i(n,t)}return e}function i(r,n){return"string"==typeof n||"number"==typeof n?u(r)+":"+n:""}var o=/[A-Z]/g,a=/^(ms|moz|webkit)/,f={};function u(r){return r in f?f[r]:f[r]=r.replace(o,"-$&").replace(a,"-$&").toLowerCase()}var c="__glitz__",s="animationName",v="fontFamily",l=function(){return function(r,n,e){var t=function(n,e,i,o){for(var a in n){var f=n[a];if("string"!=typeof f&&"number"!=typeof f)if("object"!=typeof f);else{if(":"===a[0]){t(f,e,i,(o||"")+a);continue}if(0===a.indexOf("@media")){var u=(i?i+" and ":"")+a.slice(7);t(f,e,u,o);continue}if("@keyframes"===a||a===s){var c=y(e,i,o);if(s in c)continue;var l=r().injectKeyframesRule(f);c[s]=l;continue}if("@font-face"===a||a===v){if(c=y(e,i,o),v in c)continue;for(var p="",m=0,d=Array.isArray(f)?f:[f];m<d.length;m++){var g=d[m];p&&(p+=","),p+="string"==typeof g?g:r().injectFontFaceRule(g)}c[v]=p;continue}if(Array.isArray(f)){y(e,i,o)[a]=f;continue}var h=!0,j={};for(var x in f){var b=f[x],_=typeof b;if(!("string"===_||"number"===_||Array.isArray(b)||"object"===_&&"animation"===a&&"name"===x||"font"===a&&"family"===x)){h=!1;break}"x"!==x?"y"!==x?j[a+x[0].toUpperCase()+x.slice(1)]=b:(j[a+"Top"]=b,j[a+"Bottom"]=b):(j[a+"Left"]=b,j[a+"Right"]=b)}h&&t(j,e,i,o)}else a in(c=y(e,i,o))||(c[a]=f)}return e},i=function(r,e){var t,i=((t={})[r]=e,t);return n?n(i):i},o=[{},{},{},{}],a=!1===e?function(e,t,i){return" "+r(t).injectClassRule(n?n(e):e,i)}:function(n,e,t){var a="";for(var f in n){var u=n[f];if("string"!=typeof u&&"number"!=typeof u)Array.isArray(u)&&(a+=" "+r(e).injectClassRule(i(f,u),t));else{var c=y(o,e,t),s=c[f]=c[f]||{};if(s[u]){a+=" "+s[u];continue}var v=r(e).injectClassRule(i(f,u),t);v&&(s[u]=v),a+=" "+v}}return a};this.injectStyle=function(r){var n=[{},{},{},{}];if(Array.isArray(r))for(var e=r.length;e>=0;e--)t(r[e],n);else t(r,n);var i=a(n[0]);for(var o in n[1])i+=a(n[1][o],void 0,o);for(var f in n[2])i+=a(n[2][f],f);for(var f in n[3])for(var o in n[3][f])i+=a(n[3][f][o],f,o);return i.slice(1)}}}();function y(r,n,e){if(n&&e){var t=r[3][n]=r[3][n]||{};return t[e]=t[e]||{}}return n?r[2][n]=r[2][n]||{}:e?r[1][e]=r[1][e]||{}:r[0]}function p(r,n){var e=r.sheet;e.insertRule(n,e.cssRules.length)}function m(r){var n=document.createElement("style");return r&&(n.media=r),n}function d(r,n){return document.head.insertBefore(r,n),r}function g(r){void 0===r&&(r="");var n=0,e=10,t=35,i=1,o=function(){var a=n+e;return a===t&&(e+=9*(t+1),t=Math.pow(36,++i)-1),n++,373===a?o():r+a.toString(36)};return o}function h(r,n){return r+"{"+n+"}"}var j=/\.([a-z0-9])(:[^{]+)?\{([^}]+)\}/g,x=/@keyframes ([a-z0-9])\{((?:[a-z0-9%]+\{[^}]+\})+)\}/g,b=/@font-face \{([^}]+)\}/g,_=/;?font-family:([^;}]+)/,O=function(r){function e(n,e,t,i){var o={},a={},f={},u={},c={},s=n.textContent;if(s){for(var v=void 0;v=j.exec(s);){if(e(),v[2])(a[v[2]]=a[v[2]]||{})[v[3]]=v[1];else o[v[3]]=v[1]}for(;v=x.exec(s);)t(),f[v[2]]=v[1];for(;v=b.exec(s);){var l=_.exec(v[1]);i(),l&&(u[v[1]]=l[1],c[v[1].replace(_,"")]=l[1])}}return r.call(this,o,a,f,u,c,e,t,i,function(r,e,t){var i=function(r,n,e){return void 0===e&&(e=""),"."+h(r+e,n)}(r,e,t);p(n,i)},function(r,e){var t=function(r,n){return"@keyframes "+h(r,n)}(r,e);p(n,t)},function(r){var e=function(r){return"@font-face {"+r+"}"}(r);p(n,e)})||this}return n(e,r),e}(function(){return function(r,n,i,o,a,f,u,c,s,v,l){this.injectClassRule=function(e,i){var o=t(e);if(o){var a=i?n[i]=n[i]||{}:r,u=a[o];if(u)return u;var c=f();return a[o]=c,s&&s(c,o,i),c}return""},this.injectKeyframesRule=function(r){var n="";for(var e in r)n+=h(e,t(r[e]));if(n){var o=i[n];if(o)return o;var a=u();return i[n]=a,v&&v(a,n),a}return""},this.injectFontFaceRule=function(r){delete r.fontFamily;var n=t(r);if(n){var i=a[n];if(i)return i;var f=c(),u=t(e({},r,{fontFamily:f}));return o[u]=a[n]=f,l&&l(u),f}return""}}}()),A=function(r){function e(n,e){void 0===e&&(e={});var t,i,o=e.prefix,a=g(o),f=g(o),u=g(o),s=e.mediaOrder,v={},l=null,y={};if(t=r.call(this,function(r){if(r){if(y[r])return y[r];var n=v[r]=m(r),e=null;if(s){var t=Object.keys(v).sort(s);l=v[t[0]],e=v[t[t.indexOf(r)+1]]||null}return d(n,e),y[r]=new O(n,a,f,u)}if(i)return i;n=d(m(r),l);return i=new O(n,a,f,u)},e.transformer,e.atomic)||this,"auto"===n&&(n=document.getElementsByClassName(c)),n)for(var p=0,h=n;p<h.length;p++){var j=h[p],x=j.media;x?(l||(l=j),v[x]=j,y[x]=new O(j,a,f,u)):i=new O(j,a,f,u)}return t}return n(e,r),e}(l);function R(r){var n,e="";for(n in r){e&&(e+=" and ");var t=r[n];e+=!0===t?"("+u(n)+")":"("+u(n)+": "+("string"==typeof t?t:w(n,"h")||w(n,"t")?t+"px":w(n,"n")?t+"dpi":t)+")"}return e}function w(r,n){return r.indexOf(n)===r.length-1}exports.default=A,exports.media=function(r,n){return(e={})["@media "+("string"==typeof r?r:R(r))]=n,e;var e},exports.query=R,exports.pseudo=function(r,n){return(e={})[r]=n,e;var e},exports.compose=function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];return r.reduceRight(function(r,n){return function(e){return n(r(e))}})};

cjs/server.js

@@ -523,5 +523,2 @@ 'use strict';
     function InjectorServer(incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
-        if (incrementClassHash === void 0) { incrementClassHash = createHashCounter(); }
-        if (incrementKeyframesHash === void 0) { incrementKeyframesHash = createHashCounter(); }
-        if (incrementFontFaceHash === void 0) { incrementFontFaceHash = createHashCounter(); }
         var _this = this;
@@ -563,10 +560,12 @@ var plainDictionary = {};
         var _this = this;
-        var classHasher = createHashCounter(options.prefix);
-        var keyframesHasher = createHashCounter(options.prefix);
-        var mainInjector;
-        var mediaInjectors = {};
+        var prefix = options.prefix;
+        var classHasher = createHashCounter(prefix);
+        var keyframesHasher = createHashCounter(prefix);
+        var fontFaceHasher = createHashCounter(prefix);
+        var plain;
+        var mediaIndex = {};
         var injector = function (media) {
             return media
-                ? (mediaInjectors[media] = mediaInjectors[media] || new InjectorServer(classHasher, keyframesHasher))
-                : (mainInjector = mainInjector || new InjectorServer(classHasher, keyframesHasher));
+                ? (mediaIndex[media] = mediaIndex[media] || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher))
+                : (plain = plain || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher));
         };
@@ -577,17 +576,10 @@ _this = _super.call(this, injector, options.transformer, options.atomic) || this;
             var markup = '';
-            if (mainInjector) {
-                markup += "<style class=\"" + className + "\">" + mainInjector.getStyle() + "</style>";
+            if (plain) {
+                markup += "<style class=\"" + className + "\">" + plain.getStyle() + "</style>";
             }
-            if (options.mediaOrder) {
-                var orderedMedias = Object.keys(mediaInjectors).sort(options.mediaOrder);
-                for (var _i = 0, orderedMedias_1 = orderedMedias; _i < orderedMedias_1.length; _i++) {
-                    var media = orderedMedias_1[_i];
-                    markup += "<style class=\"" + className + "\" media=\"" + media + "\">" + mediaInjectors[media].getStyle() + "</style>";
-                }
+            var medias = options.mediaOrder ? Object.keys(mediaIndex).sort(options.mediaOrder) : Object.keys(mediaIndex);
+            for (var _i = 0, medias_1 = medias; _i < medias_1.length; _i++) {
+                var media = medias_1[_i];
+                markup += "<style class=\"" + className + "\" media=\"" + media + "\">" + mediaIndex[media].getStyle() + "</style>";
             }
-            else {
-                for (var media in mediaInjectors) {
-                    markup += "<style class=\"" + className + "\" media=\"" + media + "\">" + mediaInjectors[media].getStyle() + "</style>";
-                }
-            }
             return markup;
@@ -594,0 +586,0 @@ };

es6/client/GlitzClient.js

@@ -7,13 +7,15 @@ import Base, { DEFAULT_HYDRATE_CLASS_NAME } from '../core/Base';
     constructor(styleElements, options = {}) {
-        const classHasher = createHashCounter(options.prefix);
-        const keyframesHasher = createHashCounter(options.prefix);
+        const prefix = options.prefix;
+        const classHasher = createHashCounter(prefix);
+        const keyframesHasher = createHashCounter(prefix);
+        const fontFaceHasher = createHashCounter(prefix);
         const mediaOrderOption = options.mediaOrder;
         const mediaSheets = {};
         let initialMediaSheet = null;
-        let mainInjector;
-        const mediaInjectors = {};
+        let plain;
+        const mediaIndex = {};
         const injector = (media) => {
             if (media) {
-                if (mediaInjectors[media]) {
-                    return mediaInjectors[media];
+                if (mediaIndex[media]) {
+                    return mediaIndex[media];
                 }
@@ -28,10 +30,10 @@ const element = (mediaSheets[media] = createStyleElement(media));
                 insertStyleElement(element, insertBefore);
-                return (mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher));
+                return (mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
             else {
-                if (mainInjector) {
-                    return mainInjector;
+                if (plain) {
+                    return plain;
                 }
                 const element = insertStyleElement(createStyleElement(media), initialMediaSheet);
-                return (mainInjector = new InjectorClient(element, classHasher, keyframesHasher));
+                return (plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
@@ -61,6 +63,6 @@ };
                     mediaSheets[media] = element;
-                    mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher);
+                    mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
                 else {
-                    mainInjector = new InjectorClient(element, classHasher, keyframesHasher);
+                    plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
@@ -67,0 +69,0 @@ }

es6/client/InjectorClient.d.ts

 import Injector from '../core/Injector';
 export default class InjectorClient extends Injector {
-    constructor(styleElement: HTMLStyleElement, incrementClassHash?: () => string, incrementKeyframesHash?: () => string, incrementFontFaceHash?: () => string);
+    constructor(styleElement: HTMLStyleElement, incrementClassHash: () => string, incrementKeyframesHash: () => string, incrementFontFaceHash: () => string);
 }

es6/client/InjectorClient.js

@@ -5,3 +5,2 @@ // tslint:disable no-conditional-assignment
 import { formatClassRule, formatFontFaceRule, formatKeyframesRule } from '../utils/format';
-import { createHashCounter } from '../utils/hash';
 const CLASS_RULE_REGEX = /\.([a-z0-9])(:[^{]+)?\{([^}]+)\}/g;
@@ -12,3 +11,3 @@ const KEYFRAMES_REGEX = /@keyframes ([a-z0-9])\{((?:[a-z0-9%]+\{[^}]+\})+)\}/g;
 export default class InjectorClient extends Injector {
-    constructor(styleElement, incrementClassHash = createHashCounter(), incrementKeyframesHash = createHashCounter(), incrementFontFaceHash = createHashCounter()) {
+    constructor(styleElement, incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
         const plainDictionary = {};
@@ -15,0 +14,0 @@ const pseudoDictionary = {};

es6/server/GlitzServer.js

@@ -6,26 +6,21 @@ import Base, { DEFAULT_HYDRATE_CLASS_NAME } from '../core/Base';
     constructor(options = {}) {
-        const classHasher = createHashCounter(options.prefix);
-        const keyframesHasher = createHashCounter(options.prefix);
-        let mainInjector;
-        const mediaInjectors = {};
+        const prefix = options.prefix;
+        const classHasher = createHashCounter(prefix);
+        const keyframesHasher = createHashCounter(prefix);
+        const fontFaceHasher = createHashCounter(prefix);
+        let plain;
+        const mediaIndex = {};
         const injector = (media) => media
-            ? (mediaInjectors[media] = mediaInjectors[media] || new InjectorServer(classHasher, keyframesHasher))
-            : (mainInjector = mainInjector || new InjectorServer(classHasher, keyframesHasher));
+            ? (mediaIndex[media] = mediaIndex[media] || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher))
+            : (plain = plain || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher));
         super(injector, options.transformer, options.atomic);
         this.getStyleMarkup = (className = DEFAULT_HYDRATE_CLASS_NAME) => {
             let markup = '';
-            if (mainInjector) {
-                markup += `<style class="${className}">${mainInjector.getStyle()}</style>`;
+            if (plain) {
+                markup += `<style class="${className}">${plain.getStyle()}</style>`;
             }
-            if (options.mediaOrder) {
-                const orderedMedias = Object.keys(mediaInjectors).sort(options.mediaOrder);
-                for (const media of orderedMedias) {
-                    markup += `<style class="${className}" media="${media}">${mediaInjectors[media].getStyle()}</style>`;
-                }
+            const medias = options.mediaOrder ? Object.keys(mediaIndex).sort(options.mediaOrder) : Object.keys(mediaIndex);
+            for (const media of medias) {
+                markup += `<style class="${className}" media="${media}">${mediaIndex[media].getStyle()}</style>`;
             }
-            else {
-                for (const media in mediaInjectors) {
-                    markup += `<style class="${className}" media="${media}">${mediaInjectors[media].getStyle()}</style>`;
-                }
-            }
             return markup;
@@ -32,0 +27,0 @@ };

es6/server/InjectorServer.d.ts

 import Injector from '../core/Injector';
 export default class InjectorServer extends Injector {
     getStyle: () => void;
-    constructor(incrementClassHash?: () => string, incrementKeyframesHash?: () => string, incrementFontFaceHash?: () => string);
+    constructor(incrementClassHash: () => string, incrementKeyframesHash: () => string, incrementFontFaceHash: () => string);
 }

es6/server/InjectorServer.js

 import Injector from '../core/Injector';
 import { formatClassRule, formatFontFaceRule, formatKeyframesRule } from '../utils/format';
-import { createHashCounter } from '../utils/hash';
 export default class InjectorServer extends Injector {
-    constructor(incrementClassHash = createHashCounter(), incrementKeyframesHash = createHashCounter(), incrementFontFaceHash = createHashCounter()) {
+    constructor(incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
         const plainDictionary = {};
@@ -7,0 +6,0 @@ const pseudoDictionary = {};

jsm/index.js

@@ -496,3 +496,3 @@ function parseDeclarationBlock(declarations) {
 class InjectorClient extends Injector {
-    constructor(styleElement, incrementClassHash = createHashCounter(), incrementKeyframesHash = createHashCounter(), incrementFontFaceHash = createHashCounter()) {
+    constructor(styleElement, incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
         const plainDictionary = {};
@@ -549,13 +549,15 @@ const pseudoDictionary = {};
     constructor(styleElements, options = {}) {
-        const classHasher = createHashCounter(options.prefix);
-        const keyframesHasher = createHashCounter(options.prefix);
+        const prefix = options.prefix;
+        const classHasher = createHashCounter(prefix);
+        const keyframesHasher = createHashCounter(prefix);
+        const fontFaceHasher = createHashCounter(prefix);
         const mediaOrderOption = options.mediaOrder;
         const mediaSheets = {};
         let initialMediaSheet = null;
-        let mainInjector;
-        const mediaInjectors = {};
+        let plain;
+        const mediaIndex = {};
         const injector = (media) => {
             if (media) {
-                if (mediaInjectors[media]) {
-                    return mediaInjectors[media];
+                if (mediaIndex[media]) {
+                    return mediaIndex[media];
                 }
@@ -570,10 +572,10 @@ const element = (mediaSheets[media] = createStyleElement(media));
                 insertStyleElement(element, insertBefore);
-                return (mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher));
+                return (mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
             else {
-                if (mainInjector) {
-                    return mainInjector;
+                if (plain) {
+                    return plain;
                 }
                 const element = insertStyleElement(createStyleElement(media), initialMediaSheet);
-                return (mainInjector = new InjectorClient(element, classHasher, keyframesHasher));
+                return (plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher));
             }
@@ -603,6 +605,6 @@ };
                     mediaSheets[media] = element;
-                    mediaInjectors[media] = new InjectorClient(element, classHasher, keyframesHasher);
+                    mediaIndex[media] = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
                 else {
-                    mainInjector = new InjectorClient(element, classHasher, keyframesHasher);
+                    plain = new InjectorClient(element, classHasher, keyframesHasher, fontFaceHasher);
                 }
@@ -609,0 +611,0 @@ }

jsm/server.js

@@ -475,3 +475,3 @@ function parseDeclarationBlock(declarations) {
 class InjectorServer extends Injector {
-    constructor(incrementClassHash = createHashCounter(), incrementKeyframesHash = createHashCounter(), incrementFontFaceHash = createHashCounter()) {
+    constructor(incrementClassHash, incrementKeyframesHash, incrementFontFaceHash) {
         const plainDictionary = {};
@@ -507,26 +507,21 @@ const pseudoDictionary = {};
     constructor(options = {}) {
-        const classHasher = createHashCounter(options.prefix);
-        const keyframesHasher = createHashCounter(options.prefix);
-        let mainInjector;
-        const mediaInjectors = {};
+        const prefix = options.prefix;
+        const classHasher = createHashCounter(prefix);
+        const keyframesHasher = createHashCounter(prefix);
+        const fontFaceHasher = createHashCounter(prefix);
+        let plain;
+        const mediaIndex = {};
         const injector = (media) => media
-            ? (mediaInjectors[media] = mediaInjectors[media] || new InjectorServer(classHasher, keyframesHasher))
-            : (mainInjector = mainInjector || new InjectorServer(classHasher, keyframesHasher));
+            ? (mediaIndex[media] = mediaIndex[media] || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher))
+            : (plain = plain || new InjectorServer(classHasher, keyframesHasher, fontFaceHasher));
         super(injector, options.transformer, options.atomic);
         this.getStyleMarkup = (className = DEFAULT_HYDRATE_CLASS_NAME) => {
             let markup = '';
-            if (mainInjector) {
-                markup += `<style class="${className}">${mainInjector.getStyle()}</style>`;
+            if (plain) {
+                markup += `<style class="${className}">${plain.getStyle()}</style>`;
             }
-            if (options.mediaOrder) {
-                const orderedMedias = Object.keys(mediaInjectors).sort(options.mediaOrder);
-                for (const media of orderedMedias) {
-                    markup += `<style class="${className}" media="${media}">${mediaInjectors[media].getStyle()}</style>`;
-                }
+            const medias = options.mediaOrder ? Object.keys(mediaIndex).sort(options.mediaOrder) : Object.keys(mediaIndex);
+            for (const media of medias) {
+                markup += `<style class="${className}" media="${media}">${mediaIndex[media].getStyle()}</style>`;
             }
-            else {
-                for (const media in mediaInjectors) {
-                    markup += `<style class="${className}" media="${media}">${mediaInjectors[media].getStyle()}</style>`;
-                }
-            }
             return markup;
@@ -533,0 +528,0 @@ };

package.json

 {
   "name": "@glitz/core",
-  "version": "1.1.0-beta.8",
+  "version": "1.1.0-beta.9",
   "main": "./cjs/index.js",
@@ -14,3 +14,3 @@ "module": "./jsm/index.js",
   "dependencies": {
-    "@glitz/type": "^1.1.0-beta.8"
+    "@glitz/type": "^1.1.0-beta.9"
   },
@@ -17,0 +17,0 @@ "scripts": {

No alert changes

Worsened metrics

Total package byte prevSize

168864

decreased by-0.82%

Lines of code

3532

decreased by-0.48%

Dependency changes

• Updated@glitz/type@^1.1.0-beta.9