style-it
Version:
Component for writing plaintext CSS in React apps -- isomorphic, scoped, FOUC-free, fully featured, CSS-in-JS
1 lines • 6.82 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.Style=t(require("react")):e.Style=t(e.React)}(this,function(e){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,exports,t){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(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}function s(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)}Object.defineProperty(exports,"__esModule",{value:!0});var i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},c="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},a=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),l=t(2),p=r(l),u=t(1),f=r(u),d=!1,Style=function(e){function Style(e){n(this,Style);var t=o(this,(Style.__proto__||Object.getPrototypeOf(Style)).call(this,e));return t.getStyleString=function(){if(t.props.children instanceof Array){var e=t.props.children.filter(function(e){return!(0,l.isValidElement)(e)&&"string"==typeof e});if(e.length>1)throw new Error("Multiple style objects as direct descedents of a Style component are not supported ("+e.length+" style objects detected): \n\n"+e[0]);return e[0]}return"string"!=typeof t.props.children||(0,l.isValidElement)(t.props.children)?null:t.props.children},t.getRootElement=function(){if(t.props.children instanceof Array){var e=t.props.children.filter(function(e){return(0,l.isValidElement)(e)});if(d){if(e.length>1)throw console.log(e),new Error("Adjacent JSX elements must be wrapped in an enclosing tag ("+e.length+" root elements detected).");if("undefined"!=typeof e[0]&&t.isVoidElement(e[0].type))throw new Error("Self-closing void elements like "+e.type+" must be wrapped in an enclosing tag. Reactive Style must be able to nest a style element inside of the root element and void element content models never allowit to have contents under any circumstances.")}return e[0]}return(0,l.isValidElement)(t.props.children)?t.props.children:null},t.getRootSelectors=function(e){var t=[];return e.props.id&&t.push("#"+e.props.id),e.props.className&&e.props.className.trim().split(/\s+/g).forEach(function(e){return t.push(e)}),t.length||"function"==typeof e.type||t.push(e.type),t},t.processCSSText=function(e,r,n){return e.replace(/\s*\/\/(?![^(]*\)).*|\s*\/\*.*\*\//g,"").replace(/\s\s+/g," ").split("}").map(function(e){var o=/.*:.*;/g,s=/.*:.*(;|$|\s+)/g,i=/\s*@/g,c=/\s*(([0-9][0-9]?|100)\s*%)|\s*(to|from)\s*$/g;return e.split("{").map(function(e,a,l){if(!e.trim().length)return"";var p=l.length-1===a&&e.match(s);if(e.match(o)||p)return t.escapeTextContentForBrowser(e);var u=e;return r&&!/:target/gi.test(u)?u.match(i)||u.match(c)?u:t.scopeSelector(r,u,n):u}).join("{\n")}).join("}\n")},t.escaper=function(e){var t={">":">","<":"<"};return t[e]},t.escapeTextContentForBrowser=function(e){var r=/[><]/g;return(""+e).replace(r,t.escaper)},t.scopeSelector=function(e,t,r){for(var n=[],o=/,(?![^(|[]*\)|\])/g,s=t.split(o),i=0;i<s.length;i++){var c=void 0,a=void 0;if(r.length&&r.some(function(e){return t.match(e)})){a=s[i];var l=r.map(function(e){return e.replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&")});a=a.replace(new RegExp("("+l.join("|")+")"),"$1"+e),c=e+" "+s[i],n.push(a,c)}else c=e+" "+s[i],n.push(c)}return n.join(", ")},t.getScopeClassName=function(e,r){var n=e;return r&&(t.pepper="",t.traverseObjectToGeneratePepper(r),n+=t.pepper),(d?"scope-":"s")+(0,f.default)(n)},t.traverseObjectToGeneratePepper=function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;if(!(r>32||t.pepper.length>1e4))for(var n in e){var o=/^[_$]|type|ref|^value$/.test(n);e[n]&&"object"===c(e[n])&&!o?t.traverseObjectToGeneratePepper(e[n],r+1):e[n]&&!o&&"function"!=typeof e[n]&&(t.pepper+=e[n])}},t.isVoidElement=function(e){return["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"].some(function(t){return e===t})},t.addCSSTextToHead=function(e){if(e.length){var t=(0,f.default)(e);window._reactiveStyle.cssTextHashesAddedToHead.some(function(e){return e===t})||(window._reactiveStyle.el.innerHTML+=e,window._reactiveStyle.cssTextHashesAddedToHead.push(t))}},t.createStyleElement=function(e,r){return p.default.createElement("style",{type:"text/css",key:r,ref:function(e){return t._style=e},dangerouslySetInnerHTML:{__html:e||""}})},t.getNewChildrenForCloneElement=function(e,r,n){return[t.createStyleElement(e,n)].concat(r.props.children)},t.scopeClassNameCache={},t.scopedCSSTextCache={},t}return s(Style,e),a(Style,[{key:"render",value:function(){if(!this.props.children)return this.createStyleElement();var e=this.getStyleString(),t=this.getRootElement();if(!e&&t)return t.props.children;if(e&&!t)return this.createStyleElement(this.processCSSText(e),this.getScopeClassName(e,t));var r=t.props.className?t.props.className+" ":"",n=t.props.id?t.props.id:"",o=void 0,s=void 0,c=r+n+e;return this.scopeClassNameCache[c]?(o=this.scopeClassNameCache[c],s=this.scopedCSSTextCache[o]):(o=this.getScopeClassName(e,t),s=this.processCSSText(e,"."+o,this.getRootSelectors(t)),this.scopeClassNameCache[c]=o,this.scopedCSSTextCache[o]=s),(0,l.cloneElement)(t,i({},t.props,{className:""+r+o}),this.getNewChildrenForCloneElement(s,t,o))}}]),Style}(l.Component);Style.it=function(e,t){return p.default.createElement(Style,null,e,t)},exports.default=Style},function(e,exports){"use strict";function t(e){for(var t=1,n=0,o=0,s=e.length,i=s&-4;o<i;){for(var c=Math.min(o+4096,i);o<c;o+=4)n+=(t+=e.charCodeAt(o))+(t+=e.charCodeAt(o+1))+(t+=e.charCodeAt(o+2))+(t+=e.charCodeAt(o+3));t%=r,n%=r}for(;o<s;o++)n+=t+=e.charCodeAt(o);return t%=r,n%=r,t|n<<16}var r=65521;e.exports=t},function(t,exports){t.exports=e}])});