npm - @atipicus/mrs-ui - Versions diffs - 0.8.0 → 0.9.0 - Mend

@atipicus/mrs-ui 0.8.0 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.js CHANGED Viewed

@@ -24,7 +24,7 @@ function _interopNamespaceDefault(e) {
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const ReactDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactDOM);
-function formatMuiErrorMessage$2(code, ...args) {
+function formatMuiErrorMessage$1(code, ...args) {
   const url = new URL(`https://mui.com/production-error/?code=${code}`);
   args.forEach((arg2) => url.searchParams.append("args[]", arg2));
   return `Minified MUI error #${code}; visit ${url} for the full message.`;
@@ -108,7 +108,7 @@ var unitlessKeys = {
   strokeOpacity: 1,
   strokeWidth: 1
 };
-function memoize$2(fn2) {
+function memoize$1(fn2) {
   var cache = /* @__PURE__ */ Object.create(null);
   return function(arg2) {
     if (cache[arg2] === void 0) cache[arg2] = fn2(arg2);
@@ -123,7 +123,7 @@ var isCustomProperty = function isCustomProperty2(property) {
 var isProcessableValue = function isProcessableValue2(value) {
   return value != null && typeof value !== "boolean";
 };
-var processStyleName = /* @__PURE__ */ memoize$2(function(styleName) {
+var processStyleName = /* @__PURE__ */ memoize$1(function(styleName) {
   return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, "-$&").toLowerCase();
 });
 var processStyleValue = function processStyleValue2(key, value) {
@@ -1435,38 +1435,38 @@ function requireReactIs() {
   return reactIs.exports;
 }
 var reactIsExports = /* @__PURE__ */ requireReactIs();
-function isPlainObject$1(item) {
+function isPlainObject(item) {
   if (typeof item !== "object" || item === null) {
     return false;
   }
   const prototype = Object.getPrototypeOf(item);
   return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in item) && !(Symbol.iterator in item);
 }
-function deepClone$1(source) {
-  if (/* @__PURE__ */ React__namespace.isValidElement(source) || reactIsExports.isValidElementType(source) || !isPlainObject$1(source)) {
+function deepClone(source) {
+  if (/* @__PURE__ */ React__namespace.isValidElement(source) || reactIsExports.isValidElementType(source) || !isPlainObject(source)) {
     return source;
   }
   const output = {};
   Object.keys(source).forEach((key) => {
-    output[key] = deepClone$1(source[key]);
+    output[key] = deepClone(source[key]);
   });
   return output;
 }
-function deepmerge$1(target, source, options = {
+function deepmerge(target, source, options = {
   clone: true
 }) {
   const output = options.clone ? {
     ...target
   } : target;
-  if (isPlainObject$1(target) && isPlainObject$1(source)) {
+  if (isPlainObject(target) && isPlainObject(source)) {
     Object.keys(source).forEach((key) => {
       if (/* @__PURE__ */ React__namespace.isValidElement(source[key]) || reactIsExports.isValidElementType(source[key])) {
         output[key] = source[key];
-      } else if (isPlainObject$1(source[key]) && // Avoid prototype pollution
-      Object.prototype.hasOwnProperty.call(target, key) && isPlainObject$1(target[key])) {
-        output[key] = deepmerge$1(target[key], source[key], options);
+      } else if (isPlainObject(source[key]) && // Avoid prototype pollution
+      Object.prototype.hasOwnProperty.call(target, key) && isPlainObject(target[key])) {
+        output[key] = deepmerge(target[key], source[key], options);
       } else if (options.clone) {
-        output[key] = isPlainObject$1(source[key]) ? deepClone$1(source[key]) : source[key];
+        output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];
       } else {
         output[key] = source[key];
       }
@@ -1474,7 +1474,7 @@ function deepmerge$1(target, source, options = {
   }
   return output;
 }
-const sortBreakpointsValues$1 = (values2) => {
+const sortBreakpointsValues = (values2) => {
   const breakpointsAsArray = Object.keys(values2).map((key) => ({
     key,
     val: values2[key]
@@ -1487,7 +1487,7 @@ const sortBreakpointsValues$1 = (values2) => {
     };
   }, {});
 };
-function createBreakpoints$1(breakpoints) {
+function createBreakpoints(breakpoints) {
   const {
     // The breakpoint **start** at this value.
     // For instance with the first breakpoint xs: [xs, sm).
@@ -1507,7 +1507,7 @@ function createBreakpoints$1(breakpoints) {
     step = 5,
     ...other
   } = breakpoints;
-  const sortedValues = sortBreakpointsValues$1(values2);
+  const sortedValues = sortBreakpointsValues(values2);
   const keys = Object.keys(sortedValues);
   function up(key) {
     const value = typeof values2[key] === "number" ? values2[key] : key;
@@ -1549,7 +1549,7 @@ function createBreakpoints$1(breakpoints) {
     ...other
   };
 }
-function sortContainerQueries$1(theme2, css) {
+function sortContainerQueries(theme2, css) {
   if (!theme2.containerQueries) {
     return css;
   }
@@ -1569,15 +1569,15 @@ function sortContainerQueries$1(theme2, css) {
     ...css
   });
 }
-function isCqShorthand$1(breakpointKeys, value) {
+function isCqShorthand(breakpointKeys, value) {
   return value === "@" || value.startsWith("@") && (breakpointKeys.some((key) => value.startsWith(`@${key}`)) || !!value.match(/^@\d/));
 }
-function getContainerQuery$1(theme2, shorthand) {
+function getContainerQuery(theme2, shorthand) {
   const matches = shorthand.match(/^@([^/]+)?\/?(.+)?$/);
   if (!matches) {
     if (process.env.NODE_ENV !== "production") {
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The provided shorthand ${`(${shorthand})`} is invalid. The format should be \`@<breakpoint | number>\` or \`@<breakpoint | number>/<container>\`.
-For example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.` : formatMuiErrorMessage$2(18, `(${shorthand})`));
+For example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.` : formatMuiErrorMessage$1(18, `(${shorthand})`));
     }
     return null;
   }
@@ -1585,7 +1585,7 @@ For example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.` : formatMuiErrorMessage
   const value = Number.isNaN(+containerQuery) ? containerQuery || 0 : +containerQuery;
   return theme2.containerQueries(containerName).up(value);
 }
-function cssContainerQueries$1(themeInput) {
+function cssContainerQueries(themeInput) {
   const toContainerQuery = (mediaQuery, name) => mediaQuery.replace("@media", name ? `@container ${name}` : "@container");
   function attachCq(node2, name) {
     node2.up = (...args) => toContainerQuery(themeInput.breakpoints.up(...args), name);
@@ -1611,20 +1611,20 @@ function cssContainerQueries$1(themeInput) {
     containerQueries
   };
 }
-const shape$3 = {
+const shape$2 = {
   borderRadius: 4
 };
-const responsivePropType$1 = process.env.NODE_ENV !== "production" ? PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.array]) : {};
-function merge$1(acc, item) {
+const responsivePropType = process.env.NODE_ENV !== "production" ? PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.array]) : {};
+function merge(acc, item) {
   if (!item) {
     return acc;
   }
-  return deepmerge$1(acc, item, {
+  return deepmerge(acc, item, {
     clone: false
     // No need to clone deep, it's way faster.
   });
 }
-const values$2 = {
+const values$1 = {
   xs: 0,
   // phone
   sm: 600,
@@ -1636,16 +1636,16 @@ const values$2 = {
   xl: 1536
   // large screen
 };
-const defaultBreakpoints$1 = {
+const defaultBreakpoints = {
   // Sorted ASC by size. That's important.
   // It can't be configured as it's used statically for propTypes.
   keys: ["xs", "sm", "md", "lg", "xl"],
-  up: (key) => `@media (min-width:${values$2[key]}px)`
+  up: (key) => `@media (min-width:${values$1[key]}px)`
 };
-const defaultContainerQueries$1 = {
+const defaultContainerQueries = {
   containerQueries: (containerName) => ({
     up: (key) => {
-      let result = typeof key === "number" ? key : values$2[key] || key;
+      let result = typeof key === "number" ? key : values$1[key] || key;
       if (typeof result === "number") {
         result = `${result}px`;
       }
@@ -1653,24 +1653,24 @@ const defaultContainerQueries$1 = {
     }
   })
 };
-function handleBreakpoints$1(props, propValue, styleFromPropValue) {
+function handleBreakpoints(props, propValue, styleFromPropValue) {
   const theme2 = props.theme || {};
   if (Array.isArray(propValue)) {
-    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints$1;
+    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints;
     return propValue.reduce((acc, item, index) => {
       acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);
       return acc;
     }, {});
   }
   if (typeof propValue === "object") {
-    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints$1;
+    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints;
     return Object.keys(propValue).reduce((acc, breakpoint) => {
-      if (isCqShorthand$1(themeBreakpoints.keys, breakpoint)) {
-        const containerKey = getContainerQuery$1(theme2.containerQueries ? theme2 : defaultContainerQueries$1, breakpoint);
+      if (isCqShorthand(themeBreakpoints.keys, breakpoint)) {
+        const containerKey = getContainerQuery(theme2.containerQueries ? theme2 : defaultContainerQueries, breakpoint);
         if (containerKey) {
           acc[containerKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
         }
-      } else if (Object.keys(themeBreakpoints.values || values$2).includes(breakpoint)) {
+      } else if (Object.keys(themeBreakpoints.values || values$1).includes(breakpoint)) {
         const mediaKey = themeBreakpoints.up(breakpoint);
         acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
       } else {
@@ -1683,7 +1683,7 @@ function handleBreakpoints$1(props, propValue, styleFromPropValue) {
   const output = styleFromPropValue(propValue);
   return output;
 }
-function createEmptyBreakpointObject$1(breakpointsInput = {}) {
+function createEmptyBreakpointObject(breakpointsInput = {}) {
   const breakpointsInOrder = breakpointsInput.keys?.reduce((acc, key) => {
     const breakpointStyleKey = breakpointsInput.up(key);
     acc[breakpointStyleKey] = {};
@@ -1691,7 +1691,7 @@ function createEmptyBreakpointObject$1(breakpointsInput = {}) {
   }, {});
   return breakpointsInOrder || {};
 }
-function removeUnusedBreakpoints$1(breakpointKeys, style2) {
+function removeUnusedBreakpoints(breakpointKeys, style2) {
   return breakpointKeys.reduce((acc, key) => {
     const breakpointOutput = acc[key];
     const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;
@@ -1702,9 +1702,9 @@ function removeUnusedBreakpoints$1(breakpointKeys, style2) {
   }, style2);
 }
 function mergeBreakpointsInOrder(breakpointsInput, ...styles2) {
-  const emptyBreakpoints = createEmptyBreakpointObject$1(breakpointsInput);
-  const mergedOutput = [emptyBreakpoints, ...styles2].reduce((prev, next) => deepmerge$1(prev, next), {});
-  return removeUnusedBreakpoints$1(Object.keys(emptyBreakpoints), mergedOutput);
+  const emptyBreakpoints = createEmptyBreakpointObject(breakpointsInput);
+  const mergedOutput = [emptyBreakpoints, ...styles2].reduce((prev, next) => deepmerge(prev, next), {});
+  return removeUnusedBreakpoints(Object.keys(emptyBreakpoints), mergedOutput);
 }
 function computeBreakpointsBase(breakpointValues, themeBreakpoints) {
   if (typeof breakpointValues !== "object") {
@@ -1751,13 +1751,13 @@ function resolveBreakpointValues({
     return acc;
   }, {});
 }
-function capitalize$2(string) {
+function capitalize$1(string) {
   if (typeof string !== "string") {
-    throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `capitalize(string)` expects a string argument." : formatMuiErrorMessage$2(7));
+    throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `capitalize(string)` expects a string argument." : formatMuiErrorMessage$1(7));
   }
   return string.charAt(0).toUpperCase() + string.slice(1);
 }
-function getPath$1(obj, path, checkVars = true) {
+function getPath(obj, path, checkVars = true) {
   if (!path || typeof path !== "string") {
     return null;
   }
@@ -1774,21 +1774,21 @@ function getPath$1(obj, path, checkVars = true) {
     return null;
   }, obj);
 }
-function getStyleValue$2(themeMapping, transform, propValueFinal, userValue = propValueFinal) {
+function getStyleValue$1(themeMapping, transform, propValueFinal, userValue = propValueFinal) {
   let value;
   if (typeof themeMapping === "function") {
     value = themeMapping(propValueFinal);
   } else if (Array.isArray(themeMapping)) {
     value = themeMapping[propValueFinal] || userValue;
   } else {
-    value = getPath$1(themeMapping, propValueFinal) || userValue;
+    value = getPath(themeMapping, propValueFinal) || userValue;
   }
   if (transform) {
     value = transform(value, userValue, themeMapping);
   }
   return value;
 }
-function style$4(options) {
+function style$2(options) {
   const {
     prop,
     cssProperty = options.prop,
@@ -1801,11 +1801,11 @@ function style$4(options) {
     }
     const propValue = props[prop];
     const theme2 = props.theme;
-    const themeMapping = getPath$1(theme2, themeKey) || {};
+    const themeMapping = getPath(theme2, themeKey) || {};
     const styleFromPropValue = (propValueFinal) => {
-      let value = getStyleValue$2(themeMapping, transform, propValueFinal);
+      let value = getStyleValue$1(themeMapping, transform, propValueFinal);
       if (propValueFinal === value && typeof propValueFinal === "string") {
-        value = getStyleValue$2(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$2(propValueFinal)}`, propValueFinal);
+        value = getStyleValue$1(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$1(propValueFinal)}`, propValueFinal);
       }
       if (cssProperty === false) {
         return value;
@@ -1814,15 +1814,15 @@ function style$4(options) {
         [cssProperty]: value
       };
     };
-    return handleBreakpoints$1(props, propValue, styleFromPropValue);
+    return handleBreakpoints(props, propValue, styleFromPropValue);
   };
   fn2.propTypes = process.env.NODE_ENV !== "production" ? {
-    [prop]: responsivePropType$1
+    [prop]: responsivePropType
   } : {};
   fn2.filterProps = [prop];
   return fn2;
 }
-function memoize$1(fn2) {
+function memoize(fn2) {
   const cache = {};
   return (arg2) => {
     if (cache[arg2] === void 0) {
@@ -1831,11 +1831,11 @@ function memoize$1(fn2) {
     return cache[arg2];
   };
 }
-const properties$1 = {
+const properties = {
   m: "margin",
   p: "padding"
 };
-const directions$1 = {
+const directions = {
   t: "Top",
   r: "Right",
   b: "Bottom",
@@ -1843,30 +1843,30 @@ const directions$1 = {
   x: ["Left", "Right"],
   y: ["Top", "Bottom"]
 };
-const aliases$1 = {
+const aliases = {
   marginX: "mx",
   marginY: "my",
   paddingX: "px",
   paddingY: "py"
 };
-const getCssProperties$1 = memoize$1((prop) => {
+const getCssProperties = memoize((prop) => {
   if (prop.length > 2) {
-    if (aliases$1[prop]) {
-      prop = aliases$1[prop];
+    if (aliases[prop]) {
+      prop = aliases[prop];
     } else {
       return [prop];
     }
   }
   const [a, b] = prop.split("");
-  const property = properties$1[a];
-  const direction = directions$1[b] || "";
+  const property = properties[a];
+  const direction = directions[b] || "";
   return Array.isArray(direction) ? direction.map((dir) => property + dir) : [property + direction];
 });
-const marginKeys$1 = ["m", "mt", "mr", "mb", "ml", "mx", "my", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "marginInline", "marginInlineStart", "marginInlineEnd", "marginBlock", "marginBlockStart", "marginBlockEnd"];
-const paddingKeys$1 = ["p", "pt", "pr", "pb", "pl", "px", "py", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "paddingBlock", "paddingBlockStart", "paddingBlockEnd"];
-const spacingKeys$1 = [...marginKeys$1, ...paddingKeys$1];
-function createUnaryUnit$1(theme2, themeKey, defaultValue, propName) {
-  const themeSpacing = getPath$1(theme2, themeKey, true) ?? defaultValue;
+const marginKeys = ["m", "mt", "mr", "mb", "ml", "mx", "my", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "marginInline", "marginInlineStart", "marginInlineEnd", "marginBlock", "marginBlockStart", "marginBlockEnd"];
+const paddingKeys = ["p", "pt", "pr", "pb", "pl", "px", "py", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "paddingBlock", "paddingBlockStart", "paddingBlockEnd"];
+const spacingKeys = [...marginKeys, ...paddingKeys];
+function createUnaryUnit(theme2, themeKey, defaultValue, propName) {
+  const themeSpacing = getPath(theme2, themeKey, true) ?? defaultValue;
   if (typeof themeSpacing === "number" || typeof themeSpacing === "string") {
     return (val) => {
       if (typeof val === "string") {
@@ -1914,55 +1914,55 @@ function createUnaryUnit$1(theme2, themeKey, defaultValue, propName) {
   }
   return () => void 0;
 }
-function createUnarySpacing$1(theme2) {
-  return createUnaryUnit$1(theme2, "spacing", 8, "spacing");
+function createUnarySpacing(theme2) {
+  return createUnaryUnit(theme2, "spacing", 8, "spacing");
 }
-function getValue$1(transformer, propValue) {
+function getValue(transformer, propValue) {
   if (typeof propValue === "string" || propValue == null) {
     return propValue;
   }
   return transformer(propValue);
 }
-function getStyleFromPropValue$1(cssProperties, transformer) {
+function getStyleFromPropValue(cssProperties, transformer) {
   return (propValue) => cssProperties.reduce((acc, cssProperty) => {
-    acc[cssProperty] = getValue$1(transformer, propValue);
+    acc[cssProperty] = getValue(transformer, propValue);
     return acc;
   }, {});
 }
-function resolveCssProperty$1(props, keys, prop, transformer) {
+function resolveCssProperty(props, keys, prop, transformer) {
   if (!keys.includes(prop)) {
     return null;
   }
-  const cssProperties = getCssProperties$1(prop);
-  const styleFromPropValue = getStyleFromPropValue$1(cssProperties, transformer);
+  const cssProperties = getCssProperties(prop);
+  const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);
   const propValue = props[prop];
-  return handleBreakpoints$1(props, propValue, styleFromPropValue);
+  return handleBreakpoints(props, propValue, styleFromPropValue);
 }
-function style$3(props, keys) {
-  const transformer = createUnarySpacing$1(props.theme);
-  return Object.keys(props).map((prop) => resolveCssProperty$1(props, keys, prop, transformer)).reduce(merge$1, {});
+function style$1(props, keys) {
+  const transformer = createUnarySpacing(props.theme);
+  return Object.keys(props).map((prop) => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});
 }
-function margin$1(props) {
-  return style$3(props, marginKeys$1);
+function margin(props) {
+  return style$1(props, marginKeys);
 }
-margin$1.propTypes = process.env.NODE_ENV !== "production" ? marginKeys$1.reduce((obj, key) => {
-  obj[key] = responsivePropType$1;
+margin.propTypes = process.env.NODE_ENV !== "production" ? marginKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
   return obj;
 }, {}) : {};
-margin$1.filterProps = marginKeys$1;
-function padding$1(props) {
-  return style$3(props, paddingKeys$1);
+margin.filterProps = marginKeys;
+function padding(props) {
+  return style$1(props, paddingKeys);
 }
-padding$1.propTypes = process.env.NODE_ENV !== "production" ? paddingKeys$1.reduce((obj, key) => {
-  obj[key] = responsivePropType$1;
+padding.propTypes = process.env.NODE_ENV !== "production" ? paddingKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
   return obj;
 }, {}) : {};
-padding$1.filterProps = paddingKeys$1;
-process.env.NODE_ENV !== "production" ? spacingKeys$1.reduce((obj, key) => {
-  obj[key] = responsivePropType$1;
+padding.filterProps = paddingKeys;
+process.env.NODE_ENV !== "production" ? spacingKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
   return obj;
 }, {}) : {};
-function createSpacing$1(spacingInput = 8, transform = createUnarySpacing$1({
+function createSpacing(spacingInput = 8, transform = createUnarySpacing({
   spacing: spacingInput
 })) {
   if (spacingInput.mui) {
@@ -1983,7 +1983,7 @@ function createSpacing$1(spacingInput = 8, transform = createUnarySpacing$1({
   spacing2.mui = true;
   return spacing2;
 }
-function compose$1(...styles2) {
+function compose(...styles2) {
   const handlers = styles2.reduce((acc, style2) => {
     style2.filterProps.forEach((prop) => {
       acc[prop] = style2;
@@ -1993,7 +1993,7 @@ function compose$1(...styles2) {
   const fn2 = (props) => {
     return Object.keys(props).reduce((acc, prop) => {
       if (handlers[prop]) {
-        return merge$1(acc, handlers[prop](props));
+        return merge(acc, handlers[prop](props));
       }
       return acc;
     }, {});
@@ -2002,153 +2002,153 @@ function compose$1(...styles2) {
   fn2.filterProps = styles2.reduce((acc, style2) => acc.concat(style2.filterProps), []);
   return fn2;
 }
-function borderTransform$1(value) {
+function borderTransform(value) {
   if (typeof value !== "number") {
     return value;
   }
   return `${value}px solid`;
 }
-function createBorderStyle$1(prop, transform) {
-  return style$4({
+function createBorderStyle(prop, transform) {
+  return style$2({
     prop,
     themeKey: "borders",
     transform
   });
 }
-const border$1 = createBorderStyle$1("border", borderTransform$1);
-const borderTop$1 = createBorderStyle$1("borderTop", borderTransform$1);
-const borderRight$1 = createBorderStyle$1("borderRight", borderTransform$1);
-const borderBottom$1 = createBorderStyle$1("borderBottom", borderTransform$1);
-const borderLeft$1 = createBorderStyle$1("borderLeft", borderTransform$1);
-const borderColor$1 = createBorderStyle$1("borderColor");
-const borderTopColor$1 = createBorderStyle$1("borderTopColor");
-const borderRightColor$1 = createBorderStyle$1("borderRightColor");
-const borderBottomColor$1 = createBorderStyle$1("borderBottomColor");
-const borderLeftColor$1 = createBorderStyle$1("borderLeftColor");
-const outline$1 = createBorderStyle$1("outline", borderTransform$1);
-const outlineColor$1 = createBorderStyle$1("outlineColor");
-const borderRadius$1 = (props) => {
+const border = createBorderStyle("border", borderTransform);
+const borderTop = createBorderStyle("borderTop", borderTransform);
+const borderRight = createBorderStyle("borderRight", borderTransform);
+const borderBottom = createBorderStyle("borderBottom", borderTransform);
+const borderLeft = createBorderStyle("borderLeft", borderTransform);
+const borderColor = createBorderStyle("borderColor");
+const borderTopColor = createBorderStyle("borderTopColor");
+const borderRightColor = createBorderStyle("borderRightColor");
+const borderBottomColor = createBorderStyle("borderBottomColor");
+const borderLeftColor = createBorderStyle("borderLeftColor");
+const outline = createBorderStyle("outline", borderTransform);
+const outlineColor = createBorderStyle("outlineColor");
+const borderRadius = (props) => {
   if (props.borderRadius !== void 0 && props.borderRadius !== null) {
-    const transformer = createUnaryUnit$1(props.theme, "shape.borderRadius", 4, "borderRadius");
+    const transformer = createUnaryUnit(props.theme, "shape.borderRadius", 4, "borderRadius");
     const styleFromPropValue = (propValue) => ({
-      borderRadius: getValue$1(transformer, propValue)
+      borderRadius: getValue(transformer, propValue)
     });
-    return handleBreakpoints$1(props, props.borderRadius, styleFromPropValue);
+    return handleBreakpoints(props, props.borderRadius, styleFromPropValue);
   }
   return null;
 };
-borderRadius$1.propTypes = process.env.NODE_ENV !== "production" ? {
-  borderRadius: responsivePropType$1
+borderRadius.propTypes = process.env.NODE_ENV !== "production" ? {
+  borderRadius: responsivePropType
 } : {};
-borderRadius$1.filterProps = ["borderRadius"];
-compose$1(border$1, borderTop$1, borderRight$1, borderBottom$1, borderLeft$1, borderColor$1, borderTopColor$1, borderRightColor$1, borderBottomColor$1, borderLeftColor$1, borderRadius$1, outline$1, outlineColor$1);
-const gap$1 = (props) => {
+borderRadius.filterProps = ["borderRadius"];
+compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius, outline, outlineColor);
+const gap = (props) => {
   if (props.gap !== void 0 && props.gap !== null) {
-    const transformer = createUnaryUnit$1(props.theme, "spacing", 8, "gap");
+    const transformer = createUnaryUnit(props.theme, "spacing", 8, "gap");
     const styleFromPropValue = (propValue) => ({
-      gap: getValue$1(transformer, propValue)
+      gap: getValue(transformer, propValue)
     });
-    return handleBreakpoints$1(props, props.gap, styleFromPropValue);
+    return handleBreakpoints(props, props.gap, styleFromPropValue);
   }
   return null;
 };
-gap$1.propTypes = process.env.NODE_ENV !== "production" ? {
-  gap: responsivePropType$1
+gap.propTypes = process.env.NODE_ENV !== "production" ? {
+  gap: responsivePropType
 } : {};
-gap$1.filterProps = ["gap"];
-const columnGap$1 = (props) => {
+gap.filterProps = ["gap"];
+const columnGap = (props) => {
   if (props.columnGap !== void 0 && props.columnGap !== null) {
-    const transformer = createUnaryUnit$1(props.theme, "spacing", 8, "columnGap");
+    const transformer = createUnaryUnit(props.theme, "spacing", 8, "columnGap");
     const styleFromPropValue = (propValue) => ({
-      columnGap: getValue$1(transformer, propValue)
+      columnGap: getValue(transformer, propValue)
     });
-    return handleBreakpoints$1(props, props.columnGap, styleFromPropValue);
+    return handleBreakpoints(props, props.columnGap, styleFromPropValue);
   }
   return null;
 };
-columnGap$1.propTypes = process.env.NODE_ENV !== "production" ? {
-  columnGap: responsivePropType$1
+columnGap.propTypes = process.env.NODE_ENV !== "production" ? {
+  columnGap: responsivePropType
 } : {};
-columnGap$1.filterProps = ["columnGap"];
-const rowGap$1 = (props) => {
+columnGap.filterProps = ["columnGap"];
+const rowGap = (props) => {
   if (props.rowGap !== void 0 && props.rowGap !== null) {
-    const transformer = createUnaryUnit$1(props.theme, "spacing", 8, "rowGap");
+    const transformer = createUnaryUnit(props.theme, "spacing", 8, "rowGap");
     const styleFromPropValue = (propValue) => ({
-      rowGap: getValue$1(transformer, propValue)
+      rowGap: getValue(transformer, propValue)
     });
-    return handleBreakpoints$1(props, props.rowGap, styleFromPropValue);
+    return handleBreakpoints(props, props.rowGap, styleFromPropValue);
   }
   return null;
 };
-rowGap$1.propTypes = process.env.NODE_ENV !== "production" ? {
-  rowGap: responsivePropType$1
+rowGap.propTypes = process.env.NODE_ENV !== "production" ? {
+  rowGap: responsivePropType
 } : {};
-rowGap$1.filterProps = ["rowGap"];
-const gridColumn$1 = style$4({
+rowGap.filterProps = ["rowGap"];
+const gridColumn = style$2({
   prop: "gridColumn"
 });
-const gridRow$1 = style$4({
+const gridRow = style$2({
   prop: "gridRow"
 });
-const gridAutoFlow$1 = style$4({
+const gridAutoFlow = style$2({
   prop: "gridAutoFlow"
 });
-const gridAutoColumns$1 = style$4({
+const gridAutoColumns = style$2({
   prop: "gridAutoColumns"
 });
-const gridAutoRows$1 = style$4({
+const gridAutoRows = style$2({
   prop: "gridAutoRows"
 });
-const gridTemplateColumns$1 = style$4({
+const gridTemplateColumns = style$2({
   prop: "gridTemplateColumns"
 });
-const gridTemplateRows$1 = style$4({
+const gridTemplateRows = style$2({
   prop: "gridTemplateRows"
 });
-const gridTemplateAreas$1 = style$4({
+const gridTemplateAreas = style$2({
   prop: "gridTemplateAreas"
 });
-const gridArea$1 = style$4({
+const gridArea = style$2({
   prop: "gridArea"
 });
-compose$1(gap$1, columnGap$1, rowGap$1, gridColumn$1, gridRow$1, gridAutoFlow$1, gridAutoColumns$1, gridAutoRows$1, gridTemplateColumns$1, gridTemplateRows$1, gridTemplateAreas$1, gridArea$1);
-function paletteTransform$1(value, userValue) {
+compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);
+function paletteTransform(value, userValue) {
   if (userValue === "grey") {
     return userValue;
   }
   return value;
 }
-const color$1 = style$4({
+const color = style$2({
   prop: "color",
   themeKey: "palette",
-  transform: paletteTransform$1
+  transform: paletteTransform
 });
-const bgcolor$1 = style$4({
+const bgcolor = style$2({
   prop: "bgcolor",
   cssProperty: "backgroundColor",
   themeKey: "palette",
-  transform: paletteTransform$1
+  transform: paletteTransform
 });
-const backgroundColor$1 = style$4({
+const backgroundColor = style$2({
   prop: "backgroundColor",
   themeKey: "palette",
-  transform: paletteTransform$1
+  transform: paletteTransform
 });
-compose$1(color$1, bgcolor$1, backgroundColor$1);
-function sizingTransform$1(value) {
+compose(color, bgcolor, backgroundColor);
+function sizingTransform(value) {
   return value <= 1 && value !== 0 ? `${value * 100}%` : value;
 }
-const width$1 = style$4({
+const width = style$2({
   prop: "width",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-const maxWidth$1 = (props) => {
+const maxWidth = (props) => {
   if (props.maxWidth !== void 0 && props.maxWidth !== null) {
     const styleFromPropValue = (propValue) => {
-      const breakpoint = props.theme?.breakpoints?.values?.[propValue] || values$2[propValue];
+      const breakpoint = props.theme?.breakpoints?.values?.[propValue] || values$1[propValue];
       if (!breakpoint) {
         return {
-          maxWidth: sizingTransform$1(propValue)
+          maxWidth: sizingTransform(propValue)
         };
       }
       if (props.theme?.breakpoints?.unit !== "px") {
@@ -2160,62 +2160,62 @@ const maxWidth$1 = (props) => {
         maxWidth: breakpoint
       };
     };
-    return handleBreakpoints$1(props, props.maxWidth, styleFromPropValue);
+    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
   }
   return null;
 };
-maxWidth$1.filterProps = ["maxWidth"];
-const minWidth$1 = style$4({
+maxWidth.filterProps = ["maxWidth"];
+const minWidth = style$2({
   prop: "minWidth",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-const height$1 = style$4({
+const height = style$2({
   prop: "height",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-const maxHeight$1 = style$4({
+const maxHeight = style$2({
   prop: "maxHeight",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-const minHeight$1 = style$4({
+const minHeight = style$2({
   prop: "minHeight",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-style$4({
+style$2({
   prop: "size",
   cssProperty: "width",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-style$4({
+style$2({
   prop: "size",
   cssProperty: "height",
-  transform: sizingTransform$1
+  transform: sizingTransform
 });
-const boxSizing$1 = style$4({
+const boxSizing = style$2({
   prop: "boxSizing"
 });
-compose$1(width$1, maxWidth$1, minWidth$1, height$1, maxHeight$1, minHeight$1, boxSizing$1);
-const defaultSxConfig$1 = {
+compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);
+const defaultSxConfig = {
   // borders
   border: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   borderTop: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   borderRight: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   borderBottom: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   borderLeft: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   borderColor: {
     themeKey: "palette"
@@ -2234,149 +2234,149 @@ const defaultSxConfig$1 = {
   },
   outline: {
     themeKey: "borders",
-    transform: borderTransform$1
+    transform: borderTransform
   },
   outlineColor: {
     themeKey: "palette"
   },
   borderRadius: {
     themeKey: "shape.borderRadius",
-    style: borderRadius$1
+    style: borderRadius
   },
   // palette
   color: {
     themeKey: "palette",
-    transform: paletteTransform$1
+    transform: paletteTransform
   },
   bgcolor: {
     themeKey: "palette",
     cssProperty: "backgroundColor",
-    transform: paletteTransform$1
+    transform: paletteTransform
   },
   backgroundColor: {
     themeKey: "palette",
-    transform: paletteTransform$1
+    transform: paletteTransform
   },
   // spacing
   p: {
-    style: padding$1
+    style: padding
   },
   pt: {
-    style: padding$1
+    style: padding
   },
   pr: {
-    style: padding$1
+    style: padding
   },
   pb: {
-    style: padding$1
+    style: padding
   },
   pl: {
-    style: padding$1
+    style: padding
   },
   px: {
-    style: padding$1
+    style: padding
   },
   py: {
-    style: padding$1
+    style: padding
   },
   padding: {
-    style: padding$1
+    style: padding
   },
   paddingTop: {
-    style: padding$1
+    style: padding
   },
   paddingRight: {
-    style: padding$1
+    style: padding
   },
   paddingBottom: {
-    style: padding$1
+    style: padding
   },
   paddingLeft: {
-    style: padding$1
+    style: padding
   },
   paddingX: {
-    style: padding$1
+    style: padding
   },
   paddingY: {
-    style: padding$1
+    style: padding
   },
   paddingInline: {
-    style: padding$1
+    style: padding
   },
   paddingInlineStart: {
-    style: padding$1
+    style: padding
   },
   paddingInlineEnd: {
-    style: padding$1
+    style: padding
   },
   paddingBlock: {
-    style: padding$1
+    style: padding
   },
   paddingBlockStart: {
-    style: padding$1
+    style: padding
   },
   paddingBlockEnd: {
-    style: padding$1
+    style: padding
   },
   m: {
-    style: margin$1
+    style: margin
   },
   mt: {
-    style: margin$1
+    style: margin
   },
   mr: {
-    style: margin$1
+    style: margin
   },
   mb: {
-    style: margin$1
+    style: margin
   },
   ml: {
-    style: margin$1
+    style: margin
   },
   mx: {
-    style: margin$1
+    style: margin
   },
   my: {
-    style: margin$1
+    style: margin
   },
   margin: {
-    style: margin$1
+    style: margin
   },
   marginTop: {
-    style: margin$1
+    style: margin
   },
   marginRight: {
-    style: margin$1
+    style: margin
   },
   marginBottom: {
-    style: margin$1
+    style: margin
   },
   marginLeft: {
-    style: margin$1
+    style: margin
   },
   marginX: {
-    style: margin$1
+    style: margin
   },
   marginY: {
-    style: margin$1
+    style: margin
   },
   marginInline: {
-    style: margin$1
+    style: margin
   },
   marginInlineStart: {
-    style: margin$1
+    style: margin
   },
   marginInlineEnd: {
-    style: margin$1
+    style: margin
   },
   marginBlock: {
-    style: margin$1
+    style: margin
   },
   marginBlockStart: {
-    style: margin$1
+    style: margin
   },
   marginBlockEnd: {
-    style: margin$1
+    style: margin
   },
   // display
   displayPrint: {
@@ -2408,13 +2408,13 @@ const defaultSxConfig$1 = {
   justifySelf: {},
   // grid
   gap: {
-    style: gap$1
+    style: gap
   },
   rowGap: {
-    style: rowGap$1
+    style: rowGap
   },
   columnGap: {
-    style: columnGap$1
+    style: columnGap
   },
   gridColumn: {},
   gridRow: {},
@@ -2440,22 +2440,22 @@ const defaultSxConfig$1 = {
   },
   // sizing
   width: {
-    transform: sizingTransform$1
+    transform: sizingTransform
   },
   maxWidth: {
-    style: maxWidth$1
+    style: maxWidth
   },
   minWidth: {
-    transform: sizingTransform$1
+    transform: sizingTransform
   },
   height: {
-    transform: sizingTransform$1
+    transform: sizingTransform
   },
   maxHeight: {
-    transform: sizingTransform$1
+    transform: sizingTransform
   },
   minHeight: {
-    transform: sizingTransform$1
+    transform: sizingTransform
   },
   boxSizing: {},
   // typography
@@ -2483,15 +2483,15 @@ const defaultSxConfig$1 = {
     themeKey: "typography"
   }
 };
-function objectsHaveSameKeys$1(...objects) {
+function objectsHaveSameKeys(...objects) {
   const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);
   const union = new Set(allKeys);
   return objects.every((object) => union.size === Object.keys(object).length);
 }
-function callIfFn$1(maybeFn, arg2) {
+function callIfFn(maybeFn, arg2) {
   return typeof maybeFn === "function" ? maybeFn(arg2) : maybeFn;
 }
-function unstable_createStyleFunctionSx$1() {
+function unstable_createStyleFunctionSx() {
   function getThemeValue(prop, val, theme2, config2) {
     const props = {
       [prop]: val,
@@ -2517,14 +2517,14 @@ function unstable_createStyleFunctionSx$1() {
         [prop]: val
       };
     }
-    const themeMapping = getPath$1(theme2, themeKey) || {};
+    const themeMapping = getPath(theme2, themeKey) || {};
     if (style2) {
       return style2(props);
     }
     const styleFromPropValue = (propValueFinal) => {
-      let value = getStyleValue$2(themeMapping, transform, propValueFinal);
+      let value = getStyleValue$1(themeMapping, transform, propValueFinal);
       if (propValueFinal === value && typeof propValueFinal === "string") {
-        value = getStyleValue$2(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$2(propValueFinal)}`, propValueFinal);
+        value = getStyleValue$1(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$1(propValueFinal)}`, propValueFinal);
       }
       if (cssProperty === false) {
         return value;
@@ -2533,7 +2533,7 @@ function unstable_createStyleFunctionSx$1() {
         [cssProperty]: value
       };
     };
-    return handleBreakpoints$1(props, val, styleFromPropValue);
+    return handleBreakpoints(props, val, styleFromPropValue);
   }
   function styleFunctionSx2(props) {
     const {
@@ -2544,7 +2544,7 @@ function unstable_createStyleFunctionSx$1() {
     if (!sx) {
       return null;
     }
-    const config2 = theme2.unstable_sxConfig ?? defaultSxConfig$1;
+    const config2 = theme2.unstable_sxConfig ?? defaultSxConfig;
     function traverse(sxInput) {
       let sxObject = sxInput;
       if (typeof sxInput === "function") {
@@ -2555,50 +2555,50 @@ function unstable_createStyleFunctionSx$1() {
       if (!sxObject) {
         return null;
       }
-      const emptyBreakpoints = createEmptyBreakpointObject$1(theme2.breakpoints);
+      const emptyBreakpoints = createEmptyBreakpointObject(theme2.breakpoints);
       const breakpointsKeys = Object.keys(emptyBreakpoints);
       let css = emptyBreakpoints;
       Object.keys(sxObject).forEach((styleKey) => {
-        const value = callIfFn$1(sxObject[styleKey], theme2);
+        const value = callIfFn(sxObject[styleKey], theme2);
         if (value !== null && value !== void 0) {
           if (typeof value === "object") {
             if (config2[styleKey]) {
-              css = merge$1(css, getThemeValue(styleKey, value, theme2, config2));
+              css = merge(css, getThemeValue(styleKey, value, theme2, config2));
             } else {
-              const breakpointsValues = handleBreakpoints$1({
+              const breakpointsValues = handleBreakpoints({
                 theme: theme2
               }, value, (x) => ({
                 [styleKey]: x
               }));
-              if (objectsHaveSameKeys$1(breakpointsValues, value)) {
+              if (objectsHaveSameKeys(breakpointsValues, value)) {
                 css[styleKey] = styleFunctionSx2({
                   sx: value,
                   theme: theme2,
                   nested: true
                 });
               } else {
-                css = merge$1(css, breakpointsValues);
+                css = merge(css, breakpointsValues);
               }
             }
           } else {
-            css = merge$1(css, getThemeValue(styleKey, value, theme2, config2));
+            css = merge(css, getThemeValue(styleKey, value, theme2, config2));
           }
         }
       });
       if (!nested && theme2.modularCssLayers) {
         return {
-          "@layer sx": sortContainerQueries$1(theme2, removeUnusedBreakpoints$1(breakpointsKeys, css))
+          "@layer sx": sortContainerQueries(theme2, removeUnusedBreakpoints(breakpointsKeys, css))
         };
       }
-      return sortContainerQueries$1(theme2, removeUnusedBreakpoints$1(breakpointsKeys, css));
+      return sortContainerQueries(theme2, removeUnusedBreakpoints(breakpointsKeys, css));
     }
     return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);
   }
   return styleFunctionSx2;
 }
-const styleFunctionSx$1 = unstable_createStyleFunctionSx$1();
-styleFunctionSx$1.filterProps = ["sx"];
-function applyStyles$3(key, styles2) {
+const styleFunctionSx = unstable_createStyleFunctionSx();
+styleFunctionSx.filterProps = ["sx"];
+function applyStyles$2(key, styles2) {
   const theme2 = this;
   if (theme2.vars) {
     if (!theme2.colorSchemes?.[key] || typeof theme2.getColorSchemeSelector !== "function") {
@@ -2620,7 +2620,7 @@ function applyStyles$3(key, styles2) {
   }
   return {};
 }
-function createTheme$2(options = {}, ...args) {
+function createTheme$1(options = {}, ...args) {
   const {
     breakpoints: breakpointsInput = {},
     palette: paletteInput = {},
@@ -2628,9 +2628,9 @@ function createTheme$2(options = {}, ...args) {
     shape: shapeInput = {},
     ...other
   } = options;
-  const breakpoints = createBreakpoints$1(breakpointsInput);
-  const spacing2 = createSpacing$1(spacingInput);
-  let muiTheme = deepmerge$1({
+  const breakpoints = createBreakpoints(breakpointsInput);
+  const spacing2 = createSpacing(spacingInput);
+  let muiTheme = deepmerge({
     breakpoints,
     direction: "ltr",
     components: {},
@@ -2641,19 +2641,19 @@ function createTheme$2(options = {}, ...args) {
     },
     spacing: spacing2,
     shape: {
-      ...shape$3,
+      ...shape$2,
       ...shapeInput
     }
   }, other);
-  muiTheme = cssContainerQueries$1(muiTheme);
-  muiTheme.applyStyles = applyStyles$3;
-  muiTheme = args.reduce((acc, argument) => deepmerge$1(acc, argument), muiTheme);
+  muiTheme = cssContainerQueries(muiTheme);
+  muiTheme.applyStyles = applyStyles$2;
+  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
   muiTheme.unstable_sxConfig = {
-    ...defaultSxConfig$1,
+    ...defaultSxConfig,
     ...other?.unstable_sxConfig
   };
   muiTheme.unstable_sx = function sx(props) {
-    return styleFunctionSx$1({
+    return styleFunctionSx({
       sx: props,
       theme: this
     });
@@ -2667,7 +2667,7 @@ function useTheme$2(defaultTheme2 = null) {
   const contextTheme = React__namespace.useContext(react.ThemeContext);
   return !contextTheme || isObjectEmpty$2(contextTheme) ? defaultTheme2 : contextTheme;
 }
-const systemDefaultTheme$1 = createTheme$2();
+const systemDefaultTheme$1 = createTheme$1();
 function useTheme$1(defaultTheme2 = systemDefaultTheme$1) {
   return useTheme$2(defaultTheme2);
 }
@@ -2728,7 +2728,7 @@ const splitProps = (props) => {
     systemProps: {},
     otherProps: {}
   };
-  const config2 = props?.theme?.unstable_sxConfig ?? defaultSxConfig$1;
+  const config2 = props?.theme?.unstable_sxConfig ?? defaultSxConfig;
   Object.keys(props).forEach((prop) => {
     if (config2[prop]) {
       result.systemProps[prop] = props[prop];
@@ -2753,7 +2753,7 @@ function extendSxProp$1(props) {
   } else if (typeof inSx === "function") {
     finalSx = (...args) => {
       const result = inSx(...args);
-      if (!isPlainObject$1(result)) {
+      if (!isPlainObject(result)) {
         return systemProps;
       }
       return {
@@ -2810,7 +2810,7 @@ function createBox(options = {}) {
   } = options;
   const BoxRoot = styled$2("div", {
     shouldForwardProp: (prop) => prop !== "theme" && prop !== "sx" && prop !== "as"
-  })(styleFunctionSx$1);
+  })(styleFunctionSx);
   const Box2 = /* @__PURE__ */ React__namespace.forwardRef(function Box3(inProps, ref) {
     const theme2 = useTheme$1(defaultTheme2);
     const {
@@ -2904,8 +2904,8 @@ function preprocessStyles(input) {
   }
   return result;
 }
-const systemDefaultTheme = createTheme$2();
-function shouldForwardProp$1(prop) {
+const systemDefaultTheme = createTheme$1();
+function shouldForwardProp(prop) {
   return prop !== "ownerState" && prop !== "theme" && prop !== "sx" && prop !== "as";
 }
 function shallowLayer(serialized, layerName) {
@@ -2983,14 +2983,14 @@ function createStyled(input = {}) {
   const {
     themeId,
     defaultTheme: defaultTheme2 = systemDefaultTheme,
-    rootShouldForwardProp: rootShouldForwardProp2 = shouldForwardProp$1,
-    slotShouldForwardProp: slotShouldForwardProp2 = shouldForwardProp$1
+    rootShouldForwardProp: rootShouldForwardProp2 = shouldForwardProp,
+    slotShouldForwardProp: slotShouldForwardProp2 = shouldForwardProp
   } = input;
   function styleAttachTheme(props) {
     attachTheme(props, themeId, defaultTheme2);
   }
   const styled2 = (tag, inputOptions = {}) => {
-    internal_mutateStyles(tag, (styles2) => styles2.filter((style2) => style2 !== styleFunctionSx$1));
+    internal_mutateStyles(tag, (styles2) => styles2.filter((style2) => style2 !== styleFunctionSx));
     const {
       name: componentName,
       slot: componentSlot,
@@ -3008,7 +3008,7 @@ function createStyled(input = {}) {
       componentSlot && componentSlot !== "Root" && componentSlot !== "root" || false
     );
     const skipSx = inputSkipSx || false;
-    let shouldForwardPropOption = shouldForwardProp$1;
+    let shouldForwardPropOption = shouldForwardProp;
     if (componentSlot === "Root" || componentSlot === "root") {
       shouldForwardPropOption = rootShouldForwardProp2;
     } else if (componentSlot) {
@@ -3030,7 +3030,7 @@ function createStyled(input = {}) {
           return processStyle(props, style2, props.theme.modularCssLayers ? layerName : void 0);
         };
       }
-      if (isPlainObject$1(style2)) {
+      if (isPlainObject(style2)) {
         const serialized = preprocessStyles(style2);
         return function styleObjectProcessor(props) {
           if (!serialized.variants) {
@@ -3071,7 +3071,7 @@ function createStyled(input = {}) {
         });
       }
       if (!skipSx) {
-        expressionsTail.push(styleFunctionSx$1);
+        expressionsTail.push(styleFunctionSx);
       }
       if (Array.isArray(expressionsBody[0])) {
         const inputStrings = expressionsBody.shift();
@@ -3103,7 +3103,7 @@ function createStyled(input = {}) {
 }
 function generateDisplayName(componentName, componentSlot, tag) {
   if (componentName) {
-    return `${componentName}${capitalize$2(componentSlot || "")}`;
+    return `${componentName}${capitalize$1(componentSlot || "")}`;
   }
   return `Styled(${getDisplayName(tag)})`;
 }
@@ -3340,7 +3340,7 @@ function decomposeColor(color2) {
   const type = color2.substring(0, marker);
   if (!["rgb", "rgba", "hsl", "hsla", "color"].includes(type)) {
     throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color2}\` color.
-The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : formatMuiErrorMessage$2(9, color2));
+The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : formatMuiErrorMessage$1(9, color2));
   }
   let values2 = color2.substring(marker + 1, color2.length - 1);
   let colorSpace;
@@ -3352,7 +3352,7 @@ The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
     }
     if (!["srgb", "display-p3", "a98-rgb", "prophoto-rgb", "rec-2020"].includes(colorSpace)) {
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
-The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : formatMuiErrorMessage$2(10, colorSpace));
+The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : formatMuiErrorMessage$1(10, colorSpace));
     }
   } else {
     values2 = values2.split(",");
@@ -4059,13 +4059,13 @@ function getReactElementRef(element) {
   }
   return element?.ref || null;
 }
-const RtlContext$1 = /* @__PURE__ */ React__namespace.createContext();
+const RtlContext = /* @__PURE__ */ React__namespace.createContext();
 process.env.NODE_ENV !== "production" ? {
   children: PropTypes.node,
   value: PropTypes.bool
 } : void 0;
-const useRtl$1 = () => {
-  const value = React__namespace.useContext(RtlContext$1);
+const useRtl = () => {
+  const value = React__namespace.useContext(RtlContext);
   return value ?? false;
 };
 const PropsContext = /* @__PURE__ */ React__namespace.createContext(void 0);
@@ -4254,7 +4254,7 @@ function prepareCssVars(theme2, parserConfig = {}) {
       css,
       varsWithDefaults
     } = cssVarsParser(scheme, parserConfig);
-    themeVars = deepmerge$1(themeVars, varsWithDefaults);
+    themeVars = deepmerge(themeVars, varsWithDefaults);
     colorSchemesMap[key] = {
       css,
       vars
@@ -4266,7 +4266,7 @@ function prepareCssVars(theme2, parserConfig = {}) {
       vars,
       varsWithDefaults
     } = cssVarsParser(defaultScheme, parserConfig);
-    themeVars = deepmerge$1(themeVars, varsWithDefaults);
+    themeVars = deepmerge(themeVars, varsWithDefaults);
     colorSchemesMap[defaultColorScheme] = {
       css,
       vars
@@ -4311,7 +4311,7 @@ function prepareCssVars(theme2, parserConfig = {}) {
     Object.entries(colorSchemesMap).forEach(([, {
       vars: schemeVars
     }]) => {
-      vars = deepmerge$1(vars, schemeVars);
+      vars = deepmerge(vars, schemeVars);
     });
     return vars;
   };
@@ -4396,7 +4396,7 @@ function createGetColorSchemeSelector(selector) {
     return "&";
   };
 }
-const defaultTheme$4 = createTheme$2();
+const defaultTheme$4 = createTheme$1();
 const defaultCreateStyledComponent$2 = styled$1("div", {
   name: "MuiContainer",
   slot: "Root",
@@ -4404,7 +4404,7 @@ const defaultCreateStyledComponent$2 = styled$1("div", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`maxWidth${capitalize$2(String(ownerState.maxWidth))}`], ownerState.fixed && styles2.fixed, ownerState.disableGutters && styles2.disableGutters];
+    return [styles2.root, styles2[`maxWidth${capitalize$1(String(ownerState.maxWidth))}`], ownerState.fixed && styles2.fixed, ownerState.disableGutters && styles2.disableGutters];
   }
 });
 const useThemePropsDefault$2 = (inProps) => useThemeProps$1({
@@ -4423,7 +4423,7 @@ const useUtilityClasses$2b = (ownerState, componentName) => {
     maxWidth: maxWidth2
   } = ownerState;
   const slots = {
-    root: ["root", maxWidth2 && `maxWidth${capitalize$2(String(maxWidth2))}`, fixed && "fixed", disableGutters && "disableGutters"]
+    root: ["root", maxWidth2 && `maxWidth${capitalize$1(String(maxWidth2))}`, fixed && "fixed", disableGutters && "disableGutters"]
   };
   return composeClasses$1(slots, getContainerUtilityClass, classes);
 };
@@ -4788,7 +4788,7 @@ function deleteLegacyGridProps(props, breakpoints) {
     });
   }
 }
-const defaultTheme$3 = createTheme$2();
+const defaultTheme$3 = createTheme$1();
 const defaultCreateStyledComponent$1 = styled$1("div", {
   name: "MuiGrid",
   slot: "Root",
@@ -4921,7 +4921,7 @@ function createGrid(options = {}) {
   Grid3.muiName = "Grid";
   return Grid3;
 }
-const defaultTheme$2 = createTheme$2();
+const defaultTheme$2 = createTheme$1();
 const defaultCreateStyledComponent = styled$1("div", {
   name: "MuiStack",
   slot: "Root",
@@ -4954,14 +4954,14 @@ const getSideFromDirection = (direction) => {
     "column-reverse": "Bottom"
   }[direction];
 };
-const style$2 = ({
+const style = ({
   ownerState,
   theme: theme2
 }) => {
   let styles2 = {
     display: "flex",
     flexDirection: "column",
-    ...handleBreakpoints$1({
+    ...handleBreakpoints({
       theme: theme2
     }, resolveBreakpointValues({
       values: ownerState.direction,
@@ -4971,7 +4971,7 @@ const style$2 = ({
     }))
   };
   if (ownerState.spacing) {
-    const transformer = createUnarySpacing$1(theme2);
+    const transformer = createUnarySpacing(theme2);
     const base = Object.keys(theme2.breakpoints.values).reduce((acc, breakpoint) => {
       if (typeof ownerState.spacing === "object" && ownerState.spacing[breakpoint] != null || typeof ownerState.direction === "object" && ownerState.direction[breakpoint] != null) {
         acc[breakpoint] = true;
@@ -4998,7 +4998,7 @@ const style$2 = ({
     const styleFromPropValue = (propValue, breakpoint) => {
       if (ownerState.useFlexGap) {
         return {
-          gap: getValue$1(transformer, propValue)
+          gap: getValue(transformer, propValue)
         };
       }
       return {
@@ -5008,11 +5008,11 @@ const style$2 = ({
           margin: 0
         },
         "& > :not(style) ~ :not(style)": {
-          [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue$1(transformer, propValue)
+          [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
         }
       };
     };
-    styles2 = deepmerge$1(styles2, handleBreakpoints$1({
+    styles2 = deepmerge(styles2, handleBreakpoints({
       theme: theme2
     }, spacingValues, styleFromPropValue));
   }
@@ -5032,7 +5032,7 @@ function createStack(options = {}) {
     };
     return composeClasses$1(slots, (slot) => generateUtilityClass$1(componentName, slot), {});
   };
-  const StackRoot = createStyledComponent(style$2);
+  const StackRoot = createStyledComponent(style);
   const Stack2 = /* @__PURE__ */ React__namespace.forwardRef(function Grid3(inProps, ref) {
     const themeProps = useThemeProps2(inProps);
     const props = extendSxProp$1(themeProps);
@@ -5340,7 +5340,7 @@ function createPalette(palette) {
     }
     if (!color2.hasOwnProperty("main")) {
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The color${name ? ` (${name})` : ""} provided to augmentColor(color) is invalid.
-The color object needs to have a \`main\` property or a \`${mainShade}\` property.` : formatMuiErrorMessage$2(11, name ? ` (${name})` : "", mainShade));
+The color object needs to have a \`main\` property or a \`${mainShade}\` property.` : formatMuiErrorMessage$1(11, name ? ` (${name})` : "", mainShade));
     }
     if (typeof color2.main !== "string") {
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The color${name ? ` (${name})` : ""} provided to augmentColor(color) is invalid.
@@ -5356,7 +5356,7 @@ const theme1 = createTheme({ palette: {
 const theme2 = createTheme({ palette: {
   primary: { main: green[500] },
-} });` : formatMuiErrorMessage$2(12, name ? ` (${name})` : "", JSON.stringify(color2.main)));
+} });` : formatMuiErrorMessage$1(12, name ? ` (${name})` : "", JSON.stringify(color2.main)));
     }
     addLightOrDark(color2, "light", lightShade, tonalOffset);
     addLightOrDark(color2, "dark", darkShade, tonalOffset);
@@ -5376,7 +5376,7 @@ const theme2 = createTheme({ palette: {
       console.error(`MUI: The palette mode \`${mode}\` is not supported.`);
     }
   }
-  const paletteOutput = deepmerge$1({
+  const paletteOutput = deepmerge({
     // A collection of common colors.
     common: {
       ...common
@@ -5534,7 +5534,7 @@ function createTypography(palette, typography2) {
       letterSpacing: "inherit"
     }
   };
-  return deepmerge$1({
+  return deepmerge({
     htmlFontSize,
     pxToRem,
     fontFamily,
@@ -5649,7 +5649,7 @@ const zIndex = {
   tooltip: 1500
 };
 function isSerializable(val) {
-  return isPlainObject$1(val) || typeof val === "undefined" || typeof val === "string" || typeof val === "boolean" || typeof val === "number" || Array.isArray(val);
+  return isPlainObject(val) || typeof val === "undefined" || typeof val === "string" || typeof val === "boolean" || typeof val === "number" || Array.isArray(val);
 }
 function stringifyTheme(baseTheme = {}) {
   const serializableTheme = {
@@ -5661,7 +5661,7 @@ function stringifyTheme(baseTheme = {}) {
       const [key, value] = array[index];
       if (!isSerializable(value) || key.startsWith("unstable_")) {
         delete object[key];
-      } else if (isPlainObject$1(value)) {
+      } else if (isPlainObject(value)) {
         object[key] = {
           ...value
         };
@@ -5693,11 +5693,11 @@ function createThemeNoVars(options = {}, ...args) {
   if (options.vars && // The error should throw only for the root theme creation because user is not allowed to use a custom node `vars`.
   // `generateThemeVars` is the closest identifier for checking that the `options` is a result of `createTheme` with CSS variables so that user can create new theme for nested ThemeProvider.
   options.generateThemeVars === void 0) {
-    throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `vars` is a private field used for CSS variables support.\nPlease use another name or follow the [docs](https://mui.com/material-ui/customization/css-theme-variables/usage/) to enable the feature." : formatMuiErrorMessage$2(20));
+    throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `vars` is a private field used for CSS variables support.\nPlease use another name or follow the [docs](https://mui.com/material-ui/customization/css-theme-variables/usage/) to enable the feature." : formatMuiErrorMessage$1(20));
   }
   const palette = createPalette(paletteInput);
-  const systemTheme = createTheme$2(options);
-  let muiTheme = deepmerge$1(systemTheme, {
+  const systemTheme = createTheme$1(options);
+  let muiTheme = deepmerge(systemTheme, {
     mixins: createMixins(systemTheme.breakpoints, mixinsInput),
     palette,
     // Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.
@@ -5708,8 +5708,8 @@ function createThemeNoVars(options = {}, ...args) {
       ...zIndex
     }
   });
-  muiTheme = deepmerge$1(muiTheme, other);
-  muiTheme = args.reduce((acc, argument) => deepmerge$1(acc, argument), muiTheme);
+  muiTheme = deepmerge(muiTheme, other);
+  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
   if (process.env.NODE_ENV !== "production") {
     const stateClasses = ["active", "checked", "completed", "disabled", "error", "expanded", "focused", "focusVisible", "required", "selected"];
     const traverse = (node, component) => {
@@ -5737,11 +5737,11 @@ function createThemeNoVars(options = {}, ...args) {
     });
   }
   muiTheme.unstable_sxConfig = {
-    ...defaultSxConfig$1,
+    ...defaultSxConfig,
     ...other?.unstable_sxConfig
   };
   muiTheme.unstable_sx = function sx(props) {
-    return styleFunctionSx$1({
+    return styleFunctionSx({
       sx: props,
       theme: this
     });
@@ -5968,7 +5968,7 @@ function createThemeWithVars(options = {}, ...args) {
     defaultScheme = true;
   }
   if (!defaultScheme) {
-    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`colorSchemes.${defaultColorScheme}\` option is either missing or invalid.` : formatMuiErrorMessage$2(21, defaultColorScheme));
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`colorSchemes.${defaultColorScheme}\` option is either missing or invalid.` : formatMuiErrorMessage$1(21, defaultColorScheme));
   }
   const muiTheme = attachColorScheme$1(colorSchemes2, defaultScheme, input, defaultColorScheme);
   if (builtInLight && !colorSchemes2.light) {
@@ -6167,7 +6167,7 @@ function createThemeWithVars(options = {}, ...args) {
       }
     });
   });
-  theme2 = args.reduce((acc, argument) => deepmerge$1(acc, argument), theme2);
+  theme2 = args.reduce((acc, argument) => deepmerge(acc, argument), theme2);
   const parserConfig = {
     prefix: cssVarPrefix,
     disableCssColorScheme,
@@ -6186,17 +6186,17 @@ function createThemeWithVars(options = {}, ...args) {
   theme2.generateThemeVars = generateThemeVars;
   theme2.generateStyleSheets = generateStyleSheets;
   theme2.generateSpacing = function generateSpacing() {
-    return createSpacing$1(input.spacing, createUnarySpacing$1(this));
+    return createSpacing(input.spacing, createUnarySpacing(this));
   };
   theme2.getColorSchemeSelector = createGetColorSchemeSelector(selector);
   theme2.spacing = theme2.generateSpacing();
   theme2.shouldSkipGeneratingVar = shouldSkipGeneratingVar$1;
   theme2.unstable_sxConfig = {
-    ...defaultSxConfig$1,
+    ...defaultSxConfig,
     ...input?.unstable_sxConfig
   };
   theme2.unstable_sx = function sx(props) {
-    return styleFunctionSx$1({
+    return styleFunctionSx({
       sx: props,
       theme: this
     });
@@ -6219,7 +6219,7 @@ function attachColorScheme(theme2, scheme, colorScheme) {
     };
   }
 }
-function createTheme$1(options = {}, ...args) {
+function createTheme(options = {}, ...args) {
   const {
     palette,
     cssVariables = false,
@@ -6294,7 +6294,7 @@ function getUnit(input) {
 function toUnitless(length) {
   return parseFloat(length);
 }
-const defaultTheme$1 = createTheme$1();
+const defaultTheme$1 = createTheme();
 function useTheme() {
   const theme2 = useTheme$1(defaultTheme$1);
   if (process.env.NODE_ENV !== "production") {
@@ -6324,12 +6324,12 @@ const styled = createStyled({
 });
 const colorSchemes = { "light": { "palette": { "primary": { "main": "#00686f", "dark": "#004e53", "light": "#009999", "contrastText": "#ffffff", "_states": { "hover": "#0099991f", "selected": "#00999929", "focus": "#00999940", "focusVisible": "#009999" } }, "secondary": { "main": "#99cc00", "dark": "#7aa300", "light": "#b3d633", "contrastText": "#000000de" }, "error": { "main": "#ab1a1a", "dark": "#8b1515", "light": "#d32f2f", "contrastText": "#ffffff" }, "warning": { "main": "#dfa00a", "dark": "#b88308", "light": "#f5b642", "contrastText": "#000000de" }, "info": { "main": "#143996", "dark": "#0C225A", "light": "#D1DAF0", "contrastText": "#ffffff" }, "success": { "main": "#036642", "dark": "#023321", "light": "#B3D1C7", "contrastText": "#ffffff" }, "background": { "default": "#ffffff", "paper": "#ffffff" }, "text": { "primary": "#000000de", "secondary": "#00000099", "disabled": "#00000061" }, "action": { "active": "#0000008f", "hover": "#00000014", "selected": "#0000001f", "disabled": "#00000042", "disabledBackground": "#0000001f" }, "divider": "#0000001f", "_components": { "alert": { "error": { "filled": { "background": "#ab1a1a", "foreground": "#ffffff" }, "outlined": { "background": "#fdeded", "foreground": "#5f2120", "border": "#ab1a1a" }, "standard": { "background": "#fdeded", "foreground": "#5f2120" } }, "warning": { "filled": { "background": "#dfa00a", "foreground": "#000000de" }, "outlined": { "background": "#fff4e5", "foreground": "#3e2410", "border": "#dfa00a" }, "standard": { "background": "#fff4e5", "foreground": "#3e2410" } }, "info": { "filled": { "background": "#2481b8", "foreground": "#ffffff" }, "outlined": { "background": "#e5f6fd", "foreground": "#014361", "border": "#2481b8" }, "standard": { "background": "#e5f6fd", "foreground": "#014361" } }, "success": { "filled": { "background": "#2e7d32", "foreground": "#ffffff" }, "outlined": { "background": "#edf7ed", "foreground": "#1e4620", "border": "#2e7d32" }, "standard": { "background": "#edf7ed", "foreground": "#1e4620" } } }, "rating": { "activeFill": "#ffb400", "enabledBorder": "#0000003b" }, "chip": { "defaultCloseFill": "#000000", "defaultEnabledBorder": "#bdbdbd" }, "input": { "standard": { "enabledBorder": "#0000006b" }, "filled": { "enabledFill": "#0000000f" }, "outlined": { "enabledBorder": "#0000003b" } }, "table": { "border": "#e0e0e0" }, "paper": { "elevation0": "#ffffff", "elevation1": "#ffffff", "elevation2": "#ffffff" } } } }, "dark": { "palette": { "primary": { "main": "#009999", "dark": "#00686f", "light": "#33adad", "contrastText": "#000000", "_states": { "hover": "#0099993d", "selected": "#00999952", "focus": "#00999966", "focusVisible": "#009999" } }, "secondary": { "main": "#b3d633", "dark": "#99cc00", "light": "#c5e066", "contrastText": "#000000" }, "error": { "main": "#f44336", "dark": "#d32f2f", "light": "#e57373", "contrastText": "#ffffff" }, "warning": { "main": "#f5b642", "dark": "#dfa00a", "light": "#f7c875", "contrastText": "#000000" }, "info": { "main": "#4f9fd1", "dark": "#2481b8", "light": "#72b3dd", "contrastText": "#000000" }, "success": { "main": "#66bb6a", "dark": "#388e3c", "light": "#81c784", "contrastText": "#000000" }, "background": { "default": "#121212", "paper": "#1e1e1e" }, "text": { "primary": "#ffffff", "secondary": "#ffffffb3", "disabled": "#ffffff80" }, "action": { "active": "#ffffff", "hover": "#ffffff14", "selected": "#ffffff1f", "disabled": "#ffffff42", "disabledBackground": "#ffffff1f" }, "divider": "#ffffff1f", "_components": { "alert": { "error": { "filled": { "background": "#f44336", "foreground": "#ffffff" }, "outlined": { "background": "#3d1a1a", "foreground": "#f8b8b8", "border": "#f44336" }, "standard": { "background": "#3d1a1a", "foreground": "#f8b8b8" } }, "warning": { "filled": { "background": "#f5b642", "foreground": "#000000" }, "outlined": { "background": "#3d3118", "foreground": "#f7d498", "border": "#f5b642" }, "standard": { "background": "#3d3118", "foreground": "#f7d498" } }, "info": { "filled": { "background": "#4f9fd1", "foreground": "#000000" }, "outlined": { "background": "#1a2f3d", "foreground": "#b8d9f0", "border": "#4f9fd1" }, "standard": { "background": "#1a2f3d", "foreground": "#b8d9f0" } }, "success": { "filled": { "background": "#66bb6a", "foreground": "#000000" }, "outlined": { "background": "#1e3a1f", "foreground": "#c8e6ca", "border": "#66bb6a" }, "standard": { "background": "#1e3a1f", "foreground": "#c8e6ca" } } }, "rating": { "activeFill": "#ffb400", "enabledBorder": "#ffffff3b" }, "chip": { "defaultCloseFill": "#ffffff", "defaultEnabledBorder": "#757575" }, "input": { "standard": { "enabledBorder": "#ffffff6b" }, "filled": { "enabledFill": "#ffffff1f" }, "outlined": { "enabledBorder": "#ffffff3b" } }, "table": { "border": "#424242" }, "paper": { "elevation0": "#1e1e1e", "elevation1": "#2a2a2a", "elevation2": "#353535" } } } } };
 const typography$1 = { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontSize": 16, "fontWeightLight": 300, "fontWeightRegular": 400, "fontWeightMedium": 500, "fontWeightSemiBold": 600, "fontWeightBold": 700, "h1": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "3.75rem", "lineHeight": 1.2, "letterSpacing": "-0.01562em" }, "h2": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "3rem", "lineHeight": 1.2, "letterSpacing": "-0.00833em" }, "h3": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "2.125rem", "lineHeight": 1.2, "letterSpacing": "0em" }, "h4": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "1.5rem", "lineHeight": 1.2, "letterSpacing": "0.00735em" }, "h5": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "1.25rem", "lineHeight": 1.2, "letterSpacing": "0em" }, "h6": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "1rem", "lineHeight": 1.2, "letterSpacing": "0.0075em" }, "body1": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 400, "fontSize": "1rem", "lineHeight": 1.5, "letterSpacing": "0.00938em" }, "body2": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 400, "fontSize": "0.875rem", "lineHeight": 1.43, "letterSpacing": "0.01071em" }, "subtitle1": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 500, "fontSize": "1rem", "lineHeight": 1.75, "letterSpacing": "0.00938em" }, "subtitle2": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 500, "fontSize": "0.875rem", "lineHeight": 1.57, "letterSpacing": "0.00714em" }, "button": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 600, "fontSize": "0.875rem", "lineHeight": 1.75, "letterSpacing": "0.02857em", "textTransform": "none" }, "caption": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 400, "fontSize": "0.75rem", "lineHeight": 1.66, "letterSpacing": "0.03333em" }, "overline": { "fontFamily": "Nunito, Helvetica, Arial, sans-serif", "fontWeight": 400, "fontSize": "0.75rem", "lineHeight": 2.66, "letterSpacing": "0.08333em", "textTransform": "uppercase" } };
-const shape$2 = { "borderRadius": 8, "sm": 4, "md": 8, "lg": 12, "xl": 24, "rounded": 9999 };
+const shape$1 = { "borderRadius": 8, "sm": 4, "md": 8, "lg": 12, "xl": 24, "rounded": 9999 };
 const spacing$2 = [0, 4, 8, 12, 16, 24, 32, 40, 48, 56, 64, 72, 80, 88, 96];
 const themeTokens = {
   colorSchemes,
   typography: typography$1,
-  shape: shape$2,
+  shape: shape$1,
   spacing: spacing$2
 };
 const ComponentAlertDarkErrorFilledBackground = "#f48282";
@@ -7277,7 +7277,7 @@ const getComponentOverrides = (mode) => {
     }
   };
 };
-const lightTheme = createTheme$1({
+const lightTheme = createTheme({
   palette: {
     mode: "light",
     primary: lightTokens.colors.primary,
@@ -7300,7 +7300,7 @@ const lightTheme = createTheme$1({
   spacing: spacing$1,
   components: getComponentOverrides("light")
 });
-const darkTheme = createTheme$1({
+const darkTheme = createTheme({
   palette: {
     mode: "dark",
     primary: darkTokens.colors.primary,
@@ -7329,11 +7329,11 @@ const colors = {
   dark: themeTokens.colorSchemes.dark.palette
 };
 const typography = themeTokens.typography;
-const shape$1 = themeTokens.shape;
+const shape = themeTokens.shape;
 const spacing = themeTokens.spacing;
 const tokens = themeTokens;
 const boxClasses = generateUtilityClasses$1("MuiBox", ["root"]);
-const defaultTheme = createTheme$1();
+const defaultTheme = createTheme();
 const Box$1 = createBox({
   themeId: THEME_ID,
   defaultTheme,
@@ -7488,7 +7488,7 @@ const useUtilityClasses$2a = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", color2 !== "inherit" && `color${capitalize$2(color2)}`, `fontSize${capitalize$2(fontSize)}`]
+    root: ["root", color2 !== "inherit" && `color${capitalize$1(color2)}`, `fontSize${capitalize$1(fontSize)}`]
   };
   return composeClasses$1(slots, getSvgIconUtilityClass, classes);
 };
@@ -7499,7 +7499,7 @@ const SvgIconRoot = styled("svg", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$2(ownerState.color)}`], styles2[`fontSize${capitalize$2(ownerState.fontSize)}`]];
+    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$1(ownerState.color)}`], styles2[`fontSize${capitalize$1(ownerState.fontSize)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -8191,7 +8191,7 @@ const useUtilityClasses$28 = (ownerState) => {
   } = ownerState;
   const slots = {
     root: ["root"],
-    badge: ["badge", variant, invisible && "invisible", `anchorOrigin${capitalize$2(anchorOrigin.vertical)}${capitalize$2(anchorOrigin.horizontal)}`, `anchorOrigin${capitalize$2(anchorOrigin.vertical)}${capitalize$2(anchorOrigin.horizontal)}${capitalize$2(overlap)}`, `overlap${capitalize$2(overlap)}`, color2 !== "default" && `color${capitalize$2(color2)}`]
+    badge: ["badge", variant, invisible && "invisible", `anchorOrigin${capitalize$1(anchorOrigin.vertical)}${capitalize$1(anchorOrigin.horizontal)}`, `anchorOrigin${capitalize$1(anchorOrigin.vertical)}${capitalize$1(anchorOrigin.horizontal)}${capitalize$1(overlap)}`, `overlap${capitalize$1(overlap)}`, color2 !== "default" && `color${capitalize$1(color2)}`]
   };
   return composeClasses$1(slots, getBadgeUtilityClass, classes);
 };
@@ -8213,7 +8213,7 @@ const BadgeBadge = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.badge, styles2[ownerState.variant], styles2[`anchorOrigin${capitalize$2(ownerState.anchorOrigin.vertical)}${capitalize$2(ownerState.anchorOrigin.horizontal)}${capitalize$2(ownerState.overlap)}`], ownerState.color !== "default" && styles2[`color${capitalize$2(ownerState.color)}`], ownerState.invisible && styles2.invisible];
+    return [styles2.badge, styles2[ownerState.variant], styles2[`anchorOrigin${capitalize$1(ownerState.anchorOrigin.vertical)}${capitalize$1(ownerState.anchorOrigin.horizontal)}${capitalize$1(ownerState.overlap)}`], ownerState.color !== "default" && styles2[`color${capitalize$1(ownerState.color)}`], ownerState.invisible && styles2.invisible];
   }
 })(memoTheme(({
   theme: theme2
@@ -8644,7 +8644,7 @@ const useUtilityClasses$27 = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", variant, ownerState.align !== "inherit" && `align${capitalize$2(align)}`, gutterBottom && "gutterBottom", noWrap && "noWrap", paragraph && "paragraph"]
+    root: ["root", variant, ownerState.align !== "inherit" && `align${capitalize$1(align)}`, gutterBottom && "gutterBottom", noWrap && "noWrap", paragraph && "paragraph"]
   };
   return composeClasses$1(slots, getTypographyUtilityClass, classes);
 };
@@ -8655,7 +8655,7 @@ const TypographyRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.variant && styles2[ownerState.variant], ownerState.align !== "inherit" && styles2[`align${capitalize$2(ownerState.align)}`], ownerState.noWrap && styles2.noWrap, ownerState.gutterBottom && styles2.gutterBottom, ownerState.paragraph && styles2.paragraph];
+    return [styles2.root, ownerState.variant && styles2[ownerState.variant], ownerState.align !== "inherit" && styles2[`align${capitalize$1(ownerState.align)}`], ownerState.noWrap && styles2.noWrap, ownerState.gutterBottom && styles2.gutterBottom, ownerState.paragraph && styles2.paragraph];
   }
 })(memoTheme(({
   theme: theme2
@@ -8685,7 +8685,7 @@ const TypographyRoot = styled("span", {
     }
   })), ...Object.entries(theme2.palette?.text || {}).filter(([, value]) => typeof value === "string").map(([color2]) => ({
     props: {
-      color: `text${capitalize$2(color2)}`
+      color: `text${capitalize$1(color2)}`
     },
     style: {
       color: (theme2.vars || theme2).palette.text[color2]
@@ -9931,7 +9931,7 @@ function getNextChildMapping(nextProps, prevChildMapping, onExited) {
   });
   return children;
 }
-var values$1 = Object.values || function(obj) {
+var values = Object.values || function(obj) {
   return Object.keys(obj).map(function(k) {
     return obj[k];
   });
@@ -9995,7 +9995,7 @@ var TransitionGroup = /* @__PURE__ */ (function(_React$Component) {
   _proto.render = function render() {
     var _this$props = this.props, Component = _this$props.component, childFactory2 = _this$props.childFactory, props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]);
     var contextValue = this.state.contextValue;
-    var children = values$1(this.state.children).map(childFactory2);
+    var children = values(this.state.children).map(childFactory2);
     delete props.appear;
     delete props.enter;
     delete props.exit;
@@ -10888,9 +10888,9 @@ const useUtilityClasses$25 = (ownerState) => {
     disableShrink
   } = ownerState;
   const slots = {
-    root: ["root", variant, `color${capitalize$2(color2)}`],
+    root: ["root", variant, `color${capitalize$1(color2)}`],
     svg: ["svg"],
-    circle: ["circle", `circle${capitalize$2(variant)}`, disableShrink && "circleDisableShrink"]
+    circle: ["circle", `circle${capitalize$1(variant)}`, disableShrink && "circleDisableShrink"]
   };
   return composeClasses$1(slots, getCircularProgressUtilityClass, classes);
 };
@@ -10901,7 +10901,7 @@ const CircularProgressRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.variant], styles2[`color${capitalize$2(ownerState.color)}`]];
+    return [styles2.root, styles2[ownerState.variant], styles2[`color${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -10945,7 +10945,7 @@ const CircularProgressCircle = styled("circle", {
     const {
       ownerState
     } = props;
-    return [styles2.circle, styles2[`circle${capitalize$2(ownerState.variant)}`], ownerState.disableShrink && styles2.circleDisableShrink];
+    return [styles2.circle, styles2[`circle${capitalize$1(ownerState.variant)}`], ownerState.disableShrink && styles2.circleDisableShrink];
   }
 })(memoTheme(({
   theme: theme2
@@ -11132,9 +11132,9 @@ const useUtilityClasses$24 = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", loading && "loading", variant, `${variant}${capitalize$2(color2)}`, `size${capitalize$2(size)}`, `${variant}Size${capitalize$2(size)}`, `color${capitalize$2(color2)}`, disableElevation && "disableElevation", fullWidth && "fullWidth", loading && `loadingPosition${capitalize$2(loadingPosition)}`],
-    startIcon: ["icon", "startIcon", `iconSize${capitalize$2(size)}`],
-    endIcon: ["icon", "endIcon", `iconSize${capitalize$2(size)}`],
+    root: ["root", loading && "loading", variant, `${variant}${capitalize$1(color2)}`, `size${capitalize$1(size)}`, `${variant}Size${capitalize$1(size)}`, `color${capitalize$1(color2)}`, disableElevation && "disableElevation", fullWidth && "fullWidth", loading && `loadingPosition${capitalize$1(loadingPosition)}`],
+    startIcon: ["icon", "startIcon", `iconSize${capitalize$1(size)}`],
+    endIcon: ["icon", "endIcon", `iconSize${capitalize$1(size)}`],
     loadingIndicator: ["loadingIndicator"],
     loadingWrapper: ["loadingWrapper"]
   };
@@ -11181,7 +11181,7 @@ const ButtonRoot = styled(ButtonBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.variant], styles2[`${ownerState.variant}${capitalize$2(ownerState.color)}`], styles2[`size${capitalize$2(ownerState.size)}`], styles2[`${ownerState.variant}Size${capitalize$2(ownerState.size)}`], ownerState.color === "inherit" && styles2.colorInherit, ownerState.disableElevation && styles2.disableElevation, ownerState.fullWidth && styles2.fullWidth, ownerState.loading && styles2.loading];
+    return [styles2.root, styles2[ownerState.variant], styles2[`${ownerState.variant}${capitalize$1(ownerState.color)}`], styles2[`size${capitalize$1(ownerState.size)}`], styles2[`${ownerState.variant}Size${capitalize$1(ownerState.size)}`], ownerState.color === "inherit" && styles2.colorInherit, ownerState.disableElevation && styles2.disableElevation, ownerState.fullWidth && styles2.fullWidth, ownerState.loading && styles2.loading];
   }
 })(memoTheme(({
   theme: theme2
@@ -11390,7 +11390,7 @@ const ButtonStartIcon = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.startIcon, ownerState.loading && styles2.startIconLoadingStart, styles2[`iconSize${capitalize$2(ownerState.size)}`]];
+    return [styles2.startIcon, ownerState.loading && styles2.startIconLoadingStart, styles2[`iconSize${capitalize$1(ownerState.size)}`]];
   }
 })(({
   theme: theme2
@@ -11434,7 +11434,7 @@ const ButtonEndIcon = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.endIcon, ownerState.loading && styles2.endIconLoadingEnd, styles2[`iconSize${capitalize$2(ownerState.size)}`]];
+    return [styles2.endIcon, ownerState.loading && styles2.endIconLoadingEnd, styles2[`iconSize${capitalize$1(ownerState.size)}`]];
   }
 })(({
   theme: theme2
@@ -11828,7 +11828,7 @@ const useUtilityClasses$23 = (ownerState) => {
     edge
   } = ownerState;
   const slots = {
-    root: ["root", checked && "checked", disabled && "disabled", edge && `edge${capitalize$2(edge)}`],
+    root: ["root", checked && "checked", disabled && "disabled", edge && `edge${capitalize$1(edge)}`],
     input: ["input"]
   };
   return composeClasses$1(slots, getSwitchBaseUtilityClass, classes);
@@ -12173,7 +12173,7 @@ const useUtilityClasses$22 = (ownerState) => {
     size
   } = ownerState;
   const slots = {
-    root: ["root", indeterminate && "indeterminate", `color${capitalize$2(color2)}`, `size${capitalize$2(size)}`]
+    root: ["root", indeterminate && "indeterminate", `color${capitalize$1(color2)}`, `size${capitalize$1(size)}`]
   };
   const composedClasses = composeClasses$1(slots, getCheckboxUtilityClass, classes);
   return {
@@ -12190,7 +12190,7 @@ const CheckboxRoot = styled(SwitchBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.indeterminate && styles2.indeterminate, styles2[`size${capitalize$2(ownerState.size)}`], ownerState.color !== "default" && styles2[`color${capitalize$2(ownerState.color)}`]];
+    return [styles2.root, ownerState.indeterminate && styles2.indeterminate, styles2[`size${capitalize$1(ownerState.size)}`], ownerState.color !== "default" && styles2[`color${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -12482,11 +12482,11 @@ const useUtilityClasses$21 = (ownerState) => {
     variant
   } = ownerState;
   const slots = {
-    root: ["root", variant, disabled && "disabled", `size${capitalize$2(size)}`, `color${capitalize$2(color2)}`, clickable && "clickable", clickable && `clickableColor${capitalize$2(color2)}`, onDelete && "deletable", onDelete && `deletableColor${capitalize$2(color2)}`, `${variant}${capitalize$2(color2)}`],
-    label: ["label", `label${capitalize$2(size)}`],
-    avatar: ["avatar", `avatar${capitalize$2(size)}`, `avatarColor${capitalize$2(color2)}`],
-    icon: ["icon", `icon${capitalize$2(size)}`, `iconColor${capitalize$2(iconColor)}`],
-    deleteIcon: ["deleteIcon", `deleteIcon${capitalize$2(size)}`, `deleteIconColor${capitalize$2(color2)}`, `deleteIcon${capitalize$2(variant)}Color${capitalize$2(color2)}`]
+    root: ["root", variant, disabled && "disabled", `size${capitalize$1(size)}`, `color${capitalize$1(color2)}`, clickable && "clickable", clickable && `clickableColor${capitalize$1(color2)}`, onDelete && "deletable", onDelete && `deletableColor${capitalize$1(color2)}`, `${variant}${capitalize$1(color2)}`],
+    label: ["label", `label${capitalize$1(size)}`],
+    avatar: ["avatar", `avatar${capitalize$1(size)}`, `avatarColor${capitalize$1(color2)}`],
+    icon: ["icon", `icon${capitalize$1(size)}`, `iconColor${capitalize$1(iconColor)}`],
+    deleteIcon: ["deleteIcon", `deleteIcon${capitalize$1(size)}`, `deleteIconColor${capitalize$1(color2)}`, `deleteIcon${capitalize$1(variant)}Color${capitalize$1(color2)}`]
   };
   return composeClasses$1(slots, getChipUtilityClass, classes);
 };
@@ -12508,24 +12508,24 @@ const ChipRoot = styled("div", {
     return [{
       [`& .${chipClasses.avatar}`]: styles2.avatar
     }, {
-      [`& .${chipClasses.avatar}`]: styles2[`avatar${capitalize$2(size)}`]
+      [`& .${chipClasses.avatar}`]: styles2[`avatar${capitalize$1(size)}`]
     }, {
-      [`& .${chipClasses.avatar}`]: styles2[`avatarColor${capitalize$2(color2)}`]
+      [`& .${chipClasses.avatar}`]: styles2[`avatarColor${capitalize$1(color2)}`]
     }, {
       [`& .${chipClasses.icon}`]: styles2.icon
     }, {
-      [`& .${chipClasses.icon}`]: styles2[`icon${capitalize$2(size)}`]
+      [`& .${chipClasses.icon}`]: styles2[`icon${capitalize$1(size)}`]
     }, {
-      [`& .${chipClasses.icon}`]: styles2[`iconColor${capitalize$2(iconColor)}`]
+      [`& .${chipClasses.icon}`]: styles2[`iconColor${capitalize$1(iconColor)}`]
     }, {
       [`& .${chipClasses.deleteIcon}`]: styles2.deleteIcon
     }, {
-      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIcon${capitalize$2(size)}`]
+      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIcon${capitalize$1(size)}`]
     }, {
-      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIconColor${capitalize$2(color2)}`]
+      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIconColor${capitalize$1(color2)}`]
     }, {
-      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIcon${capitalize$2(variant)}Color${capitalize$2(color2)}`]
-    }, styles2.root, styles2[`size${capitalize$2(size)}`], styles2[`color${capitalize$2(color2)}`], clickable && styles2.clickable, clickable && color2 !== "default" && styles2[`clickableColor${capitalize$2(color2)})`], onDelete && styles2.deletable, onDelete && color2 !== "default" && styles2[`deletableColor${capitalize$2(color2)}`], styles2[variant], styles2[`${variant}${capitalize$2(color2)}`]];
+      [`& .${chipClasses.deleteIcon}`]: styles2[`deleteIcon${capitalize$1(variant)}Color${capitalize$1(color2)}`]
+    }, styles2.root, styles2[`size${capitalize$1(size)}`], styles2[`color${capitalize$1(color2)}`], clickable && styles2.clickable, clickable && color2 !== "default" && styles2[`clickableColor${capitalize$1(color2)})`], onDelete && styles2.deletable, onDelete && color2 !== "default" && styles2[`deletableColor${capitalize$1(color2)}`], styles2[variant], styles2[`${variant}${capitalize$1(color2)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -12758,7 +12758,7 @@ const ChipLabel = styled("span", {
     const {
       size
     } = ownerState;
-    return [styles2.label, styles2[`label${capitalize$2(size)}`]];
+    return [styles2.label, styles2[`label${capitalize$1(size)}`]];
   }
 })({
   overflow: "hidden",
@@ -13149,7 +13149,7 @@ const Container$1 = createContainer({
       const {
         ownerState
       } = props;
-      return [styles2.root, styles2[`maxWidth${capitalize$2(String(ownerState.maxWidth))}`], ownerState.fixed && styles2.fixed, ownerState.disableGutters && styles2.disableGutters];
+      return [styles2.root, styles2[`maxWidth${capitalize$1(String(ownerState.maxWidth))}`], ownerState.fixed && styles2.fixed, ownerState.disableGutters && styles2.disableGutters];
     }
   }),
   useThemeProps: (inProps) => useDefaultProps({
@@ -13545,7 +13545,7 @@ const useUtilityClasses$1$ = (ownerState) => {
     fullWidth
   } = ownerState;
   const slots = {
-    root: ["root", margin2 !== "none" && `margin${capitalize$2(margin2)}`, fullWidth && "fullWidth"]
+    root: ["root", margin2 !== "none" && `margin${capitalize$1(margin2)}`, fullWidth && "fullWidth"]
   };
   return composeClasses$1(slots, getFormControlUtilityClasses, classes);
 };
@@ -13556,7 +13556,7 @@ const FormControlRoot = styled("div", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`margin${capitalize$2(ownerState.margin)}`], ownerState.fullWidth && styles2.fullWidth];
+    return [styles2.root, styles2[`margin${capitalize$1(ownerState.margin)}`], ownerState.fullWidth && styles2.fullWidth];
   }
 })({
   display: "inline-flex",
@@ -13827,7 +13827,7 @@ const useUtilityClasses$1_ = (ownerState) => {
     required
   } = ownerState;
   const slots = {
-    root: ["root", disabled && "disabled", `labelPlacement${capitalize$2(labelPlacement)}`, error && "error", required && "required"],
+    root: ["root", disabled && "disabled", `labelPlacement${capitalize$1(labelPlacement)}`, error && "error", required && "required"],
     label: ["label", disabled && "disabled"],
     asterisk: ["asterisk", error && "error"]
   };
@@ -13842,7 +13842,7 @@ const FormControlLabelRoot = styled("label", {
     } = props;
     return [{
       [`& .${formControlLabelClasses.label}`]: styles2.label
-    }, styles2.root, styles2[`labelPlacement${capitalize$2(ownerState.labelPlacement)}`]];
+    }, styles2.root, styles2[`labelPlacement${capitalize$1(ownerState.labelPlacement)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -14335,7 +14335,7 @@ const useUtilityClasses$1Y = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", color2 !== "inherit" && `color${capitalize$2(color2)}`, `fontSize${capitalize$2(fontSize)}`]
+    root: ["root", color2 !== "inherit" && `color${capitalize$1(color2)}`, `fontSize${capitalize$1(fontSize)}`]
   };
   return composeClasses$1(slots, getIconUtilityClass, classes);
 };
@@ -14346,7 +14346,7 @@ const IconRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$2(ownerState.color)}`], styles2[`fontSize${capitalize$2(ownerState.fontSize)}`]];
+    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$1(ownerState.color)}`], styles2[`fontSize${capitalize$1(ownerState.fontSize)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -14562,7 +14562,7 @@ const useUtilityClasses$1X = (ownerState) => {
     loading
   } = ownerState;
   const slots = {
-    root: ["root", loading && "loading", disabled && "disabled", color2 !== "default" && `color${capitalize$2(color2)}`, edge && `edge${capitalize$2(edge)}`, `size${capitalize$2(size)}`],
+    root: ["root", loading && "loading", disabled && "disabled", color2 !== "default" && `color${capitalize$1(color2)}`, edge && `edge${capitalize$1(edge)}`, `size${capitalize$1(size)}`],
     loadingIndicator: ["loadingIndicator"],
     loadingWrapper: ["loadingWrapper"]
   };
@@ -14575,7 +14575,7 @@ const IconButtonRoot = styled(ButtonBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.loading && styles2.loading, ownerState.color !== "default" && styles2[`color${capitalize$2(ownerState.color)}`], ownerState.edge && styles2[`edge${capitalize$2(ownerState.edge)}`], styles2[`size${capitalize$2(ownerState.size)}`]];
+    return [styles2.root, ownerState.loading && styles2.loading, ownerState.color !== "default" && styles2[`color${capitalize$1(ownerState.color)}`], ownerState.edge && styles2[`edge${capitalize$1(ownerState.edge)}`], styles2[`size${capitalize$1(ownerState.size)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -14936,10 +14936,10 @@ const useUtilityClasses$1W = (ownerState) => {
     color: color2
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2)}`, variant],
-    dashed: ["dashed", `dashedColor${capitalize$2(color2)}`],
-    bar1: ["bar", "bar1", `barColor${capitalize$2(color2)}`, (variant === "indeterminate" || variant === "query") && "bar1Indeterminate", variant === "determinate" && "bar1Determinate", variant === "buffer" && "bar1Buffer"],
-    bar2: ["bar", "bar2", variant !== "buffer" && `barColor${capitalize$2(color2)}`, variant === "buffer" && `color${capitalize$2(color2)}`, (variant === "indeterminate" || variant === "query") && "bar2Indeterminate", variant === "buffer" && "bar2Buffer"]
+    root: ["root", `color${capitalize$1(color2)}`, variant],
+    dashed: ["dashed", `dashedColor${capitalize$1(color2)}`],
+    bar1: ["bar", "bar1", `barColor${capitalize$1(color2)}`, (variant === "indeterminate" || variant === "query") && "bar1Indeterminate", variant === "determinate" && "bar1Determinate", variant === "buffer" && "bar1Buffer"],
+    bar2: ["bar", "bar2", variant !== "buffer" && `barColor${capitalize$1(color2)}`, variant === "buffer" && `color${capitalize$1(color2)}`, (variant === "indeterminate" || variant === "query") && "bar2Indeterminate", variant === "buffer" && "bar2Buffer"]
   };
   return composeClasses$1(slots, getLinearProgressUtilityClass, classes);
 };
@@ -14956,7 +14956,7 @@ const LinearProgressRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`color${capitalize$2(ownerState.color)}`], styles2[ownerState.variant]];
+    return [styles2.root, styles2[`color${capitalize$1(ownerState.color)}`], styles2[ownerState.variant]];
   }
 })(memoTheme(({
   theme: theme2
@@ -15016,7 +15016,7 @@ const LinearProgressDashed = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.dashed, styles2[`dashedColor${capitalize$2(ownerState.color)}`]];
+    return [styles2.dashed, styles2[`dashedColor${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -15057,7 +15057,7 @@ const LinearProgressBar1 = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.bar, styles2.bar1, styles2[`barColor${capitalize$2(ownerState.color)}`], (ownerState.variant === "indeterminate" || ownerState.variant === "query") && styles2.bar1Indeterminate, ownerState.variant === "determinate" && styles2.bar1Determinate, ownerState.variant === "buffer" && styles2.bar1Buffer];
+    return [styles2.bar, styles2.bar1, styles2[`barColor${capitalize$1(ownerState.color)}`], (ownerState.variant === "indeterminate" || ownerState.variant === "query") && styles2.bar1Indeterminate, ownerState.variant === "determinate" && styles2.bar1Determinate, ownerState.variant === "buffer" && styles2.bar1Buffer];
   }
 })(memoTheme(({
   theme: theme2
@@ -15121,7 +15121,7 @@ const LinearProgressBar2 = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.bar, styles2.bar2, styles2[`barColor${capitalize$2(ownerState.color)}`], (ownerState.variant === "indeterminate" || ownerState.variant === "query") && styles2.bar2Indeterminate, ownerState.variant === "buffer" && styles2.bar2Buffer];
+    return [styles2.bar, styles2.bar2, styles2[`barColor${capitalize$1(ownerState.color)}`], (ownerState.variant === "indeterminate" || ownerState.variant === "query") && styles2.bar2Indeterminate, ownerState.variant === "buffer" && styles2.bar2Buffer];
   }
 })(memoTheme(({
   theme: theme2
@@ -15205,7 +15205,7 @@ const LinearProgress$1 = /* @__PURE__ */ React__namespace.forwardRef(function Li
     variant
   };
   const classes = useUtilityClasses$1W(ownerState);
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const rootProps = {};
   const inlineStyles = {
     bar1: {},
@@ -15363,8 +15363,8 @@ const getTextDecoration = ({
   ownerState
 }) => {
   const transformedColor = ownerState.color;
-  const color2 = getPath$1(theme2, `palette.${transformedColor}.main`, false) || getPath$1(theme2, `palette.${transformedColor}`, false) || ownerState.color;
-  const channelColor = getPath$1(theme2, `palette.${transformedColor}.mainChannel`) || getPath$1(theme2, `palette.${transformedColor}Channel`);
+  const color2 = getPath(theme2, `palette.${transformedColor}.main`, false) || getPath(theme2, `palette.${transformedColor}`, false) || ownerState.color;
+  const channelColor = getPath(theme2, `palette.${transformedColor}.mainChannel`) || getPath(theme2, `palette.${transformedColor}Channel`);
   if ("vars" in theme2 && channelColor) {
     return `rgba(${channelColor} / 0.4)`;
   }
@@ -15389,7 +15389,7 @@ const useUtilityClasses$1V = (ownerState) => {
     underline
   } = ownerState;
   const slots = {
-    root: ["root", `underline${capitalize$2(underline)}`, component === "button" && "button", focusVisible && "focusVisible"]
+    root: ["root", `underline${capitalize$1(underline)}`, component === "button" && "button", focusVisible && "focusVisible"]
   };
   return composeClasses$1(slots, getLinkUtilityClass, classes);
 };
@@ -15400,7 +15400,7 @@ const LinkRoot = styled(Typography$1, {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`underline${capitalize$2(ownerState.underline)}`], ownerState.component === "button" && styles2.button];
+    return [styles2.root, styles2[`underline${capitalize$1(ownerState.underline)}`], ownerState.component === "button" && styles2.button];
   }
 })(memoTheme(({
   theme: theme2
@@ -16617,7 +16617,7 @@ const useUtilityClasses$1Q = (ownerState) => {
     size
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2)}`, size !== "medium" && `size${capitalize$2(size)}`]
+    root: ["root", `color${capitalize$1(color2)}`, size !== "medium" && `size${capitalize$1(size)}`]
   };
   return {
     ...classes,
@@ -16632,7 +16632,7 @@ const RadioRoot = styled(SwitchBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.size !== "medium" && styles2[`size${capitalize$2(ownerState.size)}`], styles2[`color${capitalize$2(ownerState.color)}`]];
+    return [styles2.root, ownerState.size !== "medium" && styles2[`size${capitalize$1(ownerState.size)}`], styles2[`color${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -19705,7 +19705,7 @@ const Menu$1 = /* @__PURE__ */ React__namespace.forwardRef(function Menu(inProps
     slotProps = {},
     ...other
   } = props;
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const ownerState = {
     ...props,
     autoFocus,
@@ -19963,7 +19963,7 @@ const useUtilityClasses$1J = (ownerState) => {
   } = ownerState;
   const slots = {
     select: ["select", variant, disabled && "disabled", multiple && "multiple", error && "error"],
-    icon: ["icon", `icon${capitalize$2(variant)}`, open && "iconOpen", disabled && "disabled"]
+    icon: ["icon", `icon${capitalize$1(variant)}`, open && "iconOpen", disabled && "disabled"]
   };
   return composeClasses$1(slots, getNativeSelectUtilityClasses, classes);
 };
@@ -20092,7 +20092,7 @@ const NativeSelectIcon = styled(StyledSelectIcon, {
     const {
       ownerState
     } = props;
-    return [styles2.icon, ownerState.variant && styles2[`icon${capitalize$2(ownerState.variant)}`], ownerState.open && styles2.iconOpen];
+    return [styles2.icon, ownerState.variant && styles2[`icon${capitalize$1(ownerState.variant)}`], ownerState.open && styles2.iconOpen];
   }
 })({});
 const NativeSelectInput = /* @__PURE__ */ React__namespace.forwardRef(function NativeSelectInput2(props, ref) {
@@ -20228,7 +20228,7 @@ const SelectIcon = styled(StyledSelectIcon, {
     const {
       ownerState
     } = props;
-    return [styles2.icon, ownerState.variant && styles2[`icon${capitalize$2(ownerState.variant)}`], ownerState.open && styles2.iconOpen];
+    return [styles2.icon, ownerState.variant && styles2[`icon${capitalize$1(ownerState.variant)}`], ownerState.open && styles2.iconOpen];
   }
 })({});
 const SelectNativeInput = styled("input", {
@@ -20265,7 +20265,7 @@ const useUtilityClasses$1I = (ownerState) => {
   } = ownerState;
   const slots = {
     select: ["select", variant, disabled && "disabled", multiple && "multiple", error && "error"],
-    icon: ["icon", `icon${capitalize$2(variant)}`, open && "iconOpen", disabled && "disabled"],
+    icon: ["icon", `icon${capitalize$1(variant)}`, open && "iconOpen", disabled && "disabled"],
     nativeInput: ["nativeInput"]
   };
   return composeClasses$1(slots, getSelectUtilityClasses, classes);
@@ -20496,7 +20496,7 @@ const SelectInput = /* @__PURE__ */ React__namespace.forwardRef(function SelectI
     let selected;
     if (multiple) {
       if (!Array.isArray(value)) {
-        throw new Error(process.env.NODE_ENV !== "production" ? "MUI: The `value` prop must be an array when using the `Select` component with `multiple`." : formatMuiErrorMessage$2(2));
+        throw new Error(process.env.NODE_ENV !== "production" ? "MUI: The `value` prop must be an array when using the `Select` component with `multiple`." : formatMuiErrorMessage$1(2));
       }
       selected = value.some((v) => areEqualValues(v, child.props.value));
       if (selected && computeDisplay) {
@@ -20815,7 +20815,7 @@ process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {
 const ArrowDropDownIcon$1 = createSvgIcon(/* @__PURE__ */ jsxRuntime.jsx("path", {
   d: "M7 10l5 5 5-5z"
 }), "ArrowDropDown");
-function getStyleValue$1(value) {
+function getStyleValue(value) {
   return parseInt(value, 10) || 0;
 }
 const styles$2 = {
@@ -20878,8 +20878,8 @@ const TextareaAutosize = /* @__PURE__ */ React__namespace.forwardRef(function Te
       hiddenTextarea.value += " ";
     }
     const boxSizing2 = computedStyle.boxSizing;
-    const padding2 = getStyleValue$1(computedStyle.paddingBottom) + getStyleValue$1(computedStyle.paddingTop);
-    const border2 = getStyleValue$1(computedStyle.borderBottomWidth) + getStyleValue$1(computedStyle.borderTopWidth);
+    const padding2 = getStyleValue(computedStyle.paddingBottom) + getStyleValue(computedStyle.paddingTop);
+    const border2 = getStyleValue(computedStyle.borderBottomWidth) + getStyleValue(computedStyle.borderTopWidth);
     const innerHeight = hiddenTextarea.scrollHeight;
     hiddenTextarea.value = "x";
     const singleRowHeight = hiddenTextarea.scrollHeight;
@@ -21030,7 +21030,7 @@ const rootOverridesResolver = (props, styles2) => {
   const {
     ownerState
   } = props;
-  return [styles2.root, ownerState.formControl && styles2.formControl, ownerState.startAdornment && styles2.adornedStart, ownerState.endAdornment && styles2.adornedEnd, ownerState.error && styles2.error, ownerState.size === "small" && styles2.sizeSmall, ownerState.multiline && styles2.multiline, ownerState.color && styles2[`color${capitalize$2(ownerState.color)}`], ownerState.fullWidth && styles2.fullWidth, ownerState.hiddenLabel && styles2.hiddenLabel];
+  return [styles2.root, ownerState.formControl && styles2.formControl, ownerState.startAdornment && styles2.adornedStart, ownerState.endAdornment && styles2.adornedEnd, ownerState.error && styles2.error, ownerState.size === "small" && styles2.sizeSmall, ownerState.multiline && styles2.multiline, ownerState.color && styles2[`color${capitalize$1(ownerState.color)}`], ownerState.fullWidth && styles2.fullWidth, ownerState.hiddenLabel && styles2.hiddenLabel];
 };
 const inputOverridesResolver = (props, styles2) => {
   const {
@@ -21056,7 +21056,7 @@ const useUtilityClasses$1H = (ownerState) => {
     type
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2)}`, disabled && "disabled", error && "error", fullWidth && "fullWidth", focused && "focused", formControl && "formControl", size && size !== "medium" && `size${capitalize$2(size)}`, multiline && "multiline", startAdornment && "adornedStart", endAdornment && "adornedEnd", hiddenLabel && "hiddenLabel", readOnly && "readOnly"],
+    root: ["root", `color${capitalize$1(color2)}`, disabled && "disabled", error && "error", fullWidth && "fullWidth", focused && "focused", formControl && "formControl", size && size !== "medium" && `size${capitalize$1(size)}`, multiline && "multiline", startAdornment && "adornedStart", endAdornment && "adornedEnd", hiddenLabel && "hiddenLabel", readOnly && "readOnly"],
     input: ["input", disabled && "disabled", type === "search" && "inputTypeSearch", multiline && "inputMultiline", size === "small" && "inputSizeSmall", hiddenLabel && "inputHiddenLabel", startAdornment && "inputAdornedStart", endAdornment && "inputAdornedEnd", readOnly && "readOnly"]
   };
   return composeClasses$1(slots, getInputBaseUtilityClass, classes);
@@ -21368,7 +21368,7 @@ const InputBase = /* @__PURE__ */ React__namespace.forwardRef(function InputBase
     if (!isControlled) {
       const element = event.target || inputRef.current;
       if (element == null) {
-        throw new Error(process.env.NODE_ENV !== "production" ? "MUI: Expected valid input target. Did you use a custom `inputComponent` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info." : formatMuiErrorMessage$2(1));
+        throw new Error(process.env.NODE_ENV !== "production" ? "MUI: Expected valid input target. Did you use a custom `inputComponent` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info." : formatMuiErrorMessage$1(1));
       }
       checkDirty({
         value: element.value
@@ -21883,7 +21883,7 @@ const Input = /* @__PURE__ */ React__namespace.forwardRef(function Input2(inProp
       ownerState
     }
   };
-  const componentsProps = slotProps ?? componentsPropsProp ? deepmerge$1(slotProps ?? componentsPropsProp, inputComponentsProps) : inputComponentsProps;
+  const componentsProps = slotProps ?? componentsPropsProp ? deepmerge(slotProps ?? componentsPropsProp, inputComponentsProps) : inputComponentsProps;
   const RootSlot = slots.root ?? components.Root ?? InputRoot;
   const InputSlot = slots.input ?? components.Input ?? InputInput;
   return /* @__PURE__ */ jsxRuntime.jsx(InputBase, {
@@ -22105,7 +22105,7 @@ const useUtilityClasses$1F = (ownerState) => {
     multiline
   } = ownerState;
   const slots = {
-    root: ["root", !disableUnderline && "underline", startAdornment && "adornedStart", endAdornment && "adornedEnd", size === "small" && `size${capitalize$2(size)}`, hiddenLabel && "hiddenLabel", multiline && "multiline"],
+    root: ["root", !disableUnderline && "underline", startAdornment && "adornedStart", endAdornment && "adornedEnd", size === "small" && `size${capitalize$1(size)}`, hiddenLabel && "hiddenLabel", multiline && "multiline"],
     input: ["input"]
   };
   const composedClasses = composeClasses$1(slots, getFilledInputUtilityClass, classes);
@@ -22382,7 +22382,7 @@ const FilledInput = /* @__PURE__ */ React__namespace.forwardRef(function FilledI
       ownerState
     }
   };
-  const componentsProps = slotProps ?? componentsPropsProp ? deepmerge$1(filledInputComponentsProps, slotProps ?? componentsPropsProp) : filledInputComponentsProps;
+  const componentsProps = slotProps ?? componentsPropsProp ? deepmerge(filledInputComponentsProps, slotProps ?? componentsPropsProp) : filledInputComponentsProps;
   const RootSlot = slots.root ?? components.Root ?? FilledInputRoot;
   const InputSlot = slots.input ?? components.Input ?? FilledInputInput;
   return /* @__PURE__ */ jsxRuntime.jsx(InputBase, {
@@ -23270,7 +23270,7 @@ const Select$1 = /* @__PURE__ */ React__namespace.forwardRef(function Select(inP
           }
         },
         ...inputProps,
-        classes: inputProps ? deepmerge$1(restOfClasses, inputProps.classes) : restOfClasses,
+        classes: inputProps ? deepmerge(restOfClasses, inputProps.classes) : restOfClasses,
         ...input ? input.props.inputProps : {}
       },
       ...(multiple && native || displayEmpty) && variant === "outlined" ? {
@@ -24475,7 +24475,7 @@ const SliderRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`color${capitalize$2(ownerState.color)}`], ownerState.size !== "medium" && styles2[`size${capitalize$2(ownerState.size)}`], ownerState.marked && styles2.marked, ownerState.orientation === "vertical" && styles2.vertical, ownerState.track === "inverted" && styles2.trackInverted, ownerState.track === false && styles2.trackFalse];
+    return [styles2.root, styles2[`color${capitalize$1(ownerState.color)}`], ownerState.size !== "medium" && styles2[`size${capitalize$1(ownerState.size)}`], ownerState.marked && styles2.marked, ownerState.orientation === "vertical" && styles2.vertical, ownerState.track === "inverted" && styles2.trackInverted, ownerState.track === false && styles2.trackFalse];
   }
 })(memoTheme(({
   theme: theme2
@@ -24686,7 +24686,7 @@ const SliderThumb = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.thumb, styles2[`thumbColor${capitalize$2(ownerState.color)}`], ownerState.size !== "medium" && styles2[`thumbSize${capitalize$2(ownerState.size)}`]];
+    return [styles2.thumb, styles2[`thumbColor${capitalize$1(ownerState.color)}`], ownerState.size !== "medium" && styles2[`thumbSize${capitalize$1(ownerState.size)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -24986,7 +24986,7 @@ const useUtilityClasses$1B = (ownerState) => {
     size
   } = ownerState;
   const slots = {
-    root: ["root", disabled && "disabled", dragging && "dragging", marked && "marked", orientation === "vertical" && "vertical", track === "inverted" && "trackInverted", track === false && "trackFalse", color2 && `color${capitalize$2(color2)}`, size && `size${capitalize$2(size)}`],
+    root: ["root", disabled && "disabled", dragging && "dragging", marked && "marked", orientation === "vertical" && "vertical", track === "inverted" && "trackInverted", track === false && "trackFalse", color2 && `color${capitalize$1(color2)}`, size && `size${capitalize$1(size)}`],
     rail: ["rail"],
     track: ["track"],
     mark: ["mark"],
@@ -24994,7 +24994,7 @@ const useUtilityClasses$1B = (ownerState) => {
     markLabel: ["markLabel"],
     markLabelActive: ["markLabelActive"],
     valueLabel: ["valueLabel"],
-    thumb: ["thumb", disabled && "disabled", size && `thumbSize${capitalize$2(size)}`, color2 && `thumbColor${capitalize$2(color2)}`],
+    thumb: ["thumb", disabled && "disabled", size && `thumbSize${capitalize$1(size)}`, color2 && `thumbColor${capitalize$1(color2)}`],
     active: ["active"],
     disabled: ["disabled"],
     focusVisible: ["focusVisible"]
@@ -25009,7 +25009,7 @@ const Slider$1 = /* @__PURE__ */ React__namespace.forwardRef(function Slider(inp
     props: inputProps,
     name: "MuiSlider"
   });
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const {
     "aria-label": ariaLabel,
     "aria-valuetext": ariaValuetext,
@@ -25609,8 +25609,8 @@ const useUtilityClasses$1A = (ownerState) => {
     disabled
   } = ownerState;
   const slots = {
-    root: ["root", edge && `edge${capitalize$2(edge)}`, `size${capitalize$2(size)}`],
-    switchBase: ["switchBase", `color${capitalize$2(color2)}`, checked && "checked", disabled && "disabled"],
+    root: ["root", edge && `edge${capitalize$1(edge)}`, `size${capitalize$1(size)}`],
+    switchBase: ["switchBase", `color${capitalize$1(color2)}`, checked && "checked", disabled && "disabled"],
     thumb: ["thumb"],
     track: ["track"],
     input: ["input"]
@@ -25629,7 +25629,7 @@ const SwitchRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.edge && styles2[`edge${capitalize$2(ownerState.edge)}`], styles2[`size${capitalize$2(ownerState.size)}`]];
+    return [styles2.root, ownerState.edge && styles2[`edge${capitalize$1(ownerState.edge)}`], styles2[`size${capitalize$1(ownerState.size)}`]];
   }
 })({
   display: "inline-flex",
@@ -25691,7 +25691,7 @@ const SwitchSwitchBase = styled(SwitchBase, {
     } = props;
     return [styles2.switchBase, {
       [`& .${switchClasses.input}`]: styles2.input
-    }, ownerState.color !== "default" && styles2[`color${capitalize$2(ownerState.color)}`]];
+    }, ownerState.color !== "default" && styles2[`color${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -26041,7 +26041,7 @@ const useUtilityClasses$1z = (ownerState) => {
     required
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2)}`, disabled && "disabled", error && "error", filled && "filled", focused && "focused", required && "required"],
+    root: ["root", `color${capitalize$1(color2)}`, disabled && "disabled", error && "error", filled && "filled", focused && "focused", required && "required"],
     asterisk: ["asterisk", error && "error"]
   };
   return composeClasses$1(slots, getFormLabelUtilityClasses, classes);
@@ -26211,7 +26211,7 @@ const useUtilityClasses$1y = (ownerState) => {
     required
   } = ownerState;
   const slots = {
-    root: ["root", formControl && "formControl", !disableAnimation && "animated", shrink && "shrink", size && size !== "normal" && `size${capitalize$2(size)}`, variant],
+    root: ["root", formControl && "formControl", !disableAnimation && "animated", shrink && "shrink", size && size !== "normal" && `size${capitalize$1(size)}`, variant],
     asterisk: [required && "asterisk"]
   };
   const composedClasses = composeClasses$1(slots, getInputLabelUtilityClasses, classes);
@@ -26483,7 +26483,7 @@ const useUtilityClasses$1x = (ownerState) => {
     required
   } = ownerState;
   const slots = {
-    root: ["root", disabled && "disabled", error && "error", size && `size${capitalize$2(size)}`, contained && "contained", focused && "focused", filled && "filled", required && "required"]
+    root: ["root", disabled && "disabled", error && "error", size && `size${capitalize$1(size)}`, contained && "contained", focused && "focused", filled && "filled", required && "required"]
   };
   return composeClasses$1(slots, getFormHelperTextUtilityClasses, classes);
 };
@@ -26494,7 +26494,7 @@ const FormHelperTextRoot = styled("p", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.size && styles2[`size${capitalize$2(ownerState.size)}`], ownerState.contained && styles2.contained, ownerState.filled && styles2.filled];
+    return [styles2.root, ownerState.size && styles2[`size${capitalize$1(ownerState.size)}`], ownerState.contained && styles2.contained, ownerState.filled && styles2.filled];
   }
 })(memoTheme(({
   theme: theme2
@@ -27306,7 +27306,7 @@ function isShadowRoot(node) {
   var OwnElement = getWindow(node).ShadowRoot;
   return node instanceof OwnElement || node instanceof ShadowRoot;
 }
-function applyStyles$2(_ref) {
+function applyStyles$1(_ref) {
   var state = _ref.state;
   Object.keys(state.elements).forEach(function(name) {
     var style2 = state.styles[name] || {};
@@ -27364,11 +27364,11 @@ function effect$2(_ref2) {
     });
   };
 }
-const applyStyles$1 = {
+const applyStyles = {
   name: "applyStyles",
   enabled: true,
   phase: "write",
-  fn: applyStyles$2,
+  fn: applyStyles$1,
   effect: effect$2,
   requires: ["computeStyles"]
 };
@@ -28592,7 +28592,7 @@ function popperGenerator(generatorOptions) {
     return instance;
   };
 }
-var defaultModifiers = [eventListeners, popperOffsets, computeStyles, applyStyles$1, offset, flip, preventOverflow, arrow, hide];
+var defaultModifiers = [eventListeners, popperOffsets, computeStyles, applyStyles, offset, flip, preventOverflow, arrow, hide];
 var createPopper = /* @__PURE__ */ popperGenerator({
   defaultModifiers
 });
@@ -28952,7 +28952,7 @@ const PopperRoot = styled(Popper$1, {
   overridesResolver: (props, styles2) => styles2.root
 })({});
 const Popper2 = /* @__PURE__ */ React__namespace.forwardRef(function Popper3(inProps, ref) {
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const props = useDefaultProps({
     props: inProps,
     name: "MuiPopper"
@@ -29148,7 +29148,7 @@ const useUtilityClasses$1t = (ownerState) => {
   } = ownerState;
   const slots = {
     popper: ["popper", !disableInteractive && "popperInteractive", arrow2 && "popperArrow"],
-    tooltip: ["tooltip", arrow2 && "tooltipArrow", touch && "touch", `tooltipPlacement${capitalize$2(placement.split("-")[0])}`],
+    tooltip: ["tooltip", arrow2 && "tooltipArrow", touch && "touch", `tooltipPlacement${capitalize$1(placement.split("-")[0])}`],
     arrow: ["arrow"]
   };
   return composeClasses$1(slots, getTooltipUtilityClass, classes);
@@ -29264,7 +29264,7 @@ const TooltipTooltip = styled("div", {
     const {
       ownerState
     } = props;
-    return [styles2.tooltip, ownerState.touch && styles2.touch, ownerState.arrow && styles2.tooltipArrow, styles2[`tooltipPlacement${capitalize$2(ownerState.placement.split("-")[0])}`]];
+    return [styles2.tooltip, ownerState.touch && styles2.touch, ownerState.arrow && styles2.tooltipArrow, styles2[`tooltipPlacement${capitalize$1(ownerState.placement.split("-")[0])}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -29456,7 +29456,7 @@ const Tooltip$1 = /* @__PURE__ */ React__namespace.forwardRef(function Tooltip(i
     children: childrenProp
   });
   const theme2 = useTheme();
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const [childNode, setChildNode] = React__namespace.useState();
   const [arrowRef, setArrowRef] = React__namespace.useState(null);
   const ignoreNonTouchEvents = React__namespace.useRef(false);
@@ -31198,7 +31198,7 @@ const useUtilityClasses$1n = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2 || severity)}`, `${variant}${capitalize$2(color2 || severity)}`, `${variant}`],
+    root: ["root", `color${capitalize$1(color2 || severity)}`, `${variant}${capitalize$1(color2 || severity)}`, `${variant}`],
     icon: ["icon"],
     message: ["message"],
     action: ["action"]
@@ -31212,7 +31212,7 @@ const AlertRoot = styled(Paper$1, {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.variant], styles2[`${ownerState.variant}${capitalize$2(ownerState.color || ownerState.severity)}`]];
+    return [styles2.root, styles2[ownerState.variant], styles2[`${ownerState.variant}${capitalize$1(ownerState.color || ownerState.severity)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -31691,7 +31691,7 @@ const useUtilityClasses$1m = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", `color${capitalize$2(color2)}`, `position${capitalize$2(position)}`]
+    root: ["root", `color${capitalize$1(color2)}`, `position${capitalize$1(position)}`]
   };
   return composeClasses$1(slots, getAppBarUtilityClass, classes);
 };
@@ -31703,7 +31703,7 @@ const AppBarRoot = styled(Paper$1, {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`position${capitalize$2(ownerState.position)}`], styles2[`color${capitalize$2(ownerState.color)}`]];
+    return [styles2.root, styles2[`position${capitalize$1(ownerState.position)}`], styles2[`color${capitalize$1(ownerState.color)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -32828,7 +32828,7 @@ const useUtilityClasses$1l = (ownerState) => {
     disableSticky
   } = ownerState;
   const slots = {
-    root: ["root", color2 !== "default" && `color${capitalize$2(color2)}`, !disableGutters && "gutters", inset && "inset", !disableSticky && "sticky"]
+    root: ["root", color2 !== "default" && `color${capitalize$1(color2)}`, !disableGutters && "gutters", inset && "inset", !disableSticky && "sticky"]
   };
   return composeClasses$1(slots, getListSubheaderUtilityClass, classes);
 };
@@ -32839,7 +32839,7 @@ const ListSubheaderRoot = styled("li", {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.color !== "default" && styles2[`color${capitalize$2(ownerState.color)}`], !ownerState.disableGutters && styles2.gutters, ownerState.inset && styles2.inset, !ownerState.disableSticky && styles2.sticky];
+    return [styles2.root, ownerState.color !== "default" && styles2[`color${capitalize$1(ownerState.color)}`], !ownerState.disableGutters && styles2.gutters, ownerState.inset && styles2.inset, !ownerState.disableSticky && styles2.sticky];
   }
 })(memoTheme(({
   theme: theme2
@@ -32995,7 +32995,7 @@ const useUtilityClasses$1k = (ownerState) => {
     root: ["root", expanded && "expanded", focused && "focused", fullWidth && "fullWidth", hasClearIcon && "hasClearIcon", hasPopupIcon && "hasPopupIcon"],
     inputRoot: ["inputRoot"],
     input: ["input", inputFocused && "inputFocused"],
-    tag: ["tag", `tagSize${capitalize$2(size)}`],
+    tag: ["tag", `tagSize${capitalize$1(size)}`],
     endAdornment: ["endAdornment"],
     clearIndicator: ["clearIndicator"],
     popupIndicator: ["popupIndicator", popupOpen && "popupIndicatorOpen"],
@@ -33027,7 +33027,7 @@ const AutocompleteRoot = styled("div", {
     return [{
       [`& .${autocompleteClasses.tag}`]: styles2.tag
     }, {
-      [`& .${autocompleteClasses.tag}`]: styles2[`tagSize${capitalize$2(size)}`]
+      [`& .${autocompleteClasses.tag}`]: styles2[`tagSize${capitalize$1(size)}`]
     }, {
       [`& .${autocompleteClasses.inputRoot}`]: styles2.inputRoot
     }, {
@@ -34547,13 +34547,13 @@ const overridesResolver$6 = (props, styles2) => {
   return [{
     [`& .${buttonGroupClasses.grouped}`]: styles2.grouped
   }, {
-    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$2(ownerState.orientation)}`]
+    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$1(ownerState.orientation)}`]
   }, {
-    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$2(ownerState.variant)}`]
+    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$1(ownerState.variant)}`]
   }, {
-    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$2(ownerState.variant)}${capitalize$2(ownerState.orientation)}`]
+    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$1(ownerState.variant)}${capitalize$1(ownerState.orientation)}`]
   }, {
-    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$2(ownerState.variant)}${capitalize$2(ownerState.color)}`]
+    [`& .${buttonGroupClasses.grouped}`]: styles2[`grouped${capitalize$1(ownerState.variant)}${capitalize$1(ownerState.color)}`]
   }, {
     [`& .${buttonGroupClasses.firstButton}`]: styles2.firstButton
   }, {
@@ -34573,8 +34573,8 @@ const useUtilityClasses$1h = (ownerState) => {
     variant
   } = ownerState;
   const slots = {
-    root: ["root", variant, orientation, fullWidth && "fullWidth", disableElevation && "disableElevation", `color${capitalize$2(color2)}`],
-    grouped: ["grouped", `grouped${capitalize$2(orientation)}`, `grouped${capitalize$2(variant)}`, `grouped${capitalize$2(variant)}${capitalize$2(orientation)}`, `grouped${capitalize$2(variant)}${capitalize$2(color2)}`, disabled && "disabled"],
+    root: ["root", variant, orientation, fullWidth && "fullWidth", disableElevation && "disableElevation", `color${capitalize$1(color2)}`],
+    grouped: ["grouped", `grouped${capitalize$1(orientation)}`, `grouped${capitalize$1(variant)}`, `grouped${capitalize$1(variant)}${capitalize$1(orientation)}`, `grouped${capitalize$1(variant)}${capitalize$1(color2)}`, disabled && "disabled"],
     firstButton: ["firstButton"],
     lastButton: ["lastButton"],
     middleButton: ["middleButton"]
@@ -36625,1421 +36625,219 @@ function composeClasses(slots, getUtilityClass, classes = void 0) {
   }
   return output;
 }
-function isPlainObject(item) {
-  if (typeof item !== "object" || item === null) {
-    return false;
-  }
-  const prototype = Object.getPrototypeOf(item);
-  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in item) && !(Symbol.iterator in item);
+const defaultGenerator = (componentName) => componentName;
+const createClassNameGenerator = () => {
+  let generate = defaultGenerator;
+  return {
+    configure(generator) {
+      generate = generator;
+    },
+    generate(componentName) {
+      return generate(componentName);
+    },
+    reset() {
+      generate = defaultGenerator;
+    }
+  };
+};
+const ClassNameGenerator = createClassNameGenerator();
+const globalStateClasses = {
+  active: "active",
+  checked: "checked",
+  completed: "completed",
+  disabled: "disabled",
+  error: "error",
+  expanded: "expanded",
+  focused: "focused",
+  focusVisible: "focusVisible",
+  open: "open",
+  readOnly: "readOnly",
+  required: "required",
+  selected: "selected"
+};
+function generateUtilityClass(componentName, slot, globalStatePrefix = "Mui") {
+  const globalStateClass = globalStateClasses[slot];
+  return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;
 }
-function deepClone(source) {
-  if (/* @__PURE__ */ React__namespace.isValidElement(source) || reactIsExports.isValidElementType(source) || !isPlainObject(source)) {
-    return source;
-  }
-  const output = {};
-  Object.keys(source).forEach((key) => {
-    output[key] = deepClone(source[key]);
+function generateUtilityClasses(componentName, slots, globalStatePrefix = "Mui") {
+  const result = {};
+  slots.forEach((slot) => {
+    result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);
   });
-  return output;
+  return result;
 }
-function deepmerge(target, source, options = {
-  clone: true
-}) {
-  const output = options.clone ? {
-    ...target
-  } : target;
-  if (isPlainObject(target) && isPlainObject(source)) {
-    Object.keys(source).forEach((key) => {
-      if (/* @__PURE__ */ React__namespace.isValidElement(source[key]) || reactIsExports.isValidElementType(source[key])) {
-        output[key] = source[key];
-      } else if (isPlainObject(source[key]) && // Avoid prototype pollution
-      Object.prototype.hasOwnProperty.call(target, key) && isPlainObject(target[key])) {
-        output[key] = deepmerge(target[key], source[key], options);
-      } else if (options.clone) {
-        output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];
-      } else {
-        output[key] = source[key];
+function getPickersToolbarUtilityClass(slot) {
+  return generateUtilityClass("MuiPickersToolbar", slot);
+}
+const pickersToolbarClasses = generateUtilityClasses("MuiPickersToolbar", ["root", "title", "content"]);
+const _excluded$K = ["localeText"];
+const PickerAdapterContext = /* @__PURE__ */ React__namespace.createContext(null);
+if (process.env.NODE_ENV !== "production") PickerAdapterContext.displayName = "PickerAdapterContext";
+const LocalizationProvider$1 = function LocalizationProvider(inProps) {
+  const {
+    localeText: inLocaleText
+  } = inProps, otherInProps = _objectWithoutPropertiesLoose(inProps, _excluded$K);
+  const {
+    adapter: parentAdapter,
+    localeText: parentLocaleText
+  } = React__namespace.useContext(PickerAdapterContext) ?? {
+    adapter: void 0,
+    localeText: void 0
+  };
+  const props = useThemeProps({
+    // We don't want to pass the `localeText` prop to the theme, that way it will always return the theme value,
+    // We will then merge this theme value with our value manually
+    props: otherInProps,
+    name: "MuiLocalizationProvider"
+  });
+  const {
+    children,
+    dateAdapter: DateAdapter,
+    dateFormats,
+    dateLibInstance,
+    adapterLocale,
+    localeText: themeLocaleText
+  } = props;
+  const localeText = React__namespace.useMemo(() => _extends({}, themeLocaleText, parentLocaleText, inLocaleText), [themeLocaleText, parentLocaleText, inLocaleText]);
+  const adapter = React__namespace.useMemo(() => {
+    if (!DateAdapter) {
+      if (parentAdapter) {
+        return parentAdapter;
       }
+      return null;
+    }
+    const dateAdapter = new DateAdapter({
+      locale: adapterLocale,
+      formats: dateFormats,
+      instance: dateLibInstance
     });
-  }
-  return output;
+    if (!dateAdapter.isMUIAdapter) {
+      throw new Error(["MUI X: The date adapter should be imported from `@mui/x-date-pickers` or `@mui/x-date-pickers-pro`, not from `@date-io`", "For example, `import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'` instead of `import AdapterDayjs from '@date-io/dayjs'`", "More information on the installation documentation: https://mui.com/x/react-date-pickers/quickstart/#installation"].join(`
+`));
+    }
+    return dateAdapter;
+  }, [DateAdapter, adapterLocale, dateFormats, dateLibInstance, parentAdapter]);
+  const defaultDates = React__namespace.useMemo(() => {
+    if (!adapter) {
+      return null;
+    }
+    return {
+      minDate: adapter.date("1900-01-01T00:00:00.000"),
+      maxDate: adapter.date("2099-12-31T00:00:00.000")
+    };
+  }, [adapter]);
+  const contextValue = React__namespace.useMemo(() => {
+    return {
+      utils: adapter,
+      adapter,
+      defaultDates,
+      localeText
+    };
+  }, [defaultDates, adapter, localeText]);
+  return /* @__PURE__ */ jsxRuntime.jsx(PickerAdapterContext.Provider, {
+    value: contextValue,
+    children
+  });
+};
+if (process.env.NODE_ENV !== "production") LocalizationProvider$1.displayName = "LocalizationProvider";
+process.env.NODE_ENV !== "production" ? LocalizationProvider$1.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * Locale for the date library you are using
+   */
+  adapterLocale: PropTypes.any,
+  children: PropTypes.node,
+  /**
+   * Date library adapter class function.
+   * @see See the localization provider {@link https://mui.com/x/react-date-pickers/quickstart/#integrate-provider-and-adapter date adapter setup section} for more details.
+   */
+  dateAdapter: PropTypes.func,
+  /**
+   * Formats that are used for any child pickers
+   */
+  dateFormats: PropTypes.shape({
+    dayOfMonth: PropTypes.string,
+    dayOfMonthFull: PropTypes.string,
+    fullDate: PropTypes.string,
+    fullTime12h: PropTypes.string,
+    fullTime24h: PropTypes.string,
+    hours12h: PropTypes.string,
+    hours24h: PropTypes.string,
+    keyboardDate: PropTypes.string,
+    keyboardDateTime12h: PropTypes.string,
+    keyboardDateTime24h: PropTypes.string,
+    meridiem: PropTypes.string,
+    minutes: PropTypes.string,
+    month: PropTypes.string,
+    monthShort: PropTypes.string,
+    normalDate: PropTypes.string,
+    normalDateWithWeekday: PropTypes.string,
+    seconds: PropTypes.string,
+    shortDate: PropTypes.string,
+    weekday: PropTypes.string,
+    weekdayShort: PropTypes.string,
+    year: PropTypes.string
+  }),
+  /**
+   * Date library instance you are using, if it has some global overrides
+   * ```jsx
+   * dateLibInstance={momentTimeZone}
+   * ```
+   */
+  dateLibInstance: PropTypes.any,
+  /**
+   * Locale for components texts
+   */
+  localeText: PropTypes.object
+} : void 0;
+const IsValidValueContext = /* @__PURE__ */ React__namespace.createContext(() => true);
+if (process.env.NODE_ENV !== "production") IsValidValueContext.displayName = "IsValidValueContext";
+function useIsValidValue() {
+  return React__namespace.useContext(IsValidValueContext);
 }
-function formatMuiErrorMessage$1(code, ...args) {
-  const url = new URL(`https://mui.com/production-error/?code=${code}`);
-  args.forEach((arg2) => url.searchParams.append("args[]", arg2));
-  return `Minified MUI error #${code}; visit ${url} for the full message.`;
+const PickerFieldPrivateContext = /* @__PURE__ */ React__namespace.createContext(null);
+if (process.env.NODE_ENV !== "production") PickerFieldPrivateContext.displayName = "PickerFieldPrivateContext";
+function useNullableFieldPrivateContext() {
+  return React__namespace.useContext(PickerFieldPrivateContext);
 }
-function capitalize$1(string) {
-  if (typeof string !== "string") {
-    throw new Error(process.env.NODE_ENV !== "production" ? "MUI: `capitalize(string)` expects a string argument." : formatMuiErrorMessage$1(7));
+const PickerContext = /* @__PURE__ */ React__namespace.createContext(null);
+if (process.env.NODE_ENV !== "production") PickerContext.displayName = "PickerContext";
+const usePickerContext = () => {
+  const value = React__namespace.useContext(PickerContext);
+  if (value == null) {
+    throw new Error("MUI X: The `usePickerContext` hook can only be called inside the context of a Picker component");
   }
-  return string.charAt(0).toUpperCase() + string.slice(1);
-}
-const sortBreakpointsValues = (values2) => {
-  const breakpointsAsArray = Object.keys(values2).map((key) => ({
-    key,
-    val: values2[key]
-  })) || [];
-  breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);
-  return breakpointsAsArray.reduce((acc, obj) => {
-    return {
-      ...acc,
-      [obj.key]: obj.val
-    };
-  }, {});
+  return value;
 };
-function createBreakpoints(breakpoints) {
-  const {
-    // The breakpoint **start** at this value.
-    // For instance with the first breakpoint xs: [xs, sm).
-    values: values2 = {
-      xs: 0,
-      // phone
-      sm: 600,
-      // tablet
-      md: 900,
-      // small laptop
-      lg: 1200,
-      // desktop
-      xl: 1536
-      // large screen
-    },
-    unit = "px",
-    step = 5,
-    ...other
-  } = breakpoints;
-  const sortedValues = sortBreakpointsValues(values2);
-  const keys = Object.keys(sortedValues);
-  function up(key) {
-    const value = typeof values2[key] === "number" ? values2[key] : key;
-    return `@media (min-width:${value}${unit})`;
-  }
-  function down(key) {
-    const value = typeof values2[key] === "number" ? values2[key] : key;
-    return `@media (max-width:${value - step / 100}${unit})`;
-  }
-  function between(start2, end2) {
-    const endIndex = keys.indexOf(end2);
-    return `@media (min-width:${typeof values2[start2] === "number" ? values2[start2] : start2}${unit}) and (max-width:${(endIndex !== -1 && typeof values2[keys[endIndex]] === "number" ? values2[keys[endIndex]] : end2) - step / 100}${unit})`;
-  }
-  function only(key) {
-    if (keys.indexOf(key) + 1 < keys.length) {
-      return between(key, keys[keys.indexOf(key) + 1]);
-    }
-    return up(key);
-  }
-  function not(key) {
-    const keyIndex = keys.indexOf(key);
-    if (keyIndex === 0) {
-      return up(keys[1]);
-    }
-    if (keyIndex === keys.length - 1) {
-      return down(keys[keyIndex]);
-    }
-    return between(key, keys[keys.indexOf(key) + 1]).replace("@media", "@media not all and");
-  }
-  return {
-    keys,
-    values: sortedValues,
-    up,
-    down,
-    between,
-    only,
-    not,
-    unit,
-    ...other
-  };
-}
-function sortContainerQueries(theme2, css) {
-  if (!theme2.containerQueries) {
-    return css;
-  }
-  const sorted = Object.keys(css).filter((key) => key.startsWith("@container")).sort((a, b) => {
-    const regex = /min-width:\s*([0-9.]+)/;
-    return +(a.match(regex)?.[1] || 0) - +(b.match(regex)?.[1] || 0);
-  });
-  if (!sorted.length) {
-    return css;
-  }
-  return sorted.reduce((acc, key) => {
-    const value = css[key];
-    delete acc[key];
-    acc[key] = value;
-    return acc;
-  }, {
-    ...css
-  });
-}
-function isCqShorthand(breakpointKeys, value) {
-  return value === "@" || value.startsWith("@") && (breakpointKeys.some((key) => value.startsWith(`@${key}`)) || !!value.match(/^@\d/));
-}
-function getContainerQuery(theme2, shorthand) {
-  const matches = shorthand.match(/^@([^/]+)?\/?(.+)?$/);
-  if (!matches) {
-    if (process.env.NODE_ENV !== "production") {
-      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The provided shorthand ${`(${shorthand})`} is invalid. The format should be \`@<breakpoint | number>\` or \`@<breakpoint | number>/<container>\`.
-For example, \`@sm\` or \`@600\` or \`@40rem/sidebar\`.` : formatMuiErrorMessage$1(18, `(${shorthand})`));
-    }
-    return null;
-  }
-  const [, containerQuery, containerName] = matches;
-  const value = Number.isNaN(+containerQuery) ? containerQuery || 0 : +containerQuery;
-  return theme2.containerQueries(containerName).up(value);
-}
-function cssContainerQueries(themeInput) {
-  const toContainerQuery = (mediaQuery, name) => mediaQuery.replace("@media", name ? `@container ${name}` : "@container");
-  function attachCq(node2, name) {
-    node2.up = (...args) => toContainerQuery(themeInput.breakpoints.up(...args), name);
-    node2.down = (...args) => toContainerQuery(themeInput.breakpoints.down(...args), name);
-    node2.between = (...args) => toContainerQuery(themeInput.breakpoints.between(...args), name);
-    node2.only = (...args) => toContainerQuery(themeInput.breakpoints.only(...args), name);
-    node2.not = (...args) => {
-      const result = toContainerQuery(themeInput.breakpoints.not(...args), name);
-      if (result.includes("not all and")) {
-        return result.replace("not all and ", "").replace("min-width:", "width<").replace("max-width:", "width>").replace("and", "or");
-      }
-      return result;
-    };
-  }
-  const node = {};
-  const containerQueries = (name) => {
-    attachCq(node, name);
-    return node;
-  };
-  attachCq(containerQueries);
-  return {
-    ...themeInput,
-    containerQueries
-  };
-}
-const shape = {
-  borderRadius: 4
-};
-const responsivePropType = process.env.NODE_ENV !== "production" ? PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.object, PropTypes.array]) : {};
-function merge(acc, item) {
-  if (!item) {
-    return acc;
-  }
-  return deepmerge(acc, item, {
-    clone: false
-    // No need to clone deep, it's way faster.
-  });
-}
-const values = {
-  xs: 0,
-  // phone
-  sm: 600,
-  // tablet
-  md: 900,
-  // small laptop
-  lg: 1200,
-  // desktop
-  xl: 1536
-  // large screen
-};
-const defaultBreakpoints = {
-  // Sorted ASC by size. That's important.
-  // It can't be configured as it's used statically for propTypes.
-  keys: ["xs", "sm", "md", "lg", "xl"],
-  up: (key) => `@media (min-width:${values[key]}px)`
-};
-const defaultContainerQueries = {
-  containerQueries: (containerName) => ({
-    up: (key) => {
-      let result = typeof key === "number" ? key : values[key] || key;
-      if (typeof result === "number") {
-        result = `${result}px`;
-      }
-      return containerName ? `@container ${containerName} (min-width:${result})` : `@container (min-width:${result})`;
-    }
-  })
-};
-function handleBreakpoints(props, propValue, styleFromPropValue) {
-  const theme2 = props.theme || {};
-  if (Array.isArray(propValue)) {
-    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints;
-    return propValue.reduce((acc, item, index) => {
-      acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);
-      return acc;
-    }, {});
-  }
-  if (typeof propValue === "object") {
-    const themeBreakpoints = theme2.breakpoints || defaultBreakpoints;
-    return Object.keys(propValue).reduce((acc, breakpoint) => {
-      if (isCqShorthand(themeBreakpoints.keys, breakpoint)) {
-        const containerKey = getContainerQuery(theme2.containerQueries ? theme2 : defaultContainerQueries, breakpoint);
-        if (containerKey) {
-          acc[containerKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
-        }
-      } else if (Object.keys(themeBreakpoints.values || values).includes(breakpoint)) {
-        const mediaKey = themeBreakpoints.up(breakpoint);
-        acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
-      } else {
-        const cssKey = breakpoint;
-        acc[cssKey] = propValue[cssKey];
-      }
-      return acc;
-    }, {});
-  }
-  const output = styleFromPropValue(propValue);
-  return output;
-}
-function createEmptyBreakpointObject(breakpointsInput = {}) {
-  const breakpointsInOrder = breakpointsInput.keys?.reduce((acc, key) => {
-    const breakpointStyleKey = breakpointsInput.up(key);
-    acc[breakpointStyleKey] = {};
-    return acc;
-  }, {});
-  return breakpointsInOrder || {};
-}
-function removeUnusedBreakpoints(breakpointKeys, style2) {
-  return breakpointKeys.reduce((acc, key) => {
-    const breakpointOutput = acc[key];
-    const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;
-    if (isBreakpointUnused) {
-      delete acc[key];
-    }
-    return acc;
-  }, style2);
-}
-function getPath(obj, path, checkVars = true) {
-  if (!path || typeof path !== "string") {
-    return null;
-  }
-  if (obj && obj.vars && checkVars) {
-    const val = `vars.${path}`.split(".").reduce((acc, item) => acc && acc[item] ? acc[item] : null, obj);
-    if (val != null) {
-      return val;
-    }
-  }
-  return path.split(".").reduce((acc, item) => {
-    if (acc && acc[item] != null) {
-      return acc[item];
-    }
-    return null;
-  }, obj);
-}
-function getStyleValue(themeMapping, transform, propValueFinal, userValue = propValueFinal) {
-  let value;
-  if (typeof themeMapping === "function") {
-    value = themeMapping(propValueFinal);
-  } else if (Array.isArray(themeMapping)) {
-    value = themeMapping[propValueFinal] || userValue;
-  } else {
-    value = getPath(themeMapping, propValueFinal) || userValue;
-  }
-  if (transform) {
-    value = transform(value, userValue, themeMapping);
-  }
-  return value;
-}
-function style$1(options) {
-  const {
-    prop,
-    cssProperty = options.prop,
-    themeKey,
-    transform
-  } = options;
-  const fn2 = (props) => {
-    if (props[prop] == null) {
-      return null;
-    }
-    const propValue = props[prop];
-    const theme2 = props.theme;
-    const themeMapping = getPath(theme2, themeKey) || {};
-    const styleFromPropValue = (propValueFinal) => {
-      let value = getStyleValue(themeMapping, transform, propValueFinal);
-      if (propValueFinal === value && typeof propValueFinal === "string") {
-        value = getStyleValue(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$1(propValueFinal)}`, propValueFinal);
-      }
-      if (cssProperty === false) {
-        return value;
-      }
-      return {
-        [cssProperty]: value
-      };
-    };
-    return handleBreakpoints(props, propValue, styleFromPropValue);
-  };
-  fn2.propTypes = process.env.NODE_ENV !== "production" ? {
-    [prop]: responsivePropType
-  } : {};
-  fn2.filterProps = [prop];
-  return fn2;
-}
-function memoize(fn2) {
-  const cache = {};
-  return (arg2) => {
-    if (cache[arg2] === void 0) {
-      cache[arg2] = fn2(arg2);
-    }
-    return cache[arg2];
-  };
-}
-const properties = {
-  m: "margin",
-  p: "padding"
-};
-const directions = {
-  t: "Top",
-  r: "Right",
-  b: "Bottom",
-  l: "Left",
-  x: ["Left", "Right"],
-  y: ["Top", "Bottom"]
-};
-const aliases = {
-  marginX: "mx",
-  marginY: "my",
-  paddingX: "px",
-  paddingY: "py"
-};
-const getCssProperties = memoize((prop) => {
-  if (prop.length > 2) {
-    if (aliases[prop]) {
-      prop = aliases[prop];
-    } else {
-      return [prop];
-    }
-  }
-  const [a, b] = prop.split("");
-  const property = properties[a];
-  const direction = directions[b] || "";
-  return Array.isArray(direction) ? direction.map((dir) => property + dir) : [property + direction];
-});
-const marginKeys = ["m", "mt", "mr", "mb", "ml", "mx", "my", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "marginInline", "marginInlineStart", "marginInlineEnd", "marginBlock", "marginBlockStart", "marginBlockEnd"];
-const paddingKeys = ["p", "pt", "pr", "pb", "pl", "px", "py", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "paddingBlock", "paddingBlockStart", "paddingBlockEnd"];
-const spacingKeys = [...marginKeys, ...paddingKeys];
-function createUnaryUnit(theme2, themeKey, defaultValue, propName) {
-  const themeSpacing = getPath(theme2, themeKey, true) ?? defaultValue;
-  if (typeof themeSpacing === "number" || typeof themeSpacing === "string") {
-    return (val) => {
-      if (typeof val === "string") {
-        return val;
-      }
-      if (process.env.NODE_ENV !== "production") {
-        if (typeof val !== "number") {
-          console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${val}.`);
-        }
-      }
-      if (typeof themeSpacing === "string") {
-        if (themeSpacing.startsWith("var(") && val === 0) {
-          return 0;
-        }
-        if (themeSpacing.startsWith("var(") && val === 1) {
-          return themeSpacing;
-        }
-        return `calc(${val} * ${themeSpacing})`;
-      }
-      return themeSpacing * val;
-    };
-  }
-  if (Array.isArray(themeSpacing)) {
-    return (val) => {
-      if (typeof val === "string") {
-        return val;
-      }
-      const abs = Math.abs(val);
-      if (process.env.NODE_ENV !== "production") {
-        if (!Number.isInteger(abs)) {
-          console.error([`MUI: The \`theme.${themeKey}\` array type cannot be combined with non integer values.You should either use an integer value that can be used as index, or define the \`theme.${themeKey}\` as a number.`].join("\n"));
-        } else if (abs > themeSpacing.length - 1) {
-          console.error([`MUI: The value provided (${abs}) overflows.`, `The supported values are: ${JSON.stringify(themeSpacing)}.`, `${abs} > ${themeSpacing.length - 1}, you need to add the missing values.`].join("\n"));
-        }
-      }
-      const transformed = themeSpacing[abs];
-      if (val >= 0) {
-        return transformed;
-      }
-      if (typeof transformed === "number") {
-        return -transformed;
-      }
-      if (typeof transformed === "string" && transformed.startsWith("var(")) {
-        return `calc(-1 * ${transformed})`;
-      }
-      return `-${transformed}`;
-    };
-  }
-  if (typeof themeSpacing === "function") {
-    return themeSpacing;
-  }
-  if (process.env.NODE_ENV !== "production") {
-    console.error([`MUI: The \`theme.${themeKey}\` value (${themeSpacing}) is invalid.`, "It should be a number, an array or a function."].join("\n"));
-  }
-  return () => void 0;
-}
-function createUnarySpacing(theme2) {
-  return createUnaryUnit(theme2, "spacing", 8, "spacing");
-}
-function getValue(transformer, propValue) {
-  if (typeof propValue === "string" || propValue == null) {
-    return propValue;
-  }
-  return transformer(propValue);
-}
-function getStyleFromPropValue(cssProperties, transformer) {
-  return (propValue) => cssProperties.reduce((acc, cssProperty) => {
-    acc[cssProperty] = getValue(transformer, propValue);
-    return acc;
-  }, {});
-}
-function resolveCssProperty(props, keys, prop, transformer) {
-  if (!keys.includes(prop)) {
-    return null;
-  }
-  const cssProperties = getCssProperties(prop);
-  const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);
-  const propValue = props[prop];
-  return handleBreakpoints(props, propValue, styleFromPropValue);
-}
-function style(props, keys) {
-  const transformer = createUnarySpacing(props.theme);
-  return Object.keys(props).map((prop) => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});
-}
-function margin(props) {
-  return style(props, marginKeys);
-}
-margin.propTypes = process.env.NODE_ENV !== "production" ? marginKeys.reduce((obj, key) => {
-  obj[key] = responsivePropType;
-  return obj;
-}, {}) : {};
-margin.filterProps = marginKeys;
-function padding(props) {
-  return style(props, paddingKeys);
-}
-padding.propTypes = process.env.NODE_ENV !== "production" ? paddingKeys.reduce((obj, key) => {
-  obj[key] = responsivePropType;
-  return obj;
-}, {}) : {};
-padding.filterProps = paddingKeys;
-process.env.NODE_ENV !== "production" ? spacingKeys.reduce((obj, key) => {
-  obj[key] = responsivePropType;
-  return obj;
-}, {}) : {};
-function createSpacing(spacingInput = 8, transform = createUnarySpacing({
-  spacing: spacingInput
-})) {
-  if (spacingInput.mui) {
-    return spacingInput;
-  }
-  const spacing2 = (...argsInput) => {
-    if (process.env.NODE_ENV !== "production") {
-      if (!(argsInput.length <= 4)) {
-        console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${argsInput.length}`);
-      }
-    }
-    const args = argsInput.length === 0 ? [1] : argsInput;
-    return args.map((argument) => {
-      const output = transform(argument);
-      return typeof output === "number" ? `${output}px` : output;
-    }).join(" ");
-  };
-  spacing2.mui = true;
-  return spacing2;
-}
-function compose(...styles2) {
-  const handlers = styles2.reduce((acc, style2) => {
-    style2.filterProps.forEach((prop) => {
-      acc[prop] = style2;
-    });
-    return acc;
-  }, {});
-  const fn2 = (props) => {
-    return Object.keys(props).reduce((acc, prop) => {
-      if (handlers[prop]) {
-        return merge(acc, handlers[prop](props));
-      }
-      return acc;
-    }, {});
-  };
-  fn2.propTypes = process.env.NODE_ENV !== "production" ? styles2.reduce((acc, style2) => Object.assign(acc, style2.propTypes), {}) : {};
-  fn2.filterProps = styles2.reduce((acc, style2) => acc.concat(style2.filterProps), []);
-  return fn2;
-}
-function borderTransform(value) {
-  if (typeof value !== "number") {
-    return value;
-  }
-  return `${value}px solid`;
-}
-function createBorderStyle(prop, transform) {
-  return style$1({
-    prop,
-    themeKey: "borders",
-    transform
-  });
-}
-const border = createBorderStyle("border", borderTransform);
-const borderTop = createBorderStyle("borderTop", borderTransform);
-const borderRight = createBorderStyle("borderRight", borderTransform);
-const borderBottom = createBorderStyle("borderBottom", borderTransform);
-const borderLeft = createBorderStyle("borderLeft", borderTransform);
-const borderColor = createBorderStyle("borderColor");
-const borderTopColor = createBorderStyle("borderTopColor");
-const borderRightColor = createBorderStyle("borderRightColor");
-const borderBottomColor = createBorderStyle("borderBottomColor");
-const borderLeftColor = createBorderStyle("borderLeftColor");
-const outline = createBorderStyle("outline", borderTransform);
-const outlineColor = createBorderStyle("outlineColor");
-const borderRadius = (props) => {
-  if (props.borderRadius !== void 0 && props.borderRadius !== null) {
-    const transformer = createUnaryUnit(props.theme, "shape.borderRadius", 4, "borderRadius");
-    const styleFromPropValue = (propValue) => ({
-      borderRadius: getValue(transformer, propValue)
-    });
-    return handleBreakpoints(props, props.borderRadius, styleFromPropValue);
-  }
-  return null;
-};
-borderRadius.propTypes = process.env.NODE_ENV !== "production" ? {
-  borderRadius: responsivePropType
-} : {};
-borderRadius.filterProps = ["borderRadius"];
-compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius, outline, outlineColor);
-const gap = (props) => {
-  if (props.gap !== void 0 && props.gap !== null) {
-    const transformer = createUnaryUnit(props.theme, "spacing", 8, "gap");
-    const styleFromPropValue = (propValue) => ({
-      gap: getValue(transformer, propValue)
-    });
-    return handleBreakpoints(props, props.gap, styleFromPropValue);
-  }
-  return null;
-};
-gap.propTypes = process.env.NODE_ENV !== "production" ? {
-  gap: responsivePropType
-} : {};
-gap.filterProps = ["gap"];
-const columnGap = (props) => {
-  if (props.columnGap !== void 0 && props.columnGap !== null) {
-    const transformer = createUnaryUnit(props.theme, "spacing", 8, "columnGap");
-    const styleFromPropValue = (propValue) => ({
-      columnGap: getValue(transformer, propValue)
-    });
-    return handleBreakpoints(props, props.columnGap, styleFromPropValue);
-  }
-  return null;
-};
-columnGap.propTypes = process.env.NODE_ENV !== "production" ? {
-  columnGap: responsivePropType
-} : {};
-columnGap.filterProps = ["columnGap"];
-const rowGap = (props) => {
-  if (props.rowGap !== void 0 && props.rowGap !== null) {
-    const transformer = createUnaryUnit(props.theme, "spacing", 8, "rowGap");
-    const styleFromPropValue = (propValue) => ({
-      rowGap: getValue(transformer, propValue)
-    });
-    return handleBreakpoints(props, props.rowGap, styleFromPropValue);
-  }
-  return null;
-};
-rowGap.propTypes = process.env.NODE_ENV !== "production" ? {
-  rowGap: responsivePropType
-} : {};
-rowGap.filterProps = ["rowGap"];
-const gridColumn = style$1({
-  prop: "gridColumn"
-});
-const gridRow = style$1({
-  prop: "gridRow"
-});
-const gridAutoFlow = style$1({
-  prop: "gridAutoFlow"
-});
-const gridAutoColumns = style$1({
-  prop: "gridAutoColumns"
-});
-const gridAutoRows = style$1({
-  prop: "gridAutoRows"
-});
-const gridTemplateColumns = style$1({
-  prop: "gridTemplateColumns"
-});
-const gridTemplateRows = style$1({
-  prop: "gridTemplateRows"
-});
-const gridTemplateAreas = style$1({
-  prop: "gridTemplateAreas"
-});
-const gridArea = style$1({
-  prop: "gridArea"
-});
-compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);
-function paletteTransform(value, userValue) {
-  if (userValue === "grey") {
-    return userValue;
-  }
-  return value;
-}
-const color = style$1({
-  prop: "color",
-  themeKey: "palette",
-  transform: paletteTransform
-});
-const bgcolor = style$1({
-  prop: "bgcolor",
-  cssProperty: "backgroundColor",
-  themeKey: "palette",
-  transform: paletteTransform
-});
-const backgroundColor = style$1({
-  prop: "backgroundColor",
-  themeKey: "palette",
-  transform: paletteTransform
-});
-compose(color, bgcolor, backgroundColor);
-function sizingTransform(value) {
-  return value <= 1 && value !== 0 ? `${value * 100}%` : value;
-}
-const width = style$1({
-  prop: "width",
-  transform: sizingTransform
-});
-const maxWidth = (props) => {
-  if (props.maxWidth !== void 0 && props.maxWidth !== null) {
-    const styleFromPropValue = (propValue) => {
-      const breakpoint = props.theme?.breakpoints?.values?.[propValue] || values[propValue];
-      if (!breakpoint) {
-        return {
-          maxWidth: sizingTransform(propValue)
-        };
-      }
-      if (props.theme?.breakpoints?.unit !== "px") {
-        return {
-          maxWidth: `${breakpoint}${props.theme.breakpoints.unit}`
-        };
-      }
-      return {
-        maxWidth: breakpoint
-      };
-    };
-    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
-  }
-  return null;
-};
-maxWidth.filterProps = ["maxWidth"];
-const minWidth = style$1({
-  prop: "minWidth",
-  transform: sizingTransform
-});
-const height = style$1({
-  prop: "height",
-  transform: sizingTransform
-});
-const maxHeight = style$1({
-  prop: "maxHeight",
-  transform: sizingTransform
-});
-const minHeight = style$1({
-  prop: "minHeight",
-  transform: sizingTransform
-});
-style$1({
-  prop: "size",
-  cssProperty: "width",
-  transform: sizingTransform
-});
-style$1({
-  prop: "size",
-  cssProperty: "height",
-  transform: sizingTransform
-});
-const boxSizing = style$1({
-  prop: "boxSizing"
-});
-compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);
-const defaultSxConfig = {
-  // borders
-  border: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  borderTop: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  borderRight: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  borderBottom: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  borderLeft: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  borderColor: {
-    themeKey: "palette"
-  },
-  borderTopColor: {
-    themeKey: "palette"
-  },
-  borderRightColor: {
-    themeKey: "palette"
-  },
-  borderBottomColor: {
-    themeKey: "palette"
-  },
-  borderLeftColor: {
-    themeKey: "palette"
-  },
-  outline: {
-    themeKey: "borders",
-    transform: borderTransform
-  },
-  outlineColor: {
-    themeKey: "palette"
-  },
-  borderRadius: {
-    themeKey: "shape.borderRadius",
-    style: borderRadius
-  },
-  // palette
-  color: {
-    themeKey: "palette",
-    transform: paletteTransform
-  },
-  bgcolor: {
-    themeKey: "palette",
-    cssProperty: "backgroundColor",
-    transform: paletteTransform
-  },
-  backgroundColor: {
-    themeKey: "palette",
-    transform: paletteTransform
-  },
-  // spacing
-  p: {
-    style: padding
-  },
-  pt: {
-    style: padding
-  },
-  pr: {
-    style: padding
-  },
-  pb: {
-    style: padding
-  },
-  pl: {
-    style: padding
-  },
-  px: {
-    style: padding
-  },
-  py: {
-    style: padding
-  },
-  padding: {
-    style: padding
-  },
-  paddingTop: {
-    style: padding
-  },
-  paddingRight: {
-    style: padding
-  },
-  paddingBottom: {
-    style: padding
-  },
-  paddingLeft: {
-    style: padding
-  },
-  paddingX: {
-    style: padding
-  },
-  paddingY: {
-    style: padding
-  },
-  paddingInline: {
-    style: padding
-  },
-  paddingInlineStart: {
-    style: padding
-  },
-  paddingInlineEnd: {
-    style: padding
-  },
-  paddingBlock: {
-    style: padding
-  },
-  paddingBlockStart: {
-    style: padding
-  },
-  paddingBlockEnd: {
-    style: padding
-  },
-  m: {
-    style: margin
-  },
-  mt: {
-    style: margin
-  },
-  mr: {
-    style: margin
-  },
-  mb: {
-    style: margin
-  },
-  ml: {
-    style: margin
-  },
-  mx: {
-    style: margin
-  },
-  my: {
-    style: margin
-  },
-  margin: {
-    style: margin
-  },
-  marginTop: {
-    style: margin
-  },
-  marginRight: {
-    style: margin
-  },
-  marginBottom: {
-    style: margin
-  },
-  marginLeft: {
-    style: margin
-  },
-  marginX: {
-    style: margin
-  },
-  marginY: {
-    style: margin
-  },
-  marginInline: {
-    style: margin
-  },
-  marginInlineStart: {
-    style: margin
-  },
-  marginInlineEnd: {
-    style: margin
-  },
-  marginBlock: {
-    style: margin
-  },
-  marginBlockStart: {
-    style: margin
-  },
-  marginBlockEnd: {
-    style: margin
-  },
-  // display
-  displayPrint: {
-    cssProperty: false,
-    transform: (value) => ({
-      "@media print": {
-        display: value
-      }
-    })
-  },
-  display: {},
-  overflow: {},
-  textOverflow: {},
-  visibility: {},
-  whiteSpace: {},
-  // flexbox
-  flexBasis: {},
-  flexDirection: {},
-  flexWrap: {},
-  justifyContent: {},
-  alignItems: {},
-  alignContent: {},
-  order: {},
-  flex: {},
-  flexGrow: {},
-  flexShrink: {},
-  alignSelf: {},
-  justifyItems: {},
-  justifySelf: {},
-  // grid
-  gap: {
-    style: gap
-  },
-  rowGap: {
-    style: rowGap
-  },
-  columnGap: {
-    style: columnGap
-  },
-  gridColumn: {},
-  gridRow: {},
-  gridAutoFlow: {},
-  gridAutoColumns: {},
-  gridAutoRows: {},
-  gridTemplateColumns: {},
-  gridTemplateRows: {},
-  gridTemplateAreas: {},
-  gridArea: {},
-  // positions
-  position: {},
-  zIndex: {
-    themeKey: "zIndex"
-  },
-  top: {},
-  right: {},
-  bottom: {},
-  left: {},
-  // shadows
-  boxShadow: {
-    themeKey: "shadows"
-  },
-  // sizing
-  width: {
-    transform: sizingTransform
-  },
-  maxWidth: {
-    style: maxWidth
-  },
-  minWidth: {
-    transform: sizingTransform
-  },
-  height: {
-    transform: sizingTransform
-  },
-  maxHeight: {
-    transform: sizingTransform
-  },
-  minHeight: {
-    transform: sizingTransform
-  },
-  boxSizing: {},
-  // typography
-  font: {
-    themeKey: "font"
-  },
-  fontFamily: {
-    themeKey: "typography"
-  },
-  fontSize: {
-    themeKey: "typography"
-  },
-  fontStyle: {
-    themeKey: "typography"
-  },
-  fontWeight: {
-    themeKey: "typography"
-  },
-  letterSpacing: {},
-  textTransform: {},
-  lineHeight: {},
-  textAlign: {},
-  typography: {
-    cssProperty: false,
-    themeKey: "typography"
-  }
-};
-function objectsHaveSameKeys(...objects) {
-  const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);
-  const union = new Set(allKeys);
-  return objects.every((object) => union.size === Object.keys(object).length);
-}
-function callIfFn(maybeFn, arg2) {
-  return typeof maybeFn === "function" ? maybeFn(arg2) : maybeFn;
-}
-function unstable_createStyleFunctionSx() {
-  function getThemeValue(prop, val, theme2, config2) {
-    const props = {
-      [prop]: val,
-      theme: theme2
-    };
-    const options = config2[prop];
-    if (!options) {
-      return {
-        [prop]: val
-      };
-    }
-    const {
-      cssProperty = prop,
-      themeKey,
-      transform,
-      style: style2
-    } = options;
-    if (val == null) {
-      return null;
-    }
-    if (themeKey === "typography" && val === "inherit") {
-      return {
-        [prop]: val
-      };
-    }
-    const themeMapping = getPath(theme2, themeKey) || {};
-    if (style2) {
-      return style2(props);
-    }
-    const styleFromPropValue = (propValueFinal) => {
-      let value = getStyleValue(themeMapping, transform, propValueFinal);
-      if (propValueFinal === value && typeof propValueFinal === "string") {
-        value = getStyleValue(themeMapping, transform, `${prop}${propValueFinal === "default" ? "" : capitalize$1(propValueFinal)}`, propValueFinal);
-      }
-      if (cssProperty === false) {
-        return value;
-      }
-      return {
-        [cssProperty]: value
-      };
-    };
-    return handleBreakpoints(props, val, styleFromPropValue);
-  }
-  function styleFunctionSx2(props) {
-    const {
-      sx,
-      theme: theme2 = {},
-      nested
-    } = props || {};
-    if (!sx) {
-      return null;
-    }
-    const config2 = theme2.unstable_sxConfig ?? defaultSxConfig;
-    function traverse(sxInput) {
-      let sxObject = sxInput;
-      if (typeof sxInput === "function") {
-        sxObject = sxInput(theme2);
-      } else if (typeof sxInput !== "object") {
-        return sxInput;
-      }
-      if (!sxObject) {
-        return null;
-      }
-      const emptyBreakpoints = createEmptyBreakpointObject(theme2.breakpoints);
-      const breakpointsKeys = Object.keys(emptyBreakpoints);
-      let css = emptyBreakpoints;
-      Object.keys(sxObject).forEach((styleKey) => {
-        const value = callIfFn(sxObject[styleKey], theme2);
-        if (value !== null && value !== void 0) {
-          if (typeof value === "object") {
-            if (config2[styleKey]) {
-              css = merge(css, getThemeValue(styleKey, value, theme2, config2));
-            } else {
-              const breakpointsValues = handleBreakpoints({
-                theme: theme2
-              }, value, (x) => ({
-                [styleKey]: x
-              }));
-              if (objectsHaveSameKeys(breakpointsValues, value)) {
-                css[styleKey] = styleFunctionSx2({
-                  sx: value,
-                  theme: theme2,
-                  nested: true
-                });
-              } else {
-                css = merge(css, breakpointsValues);
-              }
-            }
-          } else {
-            css = merge(css, getThemeValue(styleKey, value, theme2, config2));
-          }
-        }
-      });
-      if (!nested && theme2.modularCssLayers) {
-        return {
-          "@layer sx": sortContainerQueries(theme2, removeUnusedBreakpoints(breakpointsKeys, css))
-        };
-      }
-      return sortContainerQueries(theme2, removeUnusedBreakpoints(breakpointsKeys, css));
-    }
-    return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);
-  }
-  return styleFunctionSx2;
-}
-const styleFunctionSx = unstable_createStyleFunctionSx();
-styleFunctionSx.filterProps = ["sx"];
-function applyStyles(key, styles2) {
-  const theme2 = this;
-  if (theme2.vars) {
-    if (!theme2.colorSchemes?.[key] || typeof theme2.getColorSchemeSelector !== "function") {
-      return {};
-    }
-    let selector = theme2.getColorSchemeSelector(key);
-    if (selector === "&") {
-      return styles2;
-    }
-    if (selector.includes("data-") || selector.includes(".")) {
-      selector = `*:where(${selector.replace(/\s*&$/, "")}) &`;
-    }
-    return {
-      [selector]: styles2
-    };
-  }
-  if (theme2.palette.mode === key) {
-    return styles2;
-  }
-  return {};
-}
-function createTheme(options = {}, ...args) {
-  const {
-    breakpoints: breakpointsInput = {},
-    palette: paletteInput = {},
-    spacing: spacingInput,
-    shape: shapeInput = {},
-    ...other
-  } = options;
-  const breakpoints = createBreakpoints(breakpointsInput);
-  const spacing2 = createSpacing(spacingInput);
-  let muiTheme = deepmerge({
-    breakpoints,
-    direction: "ltr",
-    components: {},
-    // Inject component definitions.
-    palette: {
-      mode: "light",
-      ...paletteInput
-    },
-    spacing: spacing2,
-    shape: {
-      ...shape,
-      ...shapeInput
-    }
-  }, other);
-  muiTheme = cssContainerQueries(muiTheme);
-  muiTheme.applyStyles = applyStyles;
-  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
-  muiTheme.unstable_sxConfig = {
-    ...defaultSxConfig,
-    ...other?.unstable_sxConfig
-  };
-  muiTheme.unstable_sx = function sx(props) {
-    return styleFunctionSx({
-      sx: props,
-      theme: this
-    });
-  };
-  return muiTheme;
-}
-createTheme();
-function shouldForwardProp(prop) {
-  return prop !== "ownerState" && prop !== "theme" && prop !== "sx" && prop !== "as";
-}
-const defaultGenerator = (componentName) => componentName;
-const createClassNameGenerator = () => {
-  let generate = defaultGenerator;
-  return {
-    configure(generator) {
-      generate = generator;
-    },
-    generate(componentName) {
-      return generate(componentName);
-    },
-    reset() {
-      generate = defaultGenerator;
-    }
-  };
-};
-const ClassNameGenerator = createClassNameGenerator();
-const globalStateClasses = {
-  active: "active",
-  checked: "checked",
-  completed: "completed",
-  disabled: "disabled",
-  error: "error",
-  expanded: "expanded",
-  focused: "focused",
-  focusVisible: "focusVisible",
-  open: "open",
-  readOnly: "readOnly",
-  required: "required",
-  selected: "selected"
-};
-function generateUtilityClass(componentName, slot, globalStatePrefix = "Mui") {
-  const globalStateClass = globalStateClasses[slot];
-  return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;
-}
-function generateUtilityClasses(componentName, slots, globalStatePrefix = "Mui") {
-  const result = {};
-  slots.forEach((slot) => {
-    result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);
-  });
-  return result;
-}
-function getPickersToolbarUtilityClass(slot) {
-  return generateUtilityClass("MuiPickersToolbar", slot);
-}
-const pickersToolbarClasses = generateUtilityClasses("MuiPickersToolbar", ["root", "title", "content"]);
-const RtlContext = /* @__PURE__ */ React__namespace.createContext();
-process.env.NODE_ENV !== "production" ? {
-  children: PropTypes.node,
-  value: PropTypes.bool
-} : void 0;
-const useRtl = () => {
-  const value = React__namespace.useContext(RtlContext);
-  return value ?? false;
-};
-const _excluded$K = ["localeText"];
-const PickerAdapterContext = /* @__PURE__ */ React__namespace.createContext(null);
-if (process.env.NODE_ENV !== "production") PickerAdapterContext.displayName = "PickerAdapterContext";
-const LocalizationProvider$1 = function LocalizationProvider(inProps) {
-  const {
-    localeText: inLocaleText
-  } = inProps, otherInProps = _objectWithoutPropertiesLoose(inProps, _excluded$K);
-  const {
-    adapter: parentAdapter,
-    localeText: parentLocaleText
-  } = React__namespace.useContext(PickerAdapterContext) ?? {
-    adapter: void 0,
-    localeText: void 0
-  };
-  const props = useThemeProps({
-    // We don't want to pass the `localeText` prop to the theme, that way it will always return the theme value,
-    // We will then merge this theme value with our value manually
-    props: otherInProps,
-    name: "MuiLocalizationProvider"
-  });
-  const {
-    children,
-    dateAdapter: DateAdapter,
-    dateFormats,
-    dateLibInstance,
-    adapterLocale,
-    localeText: themeLocaleText
-  } = props;
-  const localeText = React__namespace.useMemo(() => _extends({}, themeLocaleText, parentLocaleText, inLocaleText), [themeLocaleText, parentLocaleText, inLocaleText]);
-  const adapter = React__namespace.useMemo(() => {
-    if (!DateAdapter) {
-      if (parentAdapter) {
-        return parentAdapter;
-      }
-      return null;
-    }
-    const dateAdapter = new DateAdapter({
-      locale: adapterLocale,
-      formats: dateFormats,
-      instance: dateLibInstance
-    });
-    if (!dateAdapter.isMUIAdapter) {
-      throw new Error(["MUI X: The date adapter should be imported from `@mui/x-date-pickers` or `@mui/x-date-pickers-pro`, not from `@date-io`", "For example, `import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'` instead of `import AdapterDayjs from '@date-io/dayjs'`", "More information on the installation documentation: https://mui.com/x/react-date-pickers/quickstart/#installation"].join(`
-`));
-    }
-    return dateAdapter;
-  }, [DateAdapter, adapterLocale, dateFormats, dateLibInstance, parentAdapter]);
-  const defaultDates = React__namespace.useMemo(() => {
-    if (!adapter) {
-      return null;
-    }
-    return {
-      minDate: adapter.date("1900-01-01T00:00:00.000"),
-      maxDate: adapter.date("2099-12-31T00:00:00.000")
-    };
-  }, [adapter]);
-  const contextValue = React__namespace.useMemo(() => {
-    return {
-      utils: adapter,
-      adapter,
-      defaultDates,
-      localeText
-    };
-  }, [defaultDates, adapter, localeText]);
-  return /* @__PURE__ */ jsxRuntime.jsx(PickerAdapterContext.Provider, {
-    value: contextValue,
-    children
-  });
-};
-if (process.env.NODE_ENV !== "production") LocalizationProvider$1.displayName = "LocalizationProvider";
-process.env.NODE_ENV !== "production" ? LocalizationProvider$1.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  /**
-   * Locale for the date library you are using
-   */
-  adapterLocale: PropTypes.any,
-  children: PropTypes.node,
-  /**
-   * Date library adapter class function.
-   * @see See the localization provider {@link https://mui.com/x/react-date-pickers/quickstart/#integrate-provider-and-adapter date adapter setup section} for more details.
-   */
-  dateAdapter: PropTypes.func,
-  /**
-   * Formats that are used for any child pickers
-   */
-  dateFormats: PropTypes.shape({
-    dayOfMonth: PropTypes.string,
-    dayOfMonthFull: PropTypes.string,
-    fullDate: PropTypes.string,
-    fullTime12h: PropTypes.string,
-    fullTime24h: PropTypes.string,
-    hours12h: PropTypes.string,
-    hours24h: PropTypes.string,
-    keyboardDate: PropTypes.string,
-    keyboardDateTime12h: PropTypes.string,
-    keyboardDateTime24h: PropTypes.string,
-    meridiem: PropTypes.string,
-    minutes: PropTypes.string,
-    month: PropTypes.string,
-    monthShort: PropTypes.string,
-    normalDate: PropTypes.string,
-    normalDateWithWeekday: PropTypes.string,
-    seconds: PropTypes.string,
-    shortDate: PropTypes.string,
-    weekday: PropTypes.string,
-    weekdayShort: PropTypes.string,
-    year: PropTypes.string
-  }),
-  /**
-   * Date library instance you are using, if it has some global overrides
-   * ```jsx
-   * dateLibInstance={momentTimeZone}
-   * ```
-   */
-  dateLibInstance: PropTypes.any,
-  /**
-   * Locale for components texts
-   */
-  localeText: PropTypes.object
-} : void 0;
-const IsValidValueContext = /* @__PURE__ */ React__namespace.createContext(() => true);
-if (process.env.NODE_ENV !== "production") IsValidValueContext.displayName = "IsValidValueContext";
-function useIsValidValue() {
-  return React__namespace.useContext(IsValidValueContext);
-}
-const PickerFieldPrivateContext = /* @__PURE__ */ React__namespace.createContext(null);
-if (process.env.NODE_ENV !== "production") PickerFieldPrivateContext.displayName = "PickerFieldPrivateContext";
-function useNullableFieldPrivateContext() {
-  return React__namespace.useContext(PickerFieldPrivateContext);
-}
-const PickerContext = /* @__PURE__ */ React__namespace.createContext(null);
-if (process.env.NODE_ENV !== "production") PickerContext.displayName = "PickerContext";
-const usePickerContext = () => {
-  const value = React__namespace.useContext(PickerContext);
-  if (value == null) {
-    throw new Error("MUI X: The `usePickerContext` hook can only be called inside the context of a Picker component");
-  }
-  return value;
-};
-const PickerActionsContext = /* @__PURE__ */ React__namespace.createContext(null);
-if (process.env.NODE_ENV !== "production") PickerActionsContext.displayName = "PickerActionsContext";
-const PickerPrivateContext = /* @__PURE__ */ React__namespace.createContext({
-  ownerState: {
-    isPickerDisabled: false,
-    isPickerReadOnly: false,
-    isPickerValueEmpty: false,
-    isPickerOpen: false,
-    pickerVariant: "desktop",
-    pickerOrientation: "portrait"
-  },
-  rootRefObject: {
-    current: null
-  },
-  labelId: void 0,
-  dismissViews: () => {
-  },
-  hasUIView: true,
-  getCurrentViewMode: () => "UI",
-  triggerElement: null,
-  viewContainerRole: null,
-  defaultActionBarActions: [],
-  onPopperExited: void 0
-});
-if (process.env.NODE_ENV !== "production") PickerPrivateContext.displayName = "PickerPrivateContext";
-function PickerProvider(props) {
+const PickerActionsContext = /* @__PURE__ */ React__namespace.createContext(null);
+if (process.env.NODE_ENV !== "production") PickerActionsContext.displayName = "PickerActionsContext";
+const PickerPrivateContext = /* @__PURE__ */ React__namespace.createContext({
+  ownerState: {
+    isPickerDisabled: false,
+    isPickerReadOnly: false,
+    isPickerValueEmpty: false,
+    isPickerOpen: false,
+    pickerVariant: "desktop",
+    pickerOrientation: "portrait"
+  },
+  rootRefObject: {
+    current: null
+  },
+  labelId: void 0,
+  dismissViews: () => {
+  },
+  hasUIView: true,
+  getCurrentViewMode: () => "UI",
+  triggerElement: null,
+  viewContainerRole: null,
+  defaultActionBarActions: [],
+  onPopperExited: void 0
+});
+if (process.env.NODE_ENV !== "production") PickerPrivateContext.displayName = "PickerPrivateContext";
+function PickerProvider(props) {
   const {
     contextValue,
     actionsContextValue,
@@ -43405,7 +42203,7 @@ const overridesResolver$3 = (props, styles2) => {
   const {
     ownerState
   } = props;
-  return [styles2.root, styles2[`position${capitalize$2(ownerState.position)}`], ownerState.disablePointerEvents === true && styles2.disablePointerEvents, styles2[ownerState.variant]];
+  return [styles2.root, styles2[`position${capitalize$1(ownerState.position)}`], ownerState.disablePointerEvents === true && styles2.disablePointerEvents, styles2[ownerState.variant]];
 };
 const useUtilityClasses$11 = (ownerState) => {
   const {
@@ -43417,7 +42215,7 @@ const useUtilityClasses$11 = (ownerState) => {
     variant
   } = ownerState;
   const slots = {
-    root: ["root", disablePointerEvents && "disablePointerEvents", position && `position${capitalize$2(position)}`, variant, hiddenLabel && "hiddenLabel", size && `size${capitalize$2(size)}`]
+    root: ["root", disablePointerEvents && "disablePointerEvents", position && `position${capitalize$1(position)}`, variant, hiddenLabel && "hiddenLabel", size && `size${capitalize$1(size)}`]
   };
   return composeClasses$1(slots, getInputAdornmentUtilityClass, classes);
 };
@@ -49645,8 +48443,8 @@ const useUtilityClasses$K = (ownerState) => {
   } = ownerState;
   const slots = {
     root: ["root"],
-    container: ["container", `scroll${capitalize$2(scroll)}`],
-    paper: ["paper", `paperScroll${capitalize$2(scroll)}`, `paperWidth${capitalize$2(String(maxWidth2))}`, fullWidth && "paperFullWidth", fullScreen && "paperFullScreen"]
+    container: ["container", `scroll${capitalize$1(scroll)}`],
+    paper: ["paper", `paperScroll${capitalize$1(scroll)}`, `paperWidth${capitalize$1(String(maxWidth2))}`, fullWidth && "paperFullWidth", fullScreen && "paperFullScreen"]
   };
   return composeClasses$1(slots, getDialogUtilityClass, classes);
 };
@@ -49667,7 +48465,7 @@ const DialogContainer = styled("div", {
     const {
       ownerState
     } = props;
-    return [styles2.container, styles2[`scroll${capitalize$2(ownerState.scroll)}`]];
+    return [styles2.container, styles2[`scroll${capitalize$1(ownerState.scroll)}`]];
   }
 })({
   height: "100%",
@@ -49710,7 +48508,7 @@ const DialogPaper = styled(Paper$1, {
     const {
       ownerState
     } = props;
-    return [styles2.paper, styles2[`scrollPaper${capitalize$2(ownerState.scroll)}`], styles2[`paperWidth${capitalize$2(String(ownerState.maxWidth))}`], ownerState.fullWidth && styles2.paperFullWidth, ownerState.fullScreen && styles2.paperFullScreen];
+    return [styles2.paper, styles2[`scrollPaper${capitalize$1(ownerState.scroll)}`], styles2[`paperWidth${capitalize$1(String(ownerState.maxWidth))}`], ownerState.fullWidth && styles2.paperFullWidth, ownerState.fullScreen && styles2.paperFullScreen];
   }
 })(memoTheme(({
   theme: theme2
@@ -51338,7 +50136,7 @@ const useUtilityClasses$J = (ownerState) => {
     disabled
   } = ownerState;
   const slots = {
-    root: ["root", icon && label && "labelIcon", `textColor${capitalize$2(textColor)}`, fullWidth && "fullWidth", wrapped && "wrapped", selected && "selected", disabled && "disabled"],
+    root: ["root", icon && label && "labelIcon", `textColor${capitalize$1(textColor)}`, fullWidth && "fullWidth", wrapped && "wrapped", selected && "selected", disabled && "disabled"],
     icon: ["iconWrapper", "icon"]
   };
   return composeClasses$1(slots, getTabUtilityClass, classes);
@@ -51350,7 +50148,7 @@ const TabRoot = styled(ButtonBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, ownerState.label && ownerState.icon && styles2.labelIcon, styles2[`textColor${capitalize$2(ownerState.textColor)}`], ownerState.fullWidth && styles2.fullWidth, ownerState.wrapped && styles2.wrapped, {
+    return [styles2.root, ownerState.label && ownerState.icon && styles2.labelIcon, styles2[`textColor${capitalize$1(ownerState.textColor)}`], ownerState.fullWidth && styles2.fullWidth, ownerState.wrapped && styles2.wrapped, {
       [`& .${tabClasses.iconWrapper}`]: styles2.iconWrapper
     }, {
       [`& .${tabClasses.icon}`]: styles2.icon
@@ -51799,7 +50597,7 @@ const TabScrollButton = /* @__PURE__ */ React__namespace.forwardRef(function Tab
     disabled,
     ...other
   } = props;
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const ownerState = {
     isRtl,
     ...props
@@ -52140,7 +50938,7 @@ const Tabs$1 = /* @__PURE__ */ React__namespace.forwardRef(function Tabs(inProps
     name: "MuiTabs"
   });
   const theme2 = useTheme();
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const {
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy,
@@ -57937,10 +56735,10 @@ const useUtilityClasses$t = (ownerState) => {
     variant
   } = ownerState;
   const slots = {
-    root: ["root", `anchor${capitalize$2(anchor)}`],
+    root: ["root", `anchor${capitalize$1(anchor)}`],
     docked: [(variant === "permanent" || variant === "persistent") && "docked"],
     modal: ["modal"],
-    paper: ["paper", `paperAnchor${capitalize$2(anchor)}`, variant !== "temporary" && `paperAnchorDocked${capitalize$2(anchor)}`]
+    paper: ["paper", `paperAnchor${capitalize$1(anchor)}`, variant !== "temporary" && `paperAnchorDocked${capitalize$1(anchor)}`]
   };
   return composeClasses$1(slots, getDrawerUtilityClass, classes);
 };
@@ -57969,7 +56767,7 @@ const DrawerPaper = styled(Paper$1, {
     const {
       ownerState
     } = props;
-    return [styles2.paper, styles2[`paperAnchor${capitalize$2(ownerState.anchor)}`], ownerState.variant !== "temporary" && styles2[`paperAnchorDocked${capitalize$2(ownerState.anchor)}`]];
+    return [styles2.paper, styles2[`paperAnchor${capitalize$1(ownerState.anchor)}`], ownerState.variant !== "temporary" && styles2[`paperAnchorDocked${capitalize$1(ownerState.anchor)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -58076,7 +56874,7 @@ const Drawer$1 = /* @__PURE__ */ React__namespace.forwardRef(function Drawer(inP
     name: "MuiDrawer"
   });
   const theme2 = useTheme();
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const defaultTransitionDuration = {
     enter: theme2.transitions.duration.enteringScreen,
     exit: theme2.transitions.duration.leavingScreen
@@ -58862,7 +57660,7 @@ const overridesResolver = (props, styles2) => {
   const {
     ownerState
   } = props;
-  return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$2(ownerState.size)}`], ownerState.variant === "text" && styles2[`text${capitalize$2(ownerState.color)}`], ownerState.variant === "outlined" && styles2[`outlined${capitalize$2(ownerState.color)}`], ownerState.shape === "rounded" && styles2.rounded, ownerState.type === "page" && styles2.page, (ownerState.type === "start-ellipsis" || ownerState.type === "end-ellipsis") && styles2.ellipsis, (ownerState.type === "previous" || ownerState.type === "next") && styles2.previousNext, (ownerState.type === "first" || ownerState.type === "last") && styles2.firstLast];
+  return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$1(ownerState.size)}`], ownerState.variant === "text" && styles2[`text${capitalize$1(ownerState.color)}`], ownerState.variant === "outlined" && styles2[`outlined${capitalize$1(ownerState.color)}`], ownerState.shape === "rounded" && styles2.rounded, ownerState.type === "page" && styles2.page, (ownerState.type === "start-ellipsis" || ownerState.type === "end-ellipsis") && styles2.ellipsis, (ownerState.type === "previous" || ownerState.type === "next") && styles2.previousNext, (ownerState.type === "first" || ownerState.type === "last") && styles2.firstLast];
 };
 const useUtilityClasses$s = (ownerState) => {
   const {
@@ -58876,7 +57674,7 @@ const useUtilityClasses$s = (ownerState) => {
     variant
   } = ownerState;
   const slots = {
-    root: ["root", `size${capitalize$2(size)}`, variant, shape2, color2 !== "standard" && `color${capitalize$2(color2)}`, color2 !== "standard" && `${variant}${capitalize$2(color2)}`, disabled && "disabled", selected && "selected", {
+    root: ["root", `size${capitalize$1(size)}`, variant, shape2, color2 !== "standard" && `color${capitalize$1(color2)}`, color2 !== "standard" && `${variant}${capitalize$1(color2)}`, disabled && "disabled", selected && "selected", {
       page: "page",
       first: "firstLast",
       last: "firstLast",
@@ -59137,7 +57935,7 @@ const PaginationItem = /* @__PURE__ */ React__namespace.forwardRef(function Pagi
     type,
     variant
   };
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const classes = useUtilityClasses$s(ownerState);
   const externalForwardedProps = {
     slots: {
@@ -59609,7 +58407,7 @@ const useUtilityClasses$q = (ownerState) => {
     focusVisible
   } = ownerState;
   const slots = {
-    root: ["root", `size${capitalize$2(size)}`, disabled && "disabled", focusVisible && "focusVisible", readOnly && "readOnly"],
+    root: ["root", `size${capitalize$1(size)}`, disabled && "disabled", focusVisible && "focusVisible", readOnly && "readOnly"],
     label: ["label", "pristine"],
     labelEmptyValue: [emptyValueFocused && "labelEmptyValueActive"],
     icon: ["icon"],
@@ -59632,7 +58430,7 @@ const RatingRoot = styled("span", {
     } = props;
     return [{
       [`& .${ratingClasses.visuallyHidden}`]: styles2.visuallyHidden
-    }, styles2.root, styles2[`size${capitalize$2(ownerState.size)}`], ownerState.readOnly && styles2.readOnly];
+    }, styles2.root, styles2[`size${capitalize$1(ownerState.size)}`], ownerState.readOnly && styles2.readOnly];
   }
 })(memoTheme(({
   theme: theme2
@@ -59939,7 +58737,7 @@ const Rating$1 = /* @__PURE__ */ React__namespace.forwardRef(function Rating(inP
     name: "Rating"
   });
   const valueRounded = roundValueToPrecision(valueDerived, precision);
-  const isRtl = useRtl$1();
+  const isRtl = useRtl();
   const [{
     hover,
     focus
@@ -61021,7 +59819,7 @@ const useUtilityClasses$o = (ownerState) => {
     anchorOrigin
   } = ownerState;
   const slots = {
-    root: ["root", `anchorOrigin${capitalize$2(anchorOrigin.vertical)}${capitalize$2(anchorOrigin.horizontal)}`]
+    root: ["root", `anchorOrigin${capitalize$1(anchorOrigin.vertical)}${capitalize$1(anchorOrigin.horizontal)}`]
   };
   return composeClasses$1(slots, getSnackbarUtilityClass, classes);
 };
@@ -61032,7 +59830,7 @@ const SnackbarRoot = styled("div", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`anchorOrigin${capitalize$2(ownerState.anchorOrigin.vertical)}${capitalize$2(ownerState.anchorOrigin.horizontal)}`]];
+    return [styles2.root, styles2[`anchorOrigin${capitalize$1(ownerState.anchorOrigin.vertical)}${capitalize$1(ownerState.anchorOrigin.horizontal)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -61693,7 +60491,7 @@ const useUtilityClasses$n = (ownerState) => {
     size
   } = ownerState;
   const slots = {
-    root: ["root", variant, `size${capitalize$2(size)}`, color2 === "inherit" ? "colorInherit" : color2]
+    root: ["root", variant, `size${capitalize$1(size)}`, color2 === "inherit" ? "colorInherit" : color2]
   };
   const composedClasses = composeClasses$1(slots, getFabUtilityClass, classes);
   return {
@@ -61710,7 +60508,7 @@ const FabRoot = styled(ButtonBase, {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$2(ownerState.size)}`], ownerState.color === "inherit" && styles2.colorInherit, styles2[capitalize$2(ownerState.size)], styles2[ownerState.color]];
+    return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$1(ownerState.size)}`], ownerState.color === "inherit" && styles2.colorInherit, styles2[capitalize$1(ownerState.size)], styles2[ownerState.color]];
   }
 })(memoTheme(({
   theme: theme2
@@ -61950,7 +60748,7 @@ const useUtilityClasses$m = (ownerState) => {
     direction
   } = ownerState;
   const slots = {
-    root: ["root", `direction${capitalize$2(direction)}`],
+    root: ["root", `direction${capitalize$1(direction)}`],
     fab: ["fab"],
     actions: ["actions", !open && "actionsClosed"]
   };
@@ -61974,7 +60772,7 @@ const SpeedDialRoot = styled("div", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[`direction${capitalize$2(ownerState.direction)}`]];
+    return [styles2.root, styles2[`direction${capitalize$1(ownerState.direction)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -62488,7 +61286,7 @@ const useUtilityClasses$l = (ownerState) => {
   } = ownerState;
   const slots = {
     fab: ["fab", !open && "fabClosed"],
-    staticTooltip: ["staticTooltip", `tooltipPlacement${capitalize$2(tooltipPlacement)}`, !open && "staticTooltipClosed"],
+    staticTooltip: ["staticTooltip", `tooltipPlacement${capitalize$1(tooltipPlacement)}`, !open && "staticTooltipClosed"],
     staticTooltipLabel: ["staticTooltipLabel"]
   };
   return composeClasses$1(slots, getSpeedDialActionUtilityClass, classes);
@@ -62533,7 +61331,7 @@ const SpeedDialActionStaticTooltip = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.staticTooltip, !ownerState.open && styles2.staticTooltipClosed, styles2[`tooltipPlacement${capitalize$2(ownerState.tooltipPlacement)}`]];
+    return [styles2.staticTooltip, !ownerState.open && styles2.staticTooltipClosed, styles2[`tooltipPlacement${capitalize$1(ownerState.tooltipPlacement)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -63013,7 +61811,7 @@ const useUtilityClasses$j = (ownerState) => {
   } = ownerState;
   const slots = {
     root: ["root", orientation, alternativeLabel && "alternativeLabel", active && "active", completed && "completed", disabled && "disabled"],
-    line: ["line", `line${capitalize$2(orientation)}`]
+    line: ["line", `line${capitalize$1(orientation)}`]
   };
   return composeClasses$1(slots, getStepConnectorUtilityClass, classes);
 };
@@ -63055,7 +61853,7 @@ const StepConnectorLine = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.line, styles2[`line${capitalize$2(ownerState.orientation)}`]];
+    return [styles2.line, styles2[`line${capitalize$1(ownerState.orientation)}`]];
   }
 })(memoTheme(({
   theme: theme2
@@ -64468,7 +63266,7 @@ const useUtilityClasses$8 = (ownerState) => {
     stickyHeader
   } = ownerState;
   const slots = {
-    root: ["root", variant, stickyHeader && "stickyHeader", align !== "inherit" && `align${capitalize$2(align)}`, padding2 !== "normal" && `padding${capitalize$2(padding2)}`, `size${capitalize$2(size)}`]
+    root: ["root", variant, stickyHeader && "stickyHeader", align !== "inherit" && `align${capitalize$1(align)}`, padding2 !== "normal" && `padding${capitalize$1(padding2)}`, `size${capitalize$1(size)}`]
   };
   return composeClasses$1(slots, getTableCellUtilityClass, classes);
 };
@@ -64479,7 +63277,7 @@ const TableCellRoot = styled("td", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$2(ownerState.size)}`], ownerState.padding !== "normal" && styles2[`padding${capitalize$2(ownerState.padding)}`], ownerState.align !== "inherit" && styles2[`align${capitalize$2(ownerState.align)}`], ownerState.stickyHeader && styles2.stickyHeader];
+    return [styles2.root, styles2[ownerState.variant], styles2[`size${capitalize$1(ownerState.size)}`], ownerState.padding !== "normal" && styles2[`padding${capitalize$1(ownerState.padding)}`], ownerState.align !== "inherit" && styles2[`align${capitalize$1(ownerState.align)}`], ownerState.stickyHeader && styles2.stickyHeader];
   }
 })(memoTheme(({
   theme: theme2
@@ -66375,7 +65173,7 @@ function getTimelineUtilityClass(slot) {
 }
 generateUtilityClasses$1("MuiTimeline", ["root", "positionLeft", "positionRight", "positionAlternate", "positionAlternateReverse"]);
 function convertTimelinePositionToClass(position) {
-  return position === "alternate-reverse" ? "positionAlternateReverse" : `position${capitalize$2(position)}`;
+  return position === "alternate-reverse" ? "positionAlternateReverse" : `position${capitalize$1(position)}`;
 }
 const useUtilityClasses$6 = (ownerState) => {
   const {
@@ -66810,7 +65608,7 @@ const useUtilityClasses$1 = (ownerState) => {
     classes
   } = ownerState;
   const slots = {
-    root: ["root", variant, color2 !== "inherit" && `${variant}${capitalize$2(color2)}`]
+    root: ["root", variant, color2 !== "inherit" && `${variant}${capitalize$1(color2)}`]
   };
   return composeClasses$1(slots, getTimelineDotUtilityClass, classes);
 };
@@ -66821,7 +65619,7 @@ const TimelineDotRoot = styled("span", {
     const {
       ownerState
     } = props;
-    return [styles2.root, styles2[ownerState.color !== "inherit" && `${ownerState.variant}${capitalize$2(ownerState.color)}`], styles2[ownerState.variant]];
+    return [styles2.root, styles2[ownerState.color !== "inherit" && `${ownerState.variant}${capitalize$1(ownerState.color)}`], styles2[ownerState.variant]];
   }
 })(({
   ownerState,
@@ -68522,7 +67320,7 @@ exports.colors = colors;
 exports.darkTheme = darkTheme;
 exports.isSidenavGroup = isSidenavGroup;
 exports.lightTheme = lightTheme;
-exports.shape = shape$1;
+exports.shape = shape;
 exports.spacing = spacing;
 exports.theme = theme;
 exports.tokens = tokens;