@mui/system 7.0.0-beta.0 → 7.0.0-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/system",
-  "version": "7.0.0-beta.0",
+  "version": "7.0.0-beta.1",
   "private": false,
   "author": "MUI Team",
   "description": "MUI System is a set of CSS utilities to help you build custom designs more efficiently. It makes it possible to rapidly lay out custom designs.",
@@ -30,10 +30,10 @@
     "clsx": "^2.1.1",
     "csstype": "^3.1.3",
     "prop-types": "^15.8.1",
-    "@mui/private-theming": "7.0.0-alpha.2",
-    "@mui/styled-engine": "7.0.0-alpha.2",
+    "@mui/private-theming": "7.0.0-beta.1",
     "@mui/types": "^7.2.22",
-    "@mui/utils": "7.0.0-alpha.2"
+    "@mui/utils": "7.0.0-alpha.2",
+    "@mui/styled-engine": "7.0.0-beta.1"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
@@ -92,5 +92,6 @@
     },
     "./esm": null,
     "./modern": null
-  }
+  },
+  "types": "./index.d.ts"
 }

package/palette/index.d.ts

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

package/palette/palette.d.ts

@@ -0,0 +1,4 @@
+import { PropsFor, SimpleStyleFunction, palette } from "../Box/index.js";
+export const color: SimpleStyleFunction<'color'>;
+export const bgcolor: SimpleStyleFunction<'bgcolor'>;
+export type PaletteProps = PropsFor<typeof palette>;

package/positions/index.d.ts

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

package/positions/positions.d.ts

@@ -0,0 +1,2 @@
+import { PropsFor, positions } from "../Box/index.js";
+export type PositionsProps = PropsFor<typeof positions>;

package/preprocessStyles.d.ts

@@ -0,0 +1,5 @@
+export default function preprocessStyles(input: any): {
+  variants: any;
+  style: any;
+  isProcessed: boolean;
+};

package/propsToClassKey/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./propsToClassKey.js";

package/propsToClassKey/propsToClassKey.d.ts

@@ -0,0 +1 @@
+export default function propsToClassKey(props: object): string;

package/responsivePropType/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./responsivePropType.js";

package/responsivePropType/responsivePropType.d.ts

@@ -0,0 +1,2 @@
+declare const responsivePropType: object;
+export default responsivePropType;

package/shadows/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./shadows.js";

package/shadows/shadows.d.ts

@@ -0,0 +1,2 @@
+import { PropsFor, shadows } from "../Box/index.js";
+export type ShadowsProps = PropsFor<typeof shadows>;

package/sizing/index.d.ts

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

package/sizing/sizing.d.ts

@@ -0,0 +1,11 @@
+import { PropsFor, SimpleStyleFunction, sizing } from "../Box/index.js";
+export const width: SimpleStyleFunction<'width'>;
+export const maxWidth: SimpleStyleFunction<'maxWidth'>;
+export const minWidth: SimpleStyleFunction<'minWidth'>;
+export const height: SimpleStyleFunction<'height'>;
+export const maxHeight: SimpleStyleFunction<'maxHeight'>;
+export const minHeight: SimpleStyleFunction<'minHeight'>;
+export const sizeWidth: SimpleStyleFunction<'sizeWidth'>;
+export const sizeHeight: SimpleStyleFunction<'sizeHeight'>;
+export const boxSizing: SimpleStyleFunction<'boxSizing'>;
+export type SizingProps = PropsFor<typeof sizing>;

package/spacing/index.d.ts

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

package/spacing/spacing.d.ts

@@ -0,0 +1,18 @@
+import { SimpleStyleFunction, spacing, PropsFor } from "../Box/index.js";
+export type SpacingValueType = string | number | null | undefined;
+export type SpacingProps = PropsFor<typeof spacing>;
+export function createUnarySpacing<Spacing>(theme: {
+  spacing: Spacing;
+}): Spacing extends number ? (abs: number | string) => number | number : Spacing extends any[] ? <Index extends number>(abs: Index | string) => Spacing[Index] | string : Spacing extends ((...args: unknown[]) => unknown) ? Spacing :
+// warns in Dev
+() => undefined;
+export function createUnaryUnit<Spacing>(theme: {
+  spacing: Spacing;
+}, themeKey: string, defaultValue: Spacing, propName: string): Spacing extends number ? (abs: SpacingValueType) => number | number : Spacing extends any[] ? <Index extends number>(abs: Index | string) => Spacing[Index] | string : Spacing extends ((...args: unknown[]) => unknown) ? Spacing :
+// warns in Dev
+() => undefined;
+export const margin: SimpleStyleFunction<'m' | 'mt' | 'mr' | 'mb' | 'ml' | 'mx' | 'my' | 'margin' | 'marginTop' | 'marginRight' | 'marginBottom' | 'marginLeft' | 'marginX' | 'marginY' | 'marginInline' | 'marginInlineStart' | 'marginInlineEnd' | 'marginBlock' | 'marginBlockStart' | 'marginBlockEnd'>;
+export type MarginProps = PropsFor<typeof margin>;
+export const padding: SimpleStyleFunction<'p' | 'pt' | 'pr' | 'pb' | 'pl' | 'px' | 'py' | 'padding' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'paddingX' | 'paddingY' | 'paddingInline' | 'paddingInlineStart' | 'paddingInlineEnd' | 'paddingBlock' | 'paddingBlockStart' | 'paddingBlockEnd'>;
+export function getValue(transformer: (prop: SpacingValueType) => SpacingValueType, propValue: SpacingValueType): SpacingValueType;
+export type PaddingProps = PropsFor<typeof padding>;

package/style/index.d.ts

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

package/style/style.d.ts

@@ -0,0 +1,19 @@
+import { CSSObject } from '@mui/styled-engine';
+import { StyleFunction } from "../Box/index.js";
+export type TransformFunction = (cssValue: unknown, userValue: unknown) => number | string | React.CSSProperties | CSSObject;
+export interface StyleOptions<PropKey> {
+  cssProperty?: PropKey | keyof React.CSSProperties | false;
+  prop: PropKey;
+  /**
+   * dot access in `Theme`
+   */
+  themeKey?: string;
+  transform?: TransformFunction;
+}
+export function style<PropKey extends string, Theme extends object>(options: StyleOptions<PropKey>): StyleFunction<{ [K in PropKey]?: unknown } & {
+  theme?: Theme;
+}> & {
+  filterProps: string[];
+};
+export function getPath<T>(obj: T, path: string | undefined, checkVars?: boolean): null | unknown;
+export function getStyleValue(themeMapping: object | ((arg: any) => any), transform: TransformFunction | null, propValueFinal: unknown, userValue?: unknown): any;

package/styleFunctionSx/AliasesCSSProperties.d.ts

@@ -0,0 +1,269 @@
+import { StandardCSSProperties } from "./StandardCssProperties.js";
+export interface AliasesCSSProperties {
+  /**
+   * The **`background-color`** CSS property sets the background color of an element.
+   *
+   * **Initial value**: `transparent`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/background-color
+   */
+  bgcolor?: StandardCSSProperties['backgroundColor'];
+  /**
+   * The **`margin`** CSS property sets the margin on all four sides of an element. It is a shorthand for `margin-top`, `margin-right`, `margin-bottom`, and `margin-left`.
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin
+   */
+  m?: StandardCSSProperties['margin'];
+  /**
+   * The **`margin-top`** CSS property sets the margin on the top of an element. A positive value places it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-top
+   */
+  mt?: StandardCSSProperties['marginTop'];
+  /**
+   * The **`margin-right`** CSS property sets the margin on the right side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-right
+   */
+  mr?: StandardCSSProperties['marginRight'];
+  /**
+   * The **`margin-bottom`** CSS property sets the margin on the bottom of an element. A positive value places it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-bottom
+   */
+  mb?: StandardCSSProperties['marginBottom'];
+  /**
+   * The **`margin-left`** CSS property sets the margin on the left side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-left
+   */
+  ml?: StandardCSSProperties['marginLeft'];
+  /**
+   * The **`mx`** property is shorthand for using both **`margin-left`** and **`margin-right`** CSS properties. They set the margin on the left and right side of an element. A positive value places it
+   * farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-left
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-right
+   */
+  mx?: StandardCSSProperties['marginLeft'];
+  /**
+   * The **`marginX`** property is shorthand for using both **`margin-left`** and **`margin-right`** CSS properties. They set the margin on the left and right side of an element. A positive value
+   * places it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-left
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-right
+   */
+  marginX?: StandardCSSProperties['marginLeft'];
+  /**
+   * The **`my`** property is shorthand for using both **`margin-top`** and **`margin-bottom`** CSS properties. They set the margin on the top and bottom of an element. A positive value places it
+   * farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-top
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-bottom
+   */
+  my?: StandardCSSProperties['marginTop'];
+  /**
+   * The **`marginY`** property is shorthand for using both **`margin-top`** and **`margin-bottom`** CSS properties. They set the margin on the top and bottom of an element. A positive value places
+   * it farther from its neighbors, while a negative value places it closer.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-top
+   * @see https://developer.mozilla.org/docs/Web/CSS/margin-bottom
+   */
+  marginY?: StandardCSSProperties['marginTop'];
+  /**
+   * The **`padding`** CSS property sets the padding on all four sides of an element. It is a shorthand for `padding-top`, `padding-right`, `padding-bottom`, and `padding-left`.
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding
+   */
+  p?: StandardCSSProperties['padding'];
+  /**
+   * The **`padding-top`** CSS property sets the height of the padding at the top of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-top
+   */
+  pt?: StandardCSSProperties['paddingTop'];
+  /**
+   * The **`padding-right`** CSS property sets the width of the padding at the right side of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-right
+   */
+  pr?: StandardCSSProperties['paddingRight'];
+  /**
+   * The **`padding-bottom`** CSS property sets the height of the padding on the bottom of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-bottom
+   */
+  pb?: StandardCSSProperties['paddingBottom'];
+  /**
+   * The **`padding-left`** CSS property sets the width of the padding at the left side of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-left
+   */
+  pl?: StandardCSSProperties['paddingLeft'];
+  /**
+   * The **`px`** property is shorthand for the CSS properties **`padding-left`** and **`padding-right`**. They set the width of the padding at the left and right side of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-left
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-right
+   */
+  px?: StandardCSSProperties['paddingLeft'];
+  /**
+   * The **`paddingX`** property is shorthand for the CSS properties **`padding-left`** and **`padding-right`**. They set the width of the padding at the left and right sides of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-left
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-right
+   */
+  paddingX?: StandardCSSProperties['paddingLeft'];
+  /**
+   * The **`py`** property is shorthand for the CSS properties **`padding-top`** and **`padding-bottom`**. They set the width of the padding at the top and bottom of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-top
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-bottom
+   */
+  py?: StandardCSSProperties['paddingTop'];
+  /**
+   * The **`paddingY`** property is shorthand for the CSS properties **`padding-top`** and **`padding-bottom`**. They set the width of the padding at the top and bottom of an element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-top
+   * @see https://developer.mozilla.org/docs/Web/CSS/padding-bottom
+   */
+  paddingY?: StandardCSSProperties['paddingTop'];
+  /**
+   * The **`typography`** property  is shorthand for the CSS properties **`font-family`**, **`font-weight`**, **`font-size`**, **`line-height`**, **`letter-spacing`** and **`text-transform``**.
+   * It takes the values defined under `theme.typography` and spreads them on the element.
+   *
+   * **Initial value**: `0`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **2**  |  **1**  | **1**  | **12** | **5.5** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/font-family
+   * @see https://developer.mozilla.org/docs/Web/CSS/font-weight
+   * @see https://developer.mozilla.org/docs/Web/CSS/font-size
+   * @see https://developer.mozilla.org/docs/Web/CSS/line-height
+   * @see https://developer.mozilla.org/docs/Web/CSS/letter-spacing
+   * @see https://developer.mozilla.org/docs/Web/CSS/text-transform
+   */
+  typography?: string;
+  /**
+   * The **`displayPrint`** property sets the display value for the element when the page is printed.
+   *
+   * **Initial value**: `inline`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/display
+   */
+  displayPrint?: StandardCSSProperties['display'];
+}

package/styleFunctionSx/OverwriteCSSProperties.d.ts

@@ -0,0 +1,54 @@
+import * as CSS from 'csstype';
+export interface OverwriteCSSProperties {
+  /**
+   * The **`border`** CSS property is shorthand for the CSS properties **`border-width`**, **`border-style`**, and **`border-color`**. It sets an element's border.
+   *
+   * **Initial value**: `none`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/border
+   */
+  border?: CSS.Property.Border | number;
+  /**
+   * The **`box-shadow`** CSS property adds shadow effects around an element's frame. You can set multiple effects separated by commas. A box shadow is described by X and Y offsets relative to the
+   * element for blur and spread radii, and by its color.
+   *
+   * **Initial value**: `none`
+   *
+   * | Chrome  | Firefox | Safari  |  Edge  |  IE   |
+   * | :-----: | :-----: | :-----: | :----: | :---: |
+   * | **10**  |  **4**  | **5.1** | **12** | **9** |
+   * | 1 _-x-_ |         | 3 _-x-_ |        |       |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/box-shadow
+   */
+  boxShadow?: CSS.Property.BoxShadow | number;
+  /**
+   * The **`font-weight`** CSS property specifies the weight (or boldness) of the font. The font weights available to you will depend on the `font-family` you are using. Some fonts are only
+   * available in `normal` and `bold`.
+   *
+   * **Initial value**: `normal`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **2**  |  **1**  | **1**  | **12** | **3** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/font-weight
+   */
+  fontWeight?: CSS.Property.FontWeight | string;
+  /**
+   * The **`z-index`** CSS property sets the z-order of a positioned element and its descendants or flex items. Overlapping elements with a higher z-index cover those with a lower one.
+   *
+   * **Initial value**: `auto`
+   *
+   * | Chrome | Firefox | Safari |  Edge  |  IE   |
+   * | :----: | :-----: | :----: | :----: | :---: |
+   * | **1**  |  **1**  | **1**  | **12** | **4** |
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/z-index
+   */
+  zIndex?: CSS.Property.ZIndex | string;
+}

package/styleFunctionSx/StandardCssProperties.d.ts

@@ -0,0 +1,2 @@
+import * as CSS from 'csstype';
+export type StandardCSSProperties = CSS.PropertiesFallback<number | string>;

package/styleFunctionSx/defaultSxConfig.d.ts

@@ -0,0 +1,15 @@
+import { StyleFunction } from "../Box/index.js";
+import { TransformFunction } from "../style/index.js";
+type SimpleStyleFunction<PropKey extends keyof any> = StyleFunction<Partial<Record<PropKey, any>>>;
+export interface SxConfigRecord {
+  cssProperty?: keyof React.CSSProperties | false;
+  /**
+   * dot access in `Theme`
+   */
+  themeKey?: string;
+  transform?: TransformFunction;
+  style?: SimpleStyleFunction<any>;
+}
+export type SxConfig = Record<string, SxConfigRecord>;
+declare const defaultSxConfig: SxConfig;
+export default defaultSxConfig;

package/styleFunctionSx/extendSxProp.d.ts

@@ -0,0 +1,4 @@
+import { SxProps } from "./styleFunctionSx.js";
+export default function extendSxProp<Props extends {
+  sx?: SxProps<any>;
+} = {}>(props: Props): Props;

package/styleFunctionSx/index.d.ts

@@ -0,0 +1,9 @@
+export { default } from "./styleFunctionSx.js";
+export * from "./styleFunctionSx.js";
+export * from "./AliasesCSSProperties.js";
+export * from "./OverwriteCSSProperties.js";
+export * from "./StandardCssProperties.js";
+export { default as extendSxProp } from "./extendSxProp.js";
+export { default as unstable_defaultSxConfig } from "./defaultSxConfig.js";
+export * from "./defaultSxConfig.js";
+export * from "./extendSxProp.js";

package/styleFunctionSx/styleFunctionSx.d.ts

@@ -0,0 +1,62 @@
+import * as CSS from 'csstype';
+import { CSSObject } from '@mui/styled-engine';
+import { StandardCSSProperties } from "./StandardCssProperties.js";
+import { AliasesCSSProperties } from "./AliasesCSSProperties.js";
+import { OverwriteCSSProperties } from "./OverwriteCSSProperties.js";
+
+/**
+ * The `css` function accepts arrays as values for mobile-first responsive styles.
+ * Note that this extends to non-theme values also. For example `display=['none', 'block']`
+ * will also works.
+ */
+export type ResponsiveStyleValue<T> = T | ReadonlyArray<T | null> | {
+  [key: string]: T | null;
+};
+
+/**
+ * Map of all CSS pseudo selectors (`:hover`, `:focus`, ...).
+ */
+export type CSSPseudoSelectorProps<Theme extends object = {}> = { [K in CSS.Pseudos]?: ((theme: Theme) => SystemStyleObject<Theme>) | SystemStyleObject<Theme> };
+
+/**
+ * Map all nested selectors.
+ */
+export interface CSSSelectorObject<Theme extends object = {}> {
+  [cssSelector: string]: ((theme: Theme) => SystemStyleObject<Theme>) | SystemStyleObject<Theme>;
+}
+type CssVariableType = string | number;
+
+/**
+ * Map all nested selectors and CSS variables.
+ */
+export interface CSSSelectorObjectOrCssVariables<Theme extends object = {}> {
+  [cssSelectorOrVariable: string]: ((theme: Theme) => SystemStyleObject<Theme> | string | number) | SystemStyleObject<Theme> | CssVariableType;
+}
+
+/**
+ * Map of all available CSS properties (including aliases) and their raw value.
+ * Only used internally to map CSS properties to input types (responsive value,
+ * theme function or nested) in `SystemCssProperties`.
+ */
+export interface AllSystemCSSProperties extends Omit<StandardCSSProperties, keyof OverwriteCSSProperties>, OverwriteCSSProperties, AliasesCSSProperties {}
+export type SystemCssProperties<Theme extends object = {}> = { [K in keyof AllSystemCSSProperties]: ResponsiveStyleValue<AllSystemCSSProperties[K]> | ((theme: Theme) => ResponsiveStyleValue<AllSystemCSSProperties[K]>) | null };
+
+/**
+ * The `SystemStyleObject` defines custom properties that will be transformed to
+ * their corresponding values from the `Theme`. Other valid CSS properties are also allowed.
+ */
+export type SystemStyleObject<Theme extends object = {}> = SystemCssProperties<Theme> | CSSPseudoSelectorProps<Theme> | CSSSelectorObjectOrCssVariables<Theme> | null;
+
+/**
+ * The `SxProps` can be either object or function
+ */
+export type SxProps<Theme extends object = {}> = SystemStyleObject<Theme> | ((theme: Theme) => SystemStyleObject<Theme>) | ReadonlyArray<boolean | SystemStyleObject<Theme> | ((theme: Theme) => SystemStyleObject<Theme>)>;
+export interface StyleFunctionSx {
+  (props: object): CSSObject;
+  filterProps?: string[];
+}
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export function unstable_createStyleFunctionSx(styleFunctionMapping: Record<string, StyleFunctionSx>): StyleFunctionSx;
+declare const styleFunctionSx: StyleFunctionSx;
+export default styleFunctionSx;

package/styled/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./styled.js";

package/styled/styled.d.ts

@@ -0,0 +1,3 @@
+import { CreateMUIStyled } from "../createStyled/index.js";
+declare const styled: CreateMUIStyled;
+export default styled;