@mui/system 6.0.0-alpha.1 → 6.0.0-alpha.11

package/modern/cssVars/createCssVarsProvider.js

@@ -1,7 +1,4 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
-const _excluded = ["colorSchemes", "components", "cssVarPrefix"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { GlobalStyles } from '@mui/styled-engine';
@@ -65,13 +62,12 @@ export default function createCssVarsProvider(options) {
     const ctx = React.useContext(ColorSchemeContext);
     const nested = !!ctx && !disableNestedContext;
     const scopedTheme = themeProp[themeId];
-    const _ref = scopedTheme || themeProp,
-      {
-        colorSchemes = {},
-        components = {},
-        cssVarPrefix
-      } = _ref,
-      restThemeProp = _objectWithoutPropertiesLoose(_ref, _excluded);
+    const {
+      colorSchemes = {},
+      components = {},
+      cssVarPrefix,
+      ...restThemeProp
+    } = scopedTheme || themeProp;
     const allColorSchemes = Object.keys(colorSchemes);
     const defaultLightColorScheme = typeof defaultColorScheme === 'string' ? defaultColorScheme : defaultColorScheme.light;
     const defaultDarkColorScheme = typeof defaultColorScheme === 'string' ? defaultColorScheme : defaultColorScheme.dark;
@@ -126,12 +122,13 @@ export default function createCssVarsProvider(options) {
     const themeVars = restThemeProp.generateThemeVars?.() || restThemeProp.vars;
 
     // 3. Start composing the theme object
-    const theme = _extends({}, restThemeProp, {
+    const theme = {
+      ...restThemeProp,
       components,
       colorSchemes,
       cssVarPrefix,
       vars: themeVars
-    });
+    };
     if (typeof theme.generateSpacing === 'function') {
       theme.spacing = theme.generateSpacing();
     }
@@ -143,7 +140,10 @@ export default function createCssVarsProvider(options) {
         Object.keys(scheme).forEach(schemeKey => {
           if (scheme[schemeKey] && typeof scheme[schemeKey] === 'object') {
             // shallow merge the 1st level structure of the theme.
-            theme[schemeKey] = _extends({}, theme[schemeKey], scheme[schemeKey]);
+            theme[schemeKey] = {
+              ...theme[schemeKey],
+              ...scheme[schemeKey]
+            };
           } else {
             theme[schemeKey] = scheme[schemeKey];
           }
@@ -299,14 +299,15 @@ export default function createCssVarsProvider(options) {
   } : void 0;
   const defaultLightColorScheme = typeof designSystemColorScheme === 'string' ? designSystemColorScheme : designSystemColorScheme.light;
   const defaultDarkColorScheme = typeof designSystemColorScheme === 'string' ? designSystemColorScheme : designSystemColorScheme.dark;
-  const getInitColorSchemeScript = params => systemGetInitColorSchemeScript(_extends({
+  const getInitColorSchemeScript = params => systemGetInitColorSchemeScript({
     attribute: defaultAttribute,
     colorSchemeStorageKey: defaultColorSchemeStorageKey,
     defaultMode: designSystemMode,
     defaultLightColorScheme,
     defaultDarkColorScheme,
-    modeStorageKey: defaultModeStorageKey
-  }, params));
+    modeStorageKey: defaultModeStorageKey,
+    ...params
+  });
   return {
     CssVarsProvider,
     useColorScheme,

package/modern/cssVars/createCssVarsTheme.js

@@ -1,10 +1,10 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import prepareCssVars from './prepareCssVars';
 function createCssVarsTheme(theme) {
   const output = theme;
-  const result = prepareCssVars(output, _extends({}, theme, {
+  const result = prepareCssVars(output, {
+    ...theme,
     prefix: theme.cssVarPrefix
-  }));
+  });
   output.vars = result.vars;
   output.generateThemeVars = result.generateThemeVars;
   output.generateStyleSheets = result.generateStyleSheets;

package/modern/cssVars/index.js

@@ -3,4 +3,5 @@
 export { default } from './createCssVarsProvider';
 export { default as getInitColorSchemeScript } from './getInitColorSchemeScript';
 export { default as prepareCssVars } from './prepareCssVars';
+export { default as prepareTypographyVars } from './prepareTypographyVars';
 export { default as createCssVarsTheme } from './createCssVarsTheme';

package/modern/cssVars/prepareCssVars.js

@@ -1,21 +1,16 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _toPropertyKey from "@babel/runtime/helpers/esm/toPropertyKey";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["getSelector"],
-  _excluded2 = ["colorSchemes", "components", "defaultColorScheme"];
 import deepmerge from '@mui/utils/deepmerge';
 import cssVarsParser from './cssVarsParser';
-function prepareCssVars(theme, _ref = {}) {
-  let {
-      getSelector
-    } = _ref,
-    parserConfig = _objectWithoutPropertiesLoose(_ref, _excluded);
+function prepareCssVars(theme, {
+  getSelector,
+  ...parserConfig
+} = {}) {
   // @ts-ignore - ignore components do not exist
   const {
-      colorSchemes = {},
-      defaultColorScheme = 'light'
-    } = theme,
-    otherTheme = _objectWithoutPropertiesLoose(theme, _excluded2);
+    colorSchemes = {},
+    components,
+    defaultColorScheme = 'light',
+    ...otherTheme
+  } = theme;
   const {
     vars: rootVars,
     css: rootCss,
@@ -24,9 +19,9 @@ function prepareCssVars(theme, _ref = {}) {
   let themeVars = rootVarsWithDefaults;
   const colorSchemesMap = {};
   const {
-      [defaultColorScheme]: defaultScheme
-    } = colorSchemes,
-    otherColorSchemes = _objectWithoutPropertiesLoose(colorSchemes, [defaultColorScheme].map(_toPropertyKey));
+    [defaultColorScheme]: defaultScheme,
+    ...otherColorSchemes
+  } = colorSchemes;
   Object.entries(otherColorSchemes || {}).forEach(([key, scheme]) => {
     const {
       vars,
@@ -53,7 +48,9 @@ function prepareCssVars(theme, _ref = {}) {
     };
   }
   const generateThemeVars = () => {
-    let vars = _extends({}, rootVars);
+    let vars = {
+      ...rootVars
+    };
     Object.entries(colorSchemesMap).forEach(([, {
       vars: schemeVars
     }]) => {
@@ -67,26 +64,34 @@ function prepareCssVars(theme, _ref = {}) {
     function insertStyleSheet(selector, css) {
       if (Object.keys(css).length) {
         stylesheets.push(typeof selector === 'string' ? {
-          [selector]: _extends({}, css)
+          [selector]: {
+            ...css
+          }
         } : selector);
       }
     }
-    insertStyleSheet(getSelector?.(undefined, _extends({}, rootCss)) || ':root', rootCss);
+    insertStyleSheet(getSelector?.(undefined, {
+      ...rootCss
+    }) || ':root', rootCss);
     const {
-        [colorScheme]: defaultSchemeVal
-      } = colorSchemesMap,
-      rest = _objectWithoutPropertiesLoose(colorSchemesMap, [colorScheme].map(_toPropertyKey));
+      [colorScheme]: defaultSchemeVal,
+      ...rest
+    } = colorSchemesMap;
     if (defaultSchemeVal) {
       // default color scheme has to come before other color schemes
       const {
         css
       } = defaultSchemeVal;
-      insertStyleSheet(getSelector?.(colorScheme, _extends({}, css)) || `[${theme.attribute || 'data-color-scheme'}="${colorScheme}"]`, css);
+      insertStyleSheet(getSelector?.(colorScheme, {
+        ...css
+      }) || `[${theme.attribute || 'data-color-scheme'}="${colorScheme}"]`, css);
     }
     Object.entries(rest).forEach(([key, {
       css
     }]) => {
-      insertStyleSheet(getSelector?.(key, _extends({}, css)) || `[${theme.attribute || 'data-color-scheme'}="${key}"]`, css);
+      insertStyleSheet(getSelector?.(key, {
+        ...css
+      }) || `[${theme.attribute || 'data-color-scheme'}="${key}"]`, css);
     });
     return stylesheets;
   };

package/modern/cssVars/prepareTypographyVars.js

@@ -0,0 +1,11 @@
+export default function prepareTypographyVars(typography) {
+  const vars = {};
+  const entries = Object.entries(typography);
+  entries.forEach(entry => {
+    const [key, value] = entry;
+    if (typeof value === 'object') {
+      vars[key] = `${value.fontStyle ? `${value.fontStyle} ` : ''}${value.fontVariant ? `${value.fontVariant} ` : ''}${value.fontWeight ? `${value.fontWeight} ` : ''}${value.fontStretch ? `${value.fontStretch} ` : ''}${value.fontSize || ''}${value.lineHeight ? `/${value.lineHeight} ` : ''}${value.fontFamily || ''}`;
+    }
+  });
+  return vars;
+}

package/modern/cssVars/useCurrentColorScheme.js

@@ -1,6 +1,5 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { DEFAULT_MODE_STORAGE_KEY, DEFAULT_COLOR_SCHEME_STORAGE_KEY } from './getInitColorSchemeScript';
 export function getSystemMode(mode) {
@@ -84,10 +83,11 @@ export default function useCurrentColorScheme(options) {
       } catch (e) {
         // Unsupported
       }
-      return _extends({}, currentState, {
+      return {
+        ...currentState,
         mode: newMode,
         systemMode: getSystemMode(newMode)
-      });
+      };
     });
   }, [modeStorageKey, defaultMode]);
   const setColorScheme = React.useCallback(value => {
@@ -99,17 +99,20 @@ export default function useCurrentColorScheme(options) {
         } catch (e) {
           // Unsupported
         }
-        return _extends({}, currentState, {
+        return {
+          ...currentState,
           lightColorScheme: defaultLightColorScheme,
           darkColorScheme: defaultDarkColorScheme
-        });
+        };
       });
     } else if (typeof value === 'string') {
       if (value && !joinedColorSchemes.includes(value)) {
         console.error(`\`${value}\` does not exist in \`theme.colorSchemes\`.`);
       } else {
         setState(currentState => {
-          const newState = _extends({}, currentState);
+          const newState = {
+            ...currentState
+          };
           processState(currentState, mode => {
             try {
               localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
@@ -128,7 +131,9 @@ export default function useCurrentColorScheme(options) {
       }
     } else {
       setState(currentState => {
-        const newState = _extends({}, currentState);
+        const newState = {
+          ...currentState
+        };
         const newLightColorScheme = value.light === null ? defaultLightColorScheme : value.light;
         const newDarkColorScheme = value.dark === null ? defaultDarkColorScheme : value.dark;
         if (newLightColorScheme) {
@@ -168,9 +173,10 @@ export default function useCurrentColorScheme(options) {
         if (currentState.systemMode === systemMode) {
           return currentState;
         }
-        return _extends({}, currentState, {
+        return {
+          ...currentState,
           systemMode
-        });
+        };
       });
     }
   }, [state.mode]);
@@ -222,9 +228,10 @@ export default function useCurrentColorScheme(options) {
     }
     return undefined;
   }, [setColorScheme, setMode, modeStorageKey, colorSchemeStorageKey, joinedColorSchemes, defaultMode, storageWindow]);
-  return _extends({}, state, {
+  return {
+    ...state,
     colorScheme,
     setMode,
     setColorScheme
-  });
+  };
 }

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/system v6.0.0-alpha.1
+ * @mui/system v6.0.0-alpha.11
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -11,6 +11,7 @@ export { default as GlobalStyles } from './GlobalStyles';
 export { default as borders } from './borders';
 export * from './borders';
 export { default as breakpoints } from './breakpoints';
+export { default as cssContainerQueries } from './cssContainerQueries';
 export { handleBreakpoints, mergeBreakpointsInOrder, resolveBreakpointValues as unstable_resolveBreakpointValues } from './breakpoints';
 export { default as compose } from './compose';
 export { default as display } from './display';

package/modern/propsToClassKey/propsToClassKey.js

@@ -1,5 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["variant"];
 import capitalize from '@mui/utils/capitalize';
 function isEmpty(string) {
   return string.length === 0;
@@ -12,9 +10,9 @@ function isEmpty(string) {
  */
 export default function propsToClassKey(props) {
   const {
-      variant
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    variant,
+    ...other
+  } = props;
   let classKey = variant || '';
   Object.keys(other).sort().forEach(key => {
     if (key === 'color') {

package/modern/styleFunctionSx/defaultSxConfig.js

@@ -267,6 +267,9 @@ const defaultSxConfig = {
   },
   boxSizing: {},
   // typography
+  font: {
+    themeKey: 'font'
+  },
   fontFamily: {
     themeKey: 'typography'
   },

package/modern/styleFunctionSx/extendSxProp.js

@@ -1,6 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["sx"];
 import { isPlainObject } from '@mui/utils/deepmerge';
 import defaultSxConfig from './defaultSxConfig';
 const splitProps = props => {
@@ -20,9 +17,9 @@ const splitProps = props => {
 };
 export default function extendSxProp(props) {
   const {
-      sx: inSx
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    sx: inSx,
+    ...other
+  } = props;
   const {
     systemProps,
     otherProps
@@ -36,12 +33,19 @@ export default function extendSxProp(props) {
       if (!isPlainObject(result)) {
         return systemProps;
       }
-      return _extends({}, systemProps, result);
+      return {
+        ...systemProps,
+        ...result
+      };
     };
   } else {
-    finalSx = _extends({}, systemProps, inSx);
+    finalSx = {
+      ...systemProps,
+      ...inSx
+    };
   }
-  return _extends({}, otherProps, {
+  return {
+    ...otherProps,
     sx: finalSx
-  });
+  };
 }

package/modern/styleFunctionSx/styleFunctionSx.js

@@ -2,6 +2,7 @@ import capitalize from '@mui/utils/capitalize';
 import merge from '../merge';
 import { getPath, getStyleValue as getValue } from '../style';
 import { handleBreakpoints, createEmptyBreakpointObject, removeUnusedBreakpoints } from '../breakpoints';
+import { sortContainerQueries } from '../cssContainerQueries';
 import defaultSxConfig from './defaultSxConfig';
 function objectsHaveSameKeys(...objects) {
   const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);
@@ -115,7 +116,7 @@ export function unstable_createStyleFunctionSx() {
           }
         }
       });
-      return removeUnusedBreakpoints(breakpointsKeys, css);
+      return sortContainerQueries(theme, removeUnusedBreakpoints(breakpointsKeys, css));
     }
     return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);
   }

package/modern/useMediaQuery/useMediaQuery.js

@@ -31,25 +31,17 @@ function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSs
     return defaultMatches;
   });
   useEnhancedEffect(() => {
-    let active = true;
     if (!matchMedia) {
       return undefined;
     }
     const queryList = matchMedia(query);
     const updateMatch = () => {
-      // Workaround Safari wrong implementation of matchMedia
-      // TODO can we remove it?
-      // https://github.com/mui/material-ui/pull/17315#issuecomment-528286677
-      if (active) {
-        setMatch(queryList.matches);
-      }
+      setMatch(queryList.matches);
     };
     updateMatch();
-    // TODO: Use `addEventListener` once support for Safari < 14 is dropped
-    queryList.addListener(updateMatch);
+    queryList.addEventListener('change', updateMatch);
     return () => {
-      active = false;
-      queryList.removeListener(updateMatch);
+      queryList.removeEventListener('change', updateMatch);
     };
   }, [query, matchMedia]);
   return match;
@@ -77,10 +69,9 @@ function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia, noSs
     }
     const mediaQueryList = matchMedia(query);
     return [() => mediaQueryList.matches, notify => {
-      // TODO: Use `addEventListener` once support for Safari < 14 is dropped
-      mediaQueryList.addListener(notify);
+      mediaQueryList.addEventListener('change', notify);
       return () => {
-        mediaQueryList.removeListener(notify);
+        mediaQueryList.removeEventListener('change', notify);
       };
     }];
   }, [getDefaultSnapshot, matchMedia, query]);

package/node/Container/createContainer.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = createContainer;
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -17,7 +15,6 @@ var _useThemeProps = _interopRequireDefault(require("../useThemeProps"));
 var _styled = _interopRequireDefault(require("../styled"));
 var _createTheme = _interopRequireDefault(require("../createTheme"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["className", "component", "disableGutters", "fixed", "maxWidth", "classes"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const defaultTheme = (0, _createTheme.default)();
@@ -61,20 +58,20 @@ function createContainer(options = {}) {
   const ContainerRoot = createStyledComponent(({
     theme,
     ownerState
-  }) => (0, _extends2.default)({
+  }) => ({
     width: '100%',
     marginLeft: 'auto',
     boxSizing: 'border-box',
     marginRight: 'auto',
-    display: 'block'
-  }, !ownerState.disableGutters && {
-    paddingLeft: theme.spacing(2),
-    paddingRight: theme.spacing(2),
-    // @ts-ignore module augmentation fails if custom breakpoints are used
-    [theme.breakpoints.up('sm')]: {
-      paddingLeft: theme.spacing(3),
-      paddingRight: theme.spacing(3)
-    }
+    ...(!ownerState.disableGutters && {
+      paddingLeft: theme.spacing(2),
+      paddingRight: theme.spacing(2),
+      // @ts-ignore module augmentation fails if custom breakpoints are used
+      [theme.breakpoints.up('sm')]: {
+        paddingLeft: theme.spacing(3),
+        paddingRight: theme.spacing(3)
+      }
+    })
   }), ({
     theme,
     ownerState
@@ -91,51 +88,58 @@ function createContainer(options = {}) {
   }, {}), ({
     theme,
     ownerState
-  }) => (0, _extends2.default)({}, ownerState.maxWidth === 'xs' && {
+  }) => ({
     // @ts-ignore module augmentation fails if custom breakpoints are used
-    [theme.breakpoints.up('xs')]: {
+    ...(ownerState.maxWidth === 'xs' && {
       // @ts-ignore module augmentation fails if custom breakpoints are used
-      maxWidth: Math.max(theme.breakpoints.values.xs, 444)
-    }
-  }, ownerState.maxWidth &&
-  // @ts-ignore module augmentation fails if custom breakpoints are used
-  ownerState.maxWidth !== 'xs' && {
+      [theme.breakpoints.up('xs')]: {
+        // @ts-ignore module augmentation fails if custom breakpoints are used
+        maxWidth: Math.max(theme.breakpoints.values.xs, 444)
+      }
+    }),
+    ...(ownerState.maxWidth &&
     // @ts-ignore module augmentation fails if custom breakpoints are used
-    [theme.breakpoints.up(ownerState.maxWidth)]: {
+    ownerState.maxWidth !== 'xs' && {
       // @ts-ignore module augmentation fails if custom breakpoints are used
-      maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`
-    }
+      [theme.breakpoints.up(ownerState.maxWidth)]: {
+        // @ts-ignore module augmentation fails if custom breakpoints are used
+        maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`
+      }
+    })
   }));
   const Container = /*#__PURE__*/React.forwardRef(function Container(inProps, ref) {
     const props = useThemeProps(inProps);
     const {
-        className,
-        component = 'div',
-        disableGutters = false,
-        fixed = false,
-        maxWidth = 'lg'
-      } = props,
-      other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-    const ownerState = (0, _extends2.default)({}, props, {
+      className,
+      component = 'div',
+      disableGutters = false,
+      fixed = false,
+      maxWidth = 'lg',
+      classes: classesProp,
+      ...other
+    } = props;
+    const ownerState = {
+      ...props,
       component,
       disableGutters,
       fixed,
       maxWidth
-    });
+    };
 
     // @ts-ignore module augmentation fails if custom breakpoints are used
     const classes = useUtilityClasses(ownerState, componentName);
     return (
       /*#__PURE__*/
       // @ts-ignore theme is injected by the styled util
-      (0, _jsxRuntime.jsx)(ContainerRoot, (0, _extends2.default)({
+      (0, _jsxRuntime.jsx)(ContainerRoot, {
         as: component
         // @ts-ignore module augmentation fails if custom breakpoints are used
         ,
         ownerState: ownerState,
         className: (0, _clsx.default)(classes.root, className),
-        ref: ref
-      }, other))
+        ref: ref,
+        ...other
+      })
     );
   });
   process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {

package/node/RtlProvider/index.js

@@ -5,23 +5,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useRtl = exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["value"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const RtlContext = /*#__PURE__*/React.createContext();
-function RtlProvider(_ref) {
-  let {
-      value
-    } = _ref,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(RtlContext.Provider, (0, _extends2.default)({
-    value: value != null ? value : true
-  }, props));
+function RtlProvider({
+  value,
+  ...props
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(RtlContext.Provider, {
+    value: value != null ? value : true,
+    ...props
+  });
 }
 process.env.NODE_ENV !== "production" ? RtlProvider.propTypes = {
   children: _propTypes.default.node,