styled-components 6.0.0-beta.6 → 6.0.0-beta.8

package/dist/styled-components.js

@@ -12,7 +12,7 @@
         'data-styled';
     var SC_ATTR_ACTIVE = 'active';
     var SC_ATTR_VERSION = 'data-styled-version';
-    var SC_VERSION = "6.0.0-beta.6";
+    var SC_VERSION = "6.0.0-beta.8";
     var SPLITTER = '/*!sc*/\n';
     var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
     var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean'
@@ -59,18 +59,6 @@
         return __assign.apply(this, arguments);
     };
 
-    function __rest(s, e) {
-        var t = {};
-        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-            t[p] = s[p];
-        if (s != null && typeof Object.getOwnPropertySymbols === "function")
-            for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-                if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                    t[p[i]] = s[p[i]];
-            }
-        return t;
-    }
-
     function __spreadArray(to, from, pack) {
         if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
             if (ar || !(i in from)) {
@@ -670,7 +658,11 @@
                 props[0] = props[0].replace(_selectorRegexp, selfReferenceReplacer);
             }
         };
-        var stringifyRules = function (css, selector, prefix, componentId) {
+        var stringifyRules = function (css, selector, 
+        /**
+         * This "prefix" referes to a _selector_ prefix.
+         */
+        prefix, componentId) {
             if (selector === void 0) { selector = ''; }
             if (prefix === void 0) { prefix = ''; }
             if (componentId === void 0) { componentId = '&'; }
@@ -683,11 +675,16 @@
             _selectorRegexp = new RegExp("\\".concat(_selector, "\\b"), 'g');
             _consecutiveSelfRefRegExp = new RegExp("(\\".concat(_selector, "\\b){2,}"));
             var middlewares = plugins.slice();
+            /**
+             * Enables automatic vendor-prefixing for styles.
+             */
             if (options.prefix || options.prefix === undefined) {
                 middlewares.unshift(pe);
             }
             middlewares.push(selfReferenceReplacementPlugin, oe);
-            return serialize(ne(prefix || selector ? "".concat(prefix, " ").concat(selector, " { ").concat(flatCSS, " }") : flatCSS), le(middlewares));
+            return serialize(ne(options.namespace || prefix || selector
+                ? "".concat(options.namespace ? options.namespace + ' ' : '').concat(prefix, " ").concat(selector, " { ").concat(flatCSS, " }")
+                : flatCSS), le(middlewares));
         };
         stringifyRules.hash = plugins.length
             ? plugins
@@ -732,10 +729,10 @@
         }, [props.disableCSSOMInjection, props.sheet, props.target]);
         var stylis = React.useMemo(function () {
             return createStylisInstance({
-                options: { prefix: !props.disableVendorPrefixes },
+                options: { namespace: props.namespace, prefix: !props.disableVendorPrefixes },
                 plugins: plugins,
             });
-        }, [props.disableVendorPrefixes, plugins]);
+        }, [props.disableVendorPrefixes, props.namespace, plugins]);
         React.useEffect(function () {
             if (!shallowequal(plugins, props.stylisPlugins))
                 setPlugins(props.stylisPlugins);
@@ -769,77 +766,6 @@
         return Keyframes;
     }());
 
-    function unwrapExports (x) {
-    	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-    }
-
-    function createCommonjsModule(fn, module) {
-    	return module = { exports: {} }, fn(module, module.exports), module.exports;
-    }
-
-    var unitless_cjs_prod = createCommonjsModule(function (module, exports) {
-
-    Object.defineProperty(exports, "__esModule", {
-      value: !0
-    });
-
-    var unitlessKeys = {
-      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,
-      msGridRow: 1,
-      msGridRowSpan: 1,
-      msGridColumn: 1,
-      msGridColumnSpan: 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
-    };
-
-    exports.default = unitlessKeys;
-    });
-
-    unwrapExports(unitless_cjs_prod);
-
-    var unitless_cjs_dev = createCommonjsModule(function (module, exports) {
-
-    Object.defineProperty(exports, '__esModule', { value: true });
-
     var unitlessKeys = {
       animationIterationCount: 1,
       borderImageOutset: 1,
@@ -889,25 +815,13 @@
       strokeWidth: 1
     };
 
-    exports.default = unitlessKeys;
-    });
-
-    unwrapExports(unitless_cjs_dev);
-
-    var unitless_cjs = createCommonjsModule(function (module) {
-
-    {
-      module.exports = unitless_cjs_dev;
-    }
-    });
-
     // Taken from https://github.com/facebook/react/blob/b87aabdfe1b7461e7331abb3601d9e6bb27544bc/packages/react-dom/src/shared/dangerousStyleValue.js
     function addUnitIfNeeded(name, value) {
         // https://github.com/amilajack/eslint-plugin-flowtype-errors/issues/133
         if (value == null || typeof value === 'boolean' || value === '') {
             return '';
         }
-        if (typeof value === 'number' && value !== 0 && !(name in unitless_cjs)) {
+        if (typeof value === 'number' && value !== 0 && !(name in unitlessKeys)) {
             return "".concat(value, "px"); // Presumes implicit 'px' suffix for unitless numbers
         }
         return String(value).trim();
@@ -1970,13 +1884,6 @@
         WrappedStyledComponent.styledComponentId = styledComponentId;
         // fold the underlying StyledComponent target up since we folded the styles
         WrappedStyledComponent.target = isTargetStyledComp ? styledComponentTarget.target : target;
-        WrappedStyledComponent.withComponent = function withComponent(tag) {
-            var previousComponentId = options.componentId, optionsToCopy = __rest(options, ["componentId"]);
-            var newComponentId = previousComponentId &&
-                "".concat(previousComponentId, "-").concat(isTag(tag) ? tag : escape(getComponentName(tag)));
-            var newOptions = __assign(__assign({}, optionsToCopy), { attrs: finalAttrs, componentId: newComponentId });
-            return createStyledComponent(tag, newOptions, rules);
-        };
         Object.defineProperty(WrappedStyledComponent, 'defaultProps', {
             get: function () {
                 return this._foldedDefaultProps;
@@ -2003,7 +1910,6 @@
                 shouldForwardProp: true,
                 styledComponentId: true,
                 target: true,
-                withComponent: true,
             });
         }
         return WrappedStyledComponent;