lukechilds
/
styled-jsx
mirror of https://github.com/lukechilds/styled-jsx.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Upgrade stylis (#268) 

Fixes #261
master
Giuseppe 7 years ago
committed by GitHub
parent
160643ec6b
commit
f38e7e2dd4
5 changed files with 14 additions and 6 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      package.json
  2. 4
      src/lib/style-transform.js
  3. 2
      test/__snapshots__/styles.js.snap
  4. 6
      test/fixtures/transform.css
  5. 6
      yarn.lock

2
package.json
View File

@ -63,7 +63,7 @@
"escape-string-regexp": "1.0.5",
"source-map": "0.5.6",
"string-hash": "1.1.1",
"stylis": "3.1.5"
"stylis": "3.2.6"
},
"devDependencies": {
"ava": "0.19.1",

4
src/lib/style-transform.js
View File

@ -1,4 +1,6 @@
const stylis = require('stylis')
const Stylis = require('stylis')
const stylis = new Stylis()
function disableNestingPlugin(...args) {
let [context, , , parent = [], line, column] = args

2
test/__snapshots__/styles.js.snap
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`transpile styles with attributes 1`] = `"html[data-jsx=\\"123\\"]{background-image:linear-gradient(0deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url(/static/background.svg)}p{color:blue}p{color:blue}p,a[data-jsx=\\"123\\"]{color:blue}.foo + a{color:red}body{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif}p[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]{color:red}*[data-jsx=\\"123\\"]{color:blue}[href=\\"woot\\"][data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"] a[data-jsx=\\"123\\"] span[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"] span{background:blue}p[data-jsx=\\"123\\"] a[title=\\"'w ' ' t'\\"][data-jsx=\\"123\\"]{margin:auto}p[data-jsx=\\"123\\"] span:not(.test){color:green}p[data-jsx=\\"123\\"],h1[data-jsx=\\"123\\"]{color:blue;-webkit-animation:hahahadatajsx123 3s ease forwards infinite;animation:hahahadatajsx123 3s ease forwards infinite;-webkit-animation-name:hahahadatajsx123;animation-name:hahahadatajsx123;-webkit-animation-delay:100ms;animation-delay:100ms}p[data-jsx=\\"123\\"]{-webkit-animation:hahahadatajsx123 1s,hehehedatajsx123 2s;animation:hahahadatajsx123 1s,hehehedatajsx123 2s}p[data-jsx=\\"123\\"]:hover{color:red}p[data-jsx=\\"123\\"]::before{color:red}[data-jsx=\\"123\\"]:hover{color:red}[data-jsx=\\"123\\"]::before{color:red}[data-jsx=\\"123\\"]:hover p[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]+a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]~a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]>a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]>>a[data-jsx=\\"123\\"]{color:red}@-webkit-keyframes hahahadatajsx123{from{top:0}to{top:100}}@keyframes hahahadatajsx123{from{top:0}to{top:100}}@-webkit-keyframes hehehedatajsx123{from{left:0}to{left:100}}@keyframes hehehedatajsx123{from{left:0}to{left:100}}@media (min-width:500px){.test[data-jsx=\\"123\\"]{color:red}}.test[data-jsx=\\"123\\"]{display:block}.inline-flex[data-jsx=\\"123\\"]{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.flex[data-jsx=\\"123\\"]{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.test[data-jsx=\\"123\\"]{box-shadow:0 0 10px black, inset 0 0 5px black}.test[title=\\",\\"][data-jsx=\\"123\\"]{display:inline-block}.test.is-status[data-jsx=\\"123\\"] .test[data-jsx=\\"123\\"]{color:red}"`;
exports[`transpile styles with attributes 1`] = `"html[data-jsx=\\"123\\"]{background-image:linear-gradient(0deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url(/static/background.svg)}p{color:blue}p{color:blue}p,a[data-jsx=\\"123\\"]{color:blue}.foo + a{color:red}body{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif}p[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]{color:red}*[data-jsx=\\"123\\"]{color:blue}[href=\\"woot\\"][data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"] a[data-jsx=\\"123\\"] span[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"] span{background:blue}p[data-jsx=\\"123\\"] a[title=\\"'w ' ' t'\\"][data-jsx=\\"123\\"]{margin:auto}p[data-jsx=\\"123\\"] span:not(.test){color:green}p[data-jsx=\\"123\\"],h1[data-jsx=\\"123\\"]{color:blue;-webkit-animation:hahahadatajsx123 3s ease forwards infinite;animation:hahahadatajsx123 3s ease forwards infinite;-webkit-animation-name:hahahadatajsx123;animation-name:hahahadatajsx123;-webkit-animation-delay:100ms;animation-delay:100ms}p[data-jsx=\\"123\\"]{-webkit-animation:hahahadatajsx123 1s,hehehedatajsx123 2s;animation:hahahadatajsx123 1s,hehehedatajsx123 2s}p[data-jsx=\\"123\\"]:hover{color:red}p[data-jsx=\\"123\\"]::before{color:red}[data-jsx=\\"123\\"]:hover{color:red}[data-jsx=\\"123\\"]::before{color:red}[data-jsx=\\"123\\"]:hover p[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]+a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]~a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]>a[data-jsx=\\"123\\"]{color:red}p[data-jsx=\\"123\\"]>>a[data-jsx=\\"123\\"]{color:red}@-webkit-keyframes hahahadatajsx123{from{top:0}to{top:100}}@keyframes hahahadatajsx123{from{top:0}to{top:100}}@-webkit-keyframes hehehedatajsx123{from{left:0}to{left:100}}@keyframes hehehedatajsx123{from{left:0}to{left:100}}@media (min-width:500px){.test[data-jsx=\\"123\\"]{color:red}}.test[data-jsx=\\"123\\"]{display:block}.inline-flex[data-jsx=\\"123\\"]{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.flex[data-jsx=\\"123\\"]{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.test[data-jsx=\\"123\\"]{box-shadow:0 0 10px black, inset 0 0 5px black}.test[title=\\",\\"][data-jsx=\\"123\\"]{display:inline-block}.test.is-status[data-jsx=\\"123\\"] .test[data-jsx=\\"123\\"]{color:red}.a-selector[data-jsx=\\"123\\"]:hover,.a-selector[data-jsx=\\"123\\"]:focus{outline:none}"`;

6
test/fixtures/transform.css
View File

@ -147,3 +147,9 @@ test
.test.is-status .test {
color: red;
}
.a-selector:hover,
.a-selector:focus
{
outline: none;
}

6
yarn.lock
View File

@ -4702,9 +4702,9 @@ strip-json-comments@~2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
stylis@3.1.5:
version "3.1.5"
resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.1.5.tgz#c585186286aaa79856c9ac62bbb38113923edda3"
stylis@3.2.6:
version "3.2.6"
resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.2.6.tgz#6291df64aae62e9f537ab24b7d8a62b2428a34e9"
supports-color@^2.0.0:
version "2.0.0"

Write Preview
Loading…
Cancel
Save