@mui/system 9.1.1 → 9.2.0

package/Box/Box.d.mts

@@ -1,24 +1,21 @@
 import * as React from 'react';
-import { OverridableComponent, OverrideProps } from '@mui/types';
-import { Theme as SystemTheme } from "../createTheme/index.mjs";
-import { SxProps, AllSystemCSSProperties, ResponsiveStyleValue, OverwriteCSSProperties, AliasesCSSProperties } from "../styleFunctionSx/index.mjs";
-import { PropsFor } from "../style/index.mjs";
-import { ComposedStyleFunction } from "../compose/index.mjs";
-import borders from "../borders/index.mjs";
-import display from "../display/index.mjs";
-import flexbox from "../flexbox/index.mjs";
-import grid from "../cssGrid/index.mjs";
-import palette from "../palette/index.mjs";
-import positions from "../positions/index.mjs";
-import shadows from "../shadows/index.mjs";
-import sizing from "../sizing/index.mjs";
-import spacing from "../spacing/index.mjs";
-import typography from "../typography/index.mjs";
+import type { OverridableComponent, OverrideProps } from '@mui/types';
+import type { SxProps, AllSystemCSSProperties, ResponsiveStyleValue, OverwriteCSSProperties, AliasesCSSProperties } from "../styleFunctionSx/index.mjs";
+import type { PropsFor } from "../style/index.mjs";
+import type { ComposedStyleFunction } from "../compose/index.mjs";
+import type { Theme as SystemTheme } from "../createTheme/index.mjs";
+import type borders from "../borders/index.mjs";
+import type display from "../display/index.mjs";
+import type flexbox from "../flexbox/index.mjs";
+import type grid from "../cssGrid/index.mjs";
+import type palette from "../palette/index.mjs";
+import type positions from "../positions/index.mjs";
+import type shadows from "../shadows/index.mjs";
+import type sizing from "../sizing/index.mjs";
+import type spacing from "../spacing/index.mjs";
+import type typography from "../typography/index.mjs";
 export interface CustomSystemProps extends AliasesCSSProperties, OverwriteCSSProperties {}
 export type SimpleSystemKeys = keyof PropsFor<ComposedStyleFunction<[typeof borders, typeof display, typeof flexbox, typeof grid, typeof palette, typeof positions, typeof shadows, typeof sizing, typeof spacing, typeof typography]>>;
-
-// The SimpleSystemKeys are subset of the AllSystemCSSProperties, so this should be ok
-// This is needed as these are used as keys inside AllSystemCSSProperties
 type StandardSystemKeys = Extract<SimpleSystemKeys, keyof AllSystemCSSProperties>;
 export type SystemProps<Theme extends object = {}> = { [K in StandardSystemKeys]?: ResponsiveStyleValue<AllSystemCSSProperties[K]> | ((theme: Theme) => ResponsiveStyleValue<AllSystemCSSProperties[K]>) };
 export interface BoxOwnProps<Theme extends object = SystemTheme> {
@@ -33,7 +30,6 @@ export interface BoxTypeMap<AdditionalProps = {}, RootComponent extends React.El
   props: AdditionalProps & BoxOwnProps<Theme>;
   defaultComponent: RootComponent;
 }
-
 /**
  *
  * Demos:

package/Box/Box.d.ts

@@ -1,24 +1,21 @@
 import * as React from 'react';
-import { OverridableComponent, OverrideProps } from '@mui/types';
-import { Theme as SystemTheme } from "../createTheme/index.js";
-import { SxProps, AllSystemCSSProperties, ResponsiveStyleValue, OverwriteCSSProperties, AliasesCSSProperties } from "../styleFunctionSx/index.js";
-import { PropsFor } from "../style/index.js";
-import { ComposedStyleFunction } from "../compose/index.js";
-import borders from "../borders/index.js";
-import display from "../display/index.js";
-import flexbox from "../flexbox/index.js";
-import grid from "../cssGrid/index.js";
-import palette from "../palette/index.js";
-import positions from "../positions/index.js";
-import shadows from "../shadows/index.js";
-import sizing from "../sizing/index.js";
-import spacing from "../spacing/index.js";
-import typography from "../typography/index.js";
+import type { OverridableComponent, OverrideProps } from '@mui/types';
+import type { SxProps, AllSystemCSSProperties, ResponsiveStyleValue, OverwriteCSSProperties, AliasesCSSProperties } from "../styleFunctionSx/index.js";
+import type { PropsFor } from "../style/index.js";
+import type { ComposedStyleFunction } from "../compose/index.js";
+import type { Theme as SystemTheme } from "../createTheme/index.js";
+import type borders from "../borders/index.js";
+import type display from "../display/index.js";
+import type flexbox from "../flexbox/index.js";
+import type grid from "../cssGrid/index.js";
+import type palette from "../palette/index.js";
+import type positions from "../positions/index.js";
+import type shadows from "../shadows/index.js";
+import type sizing from "../sizing/index.js";
+import type spacing from "../spacing/index.js";
+import type typography from "../typography/index.js";
 export interface CustomSystemProps extends AliasesCSSProperties, OverwriteCSSProperties {}
 export type SimpleSystemKeys = keyof PropsFor<ComposedStyleFunction<[typeof borders, typeof display, typeof flexbox, typeof grid, typeof palette, typeof positions, typeof shadows, typeof sizing, typeof spacing, typeof typography]>>;
-
-// The SimpleSystemKeys are subset of the AllSystemCSSProperties, so this should be ok
-// This is needed as these are used as keys inside AllSystemCSSProperties
 type StandardSystemKeys = Extract<SimpleSystemKeys, keyof AllSystemCSSProperties>;
 export type SystemProps<Theme extends object = {}> = { [K in StandardSystemKeys]?: ResponsiveStyleValue<AllSystemCSSProperties[K]> | ((theme: Theme) => ResponsiveStyleValue<AllSystemCSSProperties[K]>) };
 export interface BoxOwnProps<Theme extends object = SystemTheme> {
@@ -33,7 +30,6 @@ export interface BoxTypeMap<AdditionalProps = {}, RootComponent extends React.El
   props: AdditionalProps & BoxOwnProps<Theme>;
   defaultComponent: RootComponent;
 }
-
 /**
  *
  * Demos:

package/Box/Box.js

@@ -10,6 +10,21 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _ClassNameGenerator = _interopRequireDefault(require("@mui/utils/ClassNameGenerator"));
 var _createBox = _interopRequireDefault(require("../createBox"));
 var _boxClasses = _interopRequireDefault(require("./boxClasses"));
+// The SimpleSystemKeys are subset of the AllSystemCSSProperties, so this should be ok
+// This is needed as these are used as keys inside AllSystemCSSProperties
+
+/**
+ *
+ * Demos:
+ *
+ * - [Box (Material UI)](https://mui.com/material-ui/react-box/)
+ * - [Menubar (Material UI)](https://mui.com/material-ui/react-menubar/)
+ * - [Box (MUI System)](https://mui.com/system/react-box/)
+ *
+ * API:
+ *
+ * - [Box API](https://mui.com/system/api/box/)
+ */
 const Box = (0, _createBox.default)({
   defaultClassName: _boxClasses.default.root,
   generateClassName: _ClassNameGenerator.default.generate
@@ -17,7 +32,7 @@ const Box = (0, _createBox.default)({
 process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
   // └─────────────────────────────────────────────────────────────────────┘
   /**
    * @ignore

package/Box/Box.mjs

@@ -4,6 +4,22 @@ import PropTypes from 'prop-types';
 import ClassNameGenerator from '@mui/utils/ClassNameGenerator';
 import createBox from "../createBox/index.mjs";
 import boxClasses from "./boxClasses.mjs";
+
+// The SimpleSystemKeys are subset of the AllSystemCSSProperties, so this should be ok
+// This is needed as these are used as keys inside AllSystemCSSProperties
+
+/**
+ *
+ * Demos:
+ *
+ * - [Box (Material UI)](https://mui.com/material-ui/react-box/)
+ * - [Menubar (Material UI)](https://mui.com/material-ui/react-menubar/)
+ * - [Box (MUI System)](https://mui.com/system/react-box/)
+ *
+ * API:
+ *
+ * - [Box API](https://mui.com/system/api/box/)
+ */
 const Box = createBox({
   defaultClassName: boxClasses.root,
   generateClassName: ClassNameGenerator.generate
@@ -11,7 +27,7 @@ const Box = createBox({
 process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
   // └─────────────────────────────────────────────────────────────────────┘
   /**
    * @ignore

package/Box/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -20,7 +19,18 @@ Object.defineProperty(exports, "default", {
     return _Box.default;
   }
 });
-var _Box = _interopRequireDefault(require("./Box"));
+var _Box = _interopRequireWildcard(require("./Box"));
+Object.keys(_Box).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Box[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Box[key];
+    }
+  });
+});
 var _boxClasses = _interopRequireWildcard(require("./boxClasses"));
 Object.keys(_boxClasses).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/Box/index.mjs

@@ -1,3 +1,4 @@
 export { default } from "./Box.mjs";
+export * from "./Box.mjs";
 export { default as boxClasses } from "./boxClasses.mjs";
 export * from "./boxClasses.mjs";

package/CHANGELOG.md

@@ -1,5 +1,79 @@
 # [Versions](https://mui.com/material-ui/getting-started/versions/)
 
+## 9.2.0
+
+<!-- generated comparing v9.1.2..master -->
+
+_Jul 2, 2026_
+
+A big thanks to the 9 contributors who made this release possible.
+
+- ⚙️ Add support for [`data-*` attributes on `slotProps`](https://mui.com/material-ui/guides/typescript/#allowing-data-attributes-on-slotprops).
+
+### `@mui/material@9.1.3`
+
+- [l10n] Add missing MuiPagination localization to zh-CN locale (#48741) @greymoth-jp
+- [select] Guard display ref during mouse down (#48744) @michelengelen
+
+### `@mui/utils@9.1.3`
+
+- [utils] Add opt-in `DataAttributesOverrides` augmentation for slot props (#48554) @LukasTy
+
+### Docs
+
+- [docs] Improve Icon Dialog responsiveness on small screens (#48639) @Prakash1185
+- [docs] Fix invalid UTF-8 in skill references (#48739) @mturac
+
+### Core
+
+- [code-infra] Resolve Renovate dashboard warnings (#48700) @Sushantplive
+- [code-infra] Validate npm publishing through dry run (#48691) @brijeshb42
+- [code-infra] Run prettier after renovate update (#48754) @Janpot
+- [code-infra] Fix 'A11y results committed?' check on react-pinned nightly jobs (#48740) @Janpot
+- [core] Remove leftover Joy UI references (#48719) @siriwatknp
+- [code-infra] Bump react-router to 7.15.1 (#48725) @Janpot
+- [docs-infra] Drive docs analytics IDs via ANALYTICS_ENV (#48694) @Janpot
+- [docs-infra] Pre-render API page descriptions (#48693) @brijeshb42
+- [code-infra][icons-material] Build lib/package.json with code-infra --no-expand (#48689) @Janpot
+- [code-infra] Fix react@18/next nightly workflow (#48635) @Janpot
+
+All contributors of this release in alphabetical order: @brijeshb42, @greymoth-jp, @Janpot, @LukasTy, @michelengelen, @mturac, @Prakash1185, @siriwatknp, @Sushantplive
+
+## 9.1.2
+
+<!-- generated comparing v9.1.1..master -->
+
+_Jun 23, 2026_
+
+A big thanks to the 5 contributors who made this release possible.
+
+### `@mui/material@9.1.2`
+
+- [autocomplete] Don't submit forms when committing `freeSolo` value with Enter key (#48679) @mj12albert
+- [transitions] Fix RTG import in ESM (#48645) @mj12albert
+
+### `@mui/system@9.1.2`
+
+- [InitColorSchemeScript] Fix script tag warning in Next.js 16 dev mode (#48671) @siriwatknp
+
+### Docs
+
+- Fix typos in release instructions (#48687) @brijeshb42
+- Update @mui/x-\* packages to latest (#48661) @Janpot
+
+### Core
+
+- [code-infra] Convert leaf @mui/system .js+.d.ts pairs to TypeScript (part 1) (#48578) @Janpot
+- [code-infra] Bump to latest code-infra packages (#48672) @brijeshb42
+- [code-infra] Resolve remaining minimatch advisory (#48662) @Janpot
+- [code-infra] Bump nx to resolve minimatch advisory (#48658) @Janpot
+- [core] Drop @babel/\* pnpm overrides (#48710) @Janpot
+- [docs-infra] Revert "Pin StackBlitz demo vite to v7 and plugin-react to v5" (#48709) @Janpot
+- [docs-infra] Fix code-block copy button broken on direct page load (#48653) @brijeshb42
+- [test] Stabilize Data Grid demo data in Argos screenshots (#48654) @LukasTy
+
+All contributors of this release in alphabetical order: @brijeshb42, @Janpot, @LukasTy, @mj12albert, @siriwatknp
+
 ## 9.1.1
 
 <!-- generated comparing v9.1.0..master -->

package/Container/index.d.mts

@@ -1,4 +1,4 @@
 export { default } from "./Container.mjs";
-export * from "./ContainerProps.mjs";
+export type * from "./ContainerProps.mjs";
 export { default as containerClasses } from "./containerClasses.mjs";
 export * from "./containerClasses.mjs";

package/Container/index.d.ts

@@ -1,4 +1,4 @@
 export { default } from "./Container.js";
-export * from "./ContainerProps.js";
+export type * from "./ContainerProps.js";
 export { default as containerClasses } from "./containerClasses.js";
 export * from "./containerClasses.js";

package/Grid/Grid.js

@@ -79,7 +79,6 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ =
    */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   /**
-   * @internal
    * The level of the grid starts from `0` and increases when the grid nests
    * inside another grid. Nesting is defined as a container Grid being a direct
    * child of a container Grid.

package/Grid/Grid.mjs

@@ -73,7 +73,6 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ =
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
-   * @internal
    * The level of the grid starts from `0` and increases when the grid nests
    * inside another grid. Nesting is defined as a container Grid being a direct
    * child of a container Grid.

package/Grid/GridProps.d.mts

@@ -45,7 +45,6 @@ export interface GridBaseProps {
    */
   offset?: ResponsiveStyleValue<GridOffset> | undefined;
   /**
-   * @internal
    * The level of the grid starts from `0` and increases when the grid nests
    * inside another grid. Nesting is defined as a container Grid being a direct
    * child of a container Grid.

package/Grid/GridProps.d.ts

@@ -45,7 +45,6 @@ export interface GridBaseProps {
    */
   offset?: ResponsiveStyleValue<GridOffset> | undefined;
   /**
-   * @internal
    * The level of the grid starts from `0` and increases when the grid nests
    * inside another grid. Nesting is defined as a container Grid being a direct
    * child of a container Grid.

package/InitColorSchemeScript/InitColorSchemeScript.d.mts

@@ -44,4 +44,5 @@ export interface InitColorSchemeScriptProps {
    */
   nonce?: string | undefined;
 }
-export default function InitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element;
+export declare function buildInitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element;
+export default function InitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element | null;

package/InitColorSchemeScript/InitColorSchemeScript.d.ts

@@ -44,4 +44,5 @@ export interface InitColorSchemeScriptProps {
    */
   nonce?: string | undefined;
 }
-export default function InitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element;
+export declare function buildInitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element;
+export default function InitColorSchemeScript(options?: InitColorSchemeScriptProps): import("react/jsx-runtime").JSX.Element | null;

package/InitColorSchemeScript/InitColorSchemeScript.js

@@ -1,15 +1,41 @@
 "use strict";
+'use client';
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_ATTRIBUTE = void 0;
+exports.buildInitColorSchemeScript = buildInitColorSchemeScript;
 exports.default = InitColorSchemeScript;
+var React = _interopRequireWildcard(require("react"));
 var _jsxRuntime = require("react/jsx-runtime");
 const DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_MODE_STORAGE_KEY = 'mode';
 const DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
 const DEFAULT_ATTRIBUTE = exports.DEFAULT_ATTRIBUTE = 'data-color-scheme';
-function InitColorSchemeScript(options) {
+// React 17 has no `useSyncExternalStore`; spread into a plain object so reading the
+// missing property returns `undefined` instead of throwing under strict ESM. See #41190 (comment).
+const safeReact = {
+  ...React
+};
+const maybeReactUseSyncExternalStore = safeReact.useSyncExternalStore;
+const subscribe = () => () => {};
+
+/**
+ * `true` during the server render and the matching hydration render, `false`
+ * on every client render afterwards. React warns when a `<script>` is
+ * created during a client render (such scripts never execute), so the inline
+ * script is only emitted on the server pass and dropped after hydration — the
+ * attribute it already set on the document persists. React <18 has no
+ * `useSyncExternalStore` and no such warning, so the script is always emitted.
+ */
+function useIsServerRender() {
+  if (maybeReactUseSyncExternalStore === undefined) {
+    return true;
+  }
+  return maybeReactUseSyncExternalStore(subscribe, () => false, () => true);
+}
+function buildInitColorSchemeScript(options) {
   const {
     defaultMode = 'system',
     defaultLightColorScheme = 'light',
@@ -78,4 +104,11 @@ try {
 } catch(e){}})();`
     }
   }, "mui-color-scheme-init");
+}
+function InitColorSchemeScript(options) {
+  const isServerRender = useIsServerRender();
+  if (!isServerRender) {
+    return null;
+  }
+  return buildInitColorSchemeScript(options);
 }

package/InitColorSchemeScript/InitColorSchemeScript.mjs

@@ -1,8 +1,33 @@
+'use client';
+
+import * as React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 export const DEFAULT_MODE_STORAGE_KEY = 'mode';
 export const DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
 export const DEFAULT_ATTRIBUTE = 'data-color-scheme';
-export default function InitColorSchemeScript(options) {
+// React 17 has no `useSyncExternalStore`; spread into a plain object so reading the
+// missing property returns `undefined` instead of throwing under strict ESM. See #41190 (comment).
+const safeReact = {
+  ...React
+};
+const maybeReactUseSyncExternalStore = safeReact.useSyncExternalStore;
+const subscribe = () => () => {};
+
+/**
+ * `true` during the server render and the matching hydration render, `false`
+ * on every client render afterwards. React warns when a `<script>` is
+ * created during a client render (such scripts never execute), so the inline
+ * script is only emitted on the server pass and dropped after hydration — the
+ * attribute it already set on the document persists. React <18 has no
+ * `useSyncExternalStore` and no such warning, so the script is always emitted.
+ */
+function useIsServerRender() {
+  if (maybeReactUseSyncExternalStore === undefined) {
+    return true;
+  }
+  return maybeReactUseSyncExternalStore(subscribe, () => false, () => true);
+}
+export function buildInitColorSchemeScript(options) {
   const {
     defaultMode = 'system',
     defaultLightColorScheme = 'light',
@@ -71,4 +96,11 @@ try {
 } catch(e){}})();`
     }
   }, "mui-color-scheme-init");
+}
+export default function InitColorSchemeScript(options) {
+  const isServerRender = useIsServerRender();
+  if (!isServerRender) {
+    return null;
+  }
+  return buildInitColorSchemeScript(options);
 }

package/Stack/Stack.js

@@ -56,7 +56,7 @@ process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ =
   /**
    * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
    *
-   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * While CSS `gap` removes the known limitations,
    * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
    *
    * To enable this flag globally, follow the theme's default props configuration.

package/Stack/Stack.mjs

@@ -50,7 +50,7 @@ process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ =
   /**
    * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
    *
-   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * While CSS `gap` removes the known limitations,
    * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
    *
    * To enable this flag globally, follow the theme's default props configuration.

package/Stack/StackProps.d.mts

@@ -25,7 +25,7 @@ export interface StackBaseProps {
   /**
    * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
    *
-   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * While CSS `gap` removes the known limitations,
    * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
    *
    * To enable this flag globally, follow the theme's default props configuration.

package/Stack/StackProps.d.ts

@@ -25,7 +25,7 @@ export interface StackBaseProps {
   /**
    * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
    *
-   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * While CSS `gap` removes the known limitations,
    * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
    *
    * To enable this flag globally, follow the theme's default props configuration.

package/ThemeProvider/ThemeProvider.d.mts

@@ -1,4 +1,5 @@
-import { DefaultTheme } from '@mui/private-theming';
+import * as React from 'react';
+import { type DefaultTheme } from '@mui/private-theming';
 export interface ThemeProviderProps<Theme = DefaultTheme> {
   /**
    * Your component tree.
@@ -13,13 +14,15 @@ export interface ThemeProviderProps<Theme = DefaultTheme> {
    */
   theme: Partial<Theme> | ((outerTheme: Theme) => Theme);
 }
-
-// #host-reference
 /**
  * This component makes the `theme` available down the React tree.
  * It should preferably be used at **the root of your component tree**.
- * API:
  *
- * - [ThemeProvider API](https://mui.com/material-ui/customization/theming/#themeprovider)
+ * <ThemeProvider theme={theme}> // existing use case
+ * <ThemeProvider theme={{ id: theme }}> // theme scoping
  */
-export default function ThemeProvider<T = DefaultTheme>(props: ThemeProviderProps<T>): React.ReactElement<ThemeProviderProps<T>>;
+declare function ThemeProvider<T = DefaultTheme>(props: ThemeProviderProps<T>): React.ReactElement<ThemeProviderProps<T>>;
+declare namespace ThemeProvider {
+  var propTypes: any;
+}
+export default ThemeProvider;

package/ThemeProvider/ThemeProvider.d.ts

@@ -1,4 +1,5 @@
-import { DefaultTheme } from '@mui/private-theming';
+import * as React from 'react';
+import { type DefaultTheme } from '@mui/private-theming';
 export interface ThemeProviderProps<Theme = DefaultTheme> {
   /**
    * Your component tree.
@@ -13,13 +14,15 @@ export interface ThemeProviderProps<Theme = DefaultTheme> {
    */
   theme: Partial<Theme> | ((outerTheme: Theme) => Theme);
 }
-
-// #host-reference
 /**
  * This component makes the `theme` available down the React tree.
  * It should preferably be used at **the root of your component tree**.
- * API:
  *
- * - [ThemeProvider API](https://mui.com/material-ui/customization/theming/#themeprovider)
+ * <ThemeProvider theme={theme}> // existing use case
+ * <ThemeProvider theme={{ id: theme }}> // theme scoping
  */
-export default function ThemeProvider<T = DefaultTheme>(props: ThemeProviderProps<T>): React.ReactElement<ThemeProviderProps<T>>;
+declare function ThemeProvider<T = DefaultTheme>(props: ThemeProviderProps<T>): React.ReactElement<ThemeProviderProps<T>>;
+declare namespace ThemeProvider {
+  var propTypes: any;
+}
+export default ThemeProvider;

package/ThemeProvider/ThemeProvider.js

@@ -85,7 +85,7 @@ function ThemeProvider(props) {
 process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
   // └─────────────────────────────────────────────────────────────────────┘
   /**
    * Your component tree.
@@ -101,6 +101,7 @@ process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes /* remove-propty
   themeId: _propTypes.default.string
 } : void 0;
 if (process.env.NODE_ENV !== 'production') {
-  process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = (0, _exactProp.default)(ThemeProvider.propTypes) : void 0;
+  // eslint-disable-next-line
+  ThemeProvider['propTypes' + ''] = (0, _exactProp.default)(ThemeProvider.propTypes);
 }
 var _default = exports.default = ThemeProvider;

package/ThemeProvider/ThemeProvider.mjs

@@ -78,7 +78,7 @@ function ThemeProvider(props) {
 process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
   // └─────────────────────────────────────────────────────────────────────┘
   /**
    * Your component tree.
@@ -94,6 +94,7 @@ process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes /* remove-propty
   themeId: PropTypes.string
 } : void 0;
 if (process.env.NODE_ENV !== 'production') {
-  process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;
+  // eslint-disable-next-line
+  ThemeProvider['propTypes' + ''] = exactProp(ThemeProvider.propTypes);
 }
 export default ThemeProvider;

package/ThemeProvider/index.d.mts

@@ -1,2 +1,2 @@
 export { default } from "./ThemeProvider.mjs";
-export * from "./ThemeProvider.mjs";
+export type * from "./ThemeProvider.mjs";

package/ThemeProvider/index.d.ts

@@ -1,2 +1,2 @@
 export { default } from "./ThemeProvider.js";
-export * from "./ThemeProvider.js";
+export type * from "./ThemeProvider.js";

package/borders/borders.d.mts

@@ -1,15 +1,17 @@
-import { PropsFor, SimpleStyleFunction } from "../style/index.mjs";
-export const border: SimpleStyleFunction<'border'>;
-export const borderTop: SimpleStyleFunction<'borderTop'>;
-export const borderRight: SimpleStyleFunction<'borderRight'>;
-export const borderBottom: SimpleStyleFunction<'borderBottom'>;
-export const borderLeft: SimpleStyleFunction<'borderLeft'>;
-export const borderColor: SimpleStyleFunction<'borderColor'>;
-export const borderTopColor: SimpleStyleFunction<'borderTopColor'>;
-export const borderRightColor: SimpleStyleFunction<'borderRightColor'>;
-export const borderBottomColor: SimpleStyleFunction<'borderBottomColor'>;
-export const borderLeftColor: SimpleStyleFunction<'borderLeftColor'>;
-export const borderRadius: SimpleStyleFunction<'borderRadius'>;
+import type { PropsFor, SimpleStyleFunction } from "../style/index.mjs";
+export declare const border: SimpleStyleFunction<"border">;
+export declare const borderTop: SimpleStyleFunction<"borderTop">;
+export declare const borderRight: SimpleStyleFunction<"borderRight">;
+export declare const borderBottom: SimpleStyleFunction<"borderBottom">;
+export declare const borderLeft: SimpleStyleFunction<"borderLeft">;
+export declare const borderColor: SimpleStyleFunction<"borderColor">;
+export declare const borderTopColor: SimpleStyleFunction<"borderTopColor">;
+export declare const borderRightColor: SimpleStyleFunction<"borderRightColor">;
+export declare const borderBottomColor: SimpleStyleFunction<"borderBottomColor">;
+export declare const borderLeftColor: SimpleStyleFunction<"borderLeftColor">;
+export declare const outline: SimpleStyleFunction<"outline">;
+export declare const outlineColor: SimpleStyleFunction<"outlineColor">;
+export declare const borderRadius: SimpleStyleFunction<'borderRadius'>;
 declare const borders: SimpleStyleFunction<'border' | 'borderTop' | 'borderRight' | 'borderBottom' | 'borderLeft' | 'borderColor' | 'borderRadius'>;
 export type BordersProps = PropsFor<typeof borders>;
 export default borders;