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

package/dist/styled-components.js

@@ -4,15 +4,11 @@
     (global = global || self, global.styled = factory(global.React));
 })(this, (function (React) { 'use strict';
 
-    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-    var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
     var SC_ATTR = (typeof process !== 'undefined' && (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR)) ||
         'data-styled';
     var SC_ATTR_ACTIVE = 'active';
     var SC_ATTR_VERSION = 'data-styled-version';
-    var SC_VERSION = "6.0.0-beta.8";
+    var SC_VERSION = "6.0.0-beta.9";
     var SPLITTER = '/*!sc*/\n';
     var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
     var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean'
@@ -699,9 +695,9 @@
         return stringifyRules;
     }
 
-    var StyleSheetContext = React__default["default"].createContext(undefined);
+    var StyleSheetContext = React.createContext(undefined);
     var StyleSheetConsumer = StyleSheetContext.Consumer;
-    var StylisContext = React__default["default"].createContext(undefined);
+    var StylisContext = React.createContext(undefined);
     var mainSheet = new StyleSheet();
     var mainStylis = createStylisInstance();
     function useStyleSheet() {
@@ -737,8 +733,8 @@
             if (!shallowequal(plugins, props.stylisPlugins))
                 setPlugins(props.stylisPlugins);
         }, [props.stylisPlugins]);
-        return (React__default["default"].createElement(StyleSheetContext.Provider, { value: styleSheet },
-            React__default["default"].createElement(StylisContext.Provider, { value: stylis }, React__default["default"].Children.only(props.children)
+        return (React.createElement(StyleSheetContext.Provider, { value: styleSheet },
+            React.createElement(StylisContext.Provider, { value: stylis }, React.Children.only(props.children)
                 )));
     }
 
@@ -997,7 +993,7 @@
         return GlobalStyle;
     }());
 
-    var ThemeContext = React__default["default"].createContext(undefined);
+    var ThemeContext = React.createContext(undefined);
     var ThemeConsumer = ThemeContext.Consumer;
     function mergeTheme(theme, outerTheme) {
         if (!theme) {
@@ -1025,7 +1021,7 @@
         if (!props.children) {
             return null;
         }
-        return React__default["default"].createElement(ThemeContext.Provider, { value: themeContext }, props.children);
+        return React.createElement(ThemeContext.Provider, { value: themeContext }, props.children);
     }
 
     var invalidHookCallRe = /invalid hook call/i;
@@ -1157,10 +1153,10 @@
         var GlobalStyleComponent = function (props) {
             var styleSheet = useStyleSheet();
             var stylis = useStylis();
-            var theme = React__default["default"].useContext(ThemeContext);
-            var instanceRef = React__default["default"].useRef(styleSheet.allocateGSInstance(styledComponentId));
+            var theme = React.useContext(ThemeContext);
+            var instanceRef = React.useRef(styleSheet.allocateGSInstance(styledComponentId));
             var instance = instanceRef.current;
-            if (React__default["default"].Children.count(props.children)) {
+            if (React.Children.count(props.children)) {
                 // eslint-disable-next-line no-console
                 console.warn("The global style component ".concat(styledComponentId, " was given child JSX. createGlobalStyle does not render children."));
             }
@@ -1174,7 +1170,7 @@
             {
                 // eslint-disable-next-line react-hooks/rules-of-hooks
                 // @ts-expect-error still using React 17 types for the time being
-                (React__default["default"].useInsertionEffect || React__default["default"].useLayoutEffect)(function () {
+                (React.useInsertionEffect || React.useLayoutEffect)(function () {
                     if (!styleSheet.server) {
                         renderStyles(instance, props, styleSheet, theme, stylis);
                         return function () { return globalStyle.removeStyles(instance, styleSheet); };
@@ -1192,7 +1188,7 @@
                 globalStyle.renderStyles(instance, context, styleSheet, stylis);
             }
         }
-        return React__default["default"].memo(GlobalStyleComponent);
+        return React.memo(GlobalStyleComponent);
     }
 
     function keyframes(strings) {
@@ -1317,14 +1313,14 @@
     }
 
     function withTheme(Component) {
-        var WithTheme = React__default["default"].forwardRef(function (props, ref) {
-            var theme = React__default["default"].useContext(ThemeContext);
+        var WithTheme = React.forwardRef(function (props, ref) {
+            var theme = React.useContext(ThemeContext);
             var themeProp = determineTheme(props, theme, Component.defaultProps);
             if (themeProp === undefined) {
                 // eslint-disable-next-line no-console
                 console.warn("[withTheme] You are not using a ThemeProvider nor passing a theme prop or a theme in defaultProps in component class \"".concat(getComponentName(Component), "\""));
             }
-            return React__default["default"].createElement(Component, __assign({}, props, { theme: themeProp, ref: ref }));
+            return React.createElement(Component, __assign({}, props, { theme: themeProp, ref: ref }));
         });
         WithTheme.displayName = "WithTheme(".concat(getComponentName(Component), ")");
         return hoistNonReactStatics(WithTheme, Component);
@@ -1369,7 +1365,7 @@
                     props.nonce = nonce;
                 }
                 // v4 returned an array for this fn, so we'll do the same for v5 for backward compat
-                return [React__default["default"].createElement("style", __assign({}, props, { key: "sc-0-0" }))];
+                return [React.createElement("style", __assign({}, props, { key: "sc-0-0" }))];
             };
             this.seal = function () {
                 _this.sealed = true;
@@ -1381,7 +1377,7 @@
             if (this.sealed) {
                 throw throwStyledComponentsError(2);
             }
-            return React__default["default"].createElement(StyleSheetManager, { sheet: this.instance }, children);
+            return React.createElement(StyleSheetManager, { sheet: this.instance }, children);
         };
         // eslint-disable-next-line consistent-return
         // @ts-expect-error alternate return types are not possible due to code transformation
@@ -1579,6 +1575,7 @@
         'track',
         'u',
         'ul',
+        'use',
         'var',
         'video',
         'wbr',
@@ -1871,7 +1868,7 @@
          * forwardRef creates a new interim component, which we'll take advantage of
          * instead of extending ParentComponent to create _another_ interim class
          */
-        var WrappedStyledComponent = React__default["default"].forwardRef(forwardRef);
+        var WrappedStyledComponent = React.forwardRef(forwardRef);
         WrappedStyledComponent.attrs = finalAttrs;
         WrappedStyledComponent.componentStyle = componentStyle;
         WrappedStyledComponent.displayName = displayName;