styled-components - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

CHANGELOG.md

@@ -7,4 +7,13 @@ # Changelog
 
-## [Upcoming Major Release]
+## [Unreleased]
 
+- Fixed `extend` not working with 3 or more inheritances, thanks to [@brunolemos](https://twitter.com/brunolemos). (see [#871](https://github.com/styled-components/styled-components/pull/871))
+- Added a test for `withComponent` followed by `attrs`, thanks to [@btmills](https://github.com/btmills). (see [#851](https://github.com/styled-components/styled-components/pull/851))
+- Fix Flow type signatures for compatibility with Flow v0.47.0 (see [#840](https://github.com/styled-components/styled-components/pull/840))
+- Upgraded stylis to v3.0. (see [#829](https://github.com/styled-components/styled-components/pull/829) and [#876](https://github.com/styled-components/styled-components/pull/876))
+- Remove dead code used previously for auto-prefixing. (see [#881](https://github.com/styled-components/styled-components/pull/881))
+- Added missing v2.0 APIs to TypeScript typings, thanks to [@patrick91](https://github.com/patrick91), [@igorbek](https://github.com/igorbek) (see [#837](https://github.com/styled-components/styled-components/pull/837), [#882](https://github.com/styled-components/styled-components/pull/882))
+
+## [v2.0.0] - 2017-05-25
+
 - Update css-to-react-native - you'll now need to add units to your React Native styles (see [css-to-react-native](https://github.com/styled-components/css-to-react-native/issues/20), [code mod](https://github.com/styled-components/styled-components-native-code-mod))
@@ -248,3 +257,4 @@ - Update stylis to latest version (see [#496](https://github.com/styled-components/styled-components/pull/496)).
 
-[Unreleased]: https://github.com/styled-components/styled-components/compare/v1.4.6...master
+[Unreleased]: https://github.com/styled-components/styled-components/compare/v2.0.0...master
+[v2.0.0]: https://github.com/styled-components/styled-components/compare/v1.4.6...v2.0.0
 [v1.4.6]: https://github.com/styled-components/styled-components/compare/v1.4.5...v1.4.6
@@ -251,0 +261,0 @@ [v1.4.5]: https://github.com/styled-components/styled-components/compare/v1.4.4...v1.4.5

CONTRIBUTING.md

@@ -13,3 +13,3 @@ Thanks for giving this a read! We're always open to your contributions to styled-components.
 
-2. Fork, then clone: `git clone httpsL://github.com/YOUR_USERNAME/styled-components.git`
+2. Fork, then clone: `git clone https://github.com/YOUR_USERNAME/styled-components.git`
 
@@ -39,2 +39,1 @@ 3. Create a branch with a meaningful name for the issue: `git checkout -b fix-something`
 code style.
-

dist/styled-components.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t(e.styled=e.styled||{},e.React)}(this,function(e,t){"use strict";function n(e){return e.replace(y,"-$1").toLowerCase()}function o(e){return v(e).replace(b,"-ms-")}function r(e){return!0===P(e)&&"[object Object]"===Object.prototype.toString.call(e)}function i(e,t){return t={exports:{}},e(t,t.exports),t.exports}function a(e){return function(){return e}}function s(e,t,n,o,r,i,a,s){if(ee(t),!e){var c;if(void 0===t)c=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var u=[n,o,r,i,a,s],l=0;c=new Error(t.replace(/%s/g,function(){return u[l++]})),c.name="Invariant Violation"}throw c.framesToPop=1,c}}function c(e){return"string"==typeof e}function u(e){return"function"==typeof e&&"string"==typeof e.styledComponentId}function l(e){return e.displayName||e.name||"Component"}function p(e){var t=Ce.call(e);return"[object Function]"===t||"function"==typeof e&&"[object RegExp]"!==t||"undefined"!=typeof window&&(e===window.setTimeout||e===window.alert||e===window.confirm||e===window.prompt)}function h(e,t){for(var n=1540483477,o=t^e.length,r=e.length,i=0;r>=4;){var a=d(e,i);a=m(a,n),a^=a>>>24,a=m(a,n),o=m(o,n),o^=a,i+=4,r-=4}switch(r){case 3:o^=f(e,i),o^=e.charCodeAt(i+2)<<16,o=m(o,n);break;case 2:o^=f(e,i),o=m(o,n);break;case 1:o^=e.charCodeAt(i),o=m(o,n)}return o^=o>>>13,o=m(o,n),(o^=o>>>15)>>>0}function d(e,t){return e.charCodeAt(t++)+(e.charCodeAt(t++)<<8)+(e.charCodeAt(t++)<<16)+(e.charCodeAt(t)<<24)}function f(e,t){return e.charCodeAt(t++)+(e.charCodeAt(t++)<<8)}function m(e,t){return e|=0,t|=0,(65535&e)*t+(((e>>>16)*t&65535)<<16)|0}var g="default"in t?t.default:t,y=/([A-Z])/g,C=n,v=C,b=/^ms-/,x=o,w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},T=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},k=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),A=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},S=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)},O=function(e,t){var n={};for(var o in e)t.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n},E=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},j=function(e){return null!=e&&"object"===(void 0===e?"undefined":w(e))&&!Array.isArray(e)},P=j,I=function(e){var t,n;return!1!==r(e)&&("function"==typeof(t=e.constructor)&&(n=t.prototype,!1!==r(n)&&!1!==n.hasOwnProperty("isPrototypeOf")))},M=function e(t,n){var o=Object.keys(t).map(function(n){return I(t[n])?e(t[n],n):x(n)+": "+t[n]+";"}).join(" ");return n?n+" {\n  "+o+"\n}":o},N=function e(t,n){return t.reduce(function(t,o){return void 0===o||null===o||!1===o||""===o?t:Array.isArray(o)?[].concat(t,e(o,n)):o.hasOwnProperty("styledComponentId")?[].concat(t,["."+o.styledComponentId]):"function"==typeof o?n?t.concat.apply(t,e([o(n)],n)):t.concat(o):t.concat(I(o)?M(o):o.toString())},[])},D="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},R=i(function(e,t){!function(n){"object"===(void 0===t?"undefined":w(t))&&void 0!==e?e.exports=n(D):window.stylis=n(window)}(function(e){function t(e,p,h,d,f){e+="";var m,g,y,C="",v="",b=e.charCodeAt(0);switch(b<33&&(b=(e=e.trim()).charCodeAt(0)),b){case 35:case 46:v=(C=e).substring(1);break;case 91:g=e.substring(1,e.length-1).split("="),m=(v=g[1]).charCodeAt(0),34!==m&&39!==m||(v=v.substring(1,v.length-1)),C="["+g[0]+'="'+v+'"]';break;default:v=C=e}b=0,void 0==h||!0===h?(h=!0,y=v):(y="",h=!1);var x,T=null!=f,k=o.length;!0===T&&(x=(void 0===f?"undefined":w(f)).charCodeAt(0),111===x?n(f):102===x?o[k++]=f:T=!1),0!==k&&(f=1===k?o[0]:function(e,t,n,r,i,a){for(var s=t,c=0,u=o.length;c<u;c++)s=o[c](e,s,n,r,i,a)||s;if(s!==t)return s},T=!0);var A,S,O,E,j,P,I,M,N,D,R,F,L,z,U,H,W,_,q,B="",V="",$="",K=0,X=0,G=0,Y=0,Z=0,J=0,Q=0,ee=0,te=0,ne=0,oe=0,re=0,ie=0,ae=0;!0===T&&(I=f(0,p,le,ue,C,0),null!=I&&(p=I),W="");for(var se=0,ce=0,ue=0,le=1,pe=p.length,he="";se<pe;){if(K=p.charCodeAt(se),0===Q&&0===J&&0===re&&(123===K||125===K||59===K||se===pe-1&&0!==B.length)){if(B+=p.charAt(se),!0===T&&125!==K&&null!=(I=123===K?f(1,B.substring(0,B.length-1).trim(),le,ue,C,he.length):f(2,B,le,ue,C,he.length))&&(B=123===K?I+" {":I),D=B.charCodeAt(0),32===D&&(D=(B=B.trim()).charCodeAt(0)),R=B.charCodeAt(1),F=B.charCodeAt(2),64===D){if(1===ne&&0!==$.length&&(ne=0,$=C+" {"+$+"}",!0===T&&null!=(I=f(4,$,le,ue,C,he.length))&&($=I),he+=$,$=""),59!==K)if(107===R)z=B.substring(1,11)+y+B.substring(11),B="@"+l+z,b=1;else if(109===R&&101===F||103===R)if(0!==ce){for(se++,ue++,void 0===P&&(P=""),I="",O="",E=M.split(i),Y=1;se<pe&&(m=p.charCodeAt(se),123===m?Y++:125===m&&Y--,0!==Y);)O+=p.charAt(se++),ue=13===m||10===m?(le++,0):ue+1;k=E.length;for(var de=0;de<k;de++)e=E[de],I+=t((de===k-1?e.substring(0,e.length-1):e).trim(),O,h,d,f);P+=B+I+"}",B="",1,b=4}else b=2,H=B,B="";else b=6;4!==b&&59!==K&&105!==R&&(107!==R&&109!==R&&103!==R&&(b=5),G=-1,X++)}else{if(123===K)if(ce++,1===ne&&0!==$.length&&(ne=0,$=C+" {"+$+"}",!0===T&&null!=(I=f(4,$,le,ue,C,he.length))&&($=I),he+=$,$=""),2===ce){se++,ue++,O="";var fe=B.substring(0,B.length-1).split(i),me=M.substring(0,M.length-1).split(i);for(Y=1;se<pe&&(m=p.charCodeAt(se),123===m?Y++:125===m&&Y--,0!==Y);)O+=p.charAt(se++),ue=13===m||10===m?(le++,0):ue+1;k=me.length;for(var ge=0;ge<k;ge++){I=me[ge],N=I.indexOf(C),me[ge]="";for(var ye=0,Ce=fe.length;ye<Ce;ye++)e=N>0?":global(%)"+I.trim():I.replace(C,"&").trim(),L=fe[ye].trim(),e=L.indexOf(" &")>0?L.replace("&","").trim()+" "+e:null!==a.exec(L)?L:e+" "+L,me[ge]+=e.replace(/ +&/,"").trim()+(ye===Ce-1?"":",")}void 0===U&&(U=""),U+="\n"+me.join(",").replace(s," $1")+" {"+O+"}",Z=1,B="",ce--}else if(0===X||2===b){0===te&&-1!==B.indexOf("::place")&&(te=1),E=B.split(i),j="",M="",k=E.length;for(var ge=0;ge<k;ge++)m=(e=E[ge]).charCodeAt(0),32===m&&(m=(e=e.trim()).charCodeAt(0)),38===m?e=C+e.substring(1).replace(r,C):(N=e.indexOf(" &"))>0?e=e.replace(r,C).trim():58===m?(q=e.charCodeAt(1),!0===d&&104===q&&116===e.charCodeAt(4)?(q=e.charCodeAt(5),e=40===q?C+e.replace(/:host\((.*)\)/g,"$1").replace(r,C):45===q?e.replace(/:host-context\((.*)\)/g,"$1 "+C).replace(r,C):C+e.substring(5)):103!==q||!0!==d&&37!==(q=e.charCodeAt(8))?e=C+e:(ee=1,e=e.replace(a,"$1").replace(r,C).trim())):0===ee&&(e=C+" "+e),!0===T&&null!=(I=f(1.5,ge===k-1?e.substring(0,e.length-1).trim():e,le,ue,C,he.length))&&(e=ge===k-1?I+" {":I),M+=(0!==ge?",\f":"")+(1!==ee?e:":global(%)"+e),j+=0!==ge?","+e:e,ee=0;B=j}else M=B;else if(!1==(125===K&&1===B.length)){if(59!==K&&(B=(125===K?B.substring(0,B.length-1):B.trim())+";"),97===D&&110===R&&105===F){if(B=B.substring(0,B.length-1),S=B.indexOf(":")+1,j=B.substring(0,S),!0===h&&45!==B.charCodeAt(9)){var ve=B.substring(S).trim().split(",");k=ve.length;for(var ge=0;ge<k;ge++){for(var be=ve[ge],xe=be.split(" "),ye=0,Ce=xe.length;ye<Ce;ye++){var we=xe[ye].trim(),Te=we.charCodeAt(0),ke=we.charCodeAt(2),Ae=we.length,Se=we.charCodeAt(Ae-1);!(Te>64&&Te<90||Te>96&&Te<122||45===Te||95===Te&&95!==we.charCodeAt(1))||41===Se||0===Ae||105===Te&&(102===ke&&101===Se&&8===Ae||105===ke&&108===Se&&7===Ae||104===ke&&116===Se&&7===Ae)||117===Te&&115===ke&&116===Se&&5===Ae||108===Te&&110===ke&&114===Se&&6===Ae||97===Te&&116===ke&&101===Se&&(9===Ae||17===Ae)||110===Te&&114===ke&&108===Se&&6===Ae||98===Te&&99===ke&&115===Se&&9===Ae||102===Te&&114===ke&&115===Se&&8===Ae||98===Te&&116===ke&&104===Se&&4===Ae||110===Te&&110===ke&&101===Se&&4===Ae||114===Te&&110===ke&&103===Se&&7===Ae||112===Te&&117===ke&&100===Se&&6===Ae||114===Te&&118===ke&&100===Se&&8===Ae||115===Te&&101===ke&&(116===Se&&10===Ae||100===Se&&8===Ae)||101===Te&&115===ke&&(101===Se&&4===Ae||(11===Ae||7===Ae||8===Ae)&&45===we.charCodeAt(4))||!isNaN(parseFloat(we))||-1!==we.indexOf("(")||(xe[ye]=y+we)}j+=(0===ge?"":",")+xe.join(" ").trim()}}else j+=(110!==B.charCodeAt(10)?"":y)+B.substring(S).trim().trim();B=l+j+";"+j+(125===K?";}":";")}else if(97===D&&112===R&&112===F)B=l+B+c+B+B;else if(100===D&&105===R&&115===F)-1!==(N=B.indexOf("flex"))&&(I=101===B.charCodeAt(N-2)?"inline-":"",B=-1!==B.indexOf(" !important")?" !important":"",B="display: "+l+I+"box"+B+";display: "+l+I+"flex"+B+";display: "+u+"flexbox"+B+";display: "+I+"flex"+B+";");else if(116===D&&(114===R&&97===F||101===R&&120===F))B=l+B+(102===B.charCodeAt(5)?u+B:"")+B;else if(104===D&&121===R&&112===F||117===D&&115===R&&101===F)B=l+B+c+B+u+B+B;else if(102===D&&108===R&&101===F)B=l+B+u+B+B;else if(111===D&&114===R&&100===F)B=l+B+u+"flex-"+B+B;else if(97===D&&108===R&&105===F&&45===B.charCodeAt(5))switch(B.charCodeAt(6)){case 105:I=B.replace("-items",""),B=l+B+l+"box-"+I+u+"flex-"+I+B;break;case 115:B=u+"flex-item-"+B.replace("-self","")+B;break;default:B=u+"flex-line-pack"+B.replace("align-content","")+B}else 106===D&&117===R&&115===F?(S=B.indexOf(":"),I=B.substring(S).replace("flex-",""),B=l+"box-pack"+I+l+B+u+"flex-pack"+I+B):99===D&&117===R&&114===F&&null!==/zoo|gra/.exec(B)?B=B.replace(/: +/g,": "+l)+B.replace(/: +/g,": "+c)+B:119===D&&105===R&&100===F&&-1!==(N=B.indexOf("-content"))&&(I=B.substring(N-3),B="width: "+l+I+"width: "+c+I+"width: "+I);59!==K&&(B=B.substring(0,B.length-1),125===K&&(B+="}"))}125===K&&(0!==ce&&ce--,0===ce&&1===Z&&(p=p.substring(0,se+1)+U+p.substring(se+1),pe+=U.length,U="",Z=0,G++),125!==D&&32===B.charCodeAt(B.length-2)&&(B=B.substring(0,B.length-1).trim()+"}")),0!==X?(125===K?G++:123===K&&0!==G&&G--,1!==oe||123!==K&&0!==G||0===$.length||(oe=0,B=C+" {"+$+"}"+B,$=""),0===G?(1===b&&(B="}@"+z+"}",z=""),b=0,G--,X--):1===b?z+=B:2===b&&0===ce&&(125!==K&&(0===oe&&($=""),$+=B,B=""),oe=1)):0===ce&&125!==K&&(ne=1,$=void 0===$?B:$+B,B="")}V+=B,125!==K||0!==b&&2!==b&&4!==b||(m=V.charCodeAt(V.length-2),4===b&&(b=0),void 0!==P&&0!==P.length&&(V=123===m?P:V+P,P="",m=V.charCodeAt(V.length-2)),123!==m&&(!0===T&&null!=(I=f(3,V,le,ue,C,he.length))&&(V=I),1===te&&(_=/::place/g,te=0,I="input-place",V=V.replace(_,"::"+l+I)+V.replace(_,"::"+c+"place")+V.replace(_,":"+u+I)+V),void 0!==H?(H+=V,125===H.charCodeAt(H.length-2)&&(he+=H,H=void 0)):he+=V),V=""),B=""}else if(13===K||10===K)1===ae?(re=ae=0,B=B.substring(0,B.indexOf("//")).trim()):!0===T&&0===re&&0!==(k=(W=W.trim()).length)&&47!==W.charCodeAt(0)&&(0!==B.length&&null!=(I=f(7,W,le,ue,C,he.length))&&(B=B.replace(new RegExp(W+"$"),I).trim()),W=""),ue=0,le++;else{if(9!==K)switch(A=p.charAt(se),!0===T&&0===re&&(W+=A),B+=A,K){case 44:0===Q&&0===re&&0===J&&(B+="\f");break;case 34:0===re&&(Q=34===Q?0:39===Q?39:34);break;case 39:0===re&&(Q=39===Q?0:34===Q?34:39);break;case 40:0===Q&&0===re&&(J=1);break;case 41:0===Q&&0===re&&(J=0);break;case 47:0===Q&&0===J&&(m=p.charCodeAt(se-1),0===ie&&47===m?re=ae=1:42===m&&(re=ie=0,B=B.substring(0,B.indexOf("/*")).trim()));break;case 42:0===Q&&0===J&&0===ae&&0===ie&&47===p.charCodeAt(se-1)&&(re=ie=1)}ue++}se++}return void 0!==$&&0!==$.length&&($=C+" {"+$+"}",!0===T&&null!=(I=f(4,$,le,ue,C,he.length))&&($=I),he+=$),!0===T&&null!=(I=f(6,he,le,ue,C,he.length))&&(he=I),he}function n(e){var n=o.length;if(null!=e)if(e.constructor===Array)for(var r=0,i=e.length;r<i;r++)o[n++]=e[r];else o[n]=e;return t}var o=[],r=/&/g,i=/,\f/g,a=/:global\(%?((?:[^\(\)\[\]]*|\[.*\]|\([^\(\)]*\))*)\)/g,s=/(?:&| ):global\(%?((?:[^\(\)\[\]]*|\[.*\]|\([^\(\)]*\))*)\)/g,c="-moz-",u="-ms-",l="-webkit-";return t.use=n,t.p=o,t.r={a:r,s:i,g:a,n:s},t})}),F=function(e,t,n){var o=e.join("").replace(/^\s*\/\/.*$/gm,""),r=t&&n?n+" "+t+" { "+o+" }":o;return R(n||!t?"":t,r,!1,!1)},L="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ".split(""),z=L.length,U=function(e){var t="",n=void 0;for(n=e;n>z;n=Math.floor(n/L.length))t=L[n%z]+t;return L[n%z]+t},H=function(e,t){return t.reduce(function(t,n,o){return t.concat(n,e[o+1])},[e[0]])},W=function(e){for(var t=arguments.length,n=Array(t>1?t-1:0),o=1;o<t;o++)n[o-1]=arguments[o];return N(H(e,n))},_=function(e){var t=""+(e||""),n=[];return t.replace(/^[^\S\n]*?\/\* sc-component-id:\s+(\S+)\s+\*\//gm,function(e,t,o){return n.push({componentId:t,matchIndex:o}),e}),n.map(function(e,o){var r=e.componentId,i=e.matchIndex,a=n[o+1];return{componentId:r,cssFromDOM:a?t.slice(i,a.matchIndex):t.slice(i)}})},q=function(){function e(t,n){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"";T(this,e),this.el=t,this.isLocal=n,this.ready=!1;var r=_(o);this.size=r.length,this.components=r.reduce(function(e,t){return e[t.componentId]=t,e},{})}return e.prototype.isFull=function(){return this.size>=40},e.prototype.addComponent=function(e){if(this.ready||this.replaceElement(),this.components[e])throw new Error("Trying to add Component '"+e+"' twice!");var t={componentId:e,textNode:document.createTextNode("")};this.el.appendChild(t.textNode),this.size+=1,this.components[e]=t},e.prototype.inject=function(e,t,n){this.ready||this.replaceElement();var o=this.components[e];if(!o)throw new Error("Must add a new component before you can inject css into it");if(""===o.textNode.data&&o.textNode.appendData("\n/* sc-component-id: "+e+" */\n"),o.textNode.appendData(t),n){var r=this.el.getAttribute(V);this.el.setAttribute(V,r?r+" "+n:n)}},e.prototype.toHTML=function(){return this.el.outerHTML},e.prototype.toReactElement=function(){throw new Error("BrowserTag doesn't implement toReactElement!")},e.prototype.clone=function(){throw new Error("BrowserTag cannot be cloned!")},e.prototype.replaceElement=function(){var e=this;if(this.ready=!0,0!==this.size){var t=this.el.cloneNode();if(t.appendChild(document.createTextNode("\n")),Object.keys(this.components).forEach(function(n){var o=e.components[n];o.textNode=document.createTextNode(o.cssFromDOM),t.appendChild(o.textNode)}),!this.el.parentNode)throw new Error("Trying to replace an element that wasn't mounted!");this.el.parentNode.replaceChild(t,this.el),this.el=t}},e}(),B={create:function(){for(var e=[],t={},n=document.querySelectorAll("["+V+"]"),o=n.length,r=0;r<o;r+=1){var i=n[r];e.push(new q(i,"true"===i.getAttribute($),i.innerHTML));var a=i.getAttribute(V);a&&a.trim().split(/\s+/).forEach(function(e){t[e]=!0})}return new Y(function(e){var t=document.createElement("style");if(t.type="text/css",t.setAttribute(V,""),t.setAttribute($,e?"true":"false"),!document.head)throw new Error("Missing document <head>");return document.head.appendChild(t),new q(t,e)},e,t)}},V="data-styled-components",$="data-styled-components-is-local",K="__styled-components-stylesheet__",X=null,G=[],Y=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};T(this,e),this.hashes={},this.deferredInjections={},this.tagConstructor=t,this.tags=n,this.names=o,this.constructComponentTagMap()}return e.prototype.constructComponentTagMap=function(){var e=this;this.componentTags={},this.tags.forEach(function(t){Object.keys(t.components).forEach(function(n){e.componentTags[n]=t})})},e.prototype.getName=function(e){return this.hashes[e.toString()]},e.prototype.alreadyInjected=function(e,t){return!!this.names[t]&&(this.hashes[e.toString()]=t,!0)},e.prototype.hasInjectedComponent=function(e){return!!this.componentTags[e]},e.prototype.deferredInject=function(e,t,n){this===X&&G.forEach(function(o){o.deferredInject(e,t,n)}),this.getOrCreateTag(e,t),this.deferredInjections[e]=n},e.prototype.inject=function(e,t,n,o,r){this===X&&G.forEach(function(o){o.inject(e,t,n)});var i=this.getOrCreateTag(e,t),a=this.deferredInjections[e];a&&(i.inject(e,a),delete this.deferredInjections[e]),i.inject(e,n,r),o&&r&&(this.hashes[o.toString()]=r)},e.prototype.toHTML=function(){return this.tags.map(function(e){return e.toHTML()}).join("")},e.prototype.toReactElements=function(){return this.tags.map(function(e,t){return e.toReactElement("sc-"+t)})},e.prototype.getOrCreateTag=function(e,t){var n=this.componentTags[e];if(n)return n;var o=this.tags[this.tags.length-1],r=!o||o.isFull()||o.isLocal!==t?this.createNewTag(t):o;return this.componentTags[e]=r,r.addComponent(e),r},e.prototype.createNewTag=function(e){var t=this.tagConstructor(e);return this.tags.push(t),t},e.reset=function(t){X=e.create(t)},e.create=function(){return((arguments.length>0&&void 0!==arguments[0]?arguments[0]:"undefined"==typeof document)?le:B).create()},e.clone=function(t){var n=new e(t.tagConstructor,t.tags.map(function(e){return e.clone()}),A({},t.names));return n.hashes=A({},t.hashes),n.deferredInjections=A({},t.deferredInjections),G.push(n),n},k(e,null,[{key:"instance",get:function(){return X||(X=e.create())}}]),e}(),Z=function(){};Z.thatReturns=a,Z.thatReturnsFalse=a(!1),Z.thatReturnsTrue=a(!0),Z.thatReturnsNull=a(null),Z.thatReturnsThis=function(){return this},Z.thatReturnsArgument=function(e){return e};var J,Q=Z,ee=function(e){},te=s,ne=Q,oe=te,re=function(){function e(){oe(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t};return n.checkPropTypes=ne,n.PropTypes=n,n},ie=i(function(e){e.exports=re()}),ae=function(e){function t(){return T(this,t),E(this,e.apply(this,arguments))}return S(t,e),t.prototype.getChildContext=function(){var e;return e={},e[K]=this.props.sheet,e},t.prototype.render=function(){return g.Children.only(this.props.children)},t}(t.Component);ae.childContextTypes=(J={},J[K]=ie.instanceOf(Y).isRequired,J);var se,ce,ue=function(){function e(t){T(this,e),this.isLocal=t,this.components={},this.size=0,this.names=[]}return e.prototype.isFull=function(){return!1},e.prototype.addComponent=function(e){if(this.components[e])throw new Error("Trying to add Component '"+e+"' twice!");this.components[e]={componentId:e,css:""},this.size+=1},e.prototype.inject=function(e,t,n){var o=this.components[e];if(!o)throw new Error("Must add a new component before you can inject css into it");""===o.css&&(o.css="/* sc-component-id: "+e+" */\n"),o.css+=t.replace(/\n*$/,"\n"),n&&this.names.push(n)},e.prototype.toHTML=function(){var e=this;return'<style type="text/css" '+V+'="'+this.names.join(" ")+'" '+$+'="'+(this.isLocal?"true":"false")+'">\n'+Object.keys(this.components).map(function(t){return e.components[t].css}).join("")+"\n</style>"},e.prototype.toReactElement=function(e){var t,n=this,o=(t={},t[V]=this.names.join(" "),t[$]=this.isLocal.toString(),t),r=Object.keys(this.components).map(function(e){return n.components[e].css}).join("");return g.createElement("style",A({key:e,type:"text/css"},o,{dangerouslySetInnerHTML:{__html:r}}))},e.prototype.clone=function(){var t=this,n=new e(this.isLocal);return n.names=[].concat(this.names),n.size=this.size,n.components=Object.keys(this.components).reduce(function(e,n){return e[n]=A({},t.components[n]),e},{}),n},e}(),le=function(){function e(){T(this,e),this.instance=Y.clone(Y.instance)}return e.prototype.collectStyles=function(e){if(this.closed)throw new Error("Can't collect styles once you've called getStyleTags!");return g.createElement(ae,{sheet:this.instance},e)},e.prototype.getStyleTags=function(){return this.closed||(G.splice(G.indexOf(this.instance),1),this.closed=!0),this.instance.toHTML()},e.prototype.getStyleElement=function(){return this.closed||(G.splice(G.indexOf(this.instance),1),this.closed=!0),this.instance.toReactElements()},e.create=function(){return new Y(function(e){return new ue(e)})},e}(),pe={children:!0,dangerouslySetInnerHTML:!0,key:!0,ref:!0,autoFocus:!0,defaultValue:!0,valueLink:!0,defaultChecked:!0,checkedLink:!0,innerHTML:!0,suppressContentEditableWarning:!0,onFocusIn:!0,onFocusOut:!0,className:!0,onCopy:!0,onCut:!0,onPaste:!0,onCompositionEnd:!0,onCompositionStart:!0,onCompositionUpdate:!0,onKeyDown:!0,onKeyPress:!0,onKeyUp:!0,onFocus:!0,onBlur:!0,onChange:!0,onInput:!0,onSubmit:!0,onClick:!0,onContextMenu:!0,onDoubleClick:!0,onDrag:!0,onDragEnd:!0,onDragEnter:!0,onDragExit:!0,onDragLeave:!0,onDragOver:!0,onDragStart:!0,onDrop:!0,onMouseDown:!0,onMouseEnter:!0,onMouseLeave:!0,onMouseMove:!0,onMouseOut:!0,onMouseOver:!0,onMouseUp:!0,onSelect:!0,onTouchCancel:!0,onTouchEnd:!0,onTouchMove:!0,onTouchStart:!0,onScroll:!0,onWheel:!0,onAbort:!0,onCanPlay:!0,onCanPlayThrough:!0,onDurationChange:!0,onEmptied:!0,onEncrypted:!0,onEnded:!0,onError:!0,onLoadedData:!0,onLoadedMetadata:!0,onLoadStart:!0,onPause:!0,onPlay:!0,onPlaying:!0,onProgress:!0,onRateChange:!0,onSeeked:!0,onSeeking:!0,onStalled:!0,onSuspend:!0,onTimeUpdate:!0,onVolumeChange:!0,onWaiting:!0,onLoad:!0,onAnimationStart:!0,onAnimationEnd:!0,onAnimationIteration:!0,onTransitionEnd:!0,onCopyCapture:!0,onCutCapture:!0,onPasteCapture:!0,onCompositionEndCapture:!0,onCompositionStartCapture:!0,onCompositionUpdateCapture:!0,onKeyDownCapture:!0,onKeyPressCapture:!0,onKeyUpCapture:!0,onFocusCapture:!0,onBlurCapture:!0,onChangeCapture:!0,onInputCapture:!0,onSubmitCapture:!0,onClickCapture:!0,onContextMenuCapture:!0,onDoubleClickCapture:!0,onDragCapture:!0,onDragEndCapture:!0,onDragEnterCapture:!0,onDragExitCapture:!0,onDragLeaveCapture:!0,onDragOverCapture:!0,onDragStartCapture:!0,onDropCapture:!0,onMouseDownCapture:!0,onMouseEnterCapture:!0,onMouseLeaveCapture:!0,onMouseMoveCapture:!0,onMouseOutCapture:!0,onMouseOverCapture:!0,onMouseUpCapture:!0,onSelectCapture:!0,onTouchCancelCapture:!0,onTouchEndCapture:!0,onTouchMoveCapture:!0,onTouchStartCapture:!0,onScrollCapture:!0,onWheelCapture:!0,onAbortCapture:!0,onCanPlayCapture:!0,onCanPlayThroughCapture:!0,onDurationChangeCapture:!0,onEmptiedCapture:!0,onEncryptedCapture:!0,onEndedCapture:!0,onErrorCapture:!0,onLoadedDataCapture:!0,onLoadedMetadataCapture:!0,onLoadStartCapture:!0,onPauseCapture:!0,onPlayCapture:!0,onPlayingCapture:!0,onProgressCapture:!0,onRateChangeCapture:!0,onSeekedCapture:!0,onSeekingCapture:!0,onStalledCapture:!0,onSuspendCapture:!0,onTimeUpdateCapture:!0,onVolumeChangeCapture:!0,onWaitingCapture:!0,onLoadCapture:!0,onAnimationStartCapture:!0,onAnimationEndCapture:!0,onAnimationIterationCapture:!0,onTransitionEndCapture:!0},he={accept:!0,acceptCharset:!0,accessKey:!0,action:!0,allowFullScreen:!0,allowTransparency:!0,alt:!0,as:!0,async:!0,autoComplete:!0,autoPlay:!0,capture:!0,cellPadding:!0,cellSpacing:!0,charSet:!0,challenge:!0,checked:!0,cite:!0,classID:!0,className:!0,cols:!0,colSpan:!0,content:!0,contentEditable:!0,contextMenu:!0,controls:!0,coords:!0,crossOrigin:!0,data:!0,dateTime:!0,default:!0,defer:!0,dir:!0,disabled:!0,download:!0,draggable:!0,encType:!0,form:!0,formAction:!0,formEncType:!0,formMethod:!0,formNoValidate:!0,formTarget:!0,frameBorder:!0,headers:!0,height:!0,hidden:!0,high:!0,href:!0,hrefLang:!0,htmlFor:!0,httpEquiv:!0,icon:!0,id:!0,inputMode:!0,integrity:!0,is:!0,keyParams:!0,keyType:!0,kind:!0,label:!0,lang:!0,list:!0,loop:!0,low:!0,manifest:!0,marginHeight:!0,marginWidth:!0,max:!0,maxLength:!0,media:!0,mediaGroup:!0,method:!0,min:!0,minLength:!0,multiple:!0,muted:!0,name:!0,nonce:!0,noValidate:!0,open:!0,optimum:!0,pattern:!0,placeholder:!0,playsInline:!0,poster:!0,preload:!0,profile:!0,radioGroup:!0,readOnly:!0,referrerPolicy:!0,rel:!0,required:!0,reversed:!0,role:!0,rows:!0,rowSpan:!0,sandbox:!0,scope:!0,scoped:!0,scrolling:!0,seamless:!0,selected:!0,shape:!0,size:!0,sizes:!0,span:!0,spellCheck:!0,src:!0,srcDoc:!0,srcLang:!0,srcSet:!0,start:!0,step:!0,style:!0,summary:!0,tabIndex:!0,target:!0,title:!0,type:!0,useMap:!0,value:!0,width:!0,wmode:!0,wrap:!0,about:!0,datatype:!0,inlist:!0,prefix:!0,property:!0,resource:!0,typeof:!0,vocab:!0,autoCapitalize:!0,autoCorrect:!0,autoSave:!0,color:!0,itemProp:!0,itemScope:!0,itemType:!0,itemID:!0,itemRef:!0,results:!0,security:!0,unselectable:0},de={accentHeight:!0,accumulate:!0,additive:!0,alignmentBaseline:!0,allowReorder:!0,alphabetic:!0,amplitude:!0,arabicForm:!0,ascent:!0,attributeName:!0,attributeType:!0,autoReverse:!0,azimuth:!0,baseFrequency:!0,baseProfile:!0,baselineShift:!0,bbox:!0,begin:!0,bias:!0,by:!0,calcMode:!0,capHeight:!0,clip:!0,clipPath:!0,clipRule:!0,clipPathUnits:!0,colorInterpolation:!0,colorInterpolationFilters:!0,colorProfile:!0,colorRendering:!0,contentScriptType:!0,contentStyleType:!0,cursor:!0,cx:!0,cy:!0,d:!0,decelerate:!0,descent:!0,diffuseConstant:!0,direction:!0,display:!0,divisor:!0,dominantBaseline:!0,dur:!0,dx:!0,dy:!0,edgeMode:!0,elevation:!0,enableBackground:!0,end:!0,exponent:!0,externalResourcesRequired:!0,fill:!0,fillOpacity:!0,fillRule:!0,filter:!0,filterRes:!0,filterUnits:!0,floodColor:!0,floodOpacity:!0,focusable:!0,fontFamily:!0,fontSize:!0,fontSizeAdjust:!0,fontStretch:!0,fontStyle:!0,fontVariant:!0,fontWeight:!0,format:!0,from:!0,fx:!0,fy:!0,g1:!0,g2:!0,glyphName:!0,glyphOrientationHorizontal:!0,glyphOrientationVertical:!0,glyphRef:!0,gradientTransform:!0,gradientUnits:!0,hanging:!0,horizAdvX:!0,horizOriginX:!0,ideographic:!0,imageRendering:!0,in:!0,in2:!0,intercept:!0,k:!0,k1:!0,k2:!0,k3:!0,k4:!0,kernelMatrix:!0,kernelUnitLength:!0,kerning:!0,keyPoints:!0,keySplines:!0,keyTimes:!0,lengthAdjust:!0,letterSpacing:!0,lightingColor:!0,limitingConeAngle:!0,local:!0,markerEnd:!0,markerMid:!0,markerStart:!0,markerHeight:!0,markerUnits:!0,markerWidth:!0,mask:!0,maskContentUnits:!0,maskUnits:!0,mathematical:!0,mode:!0,numOctaves:!0,offset:!0,opacity:!0,operator:!0,order:!0,orient:!0,orientation:!0,origin:!0,overflow:!0,overlinePosition:!0,overlineThickness:!0,paintOrder:!0,panose1:!0,pathLength:!0,patternContentUnits:!0,patternTransform:!0,patternUnits:!0,pointerEvents:!0,points:!0,pointsAtX:!0,pointsAtY:!0,pointsAtZ:!0,preserveAlpha:!0,preserveAspectRatio:!0,primitiveUnits:!0,r:!0,radius:!0,refX:!0,refY:!0,renderingIntent:!0,repeatCount:!0,repeatDur:!0,requiredExtensions:!0,requiredFeatures:!0,restart:!0,result:!0,rotate:!0,rx:!0,ry:!0,scale:!0,seed:!0,shapeRendering:!0,slope:!0,spacing:!0,specularConstant:!0,specularExponent:!0,speed:!0,spreadMethod:!0,startOffset:!0,stdDeviation:!0,stemh:!0,stemv:!0,stitchTiles:!0,stopColor:!0,stopOpacity:!0,strikethroughPosition:!0,strikethroughThickness:!0,string:!0,stroke:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeLinecap:!0,strokeLinejoin:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0,surfaceScale:!0,systemLanguage:!0,tableValues:!0,targetX:!0,targetY:!0,textAnchor:!0,textDecoration:!0,textRendering:!0,textLength:!0,to:!0,transform:!0,u1:!0,u2:!0,underlinePosition:!0,underlineThickness:!0,unicode:!0,unicodeBidi:!0,unicodeRange:!0,unitsPerEm:!0,vAlphabetic:!0,vHanging:!0,vIdeographic:!0,vMathematical:!0,values:!0,vectorEffect:!0,version:!0,vertAdvY:!0,vertOriginX:!0,vertOriginY:!0,viewBox:!0,viewTarget:!0,visibility:!0,widths:!0,wordSpacing:!0,writingMode:!0,x:!0,xHeight:!0,x1:!0,x2:!0,xChannelSelector:!0,xlinkActuate:!0,xlinkArcrole:!0,xlinkHref:!0,xlinkRole:!0,xlinkShow:!0,xlinkTitle:!0,xlinkType:!0,xmlBase:!0,xmlns:!0,xmlnsXlink:!0,xmlLang:!0,xmlSpace:!0,y:!0,y1:!0,y2:!0,yChannelSelector:!0,z:!0,zoomAndPan:!0},fe=RegExp.prototype.test.bind(new RegExp("^(data|aria)-[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$")),me={}.hasOwnProperty,ge=function(e){return me.call(he,e)||me.call(de,e)||fe(e.toLowerCase())||me.call(pe,e)},ye=p,Ce=Object.prototype.toString,ve=function(e){var t=[],n=e;return{publish:function(e){n=e,t.forEach(function(e){return e(n)})},subscribe:function(e){return t.push(e),e(n),function(){t=t.filter(function(t){return t!==e})}}}},be="__styled-components__",xe=function(e){function t(){T(this,t);var n=E(this,e.call(this));return n.getTheme=n.getTheme.bind(n),n}return S(t,e),t.prototype.componentWillMount=function(){var e=this;if(this.context[be]){var t=this.context[be];this.unsubscribeToOuter=t(function(t){e.outerTheme=t})}this.broadcast=ve(this.getTheme())},t.prototype.getChildContext=function(){var e;return A({},this.context,(e={},e[be]=this.broadcast.subscribe,e))},t.prototype.componentWillReceiveProps=function(e){this.props.theme!==e.theme&&this.broadcast.publish(this.getTheme(e.theme))},t.prototype.componentWillUnmount=function(){this.context[be]&&this.unsubscribeToOuter()},t.prototype.getTheme=function(e){var t=e||this.props.theme;if(ye(t)){var n=t(this.outerTheme);if(!I(n))throw new Error("[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!");return n}if(!I(t))throw new Error("[ThemeProvider] Please make your theme prop a plain object");return A({},this.outerTheme,t)},t.prototype.render=function(){return this.props.children?g.Children.only(this.props.children):null},t}(t.Component);xe.childContextTypes=(se={},se[be]=ie.func.isRequired,se),xe.contextTypes=(ce={},ce[be]=ie.func,ce);var we,Te=function(e){function t(){return T(this,t),E(this,e.apply(this,arguments))}return S(t,e),t}(t.Component);Te.contextTypes=(we={},we[be]=ie.func,we[K]=ie.instanceOf(Y),we);var ke=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"],Ae=function(e){return e.replace(/\s|\\n/g,"")},Se={childContextTypes:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,mixins:!0,propTypes:!0,type:!0},Oe={name:!0,length:!0,prototype:!0,caller:!0,arguments:!0,arity:!0},Ee="function"==typeof Object.getOwnPropertySymbols,je=function(e,t,n){if("string"!=typeof t){var o=Object.getOwnPropertyNames(t);Ee&&(o=o.concat(Object.getOwnPropertySymbols(t)));for(var r=0;r<o.length;++r)if(!(Se[o[r]]||Oe[o[r]]||n&&n[o[r]]))try{e[o[r]]=t[o[r]]}catch(e){}}return e},Pe=function(e){var t,n=e.displayName||e.name||"Component",o=u(e),r=function(t){function n(){var e,o,r;T(this,n);for(var i=arguments.length,a=Array(i),s=0;s<i;s++)a[s]=arguments[s];return e=o=E(this,t.call.apply(t,[this].concat(a))),o.state={},r=e,E(o,r)}return S(n,t),n.prototype.componentWillMount=function(){var e=this;if(!this.context[be])throw new Error("[withTheme] Please use ThemeProvider to be able to use withTheme");var t=this.context[be];this.unsubscribe=t(function(t){e.setState({theme:t})})},n.prototype.componentWillUnmount=function(){"function"==typeof this.unsubscribe&&this.unsubscribe()},
-n.prototype.render=function(){var t=this.props.innerRef,n=this.state.theme;return g.createElement(e,A({theme:n},this.props,{innerRef:o?t:void 0,ref:o?void 0:t}))},n}(g.Component);return r.displayName="WithTheme("+n+")",r.styledComponentId="withTheme",r.contextTypes=(t={},t[be]=ie.func,t),je(r,e)},Ie=function(e,t,n){return function(){function o(e,t){if(T(this,o),this.rules=e,this.componentId=t,!Y.instance.hasInjectedComponent(this.componentId)){Y.instance.deferredInject(t,!0,"")}}return o.prototype.generateAndInjectStyles=function(o,r){var i=t(this.rules,o),a=h(this.componentId+i.join("")),s=r.getName(a);if(s)return s;var c=e(a);if(r.alreadyInjected(a,c))return c;var u="\n"+n(i,"."+c);return r.inject(this.componentId,!0,u,a,c),c},o.generateName=function(t){return e(h(t))},o}()}(U,N,F),Me=function(e){return function t(n,o){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if("string"!=typeof o&&"function"!=typeof o)throw new Error("Cannot create styled-component for component: "+o);var i=function(t){for(var i=arguments.length,a=Array(i>1?i-1:0),s=1;s<i;s++)a[s-1]=arguments[s];return n(o,r,e.apply(void 0,[t].concat(a)))};return i.withConfig=function(e){return t(n,o,A({},r,e))},i.attrs=function(e){return t(n,o,A({},r,{attrs:A({},r.attrs||{},e)}))},i}}(W),Ne=function(e,n){var o={},r=function(t){var n="string"!=typeof t?"sc":t.replace(/[[\].#*$><+~=|^:(),"'`]/g,"-").replace(/--+/g,"-"),r=(o[n]||0)+1;return o[n]=r,n+"-"+e.generateName(n+r)},i=function(e){function n(){var t,o,r;T(this,n);for(var i=arguments.length,a=Array(i),s=0;s<i;s++)a[s]=arguments[s];return t=o=E(this,e.call.apply(e,[this].concat(a))),o.attrs={},o.state={theme:null,generatedClassName:""},r=t,E(o,r)}return S(n,e),n.prototype.buildExecutionContext=function(e,t){var n=this.constructor.attrs,o=A({},t,{theme:e});return void 0===n?o:(this.attrs=Object.keys(n).reduce(function(e,t){var r=n[t];return e[t]="function"==typeof r?r(o):r,e},{}),A({},o,this.attrs))},n.prototype.generateAndInjectStyles=function(e,t){var n=this.constructor,o=n.componentStyle,r=n.warnTooManyClasses,i=this.buildExecutionContext(e,t),a=this.context[K]||Y.instance,s=o.generateAndInjectStyles(i,a);return void 0!==r&&r(s),s},n.prototype.componentWillMount=function(){var e=this;if(this.context[be]){var t=this.context[be];this.unsubscribe=t(function(t){var n=e.constructor.defaultProps,o=n&&e.props.theme===n.theme,r=e.props.theme&&!o?e.props.theme:t,i=e.generateAndInjectStyles(r,e.props);e.setState({theme:r,generatedClassName:i})})}else{var n=this.props.theme||{},o=this.generateAndInjectStyles(n,this.props);this.setState({theme:n,generatedClassName:o})}},n.prototype.componentWillReceiveProps=function(e){var t=this;this.setState(function(n){var o=t.constructor.defaultProps,r=o&&e.theme===o.theme,i=e.theme&&!r?e.theme:n.theme;return{theme:i,generatedClassName:t.generateAndInjectStyles(i,e)}})},n.prototype.componentWillUnmount=function(){this.unsubscribe&&this.unsubscribe()},n.prototype.render=function(){var e=this,n=this.props.innerRef,o=this.state.generatedClassName,r=this.constructor,i=r.styledComponentId,a=r.target,s=c(a),l=[this.props.className,i,this.attrs.className,o].filter(Boolean).join(" "),p=A({},this.attrs,{className:l});u(a)?p.innerRef=n:p.ref=n;var h=Object.keys(this.props).reduce(function(t,n){return"innerRef"===n||"className"===n||s&&!ge(n)||(t[n]=e.props[n]),t},p);return t.createElement(a,h)},n}(Te);return function t(o,a,s){var u,p=a.displayName,h=void 0===p?c(o)?"styled."+o:"Styled("+l(o)+")":p,d=a.componentId,f=void 0===d?r(a.displayName):d,m=a.ParentComponent,g=void 0===m?i:m,y=a.rules,C=a.attrs,v=a.displayName&&a.componentId?a.displayName+"-"+a.componentId:f,b=void 0,x=new e(void 0===y?s:y.concat(s),v),w=function(e){function r(){return T(this,r),E(this,e.apply(this,arguments))}return S(r,e),r.withComponent=function(e){var n=(a.displayName,a.componentId,O(a,["displayName","componentId"])),o=A({},n,{ParentComponent:r});return t(e,o,s)},k(r,null,[{key:"extend",get:function(){var e=(a.displayName,a.componentId,O(a,["displayName","componentId"])),i=A({},e,{rules:s,ParentComponent:r});return n(t,o,i)}}]),r}(g);return w.contextTypes=(u={},u[be]=ie.func,u[K]=ie.instanceOf(Y),u),w.displayName=h,w.styledComponentId=v,w.attrs=C,w.componentStyle=x,w.warnTooManyClasses=b,w.target=o,w}}(Ie,Me),De=function(e,t,n){return function(o){for(var r=arguments.length,i=Array(r>1?r-1:0),a=1;a<r;a++)i[a-1]=arguments[a];var s=n.apply(void 0,[o].concat(i)),c=h(Ae(JSON.stringify(s))),u=Y.instance.getName(c);if(u)return u;var l=e(c);if(Y.instance.alreadyInjected(c,l))return l;var p=t(s,l,"@keyframes");return Y.instance.inject("sc-keyframes-"+l,!0,p,c,l),l}}(U,F,W),Re=function(e,t){return function(n){for(var o=arguments.length,r=Array(o>1?o-1:0),i=1;i<o;i++)r[i-1]=arguments[i];var a=t.apply(void 0,[n].concat(r)),s=h(JSON.stringify(a)),c="sc-global-"+s;Y.instance.hasInjectedComponent(c)||Y.instance.inject(c,!1,e(a))}}(F,W),Fe=function(e,t){var n=function(n){return t(e,n)};return ke.forEach(function(e){n[e]=n(e)}),n}(Ne,Me);e.default=Fe,e.css=W,e.keyframes=De,e.injectGlobal=Re,e.ThemeProvider=xe,e.withTheme=Pe,e.ServerStyleSheet=le,e.StyleSheetManager=ae,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t(e.styled=e.styled||{},e.React)}(this,function(e,t){"use strict";function n(e){return e.replace(g,"-$1").toLowerCase()}function r(e){return C(e).replace(v,"-ms-")}function o(e){return!0===P(e)&&"[object Object]"===Object.prototype.toString.call(e)}function a(e,t){return t={exports:{}},e(t,t.exports),t.exports}function i(e){return function(){return e}}function s(e,t,n,r,o,a,i,s){if(Q(t),!e){var c;if(void 0===t)c=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var u=[n,r,o,a,i,s],p=0;c=new Error(t.replace(/%s/g,function(){return u[p++]})),c.name="Invariant Violation"}throw c.framesToPop=1,c}}function c(e){return"string"==typeof e}function u(e){return"function"==typeof e&&"string"==typeof e.styledComponentId}function p(e){return e.displayName||e.name||"Component"}function l(e){var t=ge.call(e);return"[object Function]"===t||"function"==typeof e&&"[object RegExp]"!==t||"undefined"!=typeof window&&(e===window.setTimeout||e===window.alert||e===window.confirm||e===window.prompt)}function h(e,t){for(var n=1540483477,r=t^e.length,o=e.length,a=0;o>=4;){var i=d(e,a);i=m(i,n),i^=i>>>24,i=m(i,n),r=m(r,n),r^=i,a+=4,o-=4}switch(o){case 3:r^=f(e,a),r^=e.charCodeAt(a+2)<<16,r=m(r,n);break;case 2:r^=f(e,a),r=m(r,n);break;case 1:r^=e.charCodeAt(a),r=m(r,n)}return r^=r>>>13,r=m(r,n),(r^=r>>>15)>>>0}function d(e,t){return e.charCodeAt(t++)+(e.charCodeAt(t++)<<8)+(e.charCodeAt(t++)<<16)+(e.charCodeAt(t)<<24)}function f(e,t){return e.charCodeAt(t++)+(e.charCodeAt(t++)<<8)}function m(e,t){return e|=0,t|=0,(65535&e)*t+(((e>>>16)*t&65535)<<16)|0}var y="default"in t?t.default:t,g=/([A-Z])/g,b=n,C=b,v=/^ms-/,k=r,w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},x=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},T=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),A=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},S=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)},j=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n},E=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},O=function(e){return null!=e&&"object"===(void 0===e?"undefined":w(e))&&!Array.isArray(e)},P=O,I=function(e){var t,n;return!1!==o(e)&&("function"==typeof(t=e.constructor)&&(n=t.prototype,!1!==o(n)&&!1!==n.hasOwnProperty("isPrototypeOf")))},M=function e(t,n){var r=Object.keys(t).map(function(n){return I(t[n])?e(t[n],n):k(n)+": "+t[n]+";"}).join(" ");return n?n+" {\n  "+r+"\n}":r},N=function e(t,n){return t.reduce(function(t,r){return void 0===r||null===r||!1===r||""===r?t:Array.isArray(r)?[].concat(t,e(r,n)):r.hasOwnProperty("styledComponentId")?[].concat(t,["."+r.styledComponentId]):"function"==typeof r?n?t.concat.apply(t,e([r(n)],n)):t.concat(r):t.concat(I(r)?M(r):r.toString())},[])},D=a(function(e,t){!function(n){"object"===(void 0===t?"undefined":w(t))&&void 0!==e?e.exports=n():window.stylis=n()}(function(){function e(n,o,i,c){for(var u,p,d=0,f=0,m=0,y=0,g=0,b=0,C=0,v=0,k=0,w=0,A=0,S=0,j=0,E=0,O=0,q=0,V=0,K=i.length,ye=K-1,ge="",ve="",we="",xe="",Ie="",Me="";A<K;){if(S=i.charCodeAt(A),f+y+m+d===0){if(1===q){switch(S){case G:break;default:A--,S=N}q=0}switch(A){case ye:if(O>0&&(ve=ve.replace(h,"")),(ve=ve.trim()).length>0){switch(S){case B:case _:case N:case H:case W:break;default:ve+=i.charAt(A)}S=N}}switch(S){case R:for(ve=ve.trim(),g=ve.charCodeAt(0),C=1,A++;A<K;){switch(S=i.charCodeAt(A)){case R:C++;break;case D:C--}if(0===C)break;xe+=i.charAt(A++)}switch(g===re&&(g=(ve=ve.replace(l,"").trim()).charCodeAt(0)),g){case $:switch(O>0&&(ve=ve.replace(h,"")),b=ve.charCodeAt(1),xe=e(o,b>108?o:Ce,xe,b),ke>0&&(u=t(Ce,ve),p=s(je,xe,u,o,he,le,we.length),ve=u.join(""),void 0!==p&&(xe=p)),b){case ae:case ie:xe=ve+"{"+xe+"}";break;case se:xe=ve+xe;break;case oe:ve=ve.replace(x,"$1 $2"+(Oe>0?Pe:"")),xe=ve+"{"+xe+"}",xe="@"+(me>0?P+xe+"@"+xe:xe)}break;default:xe=e(o,t(o,ve),xe,c)}Ie+=xe,A++,v=0,w=0,O=0,k=0,ve="",xe="";break;case N:switch(O>0&&(ve=ve.replace(h,"")),ve=ve.trim(),ke>0&&void 0!==(p=s(Ae,ve,o,n,he,le,we.length))&&(ve=p.trim()).length<1&&(ve="\0\0"),g=ve.charCodeAt(0),b=ve.charCodeAt(1),g+b){case re:break;case ue:case pe:Me+=ve+i.charAt(A);break;default:we+=r(ve,g,b,ve.charCodeAt(2))}A++,v=0,w=0,O=0,ve=""}}switch(S){case H:case W:if(f+y+m+d+be===0)switch(j){case Y:case G:case re:case _:case H:case W:case B:case N:case R:case D:break;default:w>0&&(q=1)}f===Q&&(f=0),ke*Ee>0&&s(Te,ve,o,n,he,le,we.length),le=1,he++;break;default:if(le++,S===_)break;switch(ge=i.charAt(A),S){case 108:y+f+d+de===0&&w>0&&A-w==2&&(de=j);break;case Y:y+f+d===0&&(w=A);break;case G:f+m+y+d===0&&(O=1,ge+="\r");break;case J:0===f&&(y=y===J?0:0===y?J:y);break;case Z:0===f&&(y=y===Z?0:0===y?Z:y);break;case z:y+f+m===0&&(d=1);break;case U:y+f+m===0&&(d=0);break;case L:y+f+d===0&&(A===ye&&(ye++,K++),m--);break;case F:if(y+f+d===0){if(0===v)switch(2*j+3*E){case 533:break;default:C=0,v=1}m++}break;case $:f+m+y+d+w+k===0&&(k=1);break;case X:case Q:if(y+d+m>0)break;switch(f){case 0:switch(2*S+3*i.charCodeAt(A+1)){case 235:f=Q;break;case 220:f=X}break;case X:S===Q&&j===X&&(ge="",f=0)}}if(0===f){if(fe+y+d+k===0&&c!==oe)switch(O=1,S){case G:case ne:case ee:case te:case L:case F:if(0===v)switch(j){case _:case B:case W:case H:ge+="\0";break;default:ge="\0"+ge+(S===G?"":"\0")}else switch(S){case F:v=++C;break;case L:0==(v=--C)&&(ge+="\0")}break;case B:switch(j){case G:case _:case B:case W:case H:break;default:0===v&&(ge+="\0")}}ve+=ge}}E=j,j=S,A++}if(O>0&&(we=we.replace(h,"")),V=we.length,V>0&&ke>0&&void 0!==(p=s(Se,we,o,n,he,le,V))&&(V=(we=p).length),V>0)switch(0===fe&&c!==oe&&a(o),we=o.join(",").trim()+"{"+we+"}",de){case 0:break;case ce:we=we.replace(T,"::"+P+"input-$1")+we.replace(T,"::"+I+"$1")+we.replace(T,":"+M+"input-$1")+we;default:de=0}return Me+we+Ie}function t(e,t){var r=t.trim().split(C),o=r,a=o.length,i=e.length;switch(i){case 0:case 1:for(var s=0,c=0===i?"":e[0]+" ";s<a;s++)o[s]=n(o[s],c,i).trim();break;default:for(var s=0,u=0,o=[];s<a;s++)for(var p=0;p<i;p++)o[u++]=n(r[s],e[p]+" ",i).trim()}return o}function n(e,t,n){var r=e,o=t,a=r.charCodeAt(0);switch(a){case re:r=r.replace(l,"");case H:case W:case B:a=(r=r.trim()).charCodeAt(0)}switch(a){case q:switch(fe+n){case 0:case 1:if(0===t.trim().length)break;default:return r.replace(v,o.trim())}break;case Y:switch(r.charCodeAt(1)){case 103:if(ye>0&&fe>0)return r.replace(w,"$1").replace(v,Me);break;default:return o.trim()+r}default:switch(r.charCodeAt(r.length-1)){case q:return o.replace(Me,"").trim()+" "+r.replace(v,Me)}}return o+r}function r(e,t,n,r){var a,i=e+";",s=0,c=2*t+3*n+4*r;if(944===c)i=o(i);else if(me>0)switch(c){case 883:i.charCodeAt(8)===V&&(i=P+i+i);break;case 978:i=P+i+I+i+i;break;case 1019:case 983:i=P+i+I+i+M+i+i;break;case 932:i=P+i+M+i+i;break;case 964:i=P+i+M+"flex-"+i+i;break;case 1023:a=i.substring(i.indexOf(":",15)).replace("flex-",""),i=P+"box-pack"+a+P+i+M+"flex-pack"+a+i;break;case 975:switch(s=(i=e).length-10,a=(33===i.charCodeAt(s)?i.substring(0,s):i).substring(8).trim(),c=a.charCodeAt(0)+(0|a.charCodeAt(7))){case 203:a.charCodeAt(8)>110&&(i=i.replace(a,P+a)+";"+i);break;case 207:case 102:i=i.replace(a,P+(c>102?"inline-":"")+"box")+";"+i.replace(a,P+a)+";"+i.replace(a,M+a+"box")+";"+i}i+=";";break;case 938:if(i.charCodeAt(5)===V)switch(i.charCodeAt(6)){case 105:a=i.replace("-items",""),i=P+i+P+"box-"+a+M+"flex-"+a+i;break;case 115:i=P+i+M+"flex-item-"+i.replace("-self","")+i;break;default:i=P+i+M+"flex-line-pack"+i.replace("align-content","")+i}break;case 1005:f.test(i)&&(i=i.replace(d,": "+P)+i.replace(d,": "+I)+i);break;case 953:(s=i.indexOf("-content",9))>0&&(a=i.substring(s-3),i="width:"+P+a+"width:"+I+a+"width:"+a);break;case 962:case 1015:i=P+i+(102===i.charCodeAt(5)?M+i:"")+i,n+r===211&&105===i.charCodeAt(13)&&i.indexOf("transform",10)>0&&(i=i.substring(0,i.indexOf(";",27)+1).replace(m,P+"$1")+i)}return i}function o(e){var t=e.length,n=e.indexOf(":",9)+1,r=e.substring(0,n).trim(),o=e.substring(n,t-1).trim(),a="";if(e.charCodeAt(9)!==V)for(var i=o.split(y),s=0,n=0,t=i.length;s<t;n=0,s++){for(var c=i[s],u=c.split(g);c=u[n];){var p=c.charCodeAt(0);if(1===Oe&&(p>$&&p<90||p>96&&p<122||p===K||p===V&&c.charCodeAt(1)!==V))switch(isNaN(parseFloat(c))+(-1!==c.indexOf("("))){case 1:switch(c){case"infinite":case"alternate":case"backwards":case"running":case"normal":case"forwards":case"both":case"none":case"linear":case"ease":case"ease-in":case"ease-out":case"ease-in-out":case"paused":case"reversed":case"alternate-reverse":case"inherit":case"initial":case"unset":case"step-start":case"step-end":break;default:c+=Pe}}u[n++]=c}a+=(0===s?"":",")+u.join(" ")}else a+=110===e.charCodeAt(10)?o+(1===Oe?Pe:""):o;return a=r+a+";",me>0?P+a+a:a}function a(e){for(var t,n,r=0,o=e.length;r<o;r++){for(var a=e[r].split(b),i="",s=0,c=0,u=0,p=0,l=a.length;s<l;s++)if(!(0===(c=(n=a[s]).length)&&l>1)){if(t=" ",u=i.charCodeAt(i.length-1),p=n.charCodeAt(0),0===s)t="";else switch(u){case X:case ne:case ee:case te:case B:case F:t=""}switch(p){case q:n=t+""+Ie;case ne:case ee:case te:case B:case L:case F:break;case z:n=t+n+Ie;break;case Y:switch(2*n.charCodeAt(1)+3*n.charCodeAt(2)){case 530:if(ye>0){n=t+n.substring(8,c-1);break}default:(s<1||a[s-1].length<1)&&(n=t+Ie+n)}break;case G:t="";default:n=c>1&&n.indexOf(":")>0?t+n.replace(O,"$1"+Ie+"$2"):t+n+Ie}i+=n}e[r]=i.replace(h,"").trim()}}function i(t,n){var r=t,o=r.charCodeAt(0);o<33&&(o=(r=r.trim()).charCodeAt(0)),Oe>0&&(Pe=r.replace(k,o===z?"":"-")),1===fe?Me=r:Ie=r;var a=[Me];ke>0&&s(xe,n,a,a,he,le,0);var i=e(Ce,a,n,0);return ke>0&&s(we,i,a,a,he,le,i.length),Pe="",Me="",Ie="",he=1,le=1,de=0,0===ge?i:p(i)}function s(e,t,n,r,o,a,i){for(var s=0,c=t;s<ke;s++)c=ve[s](e,c,n,r,o,a,i);switch(c){case null:case void 0:case t:break;default:return c+""}}function c(e){switch(e){case void 0:case null:ke=ve.length=0;break;default:switch(e.constructor){case Array:for(var t=0,n=e.length;t<n;t++)c(e[t]);break;case Function:ve[ke++]=e;break;case Boolean:Ee=0|!!e}}return c}function u(e){for(var t in e){var n=e[t];switch(t){case"keyframe":Oe=0|n;break;case"global":ye=0|n;break;case"cascade":fe=0|n;break;case"compress":ge=0|n;break;case"prefix":me=0|n;break;case"semicolon":be=0|n}}return u}function p(e){return e.replace(h,"").replace(A,"").replace(S,"$1").replace(j,"$1").replace(E," ")}var l=/^\0+/g,h=/[\0\r]/g,d=/: */g,f=/zoo|gra/,m=/ *(transform)/g,y=/,+\s*(?![^(]*[)])/g,g=/ +\s*(?![^(]*[)])/g,b=/ *[\0] */g,C=/,\r+?/g,v=/&/g,k=/\W+/g,w=/:global\(((?:[^\(\)\[\]]*|\[.*\]|\([^\(\)]*\))*)\)/g,x=/@(k\w+s)\s*(\S*)\s*/,T=/::?(place)/g,A=/\s+(?=[{\];=:>])/g,S=/([[}=:>])\s+/g,j=/(\{[^{]+?);(?=\})/g,E=/\s{2,}/g,O=/([^\(])(:+) */g,P="-webkit-",I="-moz-",M="-ms-",N=59,D=125,R=123,F=40,L=41,z=91,U=93,W=10,H=13,_=9,$=64,B=32,q=38,V=45,K=95,X=42,G=44,Y=58,Z=39,J=34,Q=47,ee=62,te=43,ne=126,re=0,oe=107,ae=109,ie=115,se=102,ce=112,ue=169,pe=163,le=1,he=1,de=0,fe=1,me=1,ye=1,ge=0,be=0,Ce=[],ve=[],ke=0,we=-2,xe=-1,Te=0,Ae=1,Se=2,je=3,Ee=0,Oe=1,Pe="",Ie="",Me="";return i.use=c,i.set=u,i})});D.set({global:!1,cascade:!0,keyframe:!1,prefix:!0,compress:!1,semicolon:!0});var R=function(e,t,n){var r=e.join("").replace(/^\s*\/\/.*$/gm,""),o=t&&n?n+" "+t+" { "+r+" }":r;return D(n||!t?"":t,o)},F="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ".split(""),L=F.length,z=function(e){var t="",n=void 0;for(n=e;n>L;n=Math.floor(n/F.length))t=F[n%L]+t;return F[n%L]+t},U=function(e,t){return t.reduce(function(t,n,r){return t.concat(n,e[r+1])},[e[0]])},W=function(e){for(var t=arguments.length,n=Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];return N(U(e,n))},H=function(e){var t=""+(e||""),n=[];return t.replace(/^[^\S\n]*?\/\* sc-component-id:\s+(\S+)\s+\*\//gm,function(e,t,r){return n.push({componentId:t,matchIndex:r}),e}),n.map(function(e,r){var o=e.componentId,a=e.matchIndex,i=n[r+1];return{componentId:o,cssFromDOM:i?t.slice(a,i.matchIndex):t.slice(a)}})},_=function(){function e(t,n){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"";x(this,e),this.el=t,this.isLocal=n,this.ready=!1;var o=H(r);this.size=o.length,this.components=o.reduce(function(e,t){return e[t.componentId]=t,e},{})}return e.prototype.isFull=function(){return this.size>=40},e.prototype.addComponent=function(e){if(this.ready||this.replaceElement(),this.components[e])throw new Error("Trying to add Component '"+e+"' twice!");var t={componentId:e,textNode:document.createTextNode("")};this.el.appendChild(t.textNode),this.size+=1,this.components[e]=t},e.prototype.inject=function(e,t,n){this.ready||this.replaceElement();var r=this.components[e];if(!r)throw new Error("Must add a new component before you can inject css into it");if(""===r.textNode.data&&r.textNode.appendData("\n/* sc-component-id: "+e+" */\n"),r.textNode.appendData(t),n){var o=this.el.getAttribute(B);this.el.setAttribute(B,o?o+" "+n:n)}},e.prototype.toHTML=function(){return this.el.outerHTML},e.prototype.toReactElement=function(){throw new Error("BrowserTag doesn't implement toReactElement!")},e.prototype.clone=function(){throw new Error("BrowserTag cannot be cloned!")},e.prototype.replaceElement=function(){var e=this;if(this.ready=!0,0!==this.size){var t=this.el.cloneNode();if(t.appendChild(document.createTextNode("\n")),Object.keys(this.components).forEach(function(n){var r=e.components[n];r.textNode=document.createTextNode(r.cssFromDOM),t.appendChild(r.textNode)}),!this.el.parentNode)throw new Error("Trying to replace an element that wasn't mounted!");this.el.parentNode.replaceChild(t,this.el),this.el=t}},e}(),$={create:function(){for(var e=[],t={},n=document.querySelectorAll("["+B+"]"),r=n.length,o=0;o<r;o+=1){var a=n[o];e.push(new _(a,"true"===a.getAttribute(q),a.innerHTML));var i=a.getAttribute(B);i&&i.trim().split(/\s+/).forEach(function(e){t[e]=!0})}return new G(function(e){var t=document.createElement("style");if(t.type="text/css",t.setAttribute(B,""),t.setAttribute(q,e?"true":"false"),!document.head)throw new Error("Missing document <head>");return document.head.appendChild(t),new _(t,e)},e,t)}},B="data-styled-components",q="data-styled-components-is-local",V="__styled-components-stylesheet__",K=null,X=[],G=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};x(this,e),this.hashes={},this.deferredInjections={},this.tagConstructor=t,this.tags=n,this.names=r,this.constructComponentTagMap()}return e.prototype.constructComponentTagMap=function(){var e=this;this.componentTags={},this.tags.forEach(function(t){Object.keys(t.components).forEach(function(n){e.componentTags[n]=t})})},e.prototype.getName=function(e){return this.hashes[e.toString()]},e.prototype.alreadyInjected=function(e,t){return!!this.names[t]&&(this.hashes[e.toString()]=t,!0)},e.prototype.hasInjectedComponent=function(e){return!!this.componentTags[e]},e.prototype.deferredInject=function(e,t,n){this===K&&X.forEach(function(r){r.deferredInject(e,t,n)}),this.getOrCreateTag(e,t),this.deferredInjections[e]=n},e.prototype.inject=function(e,t,n,r,o){this===K&&X.forEach(function(r){r.inject(e,t,n)});var a=this.getOrCreateTag(e,t),i=this.deferredInjections[e];i&&(a.inject(e,i),delete this.deferredInjections[e]),a.inject(e,n,o),r&&o&&(this.hashes[r.toString()]=o)},e.prototype.toHTML=function(){return this.tags.map(function(e){return e.toHTML()}).join("")},e.prototype.toReactElements=function(){return this.tags.map(function(e,t){return e.toReactElement("sc-"+t)})},e.prototype.getOrCreateTag=function(e,t){var n=this.componentTags[e];if(n)return n;var r=this.tags[this.tags.length-1],o=!r||r.isFull()||r.isLocal!==t?this.createNewTag(t):r;return this.componentTags[e]=o,o.addComponent(e),o},e.prototype.createNewTag=function(e){var t=this.tagConstructor(e);return this.tags.push(t),t},e.reset=function(t){K=e.create(t)},e.create=function(){return((arguments.length>0&&void 0!==arguments[0]?arguments[0]:"undefined"==typeof document)?ue:$).create()},e.clone=function(t){var n=new e(t.tagConstructor,t.tags.map(function(e){return e.clone()}),A({},t.names));return n.hashes=A({},t.hashes),n.deferredInjections=A({},t.deferredInjections),X.push(n),n},T(e,null,[{key:"instance",get:function(){return K||(K=e.create())}}]),e}(),Y=function(){};Y.thatReturns=i,Y.thatReturnsFalse=i(!1),Y.thatReturnsTrue=i(!0),Y.thatReturnsNull=i(null),Y.thatReturnsThis=function(){return this},Y.thatReturnsArgument=function(e){return e};var Z,J=Y,Q=function(e){},ee=s,te=J,ne=ee,re=function(){function e(){ne(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t};return n.checkPropTypes=te,n.PropTypes=n,n},oe=a(function(e){e.exports=re()}),ae=function(e){function t(){return x(this,t),E(this,e.apply(this,arguments))}return S(t,e),t.prototype.getChildContext=function(){var e;return e={},e[V]=this.props.sheet,e},t.prototype.render=function(){return y.Children.only(this.props.children)},t}(t.Component);ae.childContextTypes=(Z={},Z[V]=oe.instanceOf(G).isRequired,Z);var ie,se,ce=function(){function e(t){x(this,e),this.isLocal=t,this.components={},this.size=0,this.names=[]}return e.prototype.isFull=function(){return!1},e.prototype.addComponent=function(e){if(this.components[e])throw new Error("Trying to add Component '"+e+"' twice!");this.components[e]={componentId:e,css:""},this.size+=1},e.prototype.inject=function(e,t,n){var r=this.components[e];if(!r)throw new Error("Must add a new component before you can inject css into it");""===r.css&&(r.css="/* sc-component-id: "+e+" */\n"),r.css+=t.replace(/\n*$/,"\n"),n&&this.names.push(n)},e.prototype.toHTML=function(){var e=this;return'<style type="text/css" '+B+'="'+this.names.join(" ")+'" '+q+'="'+(this.isLocal?"true":"false")+'">\n'+Object.keys(this.components).map(function(t){return e.components[t].css}).join("")+"\n</style>"},e.prototype.toReactElement=function(e){var t,n=this,r=(t={},t[B]=this.names.join(" "),t[q]=this.isLocal.toString(),t),o=Object.keys(this.components).map(function(e){return n.components[e].css}).join("");return y.createElement("style",A({key:e,type:"text/css"},r,{dangerouslySetInnerHTML:{__html:o}}))},e.prototype.clone=function(){var t=this,n=new e(this.isLocal);return n.names=[].concat(this.names),n.size=this.size,n.components=Object.keys(this.components).reduce(function(e,n){return e[n]=A({},t.components[n]),e},{}),n},e}(),ue=function(){function e(){x(this,e),this.instance=G.clone(G.instance)}return e.prototype.collectStyles=function(e){if(this.closed)throw new Error("Can't collect styles once you've called getStyleTags!");return y.createElement(ae,{sheet:this.instance},e)},e.prototype.getStyleTags=function(){return this.closed||(X.splice(X.indexOf(this.instance),1),this.closed=!0),this.instance.toHTML()},e.prototype.getStyleElement=function(){return this.closed||(X.splice(X.indexOf(this.instance),1),this.closed=!0),this.instance.toReactElements()},e.create=function(){return new G(function(e){return new ce(e)})},e}(),pe={children:!0,dangerouslySetInnerHTML:!0,key:!0,ref:!0,autoFocus:!0,defaultValue:!0,valueLink:!0,defaultChecked:!0,checkedLink:!0,innerHTML:!0,suppressContentEditableWarning:!0,onFocusIn:!0,onFocusOut:!0,className:!0,onCopy:!0,onCut:!0,onPaste:!0,onCompositionEnd:!0,onCompositionStart:!0,onCompositionUpdate:!0,onKeyDown:!0,onKeyPress:!0,onKeyUp:!0,onFocus:!0,onBlur:!0,onChange:!0,onInput:!0,onSubmit:!0,onClick:!0,onContextMenu:!0,onDoubleClick:!0,onDrag:!0,onDragEnd:!0,onDragEnter:!0,onDragExit:!0,onDragLeave:!0,onDragOver:!0,onDragStart:!0,onDrop:!0,onMouseDown:!0,onMouseEnter:!0,onMouseLeave:!0,onMouseMove:!0,onMouseOut:!0,onMouseOver:!0,onMouseUp:!0,onSelect:!0,onTouchCancel:!0,onTouchEnd:!0,onTouchMove:!0,onTouchStart:!0,onScroll:!0,onWheel:!0,onAbort:!0,onCanPlay:!0,onCanPlayThrough:!0,onDurationChange:!0,onEmptied:!0,onEncrypted:!0,onEnded:!0,onError:!0,onLoadedData:!0,onLoadedMetadata:!0,onLoadStart:!0,onPause:!0,onPlay:!0,onPlaying:!0,onProgress:!0,onRateChange:!0,onSeeked:!0,onSeeking:!0,onStalled:!0,onSuspend:!0,onTimeUpdate:!0,onVolumeChange:!0,onWaiting:!0,onLoad:!0,onAnimationStart:!0,onAnimationEnd:!0,onAnimationIteration:!0,onTransitionEnd:!0,onCopyCapture:!0,onCutCapture:!0,onPasteCapture:!0,onCompositionEndCapture:!0,onCompositionStartCapture:!0,onCompositionUpdateCapture:!0,onKeyDownCapture:!0,onKeyPressCapture:!0,onKeyUpCapture:!0,onFocusCapture:!0,onBlurCapture:!0,onChangeCapture:!0,onInputCapture:!0,onSubmitCapture:!0,onClickCapture:!0,onContextMenuCapture:!0,onDoubleClickCapture:!0,onDragCapture:!0,onDragEndCapture:!0,onDragEnterCapture:!0,onDragExitCapture:!0,onDragLeaveCapture:!0,onDragOverCapture:!0,onDragStartCapture:!0,onDropCapture:!0,onMouseDownCapture:!0,onMouseEnterCapture:!0,onMouseLeaveCapture:!0,onMouseMoveCapture:!0,onMouseOutCapture:!0,onMouseOverCapture:!0,onMouseUpCapture:!0,onSelectCapture:!0,onTouchCancelCapture:!0,onTouchEndCapture:!0,onTouchMoveCapture:!0,onTouchStartCapture:!0,onScrollCapture:!0,onWheelCapture:!0,onAbortCapture:!0,onCanPlayCapture:!0,onCanPlayThroughCapture:!0,onDurationChangeCapture:!0,onEmptiedCapture:!0,onEncryptedCapture:!0,onEndedCapture:!0,onErrorCapture:!0,onLoadedDataCapture:!0,onLoadedMetadataCapture:!0,onLoadStartCapture:!0,onPauseCapture:!0,onPlayCapture:!0,onPlayingCapture:!0,onProgressCapture:!0,onRateChangeCapture:!0,onSeekedCapture:!0,onSeekingCapture:!0,onStalledCapture:!0,onSuspendCapture:!0,onTimeUpdateCapture:!0,onVolumeChangeCapture:!0,onWaitingCapture:!0,onLoadCapture:!0,onAnimationStartCapture:!0,onAnimationEndCapture:!0,onAnimationIterationCapture:!0,onTransitionEndCapture:!0},le={accept:!0,acceptCharset:!0,accessKey:!0,action:!0,allowFullScreen:!0,allowTransparency:!0,alt:!0,as:!0,async:!0,autoComplete:!0,autoPlay:!0,capture:!0,cellPadding:!0,cellSpacing:!0,charSet:!0,challenge:!0,checked:!0,cite:!0,classID:!0,className:!0,cols:!0,colSpan:!0,content:!0,contentEditable:!0,contextMenu:!0,controls:!0,coords:!0,crossOrigin:!0,data:!0,dateTime:!0,default:!0,defer:!0,dir:!0,disabled:!0,download:!0,draggable:!0,encType:!0,form:!0,formAction:!0,formEncType:!0,formMethod:!0,formNoValidate:!0,formTarget:!0,frameBorder:!0,headers:!0,height:!0,hidden:!0,high:!0,href:!0,hrefLang:!0,htmlFor:!0,httpEquiv:!0,icon:!0,id:!0,inputMode:!0,integrity:!0,is:!0,keyParams:!0,keyType:!0,kind:!0,label:!0,lang:!0,list:!0,loop:!0,low:!0,manifest:!0,marginHeight:!0,marginWidth:!0,max:!0,maxLength:!0,media:!0,mediaGroup:!0,method:!0,min:!0,minLength:!0,multiple:!0,muted:!0,name:!0,nonce:!0,noValidate:!0,open:!0,optimum:!0,pattern:!0,placeholder:!0,playsInline:!0,poster:!0,preload:!0,profile:!0,radioGroup:!0,readOnly:!0,referrerPolicy:!0,rel:!0,required:!0,reversed:!0,role:!0,rows:!0,rowSpan:!0,sandbox:!0,scope:!0,scoped:!0,scrolling:!0,seamless:!0,selected:!0,shape:!0,size:!0,sizes:!0,span:!0,spellCheck:!0,src:!0,srcDoc:!0,srcLang:!0,srcSet:!0,start:!0,step:!0,style:!0,summary:!0,tabIndex:!0,target:!0,title:!0,type:!0,useMap:!0,value:!0,width:!0,wmode:!0,wrap:!0,about:!0,datatype:!0,inlist:!0,prefix:!0,property:!0,resource:!0,typeof:!0,vocab:!0,autoCapitalize:!0,autoCorrect:!0,autoSave:!0,color:!0,itemProp:!0,itemScope:!0,itemType:!0,itemID:!0,itemRef:!0,results:!0,security:!0,unselectable:0},he={accentHeight:!0,accumulate:!0,additive:!0,alignmentBaseline:!0,allowReorder:!0,alphabetic:!0,amplitude:!0,arabicForm:!0,ascent:!0,attributeName:!0,attributeType:!0,autoReverse:!0,azimuth:!0,baseFrequency:!0,baseProfile:!0,baselineShift:!0,bbox:!0,begin:!0,bias:!0,by:!0,calcMode:!0,capHeight:!0,clip:!0,clipPath:!0,clipRule:!0,clipPathUnits:!0,colorInterpolation:!0,colorInterpolationFilters:!0,colorProfile:!0,colorRendering:!0,contentScriptType:!0,contentStyleType:!0,cursor:!0,cx:!0,cy:!0,d:!0,decelerate:!0,descent:!0,diffuseConstant:!0,direction:!0,display:!0,divisor:!0,dominantBaseline:!0,dur:!0,dx:!0,dy:!0,edgeMode:!0,elevation:!0,enableBackground:!0,end:!0,exponent:!0,externalResourcesRequired:!0,fill:!0,fillOpacity:!0,fillRule:!0,filter:!0,filterRes:!0,filterUnits:!0,floodColor:!0,floodOpacity:!0,focusable:!0,fontFamily:!0,fontSize:!0,fontSizeAdjust:!0,fontStretch:!0,fontStyle:!0,fontVariant:!0,fontWeight:!0,format:!0,from:!0,fx:!0,fy:!0,g1:!0,g2:!0,glyphName:!0,glyphOrientationHorizontal:!0,glyphOrientationVertical:!0,glyphRef:!0,gradientTransform:!0,gradientUnits:!0,hanging:!0,horizAdvX:!0,horizOriginX:!0,ideographic:!0,imageRendering:!0,in:!0,in2:!0,intercept:!0,k:!0,k1:!0,k2:!0,k3:!0,k4:!0,kernelMatrix:!0,kernelUnitLength:!0,kerning:!0,keyPoints:!0,keySplines:!0,keyTimes:!0,lengthAdjust:!0,letterSpacing:!0,lightingColor:!0,limitingConeAngle:!0,local:!0,markerEnd:!0,markerMid:!0,markerStart:!0,markerHeight:!0,markerUnits:!0,markerWidth:!0,mask:!0,maskContentUnits:!0,maskUnits:!0,mathematical:!0,mode:!0,numOctaves:!0,offset:!0,opacity:!0,operator:!0,order:!0,orient:!0,orientation:!0,origin:!0,overflow:!0,overlinePosition:!0,overlineThickness:!0,paintOrder:!0,panose1:!0,pathLength:!0,patternContentUnits:!0,patternTransform:!0,patternUnits:!0,pointerEvents:!0,points:!0,pointsAtX:!0,pointsAtY:!0,pointsAtZ:!0,preserveAlpha:!0,preserveAspectRatio:!0,primitiveUnits:!0,r:!0,radius:!0,refX:!0,refY:!0,renderingIntent:!0,repeatCount:!0,repeatDur:!0,requiredExtensions:!0,requiredFeatures:!0,restart:!0,result:!0,rotate:!0,rx:!0,ry:!0,scale:!0,seed:!0,shapeRendering:!0,slope:!0,spacing:!0,specularConstant:!0,specularExponent:!0,speed:!0,spreadMethod:!0,startOffset:!0,stdDeviation:!0,stemh:!0,stemv:!0,stitchTiles:!0,stopColor:!0,stopOpacity:!0,strikethroughPosition:!0,strikethroughThickness:!0,string:!0,stroke:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeLinecap:!0,strokeLinejoin:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0,surfaceScale:!0,systemLanguage:!0,tableValues:!0,targetX:!0,targetY:!0,textAnchor:!0,textDecoration:!0,textRendering:!0,textLength:!0,to:!0,transform:!0,u1:!0,u2:!0,underlinePosition:!0,underlineThickness:!0,unicode:!0,unicodeBidi:!0,unicodeRange:!0,unitsPerEm:!0,vAlphabetic:!0,vHanging:!0,vIdeographic:!0,vMathematical:!0,values:!0,vectorEffect:!0,version:!0,vertAdvY:!0,vertOriginX:!0,vertOriginY:!0,viewBox:!0,viewTarget:!0,visibility:!0,widths:!0,wordSpacing:!0,writingMode:!0,x:!0,xHeight:!0,x1:!0,x2:!0,xChannelSelector:!0,xlinkActuate:!0,xlinkArcrole:!0,xlinkHref:!0,xlinkRole:!0,xlinkShow:!0,xlinkTitle:!0,xlinkType:!0,xmlBase:!0,xmlns:!0,xmlnsXlink:!0,xmlLang:!0,xmlSpace:!0,y:!0,y1:!0,y2:!0,yChannelSelector:!0,z:!0,zoomAndPan:!0},de=RegExp.prototype.test.bind(new RegExp("^(data|aria)-[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$")),fe={}.hasOwnProperty,me=function(e){return fe.call(le,e)||fe.call(he,e)||de(e.toLowerCase())||fe.call(pe,e)},ye=l,ge=Object.prototype.toString,be=function(e){var t=[],n=e;return{publish:function(e){n=e,t.forEach(function(e){return e(n)})},subscribe:function(e){return t.push(e),e(n),function(){t=t.filter(function(t){return t!==e})}}}},Ce="__styled-components__",ve=function(e){function t(){x(this,t);var n=E(this,e.call(this));return n.getTheme=n.getTheme.bind(n),n}return S(t,e),t.prototype.componentWillMount=function(){var e=this;if(this.context[Ce]){var t=this.context[Ce];this.unsubscribeToOuter=t(function(t){e.outerTheme=t})}this.broadcast=be(this.getTheme())},t.prototype.getChildContext=function(){var e;return A({},this.context,(e={},e[Ce]=this.broadcast.subscribe,e))},t.prototype.componentWillReceiveProps=function(e){this.props.theme!==e.theme&&this.broadcast.publish(this.getTheme(e.theme))},t.prototype.componentWillUnmount=function(){this.context[Ce]&&this.unsubscribeToOuter()},t.prototype.getTheme=function(e){var t=e||this.props.theme;if(ye(t)){var n=t(this.outerTheme);if(!I(n))throw new Error("[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!");return n}if(!I(t))throw new Error("[ThemeProvider] Please make your theme prop a plain object");return A({},this.outerTheme,t)},t.prototype.render=function(){return this.props.children?y.Children.only(this.props.children):null},t}(t.Component);ve.childContextTypes=(ie={},ie[Ce]=oe.func.isRequired,ie),ve.contextTypes=(se={},se[Ce]=oe.func,se);var ke,we=function(e){function t(){return x(this,t),E(this,e.apply(this,arguments))}return S(t,e),t}(t.Component);we.contextTypes=(ke={},ke[Ce]=oe.func,ke[V]=oe.instanceOf(G),ke);var xe=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"],Te=function(e){return e.replace(/\s|\\n/g,"")},Ae={childContextTypes:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,mixins:!0,propTypes:!0,type:!0},Se={name:!0,length:!0,prototype:!0,caller:!0,arguments:!0,arity:!0},je="function"==typeof Object.getOwnPropertySymbols,Ee=function(e,t,n){if("string"!=typeof t){var r=Object.getOwnPropertyNames(t);je&&(r=r.concat(Object.getOwnPropertySymbols(t)));for(var o=0;o<r.length;++o)if(!(Ae[r[o]]||Se[r[o]]||n&&n[r[o]]))try{e[r[o]]=t[r[o]]}catch(e){}}return e},Oe=function(e){var t,n=e.displayName||e.name||"Component",r=u(e),o=function(t){function n(){var e,r,o;x(this,n);for(var a=arguments.length,i=Array(a),s=0;s<a;s++)i[s]=arguments[s];return e=r=E(this,t.call.apply(t,[this].concat(i))),r.state={},o=e,E(r,o)}return S(n,t),n.prototype.componentWillMount=function(){var e=this;if(!this.context[Ce])throw new Error("[withTheme] Please use ThemeProvider to be able to use withTheme");var t=this.context[Ce];this.unsubscribe=t(function(t){e.setState({theme:t})})},n.prototype.componentWillUnmount=function(){"function"==typeof this.unsubscribe&&this.unsubscribe()},n.prototype.render=function(){var t=this.props.innerRef,n=this.state.theme;return y.createElement(e,A({theme:n},this.props,{innerRef:r?t:void 0,
+ref:r?void 0:t}))},n}(y.Component);return o.displayName="WithTheme("+n+")",o.styledComponentId="withTheme",o.contextTypes=(t={},t[Ce]=oe.func,t),Ee(o,e)},Pe=function(e,t,n){return function(){function r(e,t){if(x(this,r),this.rules=e,this.componentId=t,!G.instance.hasInjectedComponent(this.componentId)){G.instance.deferredInject(t,!0,"")}}return r.prototype.generateAndInjectStyles=function(r,o){var a=t(this.rules,r),i=h(this.componentId+a.join("")),s=o.getName(i);if(s)return s;var c=e(i);if(o.alreadyInjected(i,c))return c;var u="\n"+n(a,"."+c);return o.inject(this.componentId,!0,u,i,c),c},r.generateName=function(t){return e(h(t))},r}()}(z,N,R),Ie=function(e){return function t(n,r){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if("string"!=typeof r&&"function"!=typeof r)throw new Error("Cannot create styled-component for component: "+r);var a=function(t){for(var a=arguments.length,i=Array(a>1?a-1:0),s=1;s<a;s++)i[s-1]=arguments[s];return n(r,o,e.apply(void 0,[t].concat(i)))};return a.withConfig=function(e){return t(n,r,A({},o,e))},a.attrs=function(e){return t(n,r,A({},o,{attrs:A({},o.attrs||{},e)}))},a}}(W),Me=function(e,n){var r={},o=function(t){var n="string"!=typeof t?"sc":t.replace(/[[\].#*$><+~=|^:(),"'`]/g,"-").replace(/--+/g,"-"),o=(r[n]||0)+1;return r[n]=o,n+"-"+e.generateName(n+o)},a=function(e){function n(){var t,r,o;x(this,n);for(var a=arguments.length,i=Array(a),s=0;s<a;s++)i[s]=arguments[s];return t=r=E(this,e.call.apply(e,[this].concat(i))),r.attrs={},r.state={theme:null,generatedClassName:""},o=t,E(r,o)}return S(n,e),n.prototype.buildExecutionContext=function(e,t){var n=this.constructor.attrs,r=A({},t,{theme:e});return void 0===n?r:(this.attrs=Object.keys(n).reduce(function(e,t){var o=n[t];return e[t]="function"==typeof o?o(r):o,e},{}),A({},r,this.attrs))},n.prototype.generateAndInjectStyles=function(e,t){var n=this.constructor,r=n.componentStyle,o=n.warnTooManyClasses,a=this.buildExecutionContext(e,t),i=this.context[V]||G.instance,s=r.generateAndInjectStyles(a,i);return void 0!==o&&o(s),s},n.prototype.componentWillMount=function(){var e=this;if(this.context[Ce]){var t=this.context[Ce];this.unsubscribe=t(function(t){var n=e.constructor.defaultProps,r=n&&e.props.theme===n.theme,o=e.props.theme&&!r?e.props.theme:t,a=e.generateAndInjectStyles(o,e.props);e.setState({theme:o,generatedClassName:a})})}else{var n=this.props.theme||{},r=this.generateAndInjectStyles(n,this.props);this.setState({theme:n,generatedClassName:r})}},n.prototype.componentWillReceiveProps=function(e){var t=this;this.setState(function(n){var r=t.constructor.defaultProps,o=r&&e.theme===r.theme,a=e.theme&&!o?e.theme:n.theme;return{theme:a,generatedClassName:t.generateAndInjectStyles(a,e)}})},n.prototype.componentWillUnmount=function(){this.unsubscribe&&this.unsubscribe()},n.prototype.render=function(){var e=this,n=this.props.innerRef,r=this.state.generatedClassName,o=this.constructor,a=o.styledComponentId,i=o.target,s=c(i),p=[this.props.className,a,this.attrs.className,r].filter(Boolean).join(" "),l=A({},this.attrs,{className:p});u(i)?l.innerRef=n:l.ref=n;var h=Object.keys(this.props).reduce(function(t,n){return"innerRef"===n||"className"===n||s&&!me(n)||(t[n]=e.props[n]),t},l);return t.createElement(i,h)},n}(we);return function t(r,i,s){var u,l=i.displayName,h=void 0===l?c(r)?"styled."+r:"Styled("+p(r)+")":l,d=i.componentId,f=void 0===d?o(i.displayName):d,m=i.ParentComponent,y=void 0===m?a:m,g=i.rules,b=i.attrs,C=i.displayName&&i.componentId?i.displayName+"-"+i.componentId:f,v=void 0,k=new e(void 0===g?s:g.concat(s),C),w=function(e){function o(){return x(this,o),E(this,e.apply(this,arguments))}return S(o,e),o.withComponent=function(e){var n=(i.displayName,i.componentId,j(i,["displayName","componentId"])),r=A({},n,{ParentComponent:o});return t(e,r,s)},T(o,null,[{key:"extend",get:function(){var e=(i.displayName,i.componentId,i.rules),a=j(i,["displayName","componentId","rules"]),c=void 0===e?s:e.concat(s),u=A({},a,{rules:c,ParentComponent:o});return n(t,r,u)}}]),o}(y);return w.contextTypes=(u={},u[Ce]=oe.func,u[V]=oe.instanceOf(G),u),w.displayName=h,w.styledComponentId=C,w.attrs=b,w.componentStyle=k,w.warnTooManyClasses=v,w.target=r,w}}(Pe,Ie),Ne=function(e,t,n){return function(r){for(var o=arguments.length,a=Array(o>1?o-1:0),i=1;i<o;i++)a[i-1]=arguments[i];var s=n.apply(void 0,[r].concat(a)),c=h(Te(JSON.stringify(s))),u=G.instance.getName(c);if(u)return u;var p=e(c);if(G.instance.alreadyInjected(c,p))return p;var l=t(s,p,"@keyframes");return G.instance.inject("sc-keyframes-"+p,!0,l,c,p),p}}(z,R,W),De=function(e,t){return function(n){for(var r=arguments.length,o=Array(r>1?r-1:0),a=1;a<r;a++)o[a-1]=arguments[a];var i=t.apply(void 0,[n].concat(o)),s=h(JSON.stringify(i)),c="sc-global-"+s;G.instance.hasInjectedComponent(c)||G.instance.inject(c,!1,e(i))}}(R,W),Re=function(e,t){var n=function(n){return t(e,n)};return xe.forEach(function(e){n[e]=n(e)}),n}(Me,Ie);e.default=Re,e.css=W,e.keyframes=Ne,e.injectGlobal=De,e.ThemeProvider=ve,e.withTheme=Oe,e.ServerStyleSheet=ue,e.StyleSheetManager=ae,Object.defineProperty(e,"__esModule",{value:!0})});

lib/models/StyledComponent.js

@@ -263,5 +263,12 @@ 'use strict';
               __ = options.componentId,
-              optionsToCopy = _objectWithoutProperties(options, ['displayName', 'componentId']);
+              rulesFromOptions = options.rules,
+              optionsToCopy = _objectWithoutProperties(options, ['displayName', 'componentId', 'rules']);
 
-          var newOptions = _extends({}, optionsToCopy, { rules: rules, ParentComponent: StyledComponent });
+          var newRules = rulesFromOptions === undefined ? rules : rulesFromOptions.concat(rules);
+
+          var newOptions = _extends({}, optionsToCopy, {
+            rules: newRules,
+            ParentComponent: StyledComponent
+          });
+
           return constructWithOptions(createStyledComponent, target, newOptions);
@@ -268,0 +275,0 @@ }

lib/models/StyledNativeComponent.js

@@ -228,5 +228,12 @@ 'use strict';
               __ = options.componentId,
-              optionsToCopy = _objectWithoutProperties(options, ['displayName', 'componentId']);
+              rulesFromOptions = options.rules,
+              optionsToCopy = _objectWithoutProperties(options, ['displayName', 'componentId', 'rules']);
 
-          var newOptions = _extends({}, optionsToCopy, { rules: rules, ParentComponent: StyledNativeComponent });
+          var newRules = rulesFromOptions === undefined ? rules : rulesFromOptions.concat(rules);
+
+          var newOptions = _extends({}, optionsToCopy, {
+            rules: newRules,
+            ParentComponent: StyledNativeComponent
+          });
+
           return constructWithOptions(createStyledNativeComponent, target, newOptions);
@@ -233,0 +240,0 @@ }

lib/models/StyleSheetManager.js

@@ -44,3 +44,5 @@ 'use strict';
     /* eslint-disable react/prop-types */
-    // $FlowFixMe
+    // Flow v0.43.1 will report an error accessing the `children` property,
+    // but v0.47.0 will not. It is necessary to use a type cast instead of
+    // a "fixme" comment to satisfy both Flow versions.
     return _react2.default.Children.only(this.props.children);
@@ -47,0 +49,0 @@ };

lib/native/test/native.test.js

@@ -6,3 +6,5 @@ 'use strict';
     _templateObject3 = _taggedTemplateLiteralLoose(['opacity: 0.9;'], ['opacity: 0.9;']),
-    _templateObject4 = _taggedTemplateLiteralLoose(['padding: 10px;'], ['padding: 10px;']);
+    _templateObject4 = _taggedTemplateLiteralLoose(['padding: 10px;'], ['padding: 10px;']),
+    _templateObject5 = _taggedTemplateLiteralLoose(['background-color: red;'], ['background-color: red;']),
+    _templateObject6 = _taggedTemplateLiteralLoose(['borderWidth: 10;'], ['borderWidth: 10;']);
 
@@ -75,2 +77,39 @@ require('react-native');
     });
+
+    it('should combine styles of extending components in >= 3 inheritances', function () {
+      var GrandGrandParent = _index2.default.View(_templateObject5);
+      var GrandParent = GrandGrandParent.extend(_templateObject6);
+      var Parent = GrandParent.extend(_templateObject3);
+      var Child = Parent.extend(_templateObject4);
+
+      var grandGrandParent = (0, _enzyme.shallow)(_react2.default.createElement(GrandGrandParent, null));
+      var grandParent = (0, _enzyme.shallow)(_react2.default.createElement(GrandParent, null));
+      var parent = (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
+      var child = (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
+
+      expect(grandGrandParent.find('View').prop('style')).toEqual([{
+        backgroundColor: 'red'
+      }, undefined]);
+
+      expect(grandParent.find('View').prop('style')).toEqual([{
+        backgroundColor: 'red',
+        borderWidth: 10
+      }, undefined]);
+
+      expect(parent.find('View').prop('style')).toEqual([{
+        backgroundColor: 'red',
+        borderWidth: 10,
+        opacity: 0.9
+      }, undefined]);
+
+      expect(child.find('View').prop('style')).toEqual([{
+        backgroundColor: 'red',
+        borderWidth: 10,
+        opacity: 0.9,
+        paddingTop: 10,
+        paddingRight: 10,
+        paddingBottom: 10,
+        paddingLeft: 10
+      }, undefined]);
+    });
   });
@@ -77,0 +116,0 @@

lib/test/extending.test.js

@@ -11,4 +11,8 @@ 'use strict';
     _templateObject8 = _taggedTemplateLiteralLoose(['color:red;'], ['color:red;']),
-    _templateObject9 = _taggedTemplateLiteralLoose(['\n      color: red;\n    '], ['\n      color: red;\n    ']),
-    _templateObject10 = _taggedTemplateLiteralLoose(['\n      color: green;\n    '], ['\n      color: green;\n    ']);
+    _templateObject9 = _taggedTemplateLiteralLoose(['\n      background-color: red;\n    '], ['\n      background-color: red;\n    ']),
+    _templateObject10 = _taggedTemplateLiteralLoose(['\n      color: blue;\n    '], ['\n      color: blue;\n    ']),
+    _templateObject11 = _taggedTemplateLiteralLoose(['\n      border: 2px solid black;\n    '], ['\n      border: 2px solid black;\n    ']),
+    _templateObject12 = _taggedTemplateLiteralLoose(['\n      border-width: 10;\n    '], ['\n      border-width: 10;\n    ']),
+    _templateObject13 = _taggedTemplateLiteralLoose(['\n      color: red;\n    '], ['\n      color: red;\n    ']),
+    _templateObject14 = _taggedTemplateLiteralLoose(['\n      color: green;\n    '], ['\n      color: green;\n    ']);
 
@@ -97,3 +101,3 @@ var _react = require('react');
 
-    (0, _utils.expectCSSMatches)('\n      .sc-a {}\n      .c { color: blue; }\n      .c > h1 { font-size: 4rem; }\n      .sc-b {}\n      .d { color: blue; }\n      .d > h1 { font-size: 4rem; }\n      .d { color: red; }\n    ');
+    (0, _utils.expectCSSMatches)('\n      .sc-a {}\n      .c{ color: blue; }\n      .c > h1{ font-size: 4rem; }\n      .sc-b {}\n      .d { color: blue; color: red; }\n      .d > h1 { font-size: 4rem; }\n    ');
   });
@@ -156,2 +160,19 @@
 
+  it('should keep styles in >= 3 inheritances', function () {
+    var GrandGrandParent = styled.div(_templateObject9);
+
+    var GrandParent = GrandGrandParent.extend(_templateObject10);
+
+    var Parent = GrandParent.extend(_templateObject11);
+
+    var Child = Parent.extend(_templateObject12);
+
+    (0, _enzyme.shallow)(_react2.default.createElement(GrandGrandParent, null));
+    (0, _enzyme.shallow)(_react2.default.createElement(GrandParent, null));
+    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
+    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
+
+    (0, _utils.expectCSSMatches)('\n      .sc-a { }\n      .e { background-color: red; }\n      .sc-b { }\n      .f { background-color: red; color: blue; }\n      .sc-c { }\n      .g { background-color: red; color: blue; border: 2px solid black; }\n      .sc-d { }\n      .h { background-color: red; color: blue; border: 2px solid black; border-width: 10; }\n    ');
+  });
+
   it('should allow changing component', function () {
@@ -165,4 +186,4 @@ var Parent = styled.div(_templateObject3);
   it('should allow changing component and extending', function () {
-    var Parent = styled.div(_templateObject9);
-    var Child = Parent.withComponent('span').extend(_templateObject10);
+    var Parent = styled.div(_templateObject13);
+    var Child = Parent.withComponent('span').extend(_templateObject14);
 
@@ -172,2 +193,11 @@ expect((0, _enzyme.shallow)(_react2.default.createElement(Child, null)).html()).toEqual('<span class="sc-c d"></span>');
   });
+
+  it('should allow changing component and adding attributes', function () {
+    var Parent = styled.button(_templateObject13);
+    var Child = Parent.withComponent('a').extend.attrs({
+      href: '/test'
+    })(_templateObject);
+
+    expect((0, _enzyme.shallow)(_react2.default.createElement(Child, null)).html()).toEqual('<a href="/test" class="sc-c d"></a>');
+  });
 });

lib/test/rehydration.test.js

@@ -185,3 +185,3 @@ 'use strict';
 
-      expect(getStyleTags()).toEqual([{ isLocal: 'false', css: '/* sc-component-id: sc-global-557410406 */ body { background: papayawhip; }' }, { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }' }, { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body {color: tomato;}' }]);
+      expect(getStyleTags()).toEqual([{ isLocal: 'false', css: '/* sc-component-id: sc-global-557410406 */ body { background: papayawhip; }' }, { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }' }, { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body{color: tomato;}' }]);
     });
@@ -195,3 +195,3 @@
       (0, _utils.expectCSSMatches)('body { background: papayawhip; } .TWO {} .b { color: red; } body { color: tomato; } .ONE { } .a { color: blue; }');
-      expect(getStyleTags()).toEqual([{ isLocal: 'false', css: '/* sc-component-id: sc-global-557410406 */ body { background: papayawhip; }' }, { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }' }, { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body {color: tomato;}' }, { isLocal: 'true', css: '/* sc-component-id: ONE */ .ONE {} .a {color: blue;}' }]);
+      expect(getStyleTags()).toEqual([{ isLocal: 'false', css: '/* sc-component-id: sc-global-557410406 */ body { background: papayawhip; }' }, { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }' }, { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body{color: tomato;}' }, { isLocal: 'true', css: '/* sc-component-id: ONE */ .ONE {} .a{color: blue;}' }]);
     });
@@ -241,3 +241,3 @@ });
       /* ...and the new CSS before the closing tag.  */
-      .replace(/(?=<\/style>)/, '\n/* sc-component-id: THREE */\n.THREE {}\n.c {color: green;}'));
+      .replace(/(?=<\/style>)/, '\n/* sc-component-id: THREE */\n.THREE {}\n.c{color: green;}'));
 
@@ -244,0 +244,0 @@ /* Note: any future additions don't replace the style tag */

lib/test/ssr.test.js

@@ -56,3 +56,3 @@ 'use strict';
 var format = function format(css) {
-  return (0, _utils.stripWhitespace)(css).replace(/(\*\/|[}>])/g, "$1\n").replace(/\n\s+/g, "\n");
+  return (0, _utils.stripWhitespace)(css).replace(/ {/g, "{").replace(/(\*\/|[}>])/g, "$1\n").replace(/\n\s+/g, "\n");
 };
@@ -77,3 +77,3 @@
     expect(html).toEqual('<h1 class="sc-a b" data-reactroot="" data-reactid="1" data-react-checksum="197727696">Hello SSR!</h1>');
-    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="b" data-styled-components-is-local="true">\n      /* sc-component-id: sc-a */\n      .sc-a {}\n      .b { color: red; }\n      \n      </style>\n    '));
+    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="b" data-styled-components-is-local="true">\n      /* sc-component-id: sc-a */\n      .sc-a {}\n      .b { color: red; }\n\n      </style>\n    '));
   });
@@ -94,3 +94,3 @@
     expect(html).toEqual('<h1 class="sc-a b" data-reactroot="" data-reactid="1" data-react-checksum="197727696">Hello SSR!</h1>');
-    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="" data-styled-components-is-local="false">\n      /* sc-component-id: sc-global-2303210225 */\n      body { background: papayawhip; }\n      \n      </style>\n      <style type="text/css" data-styled-components="b" data-styled-components-is-local="true">\n      /* sc-component-id: sc-a */\n      .sc-a {}\n      .b { color: red; }\n      \n      </style>\n    '));
+    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="" data-styled-components-is-local="false">\n      /* sc-component-id: sc-global-2303210225 */\n      body { background: papayawhip; }\n\n      </style>\n      <style type="text/css" data-styled-components="b" data-styled-components-is-local="true">\n      /* sc-component-id: sc-a */\n      .sc-a {}\n      .b { color: red; }\n\n      </style>\n    '));
   });
@@ -112,3 +112,3 @@
     expect(html).toEqual('<div data-reactroot="" data-reactid="1" data-react-checksum="275982144"><h2 class="TWO a" data-reactid="2"></h2><h1 class="ONE b" data-reactid="3"></h1></div>');
-    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="a b" data-styled-components-is-local="true">\n      /* sc-component-id: ONE */\n      .ONE {}\n      .b {color: red;}\n      /* sc-component-id: TWO */\n      .TWO {}\n      .a {color: blue;}\n      \n      </style>\n    '));
+    expect(css).toEqual(format('\n      <style type="text/css" data-styled-components="a b" data-styled-components-is-local="true">\n      /* sc-component-id: ONE */\n      .ONE {}\n      .b {color: red;}\n      /* sc-component-id: TWO */\n      .TWO {}\n      .a {color: blue;}\n\n      </style>\n    '));
   });
@@ -115,0 +115,0 @@

lib/test/theme.test.js

@@ -408,4 +408,3 @@ 'use strict';
 
-    var Theme = function Theme(_ref5) {
-      var props = _ref5.props;
+    var Theme = function Theme(props) {
       return _react2.default.createElement(
@@ -412,0 +411,0 @@ _ThemeProvider2.default,

lib/test/utils.js

@@ -103,8 +103,11 @@ 'use strict';
 
-var expectCSSMatches = exports.expectCSSMatches = function expectCSSMatches(expectation) {
+var expectCSSMatches = exports.expectCSSMatches = function expectCSSMatches(_expectation) {
   var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : { ignoreWhitespace: true };
 
+  // NOTE: This should normalise both CSS strings to make irrelevant mismatches less likely
+  var expectation = _expectation.replace(/ {/g, '{').replace(/:\s+;/g, ':;');
+
   var css = Array.from(document.querySelectorAll('style')).map(function (tag) {
     return tag.innerHTML;
-  }).join("\n");
+  }).join('\n').replace(/ {/g, '{').replace(/:\s+;/g, ':;');
 
@@ -111,0 +114,0 @@ if (opts.ignoreWhitespace) {

lib/utils/stringifyRules.js

@@ -13,2 +13,11 @@ 'use strict';
 
+_stylis2.default.set({
+  global: false,
+  cascade: true,
+  keyframe: false,
+  prefix: true,
+  compress: false,
+  semicolon: true
+});
+
 var stringifyRules = function stringifyRules(rules, selector, prefix) {
@@ -19,5 +28,3 @@ var flatCSS = rules.join('').replace(/^\s*\/\/.*$/gm, ''); // replace JS comments
 
-  var css = (0, _stylis2.default)(prefix || !selector ? '' : selector, cssStr, false, false);
-
-  return css;
+  return (0, _stylis2.default)(prefix || !selector ? '' : selector, cssStr);
 };
@@ -24,0 +31,0 @@

package.json

 {
   "name": "styled-components",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅",
@@ -10,6 +10,5 @@ "main": "lib/index.js",
   "scripts": {
-    "build": "npm run build:lib && npm run build:dist && npm run build:flow",
+    "build": "npm run build:lib && npm run build:dist",
     "prebuild:lib": "rimraf lib/*",
     "build:lib": "babel --out-dir lib src",
-    "build:flow": "flow-copy-source -v -i '{**/test/*.js,**/*.test.js}' src lib",
     "prebuild:dist": "rimraf dist/*",
@@ -27,3 +26,3 @@ "build:dist": "rollup -c && rollup -c --environment ESBUNDLE && rollup -c --environment PRODUCTION",
     "tslint": "tslint typings/*.ts native/*.ts",
-    "typescript": "tsc ./typings/styled-components-test.tsx ./typings/styled-components-native-test.tsx ./typings/themed-tests/mytheme-styled-components-test.tsx --noEmit --jsx react --target es6 --module es2015 --moduleResolution node",
+    "typescript": "tsc --project ./typings/tests",
     "prepublish": "npm run build",
@@ -67,12 +66,12 @@ "lint-staged": "lint-staged",
     "hoist-non-react-statics": "^1.2.0",
-    "inline-style-prefixer": "^2.0.5",
     "is-function": "^1.0.1",
     "is-plain-object": "^2.0.1",
     "prop-types": "^15.5.4",
-    "stylis": "^2.0.0",
+    "stylis": "^3.0.19",
     "supports-color": "^3.2.3"
   },
   "devDependencies": {
-    "@types/react": "^0.14.55",
-    "@types/react-native": "^0.37.5",
+    "@types/react": "^15.0.25",
+    "@types/react-dom": "^15.5.0",
+    "@types/react-native": "^0.44.4",
     "babel-cli": "^6.22.2",
@@ -102,3 +101,3 @@ "babel-core": "^6.17.0",
     "express": "^4.14.1",
-    "flow-bin": "^0.43.1",
+    "flow-bin": "^0.47.0",
     "flow-copy-source": "^1.1.0",
@@ -127,3 +126,3 @@ "flow-watch": "^1.1.1",
     "tslint": "^4.3.1",
-    "typescript": "^2.1.5"
+    "typescript": "^2.3.3"
   },
@@ -130,0 +129,0 @@ "peerDependencies": {

README.md

@@ -13,6 +13,3 @@ <a href="https://www.styled-components.com">
 [![npm](https://img.shields.io/npm/v/styled-components.svg)](https://www.npmjs.com/package/styled-components)
-[![Travis Build Status](https://travis-ci.org/styled-components/styled-components.svg?branch=master)](https://travis-ci.org/styled-components/styled-components)
-[![AppVeyor Build Status](https://ci.appveyor.com/api/projects/status/github/gruntjs/grunt?branch=master&svg=true)](https://ci.appveyor.com/project/mxstbr/styled-components)
-[![Supported by Thinkmill](https://thinkmill.github.io/badge/heart.svg)](http://thinkmill.com.au/?utm_source=github&utm_medium=badge&utm_campaign=styled-components)
-[![gitter](https://camo.githubusercontent.com/54dc79dc7da6b76b17bc8013342da9b4266d993c/68747470733a2f2f6261646765732e6769747465722e696d2f6d78737462722f72656163742d626f696c6572706c6174652e737667)](https://gitter.im/styled-components/styled-components)
+[![Join the community on Spectrum](https://withspectrum.github.io/badge/badge.svg)](https://spectrum.chat/styled-components)
 
@@ -33,3 +30,3 @@ ![gzip size](http://img.badgesize.io/https://unpkg.com/styled-components/dist/styled-components.min.js?compression=gzip&label=gzip%20size)
 
-**See the documentation at [styled-components.com/docs](https://www.styled-components/docs)** for more information about using `styled-components`!
+**See the documentation at [styled-components.com/docs](https://www.styled-components.com/docs)** for more information about using `styled-components`!
 
@@ -40,3 +37,3 @@ ### Quicklinks
 
-- [**Gettings started**](https://www.styled-components.com/docs/basics)
+- [**Getting started**](https://www.styled-components.com/docs/basics)
 - [API Reference](https://styled-components.com/docs/api)
@@ -116,2 +113,3 @@ - [Theming](https://www.styled-components.com/docs/advanced#theming)
 - [react-create-component-from-tag-prop](https://github.com/jameslnewell/react-create-component-from-tag-prop): Create a react component from a tag prop. Lets your users to choose which HTML elements get styled by your 💅 styled-components.
+- [styled-components-theme](https://github.com/erikras/styled-components-theme): A library for refering to theme colors and modifying them inline. e.g. `color: ${primary.lighten(0.3)};`
 
@@ -118,0 +116,0 @@ ### Boilerplates

src/models/StyledComponent.js

@@ -217,4 +217,19 @@ // @flow
       static get extend() {
-        const { displayName: _, componentId: __, ...optionsToCopy } = options
-        const newOptions = { ...optionsToCopy, rules, ParentComponent: StyledComponent }
+        const {
+          displayName: _,
+          componentId: __,
+          rules: rulesFromOptions,
+          ...optionsToCopy
+        } = options
+
+        const newRules = rulesFromOptions === undefined
+          ? rules
+          : rulesFromOptions.concat(rules)
+
+        const newOptions = {
+          ...optionsToCopy,
+          rules: newRules,
+          ParentComponent: StyledComponent,
+        }
+
         return constructWithOptions(createStyledComponent, target, newOptions)
@@ -221,0 +236,0 @@ }

src/models/StyledNativeComponent.js

@@ -185,5 +185,24 @@ // @flow
       static get extend() {
-        const { displayName: _, componentId: __, ...optionsToCopy } = options
-        const newOptions = { ...optionsToCopy, rules, ParentComponent: StyledNativeComponent }
-        return constructWithOptions(createStyledNativeComponent, target, newOptions)
+        const {
+          displayName: _,
+          componentId: __,
+          rules: rulesFromOptions,
+          ...optionsToCopy
+        } = options
+
+        const newRules = rulesFromOptions === undefined
+          ? rules
+          : rulesFromOptions.concat(rules)
+
+        const newOptions = {
+          ...optionsToCopy,
+          rules: newRules,
+          ParentComponent: StyledNativeComponent,
+        }
+
+        return constructWithOptions(
+          createStyledNativeComponent,
+          target,
+          newOptions,
+        )
       }
@@ -190,0 +209,0 @@ }

src/models/StyleSheetManager.js

@@ -13,4 +13,6 @@ // @flow
     /* eslint-disable react/prop-types */
-    // $FlowFixMe
-    return React.Children.only(this.props.children)
+    // Flow v0.43.1 will report an error accessing the `children` property,
+    // but v0.47.0 will not. It is necessary to use a type cast instead of
+    // a "fixme" comment to satisfy both Flow versions.
+    return React.Children.only((this.props: any).children)
   }
@@ -17,0 +19,0 @@ }

src/native/test/native.test.js

@@ -58,2 +58,51 @@ import 'react-native'
     })
+
+    it('should combine styles of extending components in >= 3 inheritances', () => {
+      const GrandGrandParent = styled.View`background-color: red;`
+      const GrandParent = GrandGrandParent.extend`borderWidth: 10;`
+      const Parent = GrandParent.extend`opacity: 0.9;`
+      const Child = Parent.extend`padding: 10px;`
+
+      const grandGrandParent = shallow(<GrandGrandParent />)
+      const grandParent = shallow(<GrandParent />)
+      const parent = shallow(<Parent />)
+      const child = shallow(<Child />)
+
+      expect(grandGrandParent.find('View').prop('style')).toEqual([
+        {
+          backgroundColor: 'red',
+        },
+        undefined,
+      ])
+
+      expect(grandParent.find('View').prop('style')).toEqual([
+        {
+          backgroundColor: 'red',
+          borderWidth: 10,
+        },
+        undefined,
+      ])
+
+      expect(parent.find('View').prop('style')).toEqual([
+        {
+          backgroundColor: 'red',
+          borderWidth: 10,
+          opacity: 0.9,
+        },
+        undefined,
+      ])
+
+      expect(child.find('View').prop('style')).toEqual([
+        {
+          backgroundColor: 'red',
+          borderWidth: 10,
+          opacity: 0.9,
+          paddingTop: 10,
+          paddingRight: 10,
+          paddingBottom: 10,
+          paddingLeft: 10,
+        },
+        undefined,
+      ])
+    })
   })
@@ -60,0 +109,0 @@

src/test/extending.test.js

@@ -79,8 +79,7 @@ // @flow
       .sc-a {}
-      .c { color: blue; }
-      .c > h1 { font-size: 4rem; }
+      .c{ color: blue; }
+      .c > h1{ font-size: 4rem; }
       .sc-b {}
-      .d { color: blue; }
+      .d { color: blue; color: red; }
       .d > h1 { font-size: 4rem; }
-      .d { color: red; }
     `)
@@ -143,2 +142,36 @@ })
 
+  it('should keep styles in >= 3 inheritances', () => {
+    const GrandGrandParent = styled.div`
+      background-color: red;
+    `
+
+    const GrandParent = GrandGrandParent.extend`
+      color: blue;
+    `
+
+    const Parent = GrandParent.extend`
+      border: 2px solid black;
+    `
+
+    const Child = Parent.extend`
+      border-width: 10;
+    `
+
+    shallow(<GrandGrandParent />)
+    shallow(<GrandParent />)
+    shallow(<Parent />)
+    shallow(<Child />)
+
+    expectCSSMatches(`
+      .sc-a { }
+      .e { background-color: red; }
+      .sc-b { }
+      .f { background-color: red; color: blue; }
+      .sc-c { }
+      .g { background-color: red; color: blue; border: 2px solid black; }
+      .sc-d { }
+      .h { background-color: red; color: blue; border: 2px solid black; border-width: 10; }
+    `)
+  })
+
   it('should allow changing component', () => {
@@ -164,2 +197,13 @@ const Parent = styled.div`color: red;`
   })
+
+  it('should allow changing component and adding attributes', () => {
+    const Parent = styled.button`
+      color: red;
+    `
+    const Child = Parent.withComponent('a').extend.attrs({
+      href: '/test'
+    })``
+
+    expect(shallow(<Child />).html()).toEqual('<a href="/test" class="sc-c d"></a>')
+  })
 })

src/test/rehydration.test.js

@@ -191,3 +191,3 @@ import React from 'react'
         { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }', },
-        { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body {color: tomato;}', },
+        { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body{color: tomato;}', },
       ])
@@ -207,4 +207,4 @@ })
         { isLocal: 'true', css: '/* sc-component-id: TWO */ .TWO {} .b { color: red; }', },
-        { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body {color: tomato;}', },
-        { isLocal: 'true', css: '/* sc-component-id: ONE */ .ONE {} .a {color: blue;}', },
+        { isLocal: 'false', css: '/* sc-component-id: sc-global-2299393384 */ body{color: tomato;}', },
+        { isLocal: 'true', css: '/* sc-component-id: ONE */ .ONE {} .a{color: blue;}', },
       ])
@@ -273,6 +273,6 @@ })
         styleTags[1].outerHTML
-        /* ...the new data attribute for the new classname "c"... */
+          /* ...the new data attribute for the new classname "c"... */
           .replace(new RegExp(`${SC_ATTR}="a b"`), `${SC_ATTR}="a b c"`)
           /* ...and the new CSS before the closing tag.  */
-          .replace(/(?=<\/style>)/, '\n/* sc-component-id: THREE */\n.THREE {}\n.c {color: green;}')
+          .replace(/(?=<\/style>)/, '\n/* sc-component-id: THREE */\n.THREE {}\n.c{color: green;}')
       )
@@ -279,0 +279,0 @@

src/test/ssr.test.js

@@ -16,3 +16,6 @@ import React from 'react'
 
-const format = css => stripWhitespace(css).replace(/(\*\/|[}>])/g, "$1\n").replace(/\n\s+/g, "\n")
+const format = css => stripWhitespace(css)
+  .replace(/ {/g, "{")
+  .replace(/(\*\/|[}>])/g, "$1\n")
+  .replace(/\n\s+/g, "\n")
 
@@ -39,3 +42,3 @@ describe('ssr', () => {
       .b { color: red; }
-      
+
       </style>
@@ -62,3 +65,3 @@ `))
       body { background: papayawhip; }
-      
+
       </style>
@@ -69,3 +72,3 @@ <style type="text/css" data-styled-components="b" data-styled-components-is-local="true">
       .b { color: red; }
-      
+
       </style>
@@ -101,3 +104,3 @@ `))
       .a {color: blue;}
-      
+
       </style>
@@ -104,0 +107,0 @@ `))

src/test/theme.test.js

@@ -359,3 +359,3 @@ // @flow
 
-    const Theme = ({ props }) => (
+    const Theme = props => (
       <ThemeProvider theme={{ color: 'green' }}>
@@ -362,0 +362,0 @@ <Text {...props} />

src/test/utils.js

@@ -57,5 +57,14 @@ // @flow
 
-export const expectCSSMatches = (expectation: string, opts: { ignoreWhitespace: boolean } = { ignoreWhitespace: true }) => {
-  const css = Array.from(document.querySelectorAll('style')).map(tag => tag.innerHTML).join("\n")
+export const expectCSSMatches = (_expectation: string, opts: { ignoreWhitespace: boolean } = { ignoreWhitespace: true }) => {
+  // NOTE: This should normalise both CSS strings to make irrelevant mismatches less likely
+  const expectation = _expectation
+    .replace(/ {/g, '{')
+    .replace(/:\s+;/g, ':;')
 
+  const css = Array.from(document.querySelectorAll('style'))
+    .map(tag => tag.innerHTML)
+    .join('\n')
+    .replace(/ {/g, '{')
+    .replace(/:\s+;/g, ':;')
+
   if (opts.ignoreWhitespace) {
@@ -62,0 +71,0 @@ const stripped = stripWhitespace(stripComments(css))

src/utils/create-broadcast.js

@@ -10,3 +10,3 @@ // @flow
   publish: (value: mixed) => void,
-  subscribe: (listener: () => void) => () => void
+  subscribe: (listener: (currentValue: mixed) => void) => () => void
 }
@@ -13,0 +13,0 @@

src/utils/stringifyRules.js

@@ -5,2 +5,11 @@ // @flow
 
+stylis.set({
+  global: false,
+  cascade: true,
+  keyframe: false,
+  prefix: true,
+  compress: false,
+  semicolon: true,
+})
+
 const stringifyRules = (
@@ -19,12 +28,5 @@ rules: Array<Interpolation>,
 
-  const css = stylis(
-    prefix || !selector ? '' : selector,
-    cssStr,
-    false,
-    false,
-  )
-
-  return css
+  return stylis(prefix || !selector ? '' : selector, cssStr)
 }
 
 export default stringifyRules

typings/styled-components.d.ts

 import * as React from "react";
-import { StatelessComponent, ComponentClass, PureComponent } from "react";
+import { StatelessComponent, ComponentClass, PureComponent, ReactElement } from "react";
 
+import { HTMLTags, SVGTags } from "./tags";
+
 type Component<P> = ComponentClass<P> | StatelessComponent<P>;
@@ -21,3 +23,3 @@
 export type FlattenInterpolation<P> = InterpolationValue | InterpolationFunction<P>;
-export type InterpolationValue = string | number;
+export type InterpolationValue = string | number | StyledComponentClass<any, any>;
 export type SimpleInterpolation = InterpolationValue | ReadonlyArray<InterpolationValue | ReadonlyArray<InterpolationValue>>;
@@ -28,6 +30,20 @@ export interface InterpolationFunction<P> {
 
-export interface ThemedStyledFunction<P, T> {
-  (strings: TemplateStringsArray, ...interpolations: Interpolation<ThemedStyledProps<P, T>>[]): ComponentClass<ThemedOuterStyledProps<P, T>>;
-  <U>(strings: TemplateStringsArray, ...interpolations: Interpolation<ThemedStyledProps<P & U, T>>[]): ComponentClass<ThemedOuterStyledProps<P & U, T>>;
+type Attrs<P, A extends Partial<P>, T> = {
+  [K in keyof A]: ((props: ThemedStyledProps<P, T>) => A[K]) | A[K];
+};
+
+export interface StyledComponentClass<P, T, O = P> extends ComponentClass<ThemedOuterStyledProps<O, T>> {
+  extend: ThemedStyledFunction<P, T, O>;
+
+  withComponent<K extends keyof HTMLTags>(tag: K): StyledComponentClass<React.HTMLProps<HTMLTags[K]>, T, O>;
+  withComponent<K extends keyof SVGTags>(tag: K): StyledComponentClass<React.SVGAttributes<SVGTags[K]>, T, O>;
+  withComponent(element: ComponentClass<P>): StyledComponentClass<P, T, O>;
 }
+
+export interface ThemedStyledFunction<P, T, O = P> {
+  (strings: TemplateStringsArray, ...interpolations: Interpolation<ThemedStyledProps<P, T>>[]): StyledComponentClass<P, T, O>;
+  <U>(strings: TemplateStringsArray, ...interpolations: Interpolation<ThemedStyledProps<P & U, T>>[]): StyledComponentClass<P & U, T, O & U>;
+  attrs<U, A extends Partial<P & U> = {}>(attrs: Attrs<P & U, A, T>): ThemedStyledFunction<P & A & U, T, O & U>;
+}
+
 export type StyledFunction<P> = ThemedStyledFunction<P, any>;
@@ -41,3 +57,13 @@
 
-export interface ThemedBaseStyledInterface<T> {
+type ThemedStyledComponentFactoriesHTML<T> = {
+    [K in keyof HTMLTags]: ThemedHtmlStyledFunction<HTMLTags[K], T>;
+};
+
+type ThemedStyledComponentFactoriesSVG<T> = {
+    [K in keyof SVGTags]: ThemedSvgStyledFunction<SVGTags[K], T>;
+};
+
+type ThemedStyledComponentFactories<T> = ThemedStyledComponentFactoriesHTML<T> & ThemedStyledComponentFactoriesHTML<T>;
+
+export interface ThemedBaseStyledInterface<T> extends ThemedStyledComponentFactories<T> {
   <P>(component: Component<P>): ThemedStyledFunction<P, T>;
@@ -47,142 +73,10 @@ }
 
+export type ThemedStyledInterface<T> = ThemedBaseStyledInterface<T>;
 export type StyledInterface = ThemedStyledInterface<any>;
-export interface ThemedStyledInterface<T> extends ThemedBaseStyledInterface<T> {
-  a: ThemedHtmlStyledFunction<HTMLAnchorElement, T>;
-  abbr: ThemedHtmlStyledFunction<HTMLElement, T>;
-  address: ThemedHtmlStyledFunction<HTMLElement, T>;
-  area: ThemedHtmlStyledFunction<HTMLAreaElement, T>;
-  article: ThemedHtmlStyledFunction<HTMLElement, T>;
-  aside: ThemedHtmlStyledFunction<HTMLElement, T>;
-  audio: ThemedHtmlStyledFunction<HTMLAudioElement, T>;
-  b: ThemedHtmlStyledFunction<HTMLElement, T>;
-  base: ThemedHtmlStyledFunction<HTMLBaseElement, T>;
-  bdi: ThemedHtmlStyledFunction<HTMLElement, T>;
-  bdo: ThemedHtmlStyledFunction<HTMLElement, T>;
-  big: ThemedHtmlStyledFunction<HTMLElement, T>;
-  blockquote: ThemedHtmlStyledFunction<HTMLElement, T>;
-  body: ThemedHtmlStyledFunction<HTMLBodyElement, T>;
-  br: ThemedHtmlStyledFunction<HTMLBRElement, T>;
-  button: ThemedHtmlStyledFunction<HTMLButtonElement, T>;
-  canvas: ThemedHtmlStyledFunction<HTMLCanvasElement, T>;
-  caption: ThemedHtmlStyledFunction<HTMLElement, T>;
-  cite: ThemedHtmlStyledFunction<HTMLElement, T>;
-  code: ThemedHtmlStyledFunction<HTMLElement, T>;
-  col: ThemedHtmlStyledFunction<HTMLTableColElement, T>;
-  colgroup: ThemedHtmlStyledFunction<HTMLTableColElement, T>;
-  data: ThemedHtmlStyledFunction<HTMLElement, T>;
-  datalist: ThemedHtmlStyledFunction<HTMLDataListElement, T>;
-  dd: ThemedHtmlStyledFunction<HTMLElement, T>;
-  del: ThemedHtmlStyledFunction<HTMLElement, T>;
-  details: ThemedHtmlStyledFunction<HTMLElement, T>;
-  dfn: ThemedHtmlStyledFunction<HTMLElement, T>;
-  dialog: ThemedHtmlStyledFunction<HTMLElement, T>;
-  div: ThemedHtmlStyledFunction<HTMLDivElement, T>;
-  dl: ThemedHtmlStyledFunction<HTMLDListElement, T>;
-  dt: ThemedHtmlStyledFunction<HTMLElement, T>;
-  em: ThemedHtmlStyledFunction<HTMLElement, T>;
-  embed: ThemedHtmlStyledFunction<HTMLEmbedElement, T>;
-  fieldset: ThemedHtmlStyledFunction<HTMLFieldSetElement, T>;
-  figcaption: ThemedHtmlStyledFunction<HTMLElement, T>;
-  figure: ThemedHtmlStyledFunction<HTMLElement, T>;
-  footer: ThemedHtmlStyledFunction<HTMLElement, T>;
-  form: ThemedHtmlStyledFunction<HTMLFormElement, T>;
-  h1: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  h2: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  h3: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  h4: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  h5: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  h6: ThemedHtmlStyledFunction<HTMLHeadingElement, T>;
-  head: ThemedHtmlStyledFunction<HTMLHeadElement, T>;
-  header: ThemedHtmlStyledFunction<HTMLElement, T>;
-  hgroup: ThemedHtmlStyledFunction<HTMLElement, T>;
-  hr: ThemedHtmlStyledFunction<HTMLHRElement, T>;
-  html: ThemedHtmlStyledFunction<HTMLHtmlElement, T>;
-  i: ThemedHtmlStyledFunction<HTMLElement, T>;
-  iframe: ThemedHtmlStyledFunction<HTMLIFrameElement, T>;
-  img: ThemedHtmlStyledFunction<HTMLImageElement, T>;
-  input: ThemedHtmlStyledFunction<HTMLInputElement, T>;
-  ins: ThemedHtmlStyledFunction<HTMLModElement, T>;
-  kbd: ThemedHtmlStyledFunction<HTMLElement, T>;
-  keygen: ThemedHtmlStyledFunction<HTMLElement, T>;
-  label: ThemedHtmlStyledFunction<HTMLLabelElement, T>;
-  legend: ThemedHtmlStyledFunction<HTMLLegendElement, T>;
-  li: ThemedHtmlStyledFunction<HTMLLIElement, T>;
-  link: ThemedHtmlStyledFunction<HTMLLinkElement, T>;
-  main: ThemedHtmlStyledFunction<HTMLElement, T>;
-  map: ThemedHtmlStyledFunction<HTMLMapElement, T>;
-  mark: ThemedHtmlStyledFunction<HTMLElement, T>;
-  menu: ThemedHtmlStyledFunction<HTMLElement, T>;
-  menuitem: ThemedHtmlStyledFunction<HTMLElement, T>;
-  meta: ThemedHtmlStyledFunction<HTMLMetaElement, T>;
-  meter: ThemedHtmlStyledFunction<HTMLElement, T>;
-  nav: ThemedHtmlStyledFunction<HTMLElement, T>;
-  noscript: ThemedHtmlStyledFunction<HTMLElement, T>;
-  object: ThemedHtmlStyledFunction<HTMLObjectElement, T>;
-  ol: ThemedHtmlStyledFunction<HTMLOListElement, T>;
-  optgroup: ThemedHtmlStyledFunction<HTMLOptGroupElement, T>;
-  option: ThemedHtmlStyledFunction<HTMLOptionElement, T>;
-  output: ThemedHtmlStyledFunction<HTMLElement, T>;
-  p: ThemedHtmlStyledFunction<HTMLParagraphElement, T>;
-  param: ThemedHtmlStyledFunction<HTMLParamElement, T>;
-  picture: ThemedHtmlStyledFunction<HTMLElement, T>;
-  pre: ThemedHtmlStyledFunction<HTMLPreElement, T>;
-  progress: ThemedHtmlStyledFunction<HTMLProgressElement, T>;
-  q: ThemedHtmlStyledFunction<HTMLQuoteElement, T>;
-  rp: ThemedHtmlStyledFunction<HTMLElement, T>;
-  rt: ThemedHtmlStyledFunction<HTMLElement, T>;
-  ruby: ThemedHtmlStyledFunction<HTMLElement, T>;
-  s: ThemedHtmlStyledFunction<HTMLElement, T>;
-  samp: ThemedHtmlStyledFunction<HTMLElement, T>;
-  script: ThemedHtmlStyledFunction<HTMLElement, T>;
-  section: ThemedHtmlStyledFunction<HTMLElement, T>;
-  select: ThemedHtmlStyledFunction<HTMLSelectElement, T>;
-  small: ThemedHtmlStyledFunction<HTMLElement, T>;
-  source: ThemedHtmlStyledFunction<HTMLSourceElement, T>;
-  span: ThemedHtmlStyledFunction<HTMLSpanElement, T>;
-  strong: ThemedHtmlStyledFunction<HTMLElement, T>;
-  style: ThemedHtmlStyledFunction<HTMLStyleElement, T>;
-  sub: ThemedHtmlStyledFunction<HTMLElement, T>;
-  summary: ThemedHtmlStyledFunction<HTMLElement, T>;
-  sup: ThemedHtmlStyledFunction<HTMLElement, T>;
-  table: ThemedHtmlStyledFunction<HTMLTableElement, T>;
-  tbody: ThemedHtmlStyledFunction<HTMLTableSectionElement, T>;
-  td: ThemedHtmlStyledFunction<HTMLTableDataCellElement, T>;
-  textarea: ThemedHtmlStyledFunction<HTMLTextAreaElement, T>;
-  tfoot: ThemedHtmlStyledFunction<HTMLTableSectionElement, T>;
-  th: ThemedHtmlStyledFunction<HTMLTableHeaderCellElement, T>;
-  thead: ThemedHtmlStyledFunction<HTMLTableSectionElement, T>;
-  time: ThemedHtmlStyledFunction<HTMLElement, T>;
-  title: ThemedHtmlStyledFunction<HTMLTitleElement, T>;
-  tr: ThemedHtmlStyledFunction<HTMLTableRowElement, T>;
-  track: ThemedHtmlStyledFunction<HTMLTrackElement, T>;
-  u: ThemedHtmlStyledFunction<HTMLElement, T>;
-  ul: ThemedHtmlStyledFunction<HTMLUListElement, T>;
-  "var": ThemedHtmlStyledFunction<HTMLElement, T>;
-  video: ThemedHtmlStyledFunction<HTMLVideoElement, T>;
-  wbr: ThemedHtmlStyledFunction<HTMLElement, T>;
 
-  // SVG
-  circle: ThemedSvgStyledFunction<SVGCircleElement, T>;
-  clipPath: ThemedSvgStyledFunction<SVGClipPathElement, T>;
-  defs: ThemedSvgStyledFunction<SVGDefsElement, T>;
-  ellipse: ThemedSvgStyledFunction<SVGEllipseElement, T>;
-  g: ThemedSvgStyledFunction<SVGGElement, T>;
-  image: ThemedSvgStyledFunction<SVGImageElement, T>;
-  line: ThemedSvgStyledFunction<SVGLineElement, T>;
-  linearGradient: ThemedSvgStyledFunction<SVGLinearGradientElement, T>;
-  mask: ThemedSvgStyledFunction<SVGMaskElement, T>;
-  path: ThemedSvgStyledFunction<SVGPathElement, T>;
-  pattern: ThemedSvgStyledFunction<SVGPatternElement, T>;
-  polygon: ThemedSvgStyledFunction<SVGPolygonElement, T>;
-  polyline: ThemedSvgStyledFunction<SVGPolylineElement, T>;
-  radialGradient: ThemedSvgStyledFunction<SVGRadialGradientElement, T>;
-  rect: ThemedSvgStyledFunction<SVGRectElement, T>;
-  stop: ThemedSvgStyledFunction<SVGStopElement, T>;
-  svg: ThemedSvgStyledFunction<SVGSVGElement, T>;
-  text: ThemedSvgStyledFunction<SVGTextElement, T>;
-  tspan: ThemedSvgStyledFunction<SVGTSpanElement, T>;
+export interface ThemeProviderProps<T> {
+  theme?: T | ((theme: T) => T);
 }
+export type ThemeProviderComponent<T> = ComponentClass<ThemeProviderProps<T>>;
 
-export type ThemeProviderComponent<T> = ComponentClass<ThemeProps<T>>;
-
 export interface ThemedCssFunction<T> {
@@ -212,4 +106,17 @@ (strings: TemplateStringsArray, ...interpolations: SimpleInterpolation[]): InterpolationValue[];
 
-export const ThemeProvider: ThemeProviderComponent<any>;
+export const ThemeProvider: ThemeProviderComponent<object>;
 
+interface StylesheetComponentProps {
+  sheet: ServerStyleSheet;
+}
+
+export class StyleSheetManager extends React.Component<StylesheetComponentProps, {}> { }
+
+export class ServerStyleSheet {
+  collectStyles(tree: React.ReactNode): ReactElement<StylesheetComponentProps>;
+
+  getStyleTags(): string;
+  getStyleElement(): ReactElement<{}>[];
+}
+
 export default styled;

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

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Improved metrics

Dependency count

10

decreased by-9.09%

Number of low license alerts

0

decreased by-100%

License quality

100

increased by25%

Lines of code

35789

increased by1.19%

Worsened metrics

Total package byte prevSize

1476168

decreased by-12.45%

Dev dependency count

52

increased by1.96%

Number of package files

272

decreased by-17.58%

Number of lines in readme file

181

decreased by-1.09%

Dependency changes

• + Addedstylis@3.5.4(transitive)

• - Removedinline-style-prefixer@^2.0.5

• - Removedbowser@1.9.4(transitive)

• - Removedhyphenate-style-name@1.1.0(transitive)

• - Removedinline-style-prefixer@2.0.5(transitive)

• - Removedstylis@2.0.12(transitive)

• Updatedstylis@^3.0.19