@mui/system 5.11.13 → 5.11.14

package/CHANGELOG.md

@@ -1,5 +1,73 @@
 # [Versions](https://mui.com/versions/)
 
+## 5.11.14
+
+<!-- generated comparing v5.11.13..master -->
+
+_Mar 21, 2023_
+
+A big thanks to the 15 contributors who made this release possible.
+This release was mostly about 🐛 bug fixes and 📚 documentation improvements.
+
+### `@mui/material@5.11.14`
+
+- [Breadcrumbs] Add ability to change icon used in `BreadcrumbCollapsed` through slots (#33812) @pratikkarad
+- [Stepper] Add aria-current to active StepButton (#36526) @michalak111
+- [TabScrollButton] Add ability to change left and right icons (#33863) @pratikkarad
+- [ListItemButton] Respect LinkComponent (#34159) @zaverden
+- [l10n] Add Central Kurdish (ku-CKB) locale (#36592) @HediMuhamad
+
+### `@mui/system@5.11.14`
+
+- [system] Fix sx prop regression for fontWeight values (#36543) @mnajdova
+
+### `@mui/base@5.0.0-alpha.121`
+
+- [docs][base] Improve the Slots Table in API docs (#36330) @hbjORbj
+
+### `@mui/joy@5.0.0-alpha.72`
+
+- [Joy] Ensure new CSS variable naming is everywhere (#36460) @hbjORbj
+- [Menu][joy] Classname listbox is missing (#36520) @hbjORbj
+- [Joy] Fix `--List-decorator*` vars (#36595) @siriwatknp
+
+### `@mui/lab@5.0.0-alpha.124`
+
+- [Masonry] Include Masonry in theme augmentation interface (#36533) @hbjORbj
+
+### Docs
+
+- [blog] Post blog about Chamonix retreat to the website (#36517) @mikailaread
+- [blog] Fix image layout shift (#36522) @oliviertassinari
+- [docs] Use `theme.applyDarkStyles` for the rest of the docs (#36161) @siriwatknp
+- [docs] Fix 301 and 404 links (#36555) @oliviertassinari
+- [docs] Keep slot code order in API docs (#36499) @oliviertassinari
+- [docs] Missing className on Migrating from JSS example (#36536) @gabrielnafuzi
+- [docs] Fix function name for Joy templates (#36512) @hbjORbj
+- [docs] Add multiline Chip example (#36437) @dav1app
+- [docs] Add a new gold sponsor (#36518) @hbjORbj
+- [docs][joy] Improve the Slots Table in API docs (#36328) @hbjORbj
+- [docs] Fix virtualElement demo for Popper (#36320) @sai6855
+- [docs] Fix typo in API docs (#36388) @RomanHotsiy
+- [docs] Ensure classname displayed under Slots section in API docs exists (#36539) @hbjORbj
+- [docs][joy] Build TS versions for Modal component demos (#36385) @varunmulay22
+- [docs][joy] Build TS versions for Menu component demos (#36383) @varunmulay22
+- [docs][joy] Build TS versions for Switch component demos (#36379) @varunmulay22
+- [docs] Remove `shouldSkipGeneratingVar` usage (#36581) @siriwatknp
+- [docs][material] Update Table's demo to show pointer cursor on clickable rows (#36546) @varunmulay22
+- [website] Designer role changes (#36528) @danilo-leal
+- [website] No association between showcase and MUI @oliviertassinari
+- [website] Open Head of Operations role (#36501) @oliviertassinari
+- [website] Limit sponsors description to two rows @oliviertassinari
+
+### Core
+
+- [core] Fix CI @oliviertassinari
+- [core] Fix blank line @oliviertassinari
+- [website] Simplify internal ops @oliviertassinari
+
+All contributors of this release in alphabetical order: @danilo-leal, @dav1app, @gabrielnafuzi, @hbjORbj, @HediMuhamad, @michalak111, @mikailaread, @mnajdova, @oliviertassinari, @pratikkarad, @RomanHotsiy, @sai6855, @siriwatknp, @varunmulay22, @zaverden
+
 ## 5.11.13
 
 <!-- generated comparing v5.11.12..master -->
@@ -9076,7 +9144,7 @@ _Nov 4, 2020_
 A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨:
 
 - ⚛️ Add support for React 17 (#23311) @eps1lon.
-  React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`.
+  React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://legacy.reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`.
 - 🛠 Introduce a new `@material-ui/unstyled` package (#23270) @mnajdova.
   This package will host the unstyled version of the components. In this first iteration, only the Slider is available. You can find it documented under the [same page](https://mui.com/components/slider-styled/#unstyled-slider) as the styled version.
 
@@ -10085,7 +10153,7 @@ Here are some highlights ✨:
 #### Breaking changes
 
 - [Modal] Remove `onRendered` prop from Modal and Portal (#22464) @eps1lon
-  Depending on your use case either use a [callback ref](https://reactjs.org/docs/refs-and-the-dom.html#callback-refs) on the child element or an effect hook in the child component.
+  Depending on your use case either use a [callback ref](https://legacy.reactjs.org/docs/refs-and-the-dom.html#callback-refs) on the child element or an effect hook in the child component.
 
 #### Changes
 
@@ -10548,7 +10616,7 @@ Here are some highlights ✨:
 
 - [RootRef] Remove component (#21974) @eps1lon
   This component was removed. You can get a reference to the underlying DOM node of our components via `ref` prop.
-  The component relied on [`ReactDOM.findDOMNode`](https://reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage).
+  The component relied on [`ReactDOM.findDOMNode`](https://legacy.reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://legacy.reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage).
 
   ```diff
   -<RootRef rootRef={ref}>

package/esm/styleFunctionSx/defaultSxConfig.js

@@ -9,14 +9,22 @@ const createFontStyleFunction = prop => {
   return props => {
     if (props[prop] !== undefined && props[prop] !== null) {
       const styleFromPropValue = propValue => {
-        var _props$theme$typograp, _props$prop;
-        let value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : capitalize((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString())}`];
+        var _props$theme$typograp;
+        // fetch the value directly defined in the theme, like fontWeightLight
+        let value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp[propValue];
+        if (typeof value === 'object') {
+          // typography variant was pulled, but these props can't be an object
+          value = null;
+        }
         if (!value) {
-          var _props$theme$typograp2, _props$theme$typograp3;
-          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : (_props$theme$typograp3 = _props$theme$typograp2[propValue]) == null ? void 0 : _props$theme$typograp3[prop];
+          var _props$theme$typograp2, _props$prop;
+          // fetch fontWeightLight when the value is 'light'
+          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : _props$theme$typograp2[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : capitalize((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString())}`];
         }
         if (!value) {
-          value = propValue;
+          var _props$theme$typograp3, _props$theme$typograp4, _props$theme$typograp5;
+          // fetch the value from the typography variant or default to the propValue
+          value = (_props$theme$typograp3 = (_props$theme$typograp4 = props.theme.typography) == null ? void 0 : (_props$theme$typograp5 = _props$theme$typograp4[propValue]) == null ? void 0 : _props$theme$typograp5[prop]) != null ? _props$theme$typograp3 : propValue;
         }
         return {
           [prop]: value

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/system v5.11.13
+ * @mui/system v5.11.14
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/system v5.11.13
+ * @mui/system v5.11.14
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/styleFunctionSx/defaultSxConfig.js

@@ -1,4 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { padding, margin } from '../spacing';
 import { handleBreakpoints } from '../breakpoints';
@@ -10,14 +11,22 @@ var createFontStyleFunction = function createFontStyleFunction(prop) {
   return function (props) {
     if (props[prop] !== undefined && props[prop] !== null) {
       var styleFromPropValue = function styleFromPropValue(propValue) {
-        var _props$theme$typograp, _props$prop;
-        var value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp["".concat(prop).concat(props[prop] === 'default' || props[prop] === prop ? '' : capitalize((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString()))];
+        var _props$theme$typograp;
+        // fetch the value directly defined in the theme, like fontWeightLight
+        var value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp[propValue];
+        if (_typeof(value) === 'object') {
+          // typography variant was pulled, but these props can't be an object
+          value = null;
+        }
         if (!value) {
-          var _props$theme$typograp2, _props$theme$typograp3;
-          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : (_props$theme$typograp3 = _props$theme$typograp2[propValue]) == null ? void 0 : _props$theme$typograp3[prop];
+          var _props$theme$typograp2, _props$prop;
+          // fetch fontWeightLight when the value is 'light'
+          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : _props$theme$typograp2["".concat(prop).concat(props[prop] === 'default' || props[prop] === prop ? '' : capitalize((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString()))];
         }
         if (!value) {
-          value = propValue;
+          var _props$theme$typograp3, _props$theme$typograp4, _props$theme$typograp5;
+          // fetch the value from the typography variant or default to the propValue
+          value = (_props$theme$typograp3 = (_props$theme$typograp4 = props.theme.typography) == null ? void 0 : (_props$theme$typograp5 = _props$theme$typograp4[propValue]) == null ? void 0 : _props$theme$typograp5[prop]) != null ? _props$theme$typograp3 : propValue;
         }
         return _defineProperty({}, prop, value);
       };

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/system v5.11.13
+ * @mui/system v5.11.14
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/styleFunctionSx/defaultSxConfig.js

@@ -9,12 +9,19 @@ const createFontStyleFunction = prop => {
   return props => {
     if (props[prop] !== undefined && props[prop] !== null) {
       const styleFromPropValue = propValue => {
-        let value = props.theme.typography?.[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : capitalize(props[prop]?.toString())}`];
+        // fetch the value directly defined in the theme, like fontWeightLight
+        let value = props.theme.typography?.[propValue];
+        if (typeof value === 'object') {
+          // typography variant was pulled, but these props can't be an object
+          value = null;
+        }
         if (!value) {
-          value = props.theme.typography?.[propValue]?.[prop];
+          // fetch fontWeightLight when the value is 'light'
+          value = props.theme.typography?.[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : capitalize(props[prop]?.toString())}`];
         }
         if (!value) {
-          value = propValue;
+          // fetch the value from the typography variant or default to the propValue
+          value = props.theme.typography?.[propValue]?.[prop] ?? propValue;
         }
         return {
           [prop]: value

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/system",
-  "version": "5.11.13",
+  "version": "5.11.14",
   "private": false,
   "author": "MUI Team",
   "description": "CSS utilities for rapidly laying out custom designs.",

package/styleFunctionSx/defaultSxConfig.js

@@ -15,14 +15,22 @@ const createFontStyleFunction = prop => {
   return props => {
     if (props[prop] !== undefined && props[prop] !== null) {
       const styleFromPropValue = propValue => {
-        var _props$theme$typograp, _props$prop;
-        let value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : (0, _utils.unstable_capitalize)((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString())}`];
+        var _props$theme$typograp;
+        // fetch the value directly defined in the theme, like fontWeightLight
+        let value = (_props$theme$typograp = props.theme.typography) == null ? void 0 : _props$theme$typograp[propValue];
+        if (typeof value === 'object') {
+          // typography variant was pulled, but these props can't be an object
+          value = null;
+        }
         if (!value) {
-          var _props$theme$typograp2, _props$theme$typograp3;
-          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : (_props$theme$typograp3 = _props$theme$typograp2[propValue]) == null ? void 0 : _props$theme$typograp3[prop];
+          var _props$theme$typograp2, _props$prop;
+          // fetch fontWeightLight when the value is 'light'
+          value = (_props$theme$typograp2 = props.theme.typography) == null ? void 0 : _props$theme$typograp2[`${prop}${props[prop] === 'default' || props[prop] === prop ? '' : (0, _utils.unstable_capitalize)((_props$prop = props[prop]) == null ? void 0 : _props$prop.toString())}`];
         }
         if (!value) {
-          value = propValue;
+          var _props$theme$typograp3, _props$theme$typograp4, _props$theme$typograp5;
+          // fetch the value from the typography variant or default to the propValue
+          value = (_props$theme$typograp3 = (_props$theme$typograp4 = props.theme.typography) == null ? void 0 : (_props$theme$typograp5 = _props$theme$typograp4[propValue]) == null ? void 0 : _props$theme$typograp5[prop]) != null ? _props$theme$typograp3 : propValue;
         }
         return {
           [prop]: value