Use stylis from npm (it seems to create a smaller bundle with uglify …

…+ rollup than with gcc + uglify + rollup) and add test for multiline declaration Closes #470
emotion-js · Nov 28, 2017 · ed185da · ed185da
1 parent 580994e
commit ed185da
Show file tree

Hide file tree

Showing 10 changed files with 35 additions and 35 deletions.
diff --git a/packages/babel-plugin-emotion/package.json b/packages/babel-plugin-emotion/package.json
@@ -21,6 +21,7 @@
     "emotion-utils": "^8.0.11",
     "find-root": "^1.1.0",
     "source-map": "^0.5.7",
+    "stylis": "^3.4.5",
     "touch": "^1.0.0"
   },
   "devDependencies": {

diff --git a/packages/babel-plugin-emotion/src/index.js b/packages/babel-plugin-emotion/src/index.js
@@ -18,7 +18,8 @@ import type {
   StringLiteral,
   Babel
 } from 'babel-flow-types'
-import { hashString, Stylis, memoize } from 'emotion-utils'
+import { hashString, memoize } from 'emotion-utils'
+import Stylis from 'stylis'
 import { addSourceMaps } from './source-map'
 
 import cssProps from './css-prop'

diff --git a/packages/create-emotion/package.json b/packages/create-emotion/package.json
@@ -17,8 +17,8 @@
   },
   "dependencies": {
     "emotion-utils": "^8.0.11",
-    "stylis": "^3.3.2",
-    "stylis-rule-sheet": "^0.0.5"
+    "stylis": "^3.4.5",
+    "stylis-rule-sheet": "^0.0.7"
   },
   "devDependencies": {
     "@types/react": "16.0.16",

diff --git a/packages/create-emotion/src/index.js b/packages/create-emotion/src/index.js
@@ -1,5 +1,6 @@
 // @flow
-import { hashString, Stylis, STYLES_KEY, TARGET_KEY } from 'emotion-utils'
+import { hashString, STYLES_KEY, TARGET_KEY } from 'emotion-utils'
+import Stylis from 'stylis'
 import stylisRuleSheet from 'stylis-rule-sheet'
 import {
   processStyleName,

diff --git a/packages/emotion-utils/src/index.js b/packages/emotion-utils/src/index.js
@@ -58,4 +58,3 @@ export const unitless = {
 }
 
 export { hashString } from './hash'
-export { default as Stylis } from './stylis'
diff --git a/packages/emotion-utils/src/stylis.js b/packages/emotion-utils/src/stylis.js
diff --git a/packages/emotion/test/__snapshots__/css.test.js.snap b/packages/emotion/test/__snapshots__/css.test.js.snap
@@ -322,6 +322,17 @@ exports[`css media query specificity 2`] = `
 />
 `;
 
+exports[`css multiline declaration 1`] = `
+.glamor-0 {
+  display: grid;
+  grid: 'AppBar' auto 'Main' 1fr / 1fr / 1fr 1fr / 1fr1fr / 1fr1fr / 1fr1fr / 1fr1fr / 1fr auto 'Main' 1fr / 1fr / 1fr 1fr / 1fr1fr / 1fr1fr / 1fr1fr / 1fr1fr / 1fr;
+}
+
+<div
+  className="glamor-0"
+/>
+`;
+
 exports[`css nested 1`] = `
 .glamor-0 {
   color: yellow;

diff --git a/packages/emotion/test/css.test.js b/packages/emotion/test/css.test.js
@@ -361,4 +361,14 @@ describe('css', () => {
     expect(tree).toMatchSnapshot()
     expect(sheet).toMatchSnapshot()
   })
+  test('multiline declaration', () => {
+    const cls1 = css`
+      display: grid;
+      grid: 'AppBar' auto 'Main' 1fr / 1fr / 1fr 1fr / 1fr1fr / 1fr1fr / 1fr1fr /
+        1fr1fr / 1fr auto 'Main' 1fr / 1fr / 1fr 1fr / 1fr1fr / 1fr1fr / 1fr1fr /
+        1fr1fr / 1fr;
+    `
+    const tree = renderer.create(<div className={cls1} />).toJSON()
+    expect(tree).toMatchSnapshot()
+  })
 })
diff --git a/packages/emotion/test/insertion.test.js b/packages/emotion/test/insertion.test.js
@@ -1,5 +1,5 @@
 // @flow
-import { Stylis } from 'emotion-utils'
+import Stylis from 'stylis'
 import stylisRuleSheet from 'stylis-rule-sheet'
 
 const specs = [

diff --git a/yarn.lock b/yarn.lock
@@ -9130,13 +9130,13 @@ styled-components@^2.2.1:
     stylis "^3.2.1"
     supports-color "^3.2.3"
 
-stylis-rule-sheet@^0.0.5:
-  version "0.0.5"
-  resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.5.tgz#ebae935cc1f6fb31b9b62dba47f2ea8b833dad9f"
+stylis-rule-sheet@^0.0.7:
+  version "0.0.7"
+  resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.7.tgz#5c51dc879141a61821c2094ba91d2cbcf2469c6c"
 
-stylis@^3.2.1, stylis@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.3.2.tgz#95ef285836e98243f8b8f64a9a72706ea6c893ea"
+stylis@^3.2.1, stylis@^3.4.5:
+  version "3.4.5"
+  resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.4.5.tgz#d7b9595fc18e7b9c8775eca8270a9a1d3e59806e"
 
 supports-color@^2.0.0:
   version "2.0.0"
Original file line number	Diff line number	Diff line change
Expand Up		@@ -58,4 +58,3 @@ export const unitless = {
		}

		export { hashString } from './hash'
		export { default as Stylis } from './stylis'