create-emotion-server - npm Package Compare versions

Comparing version 9.2.3 to 9.2.4

lib/inline.js

@@ -6,17 +6,4 @@ 'use strict';
 
-function toTag(emotion, ids, thing, nonceString) {
-  var idhash = ids.reduce(function (o, x) {
-    o[x] = true;
-    return o;
-  }, {});
-  var styles = '';
-  var idHydration = '';
-  thing.keys = thing.keys.filter(function (id) {
-    if (idhash[id] !== undefined && emotion.caches.inserted[id] !== true) {
-      styles += emotion.caches.inserted[id];
-      idHydration += ' ' + id;
-    }
-    return true;
-  });
-  return '<style data-emotion-' + emotion.caches.key + '="' + idHydration.substring(1) + '"' + nonceString + '>' + styles + '</style>';
+function generateStyleTag(cssKey, ids, styles, nonceString) {
+  return '<style data-emotion-' + cssKey + '="' + ids.substring(1) + '"' + nonceString + '>' + styles + '</style>';
 }
@@ -27,43 +14,60 @@
   return function (html) {
-    var regex = new RegExp('<|' + emotion.caches.key + '-([a-zA-Z0-9-]+)', 'gm');
+    var _emotion$caches = emotion.caches,
+        inserted = _emotion$caches.inserted,
+        cssKey = _emotion$caches.key,
+        registered = _emotion$caches.registered;
 
-    var match = void 0;
-    var lastBackIndex = 0;
-    var idBuffer = [];
+    var regex = new RegExp('<|' + cssKey + '-([a-zA-Z0-9-]+)', 'gm');
+
+    var seen = {};
+
     var result = '';
-    var insed = {};
-    var keys = Object.keys(emotion.caches.inserted);
+    var globalIds = '';
     var globalStyles = '';
-    var globalIds = '';
-    keys = keys.filter(function (id) {
-      if (emotion.caches.registered[emotion.caches.key + '-' + id] === undefined && emotion.caches.inserted[id] !== true) {
-        globalStyles += emotion.caches.inserted[id];
-        globalIds += ' ' + id;
-        return false;
+
+    for (var id in inserted) {
+      if (inserted.hasOwnProperty(id)) {
+        var style = inserted[id];
+        var key = cssKey + '-' + id;
+        if (style !== true && registered[key] === undefined) {
+          globalStyles += style;
+          globalIds += ' ' + id;
+        }
       }
-      return true;
-    });
+    }
+
     if (globalStyles !== '') {
-      result += '<style data-emotion-' + emotion.caches.key + '="' + globalIds.substring(1) + '"' + nonceString + '>' + globalStyles + '</style>';
+      result = generateStyleTag(cssKey, globalIds, globalStyles, nonceString);
     }
-    var thing = { keys: keys };
+
+    var ids = '';
+    var styles = '';
+    var lastInsertionPoint = 0;
+    var match = void 0;
+
     while ((match = regex.exec(html)) !== null) {
       if (match[0] === '<') {
-        idBuffer = idBuffer.filter(function (x) {
-          return !insed[x];
-        });
-        if (idBuffer.length > 0) {
-          result += toTag(emotion, idBuffer, thing, nonceString);
+        if (ids !== '') {
+          result += generateStyleTag(cssKey, ids, styles, nonceString);
+          ids = '';
+          styles = '';
         }
-        result += html.substring(lastBackIndex, match.index);
-        lastBackIndex = match.index;
-        idBuffer.forEach(function (x) {
-          insed[x] = true;
-        });
-        idBuffer = [];
-      } else {
-        idBuffer.push(match[1]);
+        result += html.substring(lastInsertionPoint, match.index);
+        lastInsertionPoint = match.index;
+        continue;
       }
+
+      var _id = match[1];
+      var _style = inserted[_id];
+      if (_style === true || seen[_id]) {
+        continue;
+      }
+
+      seen[_id] = true;
+      styles += _style;
+      ids += ' ' + _id;
     }
-    result += html.substring(lastBackIndex, html.length);
+
+    result += html.substring(lastInsertionPoint);
+
     return result;
@@ -70,0 +74,0 @@ };

package.json

 {
   "name": "create-emotion-server",
-  "version": "9.2.3",
+  "version": "9.2.4",
   "description": "SSR and style extraction tooling for emotion, The Next Generation of CSS-in-JS.",
@@ -28,5 +28,5 @@ "main": "lib/index.js",
     "dtslint": "^0.3.0",
-    "emotion": "^9.2.3",
+    "emotion": "^9.2.4",
     "npm-run-all": "^4.0.2",
-    "react-emotion": "^9.2.3",
+    "react-emotion": "^9.2.4",
     "rimraf": "^2.6.1"
@@ -33,0 +33,0 @@ },

src/inline.js

 // @flow
 import type { Emotion } from 'create-emotion'
 
-function toTag(
-  emotion: Emotion,
-  ids: Array<string>,
-  thing: { keys: Array<string> },
+function generateStyleTag(
+  cssKey: string,
+  ids: string,
+  styles: string,
   nonceString: string
 ) {
-  let idhash = ids.reduce((o, x) => {
-    o[x] = true
-    return o
-  }, {})
-  let styles = ''
-  let idHydration = ''
-  thing.keys = thing.keys.filter(id => {
-    if (idhash[id] !== undefined && emotion.caches.inserted[id] !== true) {
-      styles += emotion.caches.inserted[id]
-      idHydration += ` ${id}`
-    }
-    return true
-  })
-  return `<style data-emotion-${emotion.caches.key}="${idHydration.substring(
+  return `<style data-emotion-${cssKey}="${ids.substring(
     1
@@ -31,46 +18,56 @@ )}"${nonceString}>${styles}</style>`
 ): string => {
-  let regex = new RegExp(`<|${emotion.caches.key}-([a-zA-Z0-9-]+)`, 'gm')
+  const { inserted, key: cssKey, registered } = emotion.caches
+  const regex = new RegExp(`<|${cssKey}-([a-zA-Z0-9-]+)`, 'gm')
 
-  let match
-  let lastBackIndex = 0
-  let idBuffer = []
+  const seen = {}
+
   let result = ''
-  let insed = {}
-  let keys = Object.keys(emotion.caches.inserted)
+  let globalIds = ''
   let globalStyles = ''
-  let globalIds = ''
-  keys = keys.filter(id => {
-    if (
-      emotion.caches.registered[`${emotion.caches.key}-${id}`] === undefined &&
-      emotion.caches.inserted[id] !== true
-    ) {
-      globalStyles += emotion.caches.inserted[id]
-      globalIds += ` ${id}`
-      return false
+
+  for (const id in inserted) {
+    if (inserted.hasOwnProperty(id)) {
+      const style = inserted[id]
+      const key = `${cssKey}-${id}`
+      if (style !== true && registered[key] === undefined) {
+        globalStyles += style
+        globalIds += ` ${id}`
+      }
     }
-    return true
-  })
+  }
+
   if (globalStyles !== '') {
-    result += `<style data-emotion-${emotion.caches.key}="${globalIds.substring(
-      1
-    )}"${nonceString}>${globalStyles}</style>`
+    result = generateStyleTag(cssKey, globalIds, globalStyles, nonceString)
   }
-  const thing = { keys }
+
+  let ids = ''
+  let styles = ''
+  let lastInsertionPoint = 0
+  let match
+
   while ((match = regex.exec(html)) !== null) {
     if (match[0] === '<') {
-      idBuffer = idBuffer.filter(x => !insed[x])
-      if (idBuffer.length > 0) {
-        result += toTag(emotion, idBuffer, thing, nonceString)
+      if (ids !== '') {
+        result += generateStyleTag(cssKey, ids, styles, nonceString)
+        ids = ''
+        styles = ''
       }
-      result += html.substring(lastBackIndex, match.index)
-      lastBackIndex = match.index
-      idBuffer.forEach(x => {
-        insed[x] = true
-      })
-      idBuffer = []
-    } else {
-      idBuffer.push(match[1])
+      result += html.substring(lastInsertionPoint, match.index)
+      lastInsertionPoint = match.index
+      continue
     }
+
+    const id = match[1]
+    const style = inserted[id]
+    if (style === true || seen[id]) {
+      continue
+    }
+
+    seen[id] = true
+    styles += style
+    ids += ` ${id}`
   }
-  result += html.substring(lastBackIndex, html.length)
+
+  result += html.substring(lastInsertionPoint)
+
   return result
@@ -77,0 +74,0 @@ }

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

Worsened metrics

Total package byte prevSize

13575

decreased by-4.93%

Lines of code

350

decreased by-4.89%

No dependency changes