@weng-lab/ui-components 2.0.0 → 2.0.1

package/dist/ui-components.es279.js

@@ -1,7 +1,237 @@
-import * as t from "react";
-const e = /* @__PURE__ */ t.createContext({});
-process.env.NODE_ENV !== "production" && (e.displayName = "ListContext");
+import * as v from "react";
+import r from "./ui-components.es81.js";
+import { clsx as g } from "./ui-components.es80.js";
+import u, { getNativeSelectUtilityClasses as R } from "./ui-components.es321.js";
+import N from "./ui-components.es164.js";
+import { j as d } from "./ui-components.es12.js";
+import n from "./ui-components.es31.js";
+import f from "./ui-components.es98.js";
+import y from "./ui-components.es86.js";
+import h from "./ui-components.es122.js";
+const C = (t) => {
+  const {
+    classes: e,
+    variant: o,
+    disabled: a,
+    multiple: i,
+    open: s,
+    error: l
+  } = t, c = {
+    select: ["select", o, a && "disabled", i && "multiple", l && "error"],
+    icon: ["icon", `icon${f(o)}`, s && "iconOpen", a && "disabled"]
+  };
+  return y(c, R, e);
+}, w = n("select", {
+  name: "MuiNativeSelect"
+})(({
+  theme: t
+}) => ({
+  // Reset
+  MozAppearance: "none",
+  // Reset
+  WebkitAppearance: "none",
+  // When interacting quickly, the text can end up selected.
+  // Native select can't be selected either.
+  userSelect: "none",
+  // Reset
+  borderRadius: 0,
+  cursor: "pointer",
+  "&:focus": {
+    // Reset Chrome style
+    borderRadius: 0
+  },
+  [`&.${u.disabled}`]: {
+    cursor: "default"
+  },
+  "&[multiple]": {
+    height: "auto"
+  },
+  "&:not([multiple]) option, &:not([multiple]) optgroup": {
+    backgroundColor: (t.vars || t).palette.background.paper
+  },
+  variants: [{
+    props: ({
+      ownerState: e
+    }) => e.variant !== "filled" && e.variant !== "outlined",
+    style: {
+      // Bump specificity to allow extending custom inputs
+      "&&&": {
+        paddingRight: 24,
+        minWidth: 16
+        // So it doesn't collapse.
+      }
+    }
+  }, {
+    props: {
+      variant: "filled"
+    },
+    style: {
+      "&&&": {
+        paddingRight: 32
+      }
+    }
+  }, {
+    props: {
+      variant: "outlined"
+    },
+    style: {
+      borderRadius: (t.vars || t).shape.borderRadius,
+      "&:focus": {
+        borderRadius: (t.vars || t).shape.borderRadius
+        // Reset the reset for Chrome style
+      },
+      "&&&": {
+        paddingRight: 32
+      }
+    }
+  }]
+})), x = n(w, {
+  name: "MuiNativeSelect",
+  slot: "Select",
+  shouldForwardProp: N,
+  overridesResolver: (t, e) => {
+    const {
+      ownerState: o
+    } = t;
+    return [e.select, e[o.variant], o.error && e.error, {
+      [`&.${u.multiple}`]: e.multiple
+    }];
+  }
+})({}), I = n("svg", {
+  name: "MuiNativeSelect"
+})(({
+  theme: t
+}) => ({
+  // We use a position absolute over a flexbox in order to forward the pointer events
+  // to the input and to support wrapping tags..
+  position: "absolute",
+  right: 0,
+  // Center vertically, height is 1em
+  top: "calc(50% - .5em)",
+  // Don't block pointer events on the select under the icon.
+  pointerEvents: "none",
+  color: (t.vars || t).palette.action.active,
+  [`&.${u.disabled}`]: {
+    color: (t.vars || t).palette.action.disabled
+  },
+  variants: [{
+    props: ({
+      ownerState: e
+    }) => e.open,
+    style: {
+      transform: "rotate(180deg)"
+    }
+  }, {
+    props: {
+      variant: "filled"
+    },
+    style: {
+      right: 7
+    }
+  }, {
+    props: {
+      variant: "outlined"
+    },
+    style: {
+      right: 7
+    }
+  }]
+})), j = n(I, {
+  name: "MuiNativeSelect",
+  slot: "Icon",
+  overridesResolver: (t, e) => {
+    const {
+      ownerState: o
+    } = t;
+    return [e.icon, o.variant && e[`icon${f(o.variant)}`], o.open && e.iconOpen];
+  }
+})({}), M = /* @__PURE__ */ v.forwardRef(function(e, o) {
+  const {
+    className: a,
+    disabled: i,
+    error: s,
+    IconComponent: l,
+    inputRef: c,
+    variant: b = "standard",
+    ...S
+  } = e, p = {
+    ...e,
+    disabled: i,
+    variant: b,
+    error: s
+  }, m = C(p);
+  return /* @__PURE__ */ d.jsxs(v.Fragment, {
+    children: [/* @__PURE__ */ d.jsx(x, {
+      ownerState: p,
+      className: g(m.select, a),
+      disabled: i,
+      ref: c || o,
+      ...S
+    }), e.multiple ? null : /* @__PURE__ */ d.jsx(j, {
+      as: l,
+      ownerState: p,
+      className: m.icon
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" && (M.propTypes = {
+  /**
+   * The option elements to populate the select with.
+   * Can be some `<option>` elements.
+   */
+  children: r.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: r.object,
+  /**
+   * The CSS class name of the select element.
+   */
+  className: r.string,
+  /**
+   * If `true`, the select is disabled.
+   */
+  disabled: r.bool,
+  /**
+   * If `true`, the `select input` will indicate an error.
+   */
+  error: r.bool,
+  /**
+   * The icon that displays the arrow.
+   */
+  IconComponent: r.elementType.isRequired,
+  /**
+   * Use that prop to pass a ref to the native select element.
+   * @deprecated
+   */
+  inputRef: h,
+  /**
+   * @ignore
+   */
+  multiple: r.bool,
+  /**
+   * Name attribute of the `select` or hidden `input` element.
+   */
+  name: r.string,
+  /**
+   * Callback fired when a menu item is selected.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: r.func,
+  /**
+   * The input value.
+   */
+  value: r.any,
+  /**
+   * The variant to use.
+   */
+  variant: r.oneOf(["standard", "outlined", "filled"])
+});
 export {
-  e as default
+  I as StyledSelectIcon,
+  w as StyledSelectSelect,
+  M as default
 };
 //# sourceMappingURL=ui-components.es279.js.map

package/dist/ui-components.es279.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-components.es279.js","sources":["../../../node_modules/.pnpm/@mui+material@7.2.0_@emotion+react@11.14.0_@types+react@19.1.8_react@19.1.0__@emotion+s_56c3cb211b767c0a0b4c5f346237ccd0/node_modules/@mui/material/esm/List/ListContext.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\n/**\n * @ignore - internal component.\n */\nconst ListContext = /*#__PURE__*/React.createContext({});\nif (process.env.NODE_ENV !== 'production') {\n  ListContext.displayName = 'ListContext';\n}\nexport default ListContext;"],"names":["ListContext","React"],"mappings":";AAOK,MAACA,IAA2B,gBAAAC,EAAM,cAAc,CAAA,CAAE;AACnD,QAAQ,IAAI,aAAa,iBAC3BD,EAAY,cAAc;","x_google_ignoreList":[0]}
+{"version":3,"file":"ui-components.es279.js","sources":["../../../node_modules/.pnpm/@mui+material@7.2.0_@emotion+react@11.14.0_@types+react@19.1.8_react@19.1.0__@emotion+s_56c3cb211b767c0a0b4c5f346237ccd0/node_modules/@mui/material/esm/NativeSelect/NativeSelectInput.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport refType from '@mui/utils/refType';\nimport composeClasses from '@mui/utils/composeClasses';\nimport capitalize from \"../utils/capitalize.js\";\nimport nativeSelectClasses, { getNativeSelectUtilityClasses } from \"./nativeSelectClasses.js\";\nimport { styled } from \"../zero-styled/index.js\";\nimport rootShouldForwardProp from \"../styles/rootShouldForwardProp.js\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n  const {\n    classes,\n    variant,\n    disabled,\n    multiple,\n    open,\n    error\n  } = ownerState;\n  const slots = {\n    select: ['select', variant, disabled && 'disabled', multiple && 'multiple', error && 'error'],\n    icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled']\n  };\n  return composeClasses(slots, getNativeSelectUtilityClasses, classes);\n};\nexport const StyledSelectSelect = styled('select', {\n  name: 'MuiNativeSelect'\n})(({\n  theme\n}) => ({\n  // Reset\n  MozAppearance: 'none',\n  // Reset\n  WebkitAppearance: 'none',\n  // When interacting quickly, the text can end up selected.\n  // Native select can't be selected either.\n  userSelect: 'none',\n  // Reset\n  borderRadius: 0,\n  cursor: 'pointer',\n  '&:focus': {\n    // Reset Chrome style\n    borderRadius: 0\n  },\n  [`&.${nativeSelectClasses.disabled}`]: {\n    cursor: 'default'\n  },\n  '&[multiple]': {\n    height: 'auto'\n  },\n  '&:not([multiple]) option, &:not([multiple]) optgroup': {\n    backgroundColor: (theme.vars || theme).palette.background.paper\n  },\n  variants: [{\n    props: ({\n      ownerState\n    }) => ownerState.variant !== 'filled' && ownerState.variant !== 'outlined',\n    style: {\n      // Bump specificity to allow extending custom inputs\n      '&&&': {\n        paddingRight: 24,\n        minWidth: 16 // So it doesn't collapse.\n      }\n    }\n  }, {\n    props: {\n      variant: 'filled'\n    },\n    style: {\n      '&&&': {\n        paddingRight: 32\n      }\n    }\n  }, {\n    props: {\n      variant: 'outlined'\n    },\n    style: {\n      borderRadius: (theme.vars || theme).shape.borderRadius,\n      '&:focus': {\n        borderRadius: (theme.vars || theme).shape.borderRadius // Reset the reset for Chrome style\n      },\n      '&&&': {\n        paddingRight: 32\n      }\n    }\n  }]\n}));\nconst NativeSelectSelect = styled(StyledSelectSelect, {\n  name: 'MuiNativeSelect',\n  slot: 'Select',\n  shouldForwardProp: rootShouldForwardProp,\n  overridesResolver: (props, styles) => {\n    const {\n      ownerState\n    } = props;\n    return [styles.select, styles[ownerState.variant], ownerState.error && styles.error, {\n      [`&.${nativeSelectClasses.multiple}`]: styles.multiple\n    }];\n  }\n})({});\nexport const StyledSelectIcon = styled('svg', {\n  name: 'MuiNativeSelect'\n})(({\n  theme\n}) => ({\n  // We use a position absolute over a flexbox in order to forward the pointer events\n  // to the input and to support wrapping tags..\n  position: 'absolute',\n  right: 0,\n  // Center vertically, height is 1em\n  top: 'calc(50% - .5em)',\n  // Don't block pointer events on the select under the icon.\n  pointerEvents: 'none',\n  color: (theme.vars || theme).palette.action.active,\n  [`&.${nativeSelectClasses.disabled}`]: {\n    color: (theme.vars || theme).palette.action.disabled\n  },\n  variants: [{\n    props: ({\n      ownerState\n    }) => ownerState.open,\n    style: {\n      transform: 'rotate(180deg)'\n    }\n  }, {\n    props: {\n      variant: 'filled'\n    },\n    style: {\n      right: 7\n    }\n  }, {\n    props: {\n      variant: 'outlined'\n    },\n    style: {\n      right: 7\n    }\n  }]\n}));\nconst NativeSelectIcon = styled(StyledSelectIcon, {\n  name: 'MuiNativeSelect',\n  slot: 'Icon',\n  overridesResolver: (props, styles) => {\n    const {\n      ownerState\n    } = props;\n    return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];\n  }\n})({});\n\n/**\n * @ignore - internal component.\n */\nconst NativeSelectInput = /*#__PURE__*/React.forwardRef(function NativeSelectInput(props, ref) {\n  const {\n    className,\n    disabled,\n    error,\n    IconComponent,\n    inputRef,\n    variant = 'standard',\n    ...other\n  } = props;\n  const ownerState = {\n    ...props,\n    disabled,\n    variant,\n    error\n  };\n  const classes = useUtilityClasses(ownerState);\n  return /*#__PURE__*/_jsxs(React.Fragment, {\n    children: [/*#__PURE__*/_jsx(NativeSelectSelect, {\n      ownerState: ownerState,\n      className: clsx(classes.select, className),\n      disabled: disabled,\n      ref: inputRef || ref,\n      ...other\n    }), props.multiple ? null : /*#__PURE__*/_jsx(NativeSelectIcon, {\n      as: IconComponent,\n      ownerState: ownerState,\n      className: classes.icon\n    })]\n  });\n});\nprocess.env.NODE_ENV !== \"production\" ? NativeSelectInput.propTypes = {\n  /**\n   * The option elements to populate the select with.\n   * Can be some `<option>` elements.\n   */\n  children: PropTypes.node,\n  /**\n   * Override or extend the styles applied to the component.\n   */\n  classes: PropTypes.object,\n  /**\n   * The CSS class name of the select element.\n   */\n  className: PropTypes.string,\n  /**\n   * If `true`, the select is disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * If `true`, the `select input` will indicate an error.\n   */\n  error: PropTypes.bool,\n  /**\n   * The icon that displays the arrow.\n   */\n  IconComponent: PropTypes.elementType.isRequired,\n  /**\n   * Use that prop to pass a ref to the native select element.\n   * @deprecated\n   */\n  inputRef: refType,\n  /**\n   * @ignore\n   */\n  multiple: PropTypes.bool,\n  /**\n   * Name attribute of the `select` or hidden `input` element.\n   */\n  name: PropTypes.string,\n  /**\n   * Callback fired when a menu item is selected.\n   *\n   * @param {object} event The event source of the callback.\n   * You can pull out the new value by accessing `event.target.value` (string).\n   */\n  onChange: PropTypes.func,\n  /**\n   * The input value.\n   */\n  value: PropTypes.any,\n  /**\n   * The variant to use.\n   */\n  variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default NativeSelectInput;"],"names":["useUtilityClasses","ownerState","classes","variant","disabled","multiple","open","error","slots","capitalize","composeClasses","getNativeSelectUtilityClasses","StyledSelectSelect","styled","theme","nativeSelectClasses","NativeSelectSelect","rootShouldForwardProp","props","styles","StyledSelectIcon","NativeSelectIcon","NativeSelectInput","React","ref","className","IconComponent","inputRef","other","_jsxs","_jsx","clsx","PropTypes","refType"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/ui-components.es28.js

@@ -1,127 +1,258 @@
-import e from "./ui-components.es81.js";
-import p from "./ui-components.es118.js";
-import i from "./ui-components.es119.js";
-import s from "./ui-components.es40.js";
-import { useDefaultProps as a } from "./ui-components.es85.js";
-import c from "./ui-components.es120.js";
-const n = i({
-  createStyledComponent: s("div", {
-    name: "MuiGrid",
-    slot: "Root",
-    overridesResolver: (r, o) => {
-      const {
-        ownerState: t
-      } = r;
-      return [o.root, t.container && o.container];
+import * as j from "react";
+import r from "./ui-components.es81.js";
+import { clsx as O } from "./ui-components.es80.js";
+import { internal_createExtendSxProp as S } from "./ui-components.es110.js";
+import w from "./ui-components.es82.js";
+import B from "./ui-components.es94.js";
+import { getTypographyUtilityClass as P } from "./ui-components.es111.js";
+import { j as W } from "./ui-components.es12.js";
+import { useDefaultProps as C } from "./ui-components.es85.js";
+import R from "./ui-components.es31.js";
+import c from "./ui-components.es98.js";
+import M from "./ui-components.es86.js";
+const N = {
+  primary: !0,
+  secondary: !0,
+  error: !0,
+  info: !0,
+  success: !0,
+  warning: !0,
+  textPrimary: !0,
+  textSecondary: !0,
+  textDisabled: !0
+}, D = S(), E = (e) => {
+  const {
+    align: t,
+    gutterBottom: o,
+    noWrap: a,
+    paragraph: i,
+    variant: s,
+    classes: p
+  } = e, n = {
+    root: ["root", s, e.align !== "inherit" && `align${c(t)}`, o && "gutterBottom", a && "noWrap", i && "paragraph"]
+  };
+  return M(n, P, p);
+}, A = R("span", {
+  name: "MuiTypography",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: o
+    } = e;
+    return [t.root, o.variant && t[o.variant], o.align !== "inherit" && t[`align${c(o.align)}`], o.noWrap && t.noWrap, o.gutterBottom && t.gutterBottom, o.paragraph && t.paragraph];
+  }
+})(w(({
+  theme: e
+}) => ({
+  margin: 0,
+  variants: [{
+    props: {
+      variant: "inherit"
+    },
+    style: {
+      // Some elements, like <button> on Chrome have default font that doesn't inherit, reset this.
+      font: "inherit",
+      lineHeight: "inherit",
+      letterSpacing: "inherit"
+    }
+  }, ...Object.entries(e.typography).filter(([t, o]) => t !== "inherit" && o && typeof o == "object").map(([t, o]) => ({
+    props: {
+      variant: t
+    },
+    style: o
+  })), ...Object.entries(e.palette).filter(B()).map(([t]) => ({
+    props: {
+      color: t
+    },
+    style: {
+      color: (e.vars || e).palette[t].main
+    }
+  })), ...Object.entries(e.palette?.text || {}).filter(([, t]) => typeof t == "string").map(([t]) => ({
+    props: {
+      color: `text${c(t)}`
+    },
+    style: {
+      color: (e.vars || e).palette.text[t]
+    }
+  })), {
+    props: ({
+      ownerState: t
+    }) => t.align !== "inherit",
+    style: {
+      textAlign: "var(--Typography-textAlign)"
+    }
+  }, {
+    props: ({
+      ownerState: t
+    }) => t.noWrap,
+    style: {
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    }
+  }, {
+    props: ({
+      ownerState: t
+    }) => t.gutterBottom,
+    style: {
+      marginBottom: "0.35em"
     }
-  }),
-  componentName: "MuiGrid",
-  useThemeProps: (r) => a({
-    props: r,
-    name: "MuiGrid"
-  }),
-  useTheme: p
+  }, {
+    props: ({
+      ownerState: t
+    }) => t.paragraph,
+    style: {
+      marginBottom: 16
+    }
+  }]
+}))), b = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  inherit: "p"
+}, V = /* @__PURE__ */ j.forwardRef(function(t, o) {
+  const {
+    color: a,
+    ...i
+  } = C({
+    props: t,
+    name: "MuiTypography"
+  }), s = !N[a], p = D({
+    ...i,
+    ...s && {
+      color: a
+    }
+  }), {
+    align: n = "inherit",
+    className: m,
+    component: g,
+    gutterBottom: d = !1,
+    noWrap: x = !1,
+    paragraph: h = !1,
+    variant: l = "body1",
+    variantMapping: y = b,
+    ...f
+  } = p, u = {
+    ...p,
+    align: n,
+    color: a,
+    className: m,
+    component: g,
+    gutterBottom: d,
+    noWrap: x,
+    paragraph: h,
+    variant: l,
+    variantMapping: y
+  }, v = g || (h ? "p" : y[l] || b[l]) || "span", T = E(u);
+  return /* @__PURE__ */ W.jsx(A, {
+    as: v,
+    ref: o,
+    className: O(T.root, m),
+    ...f,
+    ownerState: u,
+    style: {
+      ...n !== "inherit" && {
+        "--Typography-textAlign": n
+      },
+      ...f.style
+    }
+  });
 });
-process.env.NODE_ENV !== "production" && (n.propTypes = {
+process.env.NODE_ENV !== "production" && (V.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
   // └─────────────────────────────────────────────────────────────────────┘
   /**
-   * The content of the component.
+   * Set the text-align on the component.
+   * @default 'inherit'
    */
-  children: e.node,
+  align: r.oneOf(["center", "inherit", "justify", "left", "right"]),
   /**
-   * The number of columns.
-   * @default 12
+   * The content of the component.
    */
-  columns: e.oneOfType([e.arrayOf(e.number), e.number, e.object]),
+  children: r.node,
   /**
-   * Defines the horizontal space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
+   * Override or extend the styles applied to the component.
    */
-  columnSpacing: e.oneOfType([e.arrayOf(e.oneOfType([e.number, e.string])), e.number, e.object, e.string]),
+  classes: r.object,
   /**
-   * If `true`, the component will have the flex *container* behavior.
-   * You should be wrapping *items* with a *container*.
-   * @default false
+   * @ignore
    */
-  container: e.bool,
+  className: r.string,
   /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
-   * @default 'row'
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
    */
-  direction: e.oneOfType([e.oneOf(["column-reverse", "column", "row-reverse", "row"]), e.arrayOf(e.oneOf(["column-reverse", "column", "row-reverse", "row"])), e.object]),
+  color: r.oneOfType([r.oneOf(["primary", "secondary", "success", "error", "info", "warning", "textPrimary", "textSecondary", "textDisabled"]), r.string]),
   /**
-   * Defines the offset value for the type `item` components.
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
    */
-  offset: e.oneOfType([e.string, e.number, e.arrayOf(e.oneOfType([e.string, e.number])), e.object]),
+  component: r.elementType,
   /**
-   * Defines the vertical space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
+   * If `true`, the text will have a bottom margin.
+   * @default false
    */
-  rowSpacing: e.oneOfType([e.arrayOf(e.oneOfType([e.number, e.string])), e.number, e.object, e.string]),
+  gutterBottom: r.bool,
   /**
-   * Defines the size of the the type `item` components.
+   * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
+   *
+   * Note that text overflow can only happen with block or inline-block level elements
+   * (the element needs to have a width in order to overflow).
+   * @default false
    */
-  size: e.oneOfType([e.string, e.bool, e.number, e.arrayOf(e.oneOfType([e.string, e.bool, e.number])), e.object]),
+  noWrap: r.bool,
   /**
-   * Defines the space between the type `item` components.
-   * It can only be used on a type `container` component.
-   * @default 0
+   * If `true`, the element will be a paragraph element.
+   * @default false
+   * @deprecated Use the `component` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  spacing: e.oneOfType([e.arrayOf(e.oneOfType([e.number, e.string])), e.number, e.object, e.string]),
+  paragraph: r.bool,
   /**
    * @ignore
    */
-  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  style: r.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.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid container> // level 1
-   *     <Grid container> // level 2
-   * ```
-   *
-   * Only consecutive grid is considered nesting. A grid container will start at
-   * `0` if there are non-Grid container element above it.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <div>
-   *     <Grid container> // level 0
-   * ```
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid>
-   *     <Grid container> // level 0
-   * ```
+   * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  unstable_level: e.number,
+  sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
   /**
-   * Defines the `flex-wrap` style property.
-   * It's applied for all screen sizes.
-   * @default 'wrap'
+   * Applies the theme typography styles.
+   * @default 'body1'
    */
-  wrap: e.oneOf(["nowrap", "wrap-reverse", "wrap"])
+  variant: r.oneOfType([r.oneOf(["body1", "body2", "button", "caption", "h1", "h2", "h3", "h4", "h5", "h6", "inherit", "overline", "subtitle1", "subtitle2"]), r.string]),
+  /**
+   * The component maps the variant prop to a range of different HTML element types.
+   * For instance, subtitle1 to `<h6>`.
+   * If you wish to change that mapping, you can provide your own.
+   * Alternatively, you can use the `component` prop.
+   * @default {
+   *   h1: 'h1',
+   *   h2: 'h2',
+   *   h3: 'h3',
+   *   h4: 'h4',
+   *   h5: 'h5',
+   *   h6: 'h6',
+   *   subtitle1: 'h6',
+   *   subtitle2: 'h6',
+   *   body1: 'p',
+   *   body2: 'p',
+   *   inherit: 'p',
+   * }
+   */
+  variantMapping: r.object
 });
-if (process.env.NODE_ENV !== "production") {
-  const r = n, o = c("Grid", r);
-  r.propTypes = {
-    // eslint-disable-next-line react/forbid-foreign-prop-types
-    ...r.propTypes,
-    direction: o("container"),
-    spacing: o("container"),
-    wrap: o("container")
-  };
-}
 export {
-  n as default
+  A as TypographyRoot,
+  V as default
 };
 //# sourceMappingURL=ui-components.es28.js.map