@emotion/styled-base - npm Package Compare versions

Comparing version 0.8.0 to 0.9.0

dist/index.browser.cjs.js

@@ -46,2 +46,3 @@ 'use strict';
   var shouldForwardProp;
+  var targetClassName;
 
@@ -51,2 +52,3 @@ if (options !== undefined) {
     shouldForwardProp = options.shouldForwardProp;
+    targetClassName = options.target;
   }
@@ -58,3 +60,6 @@
   if (typeof shouldForwardProp !== 'function') {
-    shouldForwardProp = typeof baseTag === 'string' && baseTag.charAt(0) === baseTag.charAt(0).toLowerCase() ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+    shouldForwardProp = typeof baseTag === 'string' && // 96 is one less than the char code
+    // for "a" so this is checking that
+    // it's a lowercase character
+    baseTag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
   }
@@ -96,2 +101,7 @@
       className += context.key + "-" + serialized.name;
+
+      if (targetClassName !== undefined) {
+        className += " " + targetClassName;
+      }
+
       var ele = React.createElement(baseTag, // $FlowFixMe
@@ -122,3 +132,14 @@ pickAssign(shouldForwardProp, {}, props, {
     FinalStyled.__emotion_styles = styles;
+    Object.defineProperty(FinalStyled, 'toString', {
+      enumerable: false,
+      value: function value() {
+        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
+          return 'NO_COMPONENT_SELECTOR';
+        } // $FlowFixMe
 
+
+        return "." + targetClassName;
+      }
+    });
+
     FinalStyled.withComponent = function (nextTag, nextOptions) {
@@ -125,0 +146,0 @@ return createStyled(nextTag, nextOptions !== undefined ? pickAssign(testAlwaysTrue, {}, options || {}, nextOptions) : options).apply(void 0, styles);

dist/index.browser.es.js

@@ -42,2 +42,3 @@ import isPropValid from '@emotion/is-prop-valid';
   var shouldForwardProp;
+  var targetClassName;
 
@@ -47,2 +48,3 @@ if (options !== undefined) {
     shouldForwardProp = options.shouldForwardProp;
+    targetClassName = options.target;
   }
@@ -54,3 +56,6 @@
   if (typeof shouldForwardProp !== 'function') {
-    shouldForwardProp = typeof baseTag === 'string' && baseTag.charAt(0) === baseTag.charAt(0).toLowerCase() ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+    shouldForwardProp = typeof baseTag === 'string' && // 96 is one less than the char code
+    // for "a" so this is checking that
+    // it's a lowercase character
+    baseTag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
   }
@@ -92,2 +97,7 @@
       className += context.key + "-" + serialized.name;
+
+      if (targetClassName !== undefined) {
+        className += " " + targetClassName;
+      }
+
       var ele = createElement(baseTag, // $FlowFixMe
@@ -118,3 +128,14 @@ pickAssign(shouldForwardProp, {}, props, {
     FinalStyled.__emotion_styles = styles;
+    Object.defineProperty(FinalStyled, 'toString', {
+      enumerable: false,
+      value: function value() {
+        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
+          return 'NO_COMPONENT_SELECTOR';
+        } // $FlowFixMe
 
+
+        return "." + targetClassName;
+      }
+    });
+
     FinalStyled.withComponent = function (nextTag, nextOptions) {
@@ -121,0 +142,0 @@ return createStyled(nextTag, nextOptions !== undefined ? pickAssign(testAlwaysTrue, {}, options || {}, nextOptions) : options).apply(void 0, styles);

dist/index.cjs.js

@@ -46,2 +46,3 @@ 'use strict';
   var shouldForwardProp;
+  var targetClassName;
 
@@ -51,2 +52,3 @@ if (options !== undefined) {
     shouldForwardProp = options.shouldForwardProp;
+    targetClassName = options.target;
   }
@@ -58,3 +60,6 @@
   if (typeof shouldForwardProp !== 'function') {
-    shouldForwardProp = typeof baseTag === 'string' && baseTag.charAt(0) === baseTag.charAt(0).toLowerCase() ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+    shouldForwardProp = typeof baseTag === 'string' && // 96 is one less than the char code
+    // for "a" so this is checking that
+    // it's a lowercase character
+    baseTag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
   }
@@ -96,2 +101,7 @@
       className += context.key + "-" + serialized.name;
+
+      if (targetClassName !== undefined) {
+        className += " " + targetClassName;
+      }
+
       var ele = React.createElement(baseTag, // $FlowFixMe
@@ -128,3 +138,14 @@ pickAssign(shouldForwardProp, {}, props, {
     FinalStyled.__emotion_styles = styles;
+    Object.defineProperty(FinalStyled, 'toString', {
+      enumerable: false,
+      value: function value() {
+        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
+          return 'NO_COMPONENT_SELECTOR';
+        } // $FlowFixMe
 
+
+        return "." + targetClassName;
+      }
+    });
+
     FinalStyled.withComponent = function (nextTag, nextOptions) {
@@ -131,0 +152,0 @@ return createStyled(nextTag, nextOptions !== undefined ? pickAssign(testAlwaysTrue, {}, options || {}, nextOptions) : options).apply(void 0, styles);

dist/index.es.js

@@ -42,2 +42,3 @@ import isPropValid from '@emotion/is-prop-valid';
   var shouldForwardProp;
+  var targetClassName;
 
@@ -47,2 +48,3 @@ if (options !== undefined) {
     shouldForwardProp = options.shouldForwardProp;
+    targetClassName = options.target;
   }
@@ -54,3 +56,6 @@
   if (typeof shouldForwardProp !== 'function') {
-    shouldForwardProp = typeof baseTag === 'string' && baseTag.charAt(0) === baseTag.charAt(0).toLowerCase() ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+    shouldForwardProp = typeof baseTag === 'string' && // 96 is one less than the char code
+    // for "a" so this is checking that
+    // it's a lowercase character
+    baseTag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
   }
@@ -92,2 +97,7 @@
       className += context.key + "-" + serialized.name;
+
+      if (targetClassName !== undefined) {
+        className += " " + targetClassName;
+      }
+
       var ele = createElement(baseTag, // $FlowFixMe
@@ -124,3 +134,14 @@ pickAssign(shouldForwardProp, {}, props, {
     FinalStyled.__emotion_styles = styles;
+    Object.defineProperty(FinalStyled, 'toString', {
+      enumerable: false,
+      value: function value() {
+        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
+          return 'NO_COMPONENT_SELECTOR';
+        } // $FlowFixMe
 
+
+        return "." + targetClassName;
+      }
+    });
+
     FinalStyled.withComponent = function (nextTag, nextOptions) {
@@ -127,0 +148,0 @@ return createStyled(nextTag, nextOptions !== undefined ? pickAssign(testAlwaysTrue, {}, options || {}, nextOptions) : options).apply(void 0, styles);

dist/index.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("@emotion/core")):"function"==typeof define&&define.amd?define(["react","@emotion/core"],t):e.emotionStyledBase=t(e.React,e.emotionCore)}(this,function(e,t){"use strict";function r(e){var t={};return function(r){return void 0===t[r]&&(t[r]=e(r)),t[r]}}var n=r(RegExp.prototype.test.bind(/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|accept|acceptCharset|accessKey|action|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|default|defer|dir|disabled|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|itemProp|itemScope|itemType|itemID|itemRef|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan)|(on[A-Z].*)|((data|aria)-.*))$/)),i=function(e){return"theme"!==e&&"innerRef"!==e},o=function(){return!0},a=function(e,t){for(var r=2,n=arguments.length;r<n;r++){var i=arguments[r],o=void 0;for(o in i)e(o)&&(t[o]=i[o])}return t};var s={animationIterationCount:1,borderImageOutset:1,borderImageSlice:1,borderImageWidth:1,boxFlex:1,boxFlexGroup:1,boxOrdinalGroup:1,columnCount:1,columns:1,flex:1,flexGrow:1,flexPositive:1,flexShrink:1,flexNegative:1,flexOrder:1,gridRow:1,gridRowEnd:1,gridRowSpan:1,gridRowStart:1,gridColumn:1,gridColumnEnd:1,gridColumnSpan:1,gridColumnStart:1,fontWeight:1,lineHeight:1,opacity:1,order:1,orphans:1,tabSize:1,widows:1,zIndex:1,zoom:1,WebkitLineClamp:1,fillOpacity:1,floodOpacity:1,stopOpacity:1,strokeDasharray:1,strokeDashoffset:1,strokeMiterlimit:1,strokeOpacity:1,strokeWidth:1},l=/[A-Z]|^ms/g,c=r(function(e){return e.replace(l,"-$&").toLowerCase()}),d=function(e,t){return null==t||"boolean"==typeof t?"":1===s[e]||45===e.charCodeAt(1)||isNaN(t)||0===t?t:t+"px"};function p(e,t){if(null==t)return"";switch(typeof t){case"boolean":return"";case"function":return void 0===this?t.toString():p.call(this,e,t(this));case"object":return 2===t.type?t.name:void 0!==t.styles?t.styles:function(e,t){var r="";Array.isArray(t)?t.forEach(function(t){r+=p.call(this,e,t)},this):Object.keys(t).forEach(function(n){"object"!=typeof t[n]?r+=c(n)+":"+d(n,t[n])+";":Array.isArray(t[n])&&"string"==typeof t[n][0]?t[n].forEach(function(e){r+=c(n)+":"+d(n,e)+";"}):r+=n+"{"+p.call(this,e,t[n])+"}"},this);return r}.call(this,e,t);default:var r=e[t];return void 0!==r?r:t}}var u=/label:\s*([^\s;\n{]+)\s*;/g;return function r(s,l){var c,d;void 0!==l&&(c=l.label,d=l.shouldForwardProp);var f=s.__emotion_real===s,m=f&&s.__emotion_base||s;return"function"!=typeof d&&(d="string"==typeof m&&m.charAt(0)===m.charAt(0).toLowerCase()?n:i),function(){var n=arguments,i=f&&void 0!==s.__emotion_styles?s.__emotion_styles.slice(0):[];if(void 0!==c&&i.push("label:"+c+";"),null==n[0]||void 0===n[0].raw)i.push.apply(i,n);else{i.push(n[0][0]);for(var h=n.length,g=1;g<h;g++)i.push(n[g],n[0][g])}var y=t.withCSSContext(function(t,r){var n,s,l,c,f="",h=[],g=a(o,{},t,{theme:t.theme||r.theme});"string"==typeof t.className&&(f+=(n=r.registered,s=h,l=t.className,c="",l.split(" ").forEach(function(e){void 0!==n[e]?s.push(n[e]):c+=e+" "}),c));var y=function(e,t){if(1===t.length&&"object"==typeof t[0]&&null!==t[0]&&void 0!==t[0].styles)return t[0];var r="",n="";return t.forEach(function(t,n){r+=p.call(this,e,t)},this),{type:1,name:function(e){for(var t,r=e.length,n=r^r,i=0;r>=4;)t=1540483477*(65535&(t=255&e.charCodeAt(i)|(255&e.charCodeAt(++i))<<8|(255&e.charCodeAt(++i))<<16|(255&e.charCodeAt(++i))<<24))+((1540483477*(t>>>16)&65535)<<16),n=1540483477*(65535&n)+((1540483477*(n>>>16)&65535)<<16)^(t=1540483477*(65535&(t^=t>>>24))+((1540483477*(t>>>16)&65535)<<16)),r-=4,++i;switch(r){case 3:n^=(255&e.charCodeAt(i+2))<<16;case 2:n^=(255&e.charCodeAt(i+1))<<8;case 1:n=1540483477*(65535&(n^=255&e.charCodeAt(i)))+((1540483477*(n>>>16)&65535)<<16)}return n=1540483477*(65535&(n^=n>>>13))+((1540483477*(n>>>16)&65535)<<16),((n^=n>>>15)>>>0).toString(36)}(r=r.replace(u,function(e,t){return n+="-"+t,""}))+n,styles:r}}.call(g,r.registered,i.concat(h));return function(e,t){1===t.type&&void 0===e.registered["css-"+t.name]&&(e.registered["css-"+t.name]=t.styles),void 0===e.inserted[t.name]&&(e.stylis(1===t.type?".css-"+t.name:"",t.styles).forEach(function(t){e.sheet.insert(t)}),e.inserted[t.name]=!0,void 0===e.compat)&&e.inserted[t.name]}(r,y),f+=r.key+"-"+y.name,e.createElement(m,a(d,{},t,{className:f,ref:t.innerRef}))});y.displayName=void 0!==c?c:"Styled("+("string"==typeof m?m:m.displayName||m.name||"Component")+")";var v=e.forwardRef(function(t,r){return null===r?e.createElement(y,t):e.createElement(y,a(o,{innerRef:r},t))});return v.__emotion_real=v,v.__emotion_base=m,v.__emotion_styles=i,v.withComponent=function(e,t){return r(e,void 0!==t?a(o,{},l||{},t):l).apply(void 0,i)},v}}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("@emotion/core")):"function"==typeof define&&define.amd?define(["react","@emotion/core"],t):e.emotionStyledBase=t(e.React,e.emotionCore)}(this,function(e,t){"use strict";function r(e){var t={};return function(r){return void 0===t[r]&&(t[r]=e(r)),t[r]}}var n=r(RegExp.prototype.test.bind(/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|accept|acceptCharset|accessKey|action|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|default|defer|dir|disabled|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|itemProp|itemScope|itemType|itemID|itemRef|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan)|(on[A-Z].*)|((data|aria)-.*))$/)),i=function(e){return"theme"!==e&&"innerRef"!==e},o=function(){return!0},a=function(e,t){for(var r=2,n=arguments.length;r<n;r++){var i=arguments[r],o=void 0;for(o in i)e(o)&&(t[o]=i[o])}return t};var s={animationIterationCount:1,borderImageOutset:1,borderImageSlice:1,borderImageWidth:1,boxFlex:1,boxFlexGroup:1,boxOrdinalGroup:1,columnCount:1,columns:1,flex:1,flexGrow:1,flexPositive:1,flexShrink:1,flexNegative:1,flexOrder:1,gridRow:1,gridRowEnd:1,gridRowSpan:1,gridRowStart:1,gridColumn:1,gridColumnEnd:1,gridColumnSpan:1,gridColumnStart:1,fontWeight:1,lineHeight:1,opacity:1,order:1,orphans:1,tabSize:1,widows:1,zIndex:1,zoom:1,WebkitLineClamp:1,fillOpacity:1,floodOpacity:1,stopOpacity:1,strokeDasharray:1,strokeDashoffset:1,strokeMiterlimit:1,strokeOpacity:1,strokeWidth:1},l=/[A-Z]|^ms/g,c=r(function(e){return e.replace(l,"-$&").toLowerCase()}),d=function(e,t){return null==t||"boolean"==typeof t?"":1===s[e]||45===e.charCodeAt(1)||isNaN(t)||0===t?t:t+"px"};function u(e,t){if(null==t)return"";if(void 0!==t.__emotion_styles)return t.toString(),t;switch(typeof t){case"boolean":return"";case"object":return 2===t.type?t.name:void 0!==t.styles?t.styles:function(e,t){var r="";Array.isArray(t)?t.forEach(function(t){r+=u.call(this,e,t)},this):Object.keys(t).forEach(function(n){"object"!=typeof t[n]?r+=c(n)+":"+d(n,t[n])+";":Array.isArray(t[n])&&"string"==typeof t[n][0]&&void 0===e[t[n][0]]?t[n].forEach(function(e){r+=c(n)+":"+d(n,e)+";"}):r+=n+"{"+u.call(this,e,t[n])+"}"},this);return r}.call(this,e,t);case"function":if(void 0!==this)return u.call(this,e,t(this));default:var r=e[t];return void 0!==r?r:t}}var p=/label:\s*([^\s;\n{]+)\s*;/g;return function r(s,l){var c,d,f;void 0!==l&&(c=l.label,d=l.shouldForwardProp,f=l.target);var m=s.__emotion_real===s,h=m&&s.__emotion_base||s;return"function"!=typeof d&&(d="string"==typeof h&&h.charCodeAt(0)>96?n:i),function(){var n=arguments,i=m&&void 0!==s.__emotion_styles?s.__emotion_styles.slice(0):[];if(void 0!==c&&i.push("label:"+c+";"),null==n[0]||void 0===n[0].raw)i.push.apply(i,n);else{i.push(n[0][0]);for(var g=n.length,y=1;y<g;y++)i.push(n[y],n[0][y])}var v=t.withCSSContext(function(t,r){var n,s,l,c,m="",g=[],y=a(o,{},t,{theme:t.theme||r.theme});"string"==typeof t.className&&(m+=(n=r.registered,s=g,l=t.className,c="",l.split(" ").forEach(function(e){void 0!==n[e]?s.push(n[e]):c+=e+" "}),c));var v=function(e,t){if(1===t.length&&"object"==typeof t[0]&&null!==t[0]&&void 0!==t[0].styles)return t[0];var r="",n="";return t.forEach(function(t,n){r+=u.call(this,e,t)},this),{name:function(e){for(var t,r=e.length,n=r^r,i=0;r>=4;)t=1540483477*(65535&(t=255&e.charCodeAt(i)|(255&e.charCodeAt(++i))<<8|(255&e.charCodeAt(++i))<<16|(255&e.charCodeAt(++i))<<24))+((1540483477*(t>>>16)&65535)<<16),n=1540483477*(65535&n)+((1540483477*(n>>>16)&65535)<<16)^(t=1540483477*(65535&(t^=t>>>24))+((1540483477*(t>>>16)&65535)<<16)),r-=4,++i;switch(r){case 3:n^=(255&e.charCodeAt(i+2))<<16;case 2:n^=(255&e.charCodeAt(i+1))<<8;case 1:n=1540483477*(65535&(n^=255&e.charCodeAt(i)))+((1540483477*(n>>>16)&65535)<<16)}return n=1540483477*(65535&(n^=n>>>13))+((1540483477*(n>>>16)&65535)<<16),((n^=n>>>15)>>>0).toString(36)}(r=r.replace(p,function(e,t){return n+="-"+t,""}))+n,styles:r}}.call(y,r.registered,i.concat(g));return function(e,t){void 0===e.registered[e.key+"-"+t.name]&&(e.registered[e.key+"-"+t.name]=t.styles),void 0===e.inserted[t.name]&&(e.stylis("."+e.key+"-"+t.name,t.styles).forEach(function(t){e.sheet.insert(t)}),e.inserted[t.name]=!0,void 0===e.compat)&&e.inserted[t.name]}(r,v),m+=r.key+"-"+v.name,void 0!==f&&(m+=" "+f),e.createElement(h,a(d,{},t,{className:m,ref:t.innerRef}))});v.displayName=void 0!==c?c:"Styled("+("string"==typeof h?h:h.displayName||h.name||"Component")+")";var k=e.forwardRef(function(t,r){return null===r?e.createElement(v,t):e.createElement(v,a(o,{innerRef:r},t))});return k.__emotion_real=k,k.__emotion_base=h,k.__emotion_styles=i,Object.defineProperty(k,"toString",{enumerable:!1,value:function(){return"."+f}}),k.withComponent=function(e,t){return r(e,void 0!==t?a(o,{},l||{},t):l).apply(void 0,i)},k}}});
 //# sourceMappingURL=index.min.js.map

package.json

 {
   "name": "@emotion/styled-base",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "base styled API for emotion",
@@ -15,5 +15,5 @@ "main": "dist/index.cjs.js",
     "@emotion/is-prop-valid": "^0.6.2",
-    "@emotion/serialize": "^0.7.0",
-    "@emotion/types": "^0.6.2",
-    "@emotion/utils": "^0.6.1"
+    "@emotion/serialize": "^0.8.0",
+    "@emotion/types": "^0.7.0",
+    "@emotion/utils": "^0.7.0"
   },
@@ -20,0 +20,0 @@ "peerDependencies": {

src/index.js

@@ -30,5 +30,7 @@ // @flow
   let shouldForwardProp
+  let targetClassName
   if (options !== undefined) {
     identifierName = options.label
     shouldForwardProp = options.shouldForwardProp
+    targetClassName = options.target
   }
@@ -40,3 +42,6 @@ const isReal = tag.__emotion_real === tag
       typeof baseTag === 'string' &&
-      baseTag.charAt(0) === baseTag.charAt(0).toLowerCase()
+      // 96 is one less than the char code
+      // for "a" so this is checking that
+      // it's a lowercase character
+      baseTag.charCodeAt(0) > 96
         ? testOmitPropsOnStringTag
@@ -86,2 +91,5 @@ : testOmitPropsOnComponent
       className += `${context.key}-${serialized.name}`
+      if (targetClassName !== undefined) {
+        className += ` ${targetClassName}`
+      }
 
@@ -135,2 +143,15 @@ const ele = React.createElement(
     FinalStyled.__emotion_styles = styles
+    Object.defineProperty(FinalStyled, 'toString', {
+      enumerable: false,
+      value() {
+        if (
+          targetClassName === undefined &&
+          process.env.NODE_ENV !== 'production'
+        ) {
+          return 'NO_COMPONENT_SELECTOR'
+        }
+        // $FlowFixMe
+        return `.${targetClassName}`
+      }
+    })
 
@@ -137,0 +158,0 @@ FinalStyled.withComponent = (

src/utils.js

@@ -32,3 +32,4 @@ // @flow
   label?: string,
-  shouldForwardProp?: string => boolean
+  shouldForwardProp?: string => boolean,
+  target?: string
 }
@@ -35,0 +36,0 @@

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

Improved metrics

Total package byte prevSize

94332

increased by9.17%

Lines of code

713

increased by14.63%

Worsened metrics

Number of low supply chain risk alerts

11

increased by83.33%

Dependency changes

• + Added@emotion/serialize@0.8.6(transitive)

• + Added@emotion/types@0.7.0(transitive)

• + Added@emotion/utils@0.7.3(transitive)

• - Removed@emotion/serialize@0.7.0(transitive)

• - Removed@emotion/types@0.6.2(transitive)

• - Removed@emotion/utils@0.6.1(transitive)

• Updated@emotion/serialize@^0.8.0

• Updated@emotion/types@^0.7.0

• Updated@emotion/utils@^0.7.0