@mui/material 6.0.0-alpha.7 → 6.0.0-alpha.8

package/node/AppBar/AppBar.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-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 _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _Paper = _interopRequireDefault(require("../Paper"));
 var _appBarClasses = require("./appBarClasses");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["className", "color", "enableColorOnDark", "position"];
 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 useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiAppBar');
@@ -47,158 +44,157 @@ const AppBarRoot = (0, _zeroStyled.styled)(_Paper.default, {
   }
 })(({
   theme
-}) => {
-  var _theme$vars;
-  return {
-    display: 'flex',
-    flexDirection: 'column',
-    width: '100%',
-    boxSizing: 'border-box',
-    // Prevent padding issue with the Modal and fixed positioned AppBar.
-    flexShrink: 0,
-    variants: [{
-      props: {
-        position: 'fixed'
-      },
-      style: {
-        position: 'fixed',
-        zIndex: (theme.vars || theme).zIndex.appBar,
-        top: 0,
-        left: 'auto',
-        right: 0,
-        '@media print': {
-          // Prevent the app bar to be visible on each printed page.
-          position: 'absolute'
-        }
-      }
-    }, {
-      props: {
+}) => ({
+  display: 'flex',
+  flexDirection: 'column',
+  width: '100%',
+  boxSizing: 'border-box',
+  // Prevent padding issue with the Modal and fixed positioned AppBar.
+  flexShrink: 0,
+  variants: [{
+    props: {
+      position: 'fixed'
+    },
+    style: {
+      position: 'fixed',
+      zIndex: (theme.vars || theme).zIndex.appBar,
+      top: 0,
+      left: 'auto',
+      right: 0,
+      '@media print': {
+        // Prevent the app bar to be visible on each printed page.
         position: 'absolute'
-      },
-      style: {
-        position: 'absolute',
-        zIndex: (theme.vars || theme).zIndex.appBar,
-        top: 0,
-        left: 'auto',
-        right: 0
-      }
-    }, {
-      props: {
-        position: 'sticky'
-      },
-      style: {
-        position: 'sticky',
-        zIndex: (theme.vars || theme).zIndex.appBar,
-        top: 0,
-        left: 'auto',
-        right: 0
-      }
-    }, {
-      props: {
-        position: 'static'
-      },
-      style: {
-        position: 'static'
-      }
-    }, {
-      props: {
-        position: 'relative'
-      },
-      style: {
-        position: 'relative'
       }
-    }, {
-      props: {
-        color: 'inherit'
-      },
-      style: {
-        '--AppBar-color': 'inherit'
-      }
-    }, {
-      props: {
-        color: 'default'
-      },
-      style: (0, _extends2.default)({
-        '--AppBar-background': theme.vars ? theme.vars.palette.AppBar.defaultBg : theme.palette.grey[100],
-        '--AppBar-color': theme.vars ? theme.vars.palette.text.primary : theme.palette.getContrastText(theme.palette.grey[100])
-      }, theme.applyStyles('dark', {
+    }
+  }, {
+    props: {
+      position: 'absolute'
+    },
+    style: {
+      position: 'absolute',
+      zIndex: (theme.vars || theme).zIndex.appBar,
+      top: 0,
+      left: 'auto',
+      right: 0
+    }
+  }, {
+    props: {
+      position: 'sticky'
+    },
+    style: {
+      position: 'sticky',
+      zIndex: (theme.vars || theme).zIndex.appBar,
+      top: 0,
+      left: 'auto',
+      right: 0
+    }
+  }, {
+    props: {
+      position: 'static'
+    },
+    style: {
+      position: 'static'
+    }
+  }, {
+    props: {
+      position: 'relative'
+    },
+    style: {
+      position: 'relative'
+    }
+  }, {
+    props: {
+      color: 'inherit'
+    },
+    style: {
+      '--AppBar-color': 'inherit'
+    }
+  }, {
+    props: {
+      color: 'default'
+    },
+    style: {
+      '--AppBar-background': theme.vars ? theme.vars.palette.AppBar.defaultBg : theme.palette.grey[100],
+      '--AppBar-color': theme.vars ? theme.vars.palette.text.primary : theme.palette.getContrastText(theme.palette.grey[100]),
+      ...theme.applyStyles('dark', {
         '--AppBar-background': theme.vars ? theme.vars.palette.AppBar.defaultBg : theme.palette.grey[900],
         '--AppBar-color': theme.vars ? theme.vars.palette.text.primary : theme.palette.getContrastText(theme.palette.grey[900])
-      }))
-    }, ...Object.keys(((_theme$vars = theme.vars) != null ? _theme$vars : theme).palette).filter(key => {
-      var _theme$vars2, _theme$vars3;
-      return ((_theme$vars2 = theme.vars) != null ? _theme$vars2 : theme).palette[key].main && ((_theme$vars3 = theme.vars) != null ? _theme$vars3 : theme).palette[key].contrastText;
-    }).map(color => {
-      var _theme$vars4, _theme$vars5;
-      return {
-        props: {
-          color
-        },
-        style: {
-          '--AppBar-background': ((_theme$vars4 = theme.vars) != null ? _theme$vars4 : theme).palette[color].main,
-          '--AppBar-color': ((_theme$vars5 = theme.vars) != null ? _theme$vars5 : theme).palette[color].contrastText
-        }
-      };
-    }), {
+      })
+    }
+  }, ...Object.entries(theme.palette).filter(([, palette]) => palette && palette.main && palette.contrastText).map(([color]) => {
+    var _theme$vars, _theme$vars2;
+    return {
       props: {
-        enableColorOnDark: true
+        color
       },
       style: {
-        backgroundColor: 'var(--AppBar-background)',
-        color: 'var(--AppBar-color)'
+        '--AppBar-background': ((_theme$vars = theme.vars) != null ? _theme$vars : theme).palette[color].main,
+        '--AppBar-color': ((_theme$vars2 = theme.vars) != null ? _theme$vars2 : theme).palette[color].contrastText
       }
-    }, {
-      props: {
-        enableColorOnDark: false
-      },
-      style: (0, _extends2.default)({
-        backgroundColor: 'var(--AppBar-background)',
-        color: 'var(--AppBar-color)'
-      }, theme.applyStyles('dark', {
+    };
+  }), {
+    props: {
+      enableColorOnDark: true
+    },
+    style: {
+      backgroundColor: 'var(--AppBar-background)',
+      color: 'var(--AppBar-color)'
+    }
+  }, {
+    props: {
+      enableColorOnDark: false
+    },
+    style: {
+      backgroundColor: 'var(--AppBar-background)',
+      color: 'var(--AppBar-color)',
+      ...theme.applyStyles('dark', {
         backgroundColor: theme.vars ? joinVars(theme.vars.palette.AppBar.darkBg, 'var(--AppBar-background)') : null,
         color: theme.vars ? joinVars(theme.vars.palette.AppBar.darkColor, 'var(--AppBar-color)') : null
-      }))
-    }, {
-      props: {
-        color: 'transparent'
-      },
-      style: (0, _extends2.default)({
-        '--AppBar-background': 'transparent',
-        '--AppBar-color': 'inherit',
-        backgroundColor: 'var(--AppBar-background)',
-        color: 'var(--AppBar-color)'
-      }, theme.applyStyles('dark', {
+      })
+    }
+  }, {
+    props: {
+      color: 'transparent'
+    },
+    style: {
+      '--AppBar-background': 'transparent',
+      '--AppBar-color': 'inherit',
+      backgroundColor: 'var(--AppBar-background)',
+      color: 'var(--AppBar-color)',
+      ...theme.applyStyles('dark', {
         backgroundImage: 'none'
-      }))
-    }]
-  };
-});
+      })
+    }
+  }]
+}));
 const AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {
   const props = useThemeProps({
     props: inProps,
     name: 'MuiAppBar'
   });
   const {
-      className,
-      color = 'primary',
-      enableColorOnDark = false,
-      position = 'fixed'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const ownerState = (0, _extends2.default)({}, props, {
+    className,
+    color = 'primary',
+    enableColorOnDark = false,
+    position = 'fixed',
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
     color,
     position,
     enableColorOnDark
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AppBarRoot, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AppBarRoot, {
     square: true,
     component: "header",
     ownerState: ownerState,
     elevation: 4,
     className: (0, _clsx.default)(classes.root, className, position === 'fixed' && 'mui-fixed'),
-    ref: ref
-  }, other));
+    ref: ref,
+    ...other
+  });
 });
 process.env.NODE_ENV !== "production" ? AppBar.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐