From 9e10e50a475f68e78015f0de9da802ecbf15b9b6 Mon Sep 17 00:00:00 2001
From: Wellington Guimaraes <wellguimaraes@gmail.com>
Date: Tue, 30 May 2017 16:10:43 -0700
Subject: [PATCH 1/5] fixed issue while updating dynamic props for conditional
 rules

---
 src/styled.js                                 |  7 +++++-
 .../__snapshots__/functional.spec.jsx.snap    | 22 +++++++++++++++++++
 src/tests/functional.spec.jsx                 | 18 +++++++++++++++
 3 files changed, 46 insertions(+), 1 deletion(-)

diff --git a/src/styled.js b/src/styled.js
index 556f2fc..265bb89 100644
--- a/src/styled.js
+++ b/src/styled.js
@@ -71,10 +71,15 @@ const styled = ({tagName, elementStyle, mountSheet}: StyledArgs) => {
     updateSheet(props: StyledElementPropsType) {
       let rule
       let ruleIndex = 0
+
       // nested styles become to flatten rules, so we need to update each nested rule
       for (ruleIndex; ruleIndex < classMap[this.dynamicTagName].length; ruleIndex++) {
         rule = classMap[this.dynamicTagName][ruleIndex]
-        this.sheet.update(rule.name, props)
+
+        if (rule.name)
+          this.sheet.update(rule.name, props)
+        else
+          this.sheet.update(props)
       }
     }
 
diff --git a/src/tests/__snapshots__/functional.spec.jsx.snap b/src/tests/__snapshots__/functional.spec.jsx.snap
index 2bb3b0e..10cbe14 100644
--- a/src/tests/__snapshots__/functional.spec.jsx.snap
+++ b/src/tests/__snapshots__/functional.spec.jsx.snap
@@ -1,3 +1,25 @@
+exports[`functional tests should update all dynamic props 1`] = `
+".button-1-id {
+  padding: 10px;
+}
+@media screen {
+  .button-1-id {
+    margin: 10px;
+  }
+}"
+`;
+
+exports[`functional tests should update all dynamic props 2`] = `
+".button-1-id {
+  padding: 0;
+}
+@media screen {
+  .button-1-id {
+    margin: 0;
+  }
+}"
+`;
+
 exports[`functional tests should update nested props 1`] = `
 ".button-id {
   font-size: 12px;
diff --git a/src/tests/functional.spec.jsx b/src/tests/functional.spec.jsx
index 7b28cae..25f3ecd 100644
--- a/src/tests/functional.spec.jsx
+++ b/src/tests/functional.spec.jsx
@@ -110,4 +110,22 @@ describe('functional tests', () => {
     assertSheet(sheet)
     wrapper.unmount()
   })
+
+  it('should update all dynamic props', () => {
+    const Button = styled('button')({
+      padding: props => props.spaced ? 10 : 0,
+
+      '@media screen': {
+        margin: props => props.spaced ? 10 : 0
+      }
+    })
+
+    const wrapper = mount(<Button spaced={true} />)
+
+    expect(styled.mountSheet().toString()).toMatchSnapshot()
+    wrapper.setProps({ spaced: false })
+    expect(styled.mountSheet().toString()).toMatchSnapshot()
+
+    wrapper.unmount()
+  })
 })

From 5082634aad96e594fe1b7aa50386c71b84d5ce89 Mon Sep 17 00:00:00 2001
From: lttb <kenzhaev.artur@gmail.com>
Date: Wed, 31 May 2017 09:06:18 +0300
Subject: [PATCH 2/5] Fix codestyle and conditional rules update

---
 src/styled.js                 | 6 ++----
 src/tests/functional.spec.jsx | 8 ++++----
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/styled.js b/src/styled.js
index 265bb89..869678e 100644
--- a/src/styled.js
+++ b/src/styled.js
@@ -76,10 +76,8 @@ const styled = ({tagName, elementStyle, mountSheet}: StyledArgs) => {
       for (ruleIndex; ruleIndex < classMap[this.dynamicTagName].length; ruleIndex++) {
         rule = classMap[this.dynamicTagName][ruleIndex]
 
-        if (rule.name)
-          this.sheet.update(rule.name, props)
-        else
-          this.sheet.update(props)
+        if (rule.name) this.sheet.update(rule.name, props)
+        if (rule.rules) rule.rules.update(props)
       }
     }
 
diff --git a/src/tests/functional.spec.jsx b/src/tests/functional.spec.jsx
index 25f3ecd..a0cc99f 100644
--- a/src/tests/functional.spec.jsx
+++ b/src/tests/functional.spec.jsx
@@ -113,17 +113,17 @@ describe('functional tests', () => {
 
   it('should update all dynamic props', () => {
     const Button = styled('button')({
-      padding: props => props.spaced ? 10 : 0,
+      padding: props => (props.spaced ? 10 : 0),
 
       '@media screen': {
-        margin: props => props.spaced ? 10 : 0
+        margin: props => (props.spaced ? 10 : 0)
       }
     })
 
-    const wrapper = mount(<Button spaced={true} />)
+    const wrapper = mount(<Button spaced />)
 
     expect(styled.mountSheet().toString()).toMatchSnapshot()
-    wrapper.setProps({ spaced: false })
+    wrapper.setProps({spaced: false})
     expect(styled.mountSheet().toString()).toMatchSnapshot()
 
     wrapper.unmount()

From acdf06cbffce11df049734e568cabc59322ada86 Mon Sep 17 00:00:00 2001
From: lttb <kenzhaev.artur@gmail.com>
Date: Thu, 15 Jun 2017 18:15:07 +0300
Subject: [PATCH 3/5] Upgrade jss to 7.1.7

---
 package.json | 2 +-
 yarn.lock    | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 4ca1ca4..15fb7a7 100644
--- a/package.json
+++ b/package.json
@@ -39,7 +39,7 @@
   "homepage": "https://github.com/cssinjs/styled-jss#readme",
   "dependencies": {
     "is-react-prop": "^0.1.3",
-    "jss": "^7.1.5",
+    "jss": "^7.1.7",
     "jss-preset-default": "^2.0.0"
   },
   "peerDependencies": {
diff --git a/yarn.lock b/yarn.lock
index 1cc41c8..04ec477 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2690,9 +2690,9 @@ jss-vendor-prefixer@^5.0.0:
   dependencies:
     css-vendor "^0.3.8"
 
-jss@^7.1.5:
-  version "7.1.5"
-  resolved "https://registry.yarnpkg.com/jss/-/jss-7.1.5.tgz#7d27b07b0f2f7f1a2ec9fe0ee1e2ab3f9d903de5"
+jss@^7.1.7:
+  version "7.1.7"
+  resolved "https://registry.yarnpkg.com/jss/-/jss-7.1.7.tgz#f2ace208247f1a68166dd20ccd69c866105fa404"
   dependencies:
     is-in-browser "1.0.2"
     warning "3.0.0"

From d03282ce7e1bd127e853f7baa58d71af06791716 Mon Sep 17 00:00:00 2001
From: lttb <kenzhaev.artur@gmail.com>
Date: Thu, 15 Jun 2017 18:15:15 +0300
Subject: [PATCH 4/5] Update test for conditional rule

---
 src/tests/__snapshots__/functional.spec.jsx.snap |  8 ++++----
 src/tests/functional.spec.jsx                    | 11 +++++++----
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/tests/__snapshots__/functional.spec.jsx.snap b/src/tests/__snapshots__/functional.spec.jsx.snap
index 10cbe14..5e11342 100644
--- a/src/tests/__snapshots__/functional.spec.jsx.snap
+++ b/src/tests/__snapshots__/functional.spec.jsx.snap
@@ -1,20 +1,20 @@
-exports[`functional tests should update all dynamic props 1`] = `
+exports[`functional tests should update dynamic props for conditional rules 1`] = `
 ".button-1-id {
   padding: 10px;
 }
 @media screen {
-  .button-1-id {
+  .button-1-id .button {
     margin: 10px;
   }
 }"
 `;
 
-exports[`functional tests should update all dynamic props 2`] = `
+exports[`functional tests should update dynamic props for conditional rules 2`] = `
 ".button-1-id {
   padding: 0;
 }
 @media screen {
-  .button-1-id {
+  .button-1-id .button {
     margin: 0;
   }
 }"
diff --git a/src/tests/functional.spec.jsx b/src/tests/functional.spec.jsx
index a0cc99f..0924fc1 100644
--- a/src/tests/functional.spec.jsx
+++ b/src/tests/functional.spec.jsx
@@ -111,20 +111,23 @@ describe('functional tests', () => {
     wrapper.unmount()
   })
 
-  it('should update all dynamic props', () => {
+  it('should update dynamic props for conditional rules', () => {
     const Button = styled('button')({
       padding: props => (props.spaced ? 10 : 0),
 
       '@media screen': {
-        margin: props => (props.spaced ? 10 : 0)
+        '& .button': {
+          margin: props => (props.spaced ? 10 : 0)
+        }
       }
     })
 
     const wrapper = mount(<Button spaced />)
+    const sheet = styled.mountSheet()
 
-    expect(styled.mountSheet().toString()).toMatchSnapshot()
+    assertSheet(sheet)
     wrapper.setProps({spaced: false})
-    expect(styled.mountSheet().toString()).toMatchSnapshot()
+    assertSheet(sheet)
 
     wrapper.unmount()
   })

From 829864b1ab0cfe981f0f2726b206f4689d2425fa Mon Sep 17 00:00:00 2001
From: lttb <kenzhaev.artur@gmail.com>
Date: Thu, 15 Jun 2017 19:03:26 +0300
Subject: [PATCH 5/5] Set styled.sheet as a getter

---
 src/createStyled.js           | 10 ++++++++--
 src/tests/functional.spec.jsx | 10 +++++-----
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/createStyled.js b/src/createStyled.js
index 3966100..da80321 100644
--- a/src/createStyled.js
+++ b/src/createStyled.js
@@ -34,7 +34,7 @@ const createStyled = (jss: Function) => (baseStyles: BaseStylesType = {}): Style
     return sheet
   }
 
-  return Object.assign((
+  const styledWrapper = (
     tagNameOrStyledElement: TagNameOrStyledElementType
   ) => (
     ownStyle: ComponentStyleType
@@ -43,7 +43,13 @@ const createStyled = (jss: Function) => (baseStyles: BaseStylesType = {}): Style
     const elementStyle = {...style, ...ownStyle}
 
     return styled({tagName, baseStyles, elementStyle, mountSheet})
-  }, {mountSheet, sheet, styles: baseStyles})
+  }
+
+  Object.defineProperty(styledWrapper, 'sheet', ({
+    get: () => sheet,
+  }: Object)) // https://github.com/facebook/flow/issues/285
+
+  return Object.assign(styledWrapper, {mountSheet, styles: baseStyles})
 }
 
 export default createStyled
diff --git a/src/tests/functional.spec.jsx b/src/tests/functional.spec.jsx
index 0924fc1..b0f2a37 100644
--- a/src/tests/functional.spec.jsx
+++ b/src/tests/functional.spec.jsx
@@ -40,13 +40,13 @@ describe('functional tests', () => {
   })
 
   afterEach(() => {
-    styled.mountSheet().detach()
+    styled.sheet.detach()
   })
 
   it('should update props and unmount', () => {
     const App = CreateApp(styled)
     const wrapper = mount(<App />)
-    const sheet = styled.mountSheet()
+    const {sheet} = styled
 
     assertSheet(sheet)
     wrapper.setProps({margin: 20})
@@ -86,7 +86,7 @@ describe('functional tests', () => {
     )
 
     const wrapper = mount(<App />)
-    const sheet = styled.mountSheet()
+    const {sheet} = styled
 
     assertSheet(sheet)
     wrapper.setProps({primary: true})
@@ -100,7 +100,7 @@ describe('functional tests', () => {
     })
 
     const wrapper = mount(<Button />)
-    const sheet = styled.mountSheet()
+    const {sheet} = styled
 
     assertSheet(sheet)
     wrapper
@@ -123,7 +123,7 @@ describe('functional tests', () => {
     })
 
     const wrapper = mount(<Button spaced />)
-    const sheet = styled.mountSheet()
+    const {sheet} = styled
 
     assertSheet(sheet)
     wrapper.setProps({spaced: false})