2932 lines
107 KiB
Plaintext
2932 lines
107 KiB
Plaintext
import {
|
|
exactProp,
|
|
init_exactProp,
|
|
init_useEnhancedEffect,
|
|
init_utils,
|
|
useEnhancedEffect_default
|
|
} from "./chunk-VA2N3UVE.js";
|
|
import {
|
|
init_isMuiElement,
|
|
isMuiElement
|
|
} from "./chunk-MOF6LDJM.js";
|
|
import {
|
|
ClassNameGenerator_default,
|
|
GlobalStyles,
|
|
ThemeContext,
|
|
_extends,
|
|
_objectWithoutPropertiesLoose,
|
|
borders_default,
|
|
capitalize,
|
|
clamp_default,
|
|
composeClasses,
|
|
compose_default,
|
|
createTheme_default,
|
|
createUnarySpacing,
|
|
cssGrid_default,
|
|
deepmerge,
|
|
extendSxProp,
|
|
generateUtilityClass,
|
|
generateUtilityClasses,
|
|
getDisplayName,
|
|
getThemeProps,
|
|
getValue,
|
|
handleBreakpoints,
|
|
init_ClassNameGenerator,
|
|
init_borders,
|
|
init_breakpoints,
|
|
init_capitalize,
|
|
init_clamp,
|
|
init_compose,
|
|
init_composeClasses,
|
|
init_createBreakpoints,
|
|
init_createSpacing,
|
|
init_createTheme,
|
|
init_cssGrid,
|
|
init_deepmerge,
|
|
init_extends,
|
|
init_formatMuiErrorMessage,
|
|
init_generateUtilityClass,
|
|
init_generateUtilityClasses,
|
|
init_getDisplayName,
|
|
init_objectWithoutPropertiesLoose,
|
|
init_palette,
|
|
init_responsivePropType,
|
|
init_shape,
|
|
init_sizing,
|
|
init_spacing,
|
|
init_style,
|
|
init_styleFunctionSx,
|
|
init_styled_engine,
|
|
init_useTheme,
|
|
init_useThemeProps,
|
|
init_useThemeWithoutDefault,
|
|
internal_processStyles,
|
|
isPlainObject,
|
|
mergeBreakpointsInOrder,
|
|
palette_default,
|
|
resolveBreakpointValues,
|
|
sizing_default,
|
|
spacing_default,
|
|
styleFunctionSx_default,
|
|
style_default,
|
|
styled,
|
|
useThemeProps,
|
|
useThemeWithoutDefault_default,
|
|
useTheme_default
|
|
} from "./chunk-7JF2SDS5.js";
|
|
import {
|
|
require_prop_types
|
|
} from "./chunk-4CB2EIFM.js";
|
|
import {
|
|
clsx_default,
|
|
init_clsx
|
|
} from "./chunk-AX45CUQC.js";
|
|
import {
|
|
require_jsx_runtime
|
|
} from "./chunk-DT77FM6J.js";
|
|
import {
|
|
require_react
|
|
} from "./chunk-4D5CYJYK.js";
|
|
import {
|
|
__toESM
|
|
} from "./chunk-CEQRFMJQ.js";
|
|
|
|
// node_modules/@mui/system/esm/useMediaQuery/useMediaQuery.js
|
|
var React = __toESM(require_react());
|
|
init_useEnhancedEffect();
|
|
init_useThemeProps();
|
|
init_useThemeWithoutDefault();
|
|
function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
|
|
const [match, setMatch] = React.useState(() => {
|
|
if (noSsr && matchMedia) {
|
|
return matchMedia(query).matches;
|
|
}
|
|
if (ssrMatchMedia) {
|
|
return ssrMatchMedia(query).matches;
|
|
}
|
|
return defaultMatches;
|
|
});
|
|
useEnhancedEffect_default(() => {
|
|
let active = true;
|
|
if (!matchMedia) {
|
|
return void 0;
|
|
}
|
|
const queryList = matchMedia(query);
|
|
const updateMatch = () => {
|
|
if (active) {
|
|
setMatch(queryList.matches);
|
|
}
|
|
};
|
|
updateMatch();
|
|
queryList.addListener(updateMatch);
|
|
return () => {
|
|
active = false;
|
|
queryList.removeListener(updateMatch);
|
|
};
|
|
}, [query, matchMedia]);
|
|
return match;
|
|
}
|
|
var maybeReactUseSyncExternalStore = React["useSyncExternalStore"];
|
|
function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
|
|
const getDefaultSnapshot = React.useCallback(() => defaultMatches, [defaultMatches]);
|
|
const getServerSnapshot = React.useMemo(() => {
|
|
if (noSsr && matchMedia) {
|
|
return () => matchMedia(query).matches;
|
|
}
|
|
if (ssrMatchMedia !== null) {
|
|
const {
|
|
matches
|
|
} = ssrMatchMedia(query);
|
|
return () => matches;
|
|
}
|
|
return getDefaultSnapshot;
|
|
}, [getDefaultSnapshot, query, ssrMatchMedia, noSsr, matchMedia]);
|
|
const [getSnapshot, subscribe] = React.useMemo(() => {
|
|
if (matchMedia === null) {
|
|
return [getDefaultSnapshot, () => () => {
|
|
}];
|
|
}
|
|
const mediaQueryList = matchMedia(query);
|
|
return [() => mediaQueryList.matches, (notify) => {
|
|
mediaQueryList.addListener(notify);
|
|
return () => {
|
|
mediaQueryList.removeListener(notify);
|
|
};
|
|
}];
|
|
}, [getDefaultSnapshot, matchMedia, query]);
|
|
const match = maybeReactUseSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
return match;
|
|
}
|
|
function useMediaQuery(queryInput, options = {}) {
|
|
const theme = useThemeWithoutDefault_default();
|
|
const supportMatchMedia = typeof window !== "undefined" && typeof window.matchMedia !== "undefined";
|
|
const {
|
|
defaultMatches = false,
|
|
matchMedia = supportMatchMedia ? window.matchMedia : null,
|
|
ssrMatchMedia = null,
|
|
noSsr = false
|
|
} = getThemeProps({
|
|
name: "MuiUseMediaQuery",
|
|
props: options,
|
|
theme
|
|
});
|
|
if (true) {
|
|
if (typeof queryInput === "function" && theme === null) {
|
|
console.error(["MUI: The `query` argument provided is invalid.", "You are providing a function without a theme in the context.", "One of the parent elements needs to use a ThemeProvider."].join("\n"));
|
|
}
|
|
}
|
|
let query = typeof queryInput === "function" ? queryInput(theme) : queryInput;
|
|
query = query.replace(/^@media( ?)/m, "");
|
|
const useMediaQueryImplementation = maybeReactUseSyncExternalStore !== void 0 ? useMediaQueryNew : useMediaQueryOld;
|
|
const match = useMediaQueryImplementation(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr);
|
|
if (true) {
|
|
React.useDebugValue({
|
|
query,
|
|
match
|
|
});
|
|
}
|
|
return match;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/colorManipulator.js
|
|
init_formatMuiErrorMessage();
|
|
init_clamp();
|
|
function clampWrapper(value, min = 0, max = 1) {
|
|
if (true) {
|
|
if (value < min || value > max) {
|
|
console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
|
|
}
|
|
}
|
|
return clamp_default(value, min, max);
|
|
}
|
|
function hexToRgb(color) {
|
|
color = color.slice(1);
|
|
const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, "g");
|
|
let colors = color.match(re);
|
|
if (colors && colors[0].length === 1) {
|
|
colors = colors.map((n) => n + n);
|
|
}
|
|
return colors ? `rgb${colors.length === 4 ? "a" : ""}(${colors.map((n, index) => {
|
|
return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1e3) / 1e3;
|
|
}).join(", ")})` : "";
|
|
}
|
|
function intToHex(int) {
|
|
const hex = int.toString(16);
|
|
return hex.length === 1 ? `0${hex}` : hex;
|
|
}
|
|
function decomposeColor(color) {
|
|
if (color.type) {
|
|
return color;
|
|
}
|
|
if (color.charAt(0) === "#") {
|
|
return decomposeColor(hexToRgb(color));
|
|
}
|
|
const marker = color.indexOf("(");
|
|
const type = color.substring(0, marker);
|
|
if (["rgb", "rgba", "hsl", "hsla", "color"].indexOf(type) === -1) {
|
|
throw new Error(true ? `MUI: Unsupported \`${color}\` color.
|
|
The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : formatMuiErrorMessage(9, color));
|
|
}
|
|
let values = color.substring(marker + 1, color.length - 1);
|
|
let colorSpace;
|
|
if (type === "color") {
|
|
values = values.split(" ");
|
|
colorSpace = values.shift();
|
|
if (values.length === 4 && values[3].charAt(0) === "/") {
|
|
values[3] = values[3].slice(1);
|
|
}
|
|
if (["srgb", "display-p3", "a98-rgb", "prophoto-rgb", "rec-2020"].indexOf(colorSpace) === -1) {
|
|
throw new Error(true ? `MUI: unsupported \`${colorSpace}\` color space.
|
|
The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : formatMuiErrorMessage(10, colorSpace));
|
|
}
|
|
} else {
|
|
values = values.split(",");
|
|
}
|
|
values = values.map((value) => parseFloat(value));
|
|
return {
|
|
type,
|
|
values,
|
|
colorSpace
|
|
};
|
|
}
|
|
function recomposeColor(color) {
|
|
const {
|
|
type,
|
|
colorSpace
|
|
} = color;
|
|
let {
|
|
values
|
|
} = color;
|
|
if (type.indexOf("rgb") !== -1) {
|
|
values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
|
|
} else if (type.indexOf("hsl") !== -1) {
|
|
values[1] = `${values[1]}%`;
|
|
values[2] = `${values[2]}%`;
|
|
}
|
|
if (type.indexOf("color") !== -1) {
|
|
values = `${colorSpace} ${values.join(" ")}`;
|
|
} else {
|
|
values = `${values.join(", ")}`;
|
|
}
|
|
return `${type}(${values})`;
|
|
}
|
|
function rgbToHex(color) {
|
|
if (color.indexOf("#") === 0) {
|
|
return color;
|
|
}
|
|
const {
|
|
values
|
|
} = decomposeColor(color);
|
|
return `#${values.map((n, i) => intToHex(i === 3 ? Math.round(255 * n) : n)).join("")}`;
|
|
}
|
|
function hslToRgb(color) {
|
|
color = decomposeColor(color);
|
|
const {
|
|
values
|
|
} = color;
|
|
const h = values[0];
|
|
const s = values[1] / 100;
|
|
const l = values[2] / 100;
|
|
const a = s * Math.min(l, 1 - l);
|
|
const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
|
|
let type = "rgb";
|
|
const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];
|
|
if (color.type === "hsla") {
|
|
type += "a";
|
|
rgb.push(values[3]);
|
|
}
|
|
return recomposeColor({
|
|
type,
|
|
values: rgb
|
|
});
|
|
}
|
|
function getLuminance(color) {
|
|
color = decomposeColor(color);
|
|
let rgb = color.type === "hsl" || color.type === "hsla" ? decomposeColor(hslToRgb(color)).values : color.values;
|
|
rgb = rgb.map((val) => {
|
|
if (color.type !== "color") {
|
|
val /= 255;
|
|
}
|
|
return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;
|
|
});
|
|
return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
|
|
}
|
|
function getContrastRatio(foreground, background) {
|
|
const lumA = getLuminance(foreground);
|
|
const lumB = getLuminance(background);
|
|
return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
|
|
}
|
|
function alpha(color, value) {
|
|
color = decomposeColor(color);
|
|
value = clampWrapper(value);
|
|
if (color.type === "rgb" || color.type === "hsl") {
|
|
color.type += "a";
|
|
}
|
|
if (color.type === "color") {
|
|
color.values[3] = `/${value}`;
|
|
} else {
|
|
color.values[3] = value;
|
|
}
|
|
return recomposeColor(color);
|
|
}
|
|
function darken(color, coefficient) {
|
|
color = decomposeColor(color);
|
|
coefficient = clampWrapper(coefficient);
|
|
if (color.type.indexOf("hsl") !== -1) {
|
|
color.values[2] *= 1 - coefficient;
|
|
} else if (color.type.indexOf("rgb") !== -1 || color.type.indexOf("color") !== -1) {
|
|
for (let i = 0; i < 3; i += 1) {
|
|
color.values[i] *= 1 - coefficient;
|
|
}
|
|
}
|
|
return recomposeColor(color);
|
|
}
|
|
function lighten(color, coefficient) {
|
|
color = decomposeColor(color);
|
|
coefficient = clampWrapper(coefficient);
|
|
if (color.type.indexOf("hsl") !== -1) {
|
|
color.values[2] += (100 - color.values[2]) * coefficient;
|
|
} else if (color.type.indexOf("rgb") !== -1) {
|
|
for (let i = 0; i < 3; i += 1) {
|
|
color.values[i] += (255 - color.values[i]) * coefficient;
|
|
}
|
|
} else if (color.type.indexOf("color") !== -1) {
|
|
for (let i = 0; i < 3; i += 1) {
|
|
color.values[i] += (1 - color.values[i]) * coefficient;
|
|
}
|
|
}
|
|
return recomposeColor(color);
|
|
}
|
|
function emphasize(color, coefficient = 0.15) {
|
|
return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_formatMuiErrorMessage();
|
|
init_styled_engine();
|
|
|
|
// node_modules/@mui/system/esm/GlobalStyles/GlobalStyles.js
|
|
var React2 = __toESM(require_react());
|
|
var import_prop_types = __toESM(require_prop_types());
|
|
init_styled_engine();
|
|
init_useTheme();
|
|
var import_jsx_runtime = __toESM(require_jsx_runtime());
|
|
function GlobalStyles2({
|
|
styles,
|
|
themeId,
|
|
defaultTheme: defaultTheme4 = {}
|
|
}) {
|
|
const upperTheme = useTheme_default(defaultTheme4);
|
|
const globalStyles = typeof styles === "function" ? styles(themeId ? upperTheme[themeId] || upperTheme : upperTheme) : styles;
|
|
return (0, import_jsx_runtime.jsx)(GlobalStyles, {
|
|
styles: globalStyles
|
|
});
|
|
}
|
|
true ? GlobalStyles2.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* @ignore
|
|
*/
|
|
defaultTheme: import_prop_types.default.object,
|
|
/**
|
|
* @ignore
|
|
*/
|
|
styles: import_prop_types.default.oneOfType([import_prop_types.default.array, import_prop_types.default.func, import_prop_types.default.number, import_prop_types.default.object, import_prop_types.default.string, import_prop_types.default.bool]),
|
|
/**
|
|
* @ignore
|
|
*/
|
|
themeId: import_prop_types.default.string
|
|
} : void 0;
|
|
var GlobalStyles_default = GlobalStyles2;
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_borders();
|
|
init_borders();
|
|
init_breakpoints();
|
|
init_breakpoints();
|
|
init_compose();
|
|
|
|
// node_modules/@mui/system/esm/display.js
|
|
init_style();
|
|
init_compose();
|
|
var displayPrint = style_default({
|
|
prop: "displayPrint",
|
|
cssProperty: false,
|
|
transform: (value) => ({
|
|
"@media print": {
|
|
display: value
|
|
}
|
|
})
|
|
});
|
|
var displayRaw = style_default({
|
|
prop: "display"
|
|
});
|
|
var overflow = style_default({
|
|
prop: "overflow"
|
|
});
|
|
var textOverflow = style_default({
|
|
prop: "textOverflow"
|
|
});
|
|
var visibility = style_default({
|
|
prop: "visibility"
|
|
});
|
|
var whiteSpace = style_default({
|
|
prop: "whiteSpace"
|
|
});
|
|
var display_default = compose_default(displayPrint, displayRaw, overflow, textOverflow, visibility, whiteSpace);
|
|
|
|
// node_modules/@mui/system/esm/flexbox.js
|
|
init_style();
|
|
init_compose();
|
|
var flexBasis = style_default({
|
|
prop: "flexBasis"
|
|
});
|
|
var flexDirection = style_default({
|
|
prop: "flexDirection"
|
|
});
|
|
var flexWrap = style_default({
|
|
prop: "flexWrap"
|
|
});
|
|
var justifyContent = style_default({
|
|
prop: "justifyContent"
|
|
});
|
|
var alignItems = style_default({
|
|
prop: "alignItems"
|
|
});
|
|
var alignContent = style_default({
|
|
prop: "alignContent"
|
|
});
|
|
var order = style_default({
|
|
prop: "order"
|
|
});
|
|
var flex = style_default({
|
|
prop: "flex"
|
|
});
|
|
var flexGrow = style_default({
|
|
prop: "flexGrow"
|
|
});
|
|
var flexShrink = style_default({
|
|
prop: "flexShrink"
|
|
});
|
|
var alignSelf = style_default({
|
|
prop: "alignSelf"
|
|
});
|
|
var justifyItems = style_default({
|
|
prop: "justifyItems"
|
|
});
|
|
var justifySelf = style_default({
|
|
prop: "justifySelf"
|
|
});
|
|
var flexbox = compose_default(flexBasis, flexDirection, flexWrap, justifyContent, alignItems, alignContent, order, flex, flexGrow, flexShrink, alignSelf, justifyItems, justifySelf);
|
|
var flexbox_default = flexbox;
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_cssGrid();
|
|
init_cssGrid();
|
|
init_palette();
|
|
init_palette();
|
|
|
|
// node_modules/@mui/system/esm/positions.js
|
|
init_style();
|
|
init_compose();
|
|
var position = style_default({
|
|
prop: "position"
|
|
});
|
|
var zIndex = style_default({
|
|
prop: "zIndex",
|
|
themeKey: "zIndex"
|
|
});
|
|
var top = style_default({
|
|
prop: "top"
|
|
});
|
|
var right = style_default({
|
|
prop: "right"
|
|
});
|
|
var bottom = style_default({
|
|
prop: "bottom"
|
|
});
|
|
var left = style_default({
|
|
prop: "left"
|
|
});
|
|
var positions_default = compose_default(position, zIndex, top, right, bottom, left);
|
|
|
|
// node_modules/@mui/system/esm/shadows.js
|
|
init_style();
|
|
var boxShadow = style_default({
|
|
prop: "boxShadow",
|
|
themeKey: "shadows"
|
|
});
|
|
var shadows_default = boxShadow;
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_sizing();
|
|
init_sizing();
|
|
init_spacing();
|
|
init_spacing();
|
|
init_style();
|
|
|
|
// node_modules/@mui/system/esm/typography.js
|
|
init_style();
|
|
init_compose();
|
|
var fontFamily = style_default({
|
|
prop: "fontFamily",
|
|
themeKey: "typography"
|
|
});
|
|
var fontSize = style_default({
|
|
prop: "fontSize",
|
|
themeKey: "typography"
|
|
});
|
|
var fontStyle = style_default({
|
|
prop: "fontStyle",
|
|
themeKey: "typography"
|
|
});
|
|
var fontWeight = style_default({
|
|
prop: "fontWeight",
|
|
themeKey: "typography"
|
|
});
|
|
var letterSpacing = style_default({
|
|
prop: "letterSpacing"
|
|
});
|
|
var textTransform = style_default({
|
|
prop: "textTransform"
|
|
});
|
|
var lineHeight = style_default({
|
|
prop: "lineHeight"
|
|
});
|
|
var textAlign = style_default({
|
|
prop: "textAlign"
|
|
});
|
|
var typographyVariant = style_default({
|
|
prop: "typography",
|
|
cssProperty: false,
|
|
themeKey: "typography"
|
|
});
|
|
var typography = compose_default(typographyVariant, fontFamily, fontSize, fontStyle, fontWeight, letterSpacing, lineHeight, textAlign, textTransform);
|
|
var typography_default = typography;
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_styleFunctionSx();
|
|
|
|
// node_modules/@mui/system/esm/getThemeValue.js
|
|
init_borders();
|
|
init_cssGrid();
|
|
init_palette();
|
|
init_sizing();
|
|
init_spacing();
|
|
var filterPropsMapping = {
|
|
borders: borders_default.filterProps,
|
|
display: display_default.filterProps,
|
|
flexbox: flexbox_default.filterProps,
|
|
grid: cssGrid_default.filterProps,
|
|
positions: positions_default.filterProps,
|
|
palette: palette_default.filterProps,
|
|
shadows: shadows_default.filterProps,
|
|
sizing: sizing_default.filterProps,
|
|
spacing: spacing_default.filterProps,
|
|
typography: typography_default.filterProps
|
|
};
|
|
var styleFunctionMapping = {
|
|
borders: borders_default,
|
|
display: display_default,
|
|
flexbox: flexbox_default,
|
|
grid: cssGrid_default,
|
|
positions: positions_default,
|
|
palette: palette_default,
|
|
shadows: shadows_default,
|
|
sizing: sizing_default,
|
|
spacing: spacing_default,
|
|
typography: typography_default
|
|
};
|
|
var propToStyleFunction = Object.keys(filterPropsMapping).reduce((acc, styleFnName) => {
|
|
filterPropsMapping[styleFnName].forEach((propName) => {
|
|
acc[propName] = styleFunctionMapping[styleFnName];
|
|
});
|
|
return acc;
|
|
}, {});
|
|
|
|
// node_modules/@mui/system/esm/Box/Box.js
|
|
var import_prop_types2 = __toESM(require_prop_types());
|
|
init_ClassNameGenerator();
|
|
|
|
// node_modules/@mui/system/esm/createBox.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
var React3 = __toESM(require_react());
|
|
init_clsx();
|
|
init_styled_engine();
|
|
init_styleFunctionSx();
|
|
init_useTheme();
|
|
var import_jsx_runtime2 = __toESM(require_jsx_runtime());
|
|
var _excluded = ["className", "component"];
|
|
function createBox(options = {}) {
|
|
const {
|
|
themeId,
|
|
defaultTheme: defaultTheme4,
|
|
defaultClassName = "MuiBox-root",
|
|
generateClassName
|
|
} = options;
|
|
const BoxRoot = styled("div", {
|
|
shouldForwardProp: (prop) => prop !== "theme" && prop !== "sx" && prop !== "as"
|
|
})(styleFunctionSx_default);
|
|
const Box2 = React3.forwardRef(function Box3(inProps, ref) {
|
|
const theme = useTheme_default(defaultTheme4);
|
|
const _extendSxProp = extendSxProp(inProps), {
|
|
className,
|
|
component = "div"
|
|
} = _extendSxProp, other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded);
|
|
return (0, import_jsx_runtime2.jsx)(BoxRoot, _extends({
|
|
as: component,
|
|
ref,
|
|
className: clsx_default(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
|
|
theme: themeId ? theme[themeId] || theme : theme
|
|
}, other));
|
|
});
|
|
return Box2;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/Box/boxClasses.js
|
|
init_generateUtilityClasses();
|
|
var boxClasses = generateUtilityClasses("MuiBox", ["root"]);
|
|
var boxClasses_default = boxClasses;
|
|
|
|
// node_modules/@mui/system/esm/Box/Box.js
|
|
var Box = createBox({
|
|
defaultClassName: boxClasses_default.root,
|
|
generateClassName: ClassNameGenerator_default.generate
|
|
});
|
|
true ? Box.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* @ignore
|
|
*/
|
|
children: import_prop_types2.default.node,
|
|
/**
|
|
* The component used for the root node.
|
|
* Either a string to use a HTML element or a component.
|
|
*/
|
|
component: import_prop_types2.default.elementType,
|
|
/**
|
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
*/
|
|
sx: import_prop_types2.default.oneOfType([import_prop_types2.default.arrayOf(import_prop_types2.default.oneOfType([import_prop_types2.default.func, import_prop_types2.default.object, import_prop_types2.default.bool])), import_prop_types2.default.func, import_prop_types2.default.object])
|
|
} : void 0;
|
|
|
|
// node_modules/@mui/system/esm/createStyled.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
init_styled_engine();
|
|
init_deepmerge();
|
|
init_capitalize();
|
|
init_getDisplayName();
|
|
init_createTheme();
|
|
init_styleFunctionSx();
|
|
var _excluded2 = ["ownerState"];
|
|
var _excluded22 = ["variants"];
|
|
var _excluded3 = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
|
|
function isEmpty(obj) {
|
|
return Object.keys(obj).length === 0;
|
|
}
|
|
function isStringTag(tag) {
|
|
return typeof tag === "string" && // 96 is one less than the char code
|
|
// for "a" so this is checking that
|
|
// it's a lowercase character
|
|
tag.charCodeAt(0) > 96;
|
|
}
|
|
function shouldForwardProp(prop) {
|
|
return prop !== "ownerState" && prop !== "theme" && prop !== "sx" && prop !== "as";
|
|
}
|
|
var systemDefaultTheme = createTheme_default();
|
|
var lowercaseFirstLetter = (string) => {
|
|
if (!string) {
|
|
return string;
|
|
}
|
|
return string.charAt(0).toLowerCase() + string.slice(1);
|
|
};
|
|
function resolveTheme({
|
|
defaultTheme: defaultTheme4,
|
|
theme,
|
|
themeId
|
|
}) {
|
|
return isEmpty(theme) ? defaultTheme4 : theme[themeId] || theme;
|
|
}
|
|
function defaultOverridesResolver(slot) {
|
|
if (!slot) {
|
|
return null;
|
|
}
|
|
return (props, styles) => styles[slot];
|
|
}
|
|
function processStyleArg(callableStyle, _ref) {
|
|
let {
|
|
ownerState
|
|
} = _ref, props = _objectWithoutPropertiesLoose(_ref, _excluded2);
|
|
const resolvedStylesArg = typeof callableStyle === "function" ? callableStyle(_extends({
|
|
ownerState
|
|
}, props)) : callableStyle;
|
|
if (Array.isArray(resolvedStylesArg)) {
|
|
return resolvedStylesArg.flatMap((resolvedStyle) => processStyleArg(resolvedStyle, _extends({
|
|
ownerState
|
|
}, props)));
|
|
}
|
|
if (!!resolvedStylesArg && typeof resolvedStylesArg === "object" && Array.isArray(resolvedStylesArg.variants)) {
|
|
const {
|
|
variants = []
|
|
} = resolvedStylesArg, otherStyles = _objectWithoutPropertiesLoose(resolvedStylesArg, _excluded22);
|
|
let result = otherStyles;
|
|
variants.forEach((variant) => {
|
|
let isMatch = true;
|
|
if (typeof variant.props === "function") {
|
|
isMatch = variant.props(_extends({
|
|
ownerState
|
|
}, props, ownerState));
|
|
} else {
|
|
Object.keys(variant.props).forEach((key) => {
|
|
if ((ownerState == null ? void 0 : ownerState[key]) !== variant.props[key] && props[key] !== variant.props[key]) {
|
|
isMatch = false;
|
|
}
|
|
});
|
|
}
|
|
if (isMatch) {
|
|
if (!Array.isArray(result)) {
|
|
result = [result];
|
|
}
|
|
result.push(typeof variant.style === "function" ? variant.style(_extends({
|
|
ownerState
|
|
}, props, ownerState)) : variant.style);
|
|
}
|
|
});
|
|
return result;
|
|
}
|
|
return resolvedStylesArg;
|
|
}
|
|
function createStyled(input = {}) {
|
|
const {
|
|
themeId,
|
|
defaultTheme: defaultTheme4 = systemDefaultTheme,
|
|
rootShouldForwardProp = shouldForwardProp,
|
|
slotShouldForwardProp = shouldForwardProp
|
|
} = input;
|
|
const systemSx = (props) => {
|
|
return styleFunctionSx_default(_extends({}, props, {
|
|
theme: resolveTheme(_extends({}, props, {
|
|
defaultTheme: defaultTheme4,
|
|
themeId
|
|
}))
|
|
}));
|
|
};
|
|
systemSx.__mui_systemSx = true;
|
|
return (tag, inputOptions = {}) => {
|
|
internal_processStyles(tag, (styles) => styles.filter((style2) => !(style2 != null && style2.__mui_systemSx)));
|
|
const {
|
|
name: componentName,
|
|
slot: componentSlot,
|
|
skipVariantsResolver: inputSkipVariantsResolver,
|
|
skipSx: inputSkipSx,
|
|
// TODO v6: remove `lowercaseFirstLetter()` in the next major release
|
|
// For more details: https://github.com/mui/material-ui/pull/37908
|
|
overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))
|
|
} = inputOptions, options = _objectWithoutPropertiesLoose(inputOptions, _excluded3);
|
|
const skipVariantsResolver = inputSkipVariantsResolver !== void 0 ? inputSkipVariantsResolver : (
|
|
// TODO v6: remove `Root` in the next major release
|
|
// For more details: https://github.com/mui/material-ui/pull/37908
|
|
componentSlot && componentSlot !== "Root" && componentSlot !== "root" || false
|
|
);
|
|
const skipSx = inputSkipSx || false;
|
|
let label;
|
|
if (true) {
|
|
if (componentName) {
|
|
label = `${componentName}-${lowercaseFirstLetter(componentSlot || "Root")}`;
|
|
}
|
|
}
|
|
let shouldForwardPropOption = shouldForwardProp;
|
|
if (componentSlot === "Root" || componentSlot === "root") {
|
|
shouldForwardPropOption = rootShouldForwardProp;
|
|
} else if (componentSlot) {
|
|
shouldForwardPropOption = slotShouldForwardProp;
|
|
} else if (isStringTag(tag)) {
|
|
shouldForwardPropOption = void 0;
|
|
}
|
|
const defaultStyledResolver = styled(tag, _extends({
|
|
shouldForwardProp: shouldForwardPropOption,
|
|
label
|
|
}, options));
|
|
const transformStyleArg = (stylesArg) => {
|
|
if (typeof stylesArg === "function" && stylesArg.__emotion_real !== stylesArg || isPlainObject(stylesArg)) {
|
|
return (props) => processStyleArg(stylesArg, _extends({}, props, {
|
|
theme: resolveTheme({
|
|
theme: props.theme,
|
|
defaultTheme: defaultTheme4,
|
|
themeId
|
|
})
|
|
}));
|
|
}
|
|
return stylesArg;
|
|
};
|
|
const muiStyledResolver = (styleArg, ...expressions) => {
|
|
let transformedStyleArg = transformStyleArg(styleArg);
|
|
const expressionsWithDefaultTheme = expressions ? expressions.map(transformStyleArg) : [];
|
|
if (componentName && overridesResolver) {
|
|
expressionsWithDefaultTheme.push((props) => {
|
|
const theme = resolveTheme(_extends({}, props, {
|
|
defaultTheme: defaultTheme4,
|
|
themeId
|
|
}));
|
|
if (!theme.components || !theme.components[componentName] || !theme.components[componentName].styleOverrides) {
|
|
return null;
|
|
}
|
|
const styleOverrides = theme.components[componentName].styleOverrides;
|
|
const resolvedStyleOverrides = {};
|
|
Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {
|
|
resolvedStyleOverrides[slotKey] = processStyleArg(slotStyle, _extends({}, props, {
|
|
theme
|
|
}));
|
|
});
|
|
return overridesResolver(props, resolvedStyleOverrides);
|
|
});
|
|
}
|
|
if (componentName && !skipVariantsResolver) {
|
|
expressionsWithDefaultTheme.push((props) => {
|
|
var _theme$components;
|
|
const theme = resolveTheme(_extends({}, props, {
|
|
defaultTheme: defaultTheme4,
|
|
themeId
|
|
}));
|
|
const themeVariants = theme == null || (_theme$components = theme.components) == null || (_theme$components = _theme$components[componentName]) == null ? void 0 : _theme$components.variants;
|
|
return processStyleArg({
|
|
variants: themeVariants
|
|
}, _extends({}, props, {
|
|
theme
|
|
}));
|
|
});
|
|
}
|
|
if (!skipSx) {
|
|
expressionsWithDefaultTheme.push(systemSx);
|
|
}
|
|
const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;
|
|
if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {
|
|
const placeholders = new Array(numOfCustomFnsApplied).fill("");
|
|
transformedStyleArg = [...styleArg, ...placeholders];
|
|
transformedStyleArg.raw = [...styleArg.raw, ...placeholders];
|
|
}
|
|
const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);
|
|
if (true) {
|
|
let displayName;
|
|
if (componentName) {
|
|
displayName = `${componentName}${capitalize(componentSlot || "")}`;
|
|
}
|
|
if (displayName === void 0) {
|
|
displayName = `Styled(${getDisplayName(tag)})`;
|
|
}
|
|
Component.displayName = displayName;
|
|
}
|
|
if (tag.muiName) {
|
|
Component.muiName = tag.muiName;
|
|
}
|
|
return Component;
|
|
};
|
|
if (defaultStyledResolver.withConfig) {
|
|
muiStyledResolver.withConfig = defaultStyledResolver.withConfig;
|
|
}
|
|
return muiStyledResolver;
|
|
};
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/styled.js
|
|
var styled2 = createStyled();
|
|
var styled_default = styled2;
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_createTheme();
|
|
init_createBreakpoints();
|
|
init_createSpacing();
|
|
init_shape();
|
|
init_useThemeProps();
|
|
init_useTheme();
|
|
init_useThemeWithoutDefault();
|
|
|
|
// node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js
|
|
init_extends();
|
|
var React8 = __toESM(require_react());
|
|
var import_prop_types5 = __toESM(require_prop_types());
|
|
|
|
// node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js
|
|
init_extends();
|
|
var React6 = __toESM(require_react());
|
|
var import_prop_types3 = __toESM(require_prop_types());
|
|
init_utils();
|
|
|
|
// node_modules/@mui/private-theming/useTheme/ThemeContext.js
|
|
var React4 = __toESM(require_react());
|
|
var ThemeContext2 = React4.createContext(null);
|
|
if (true) {
|
|
ThemeContext2.displayName = "ThemeContext";
|
|
}
|
|
var ThemeContext_default = ThemeContext2;
|
|
|
|
// node_modules/@mui/private-theming/useTheme/useTheme.js
|
|
var React5 = __toESM(require_react());
|
|
function useTheme() {
|
|
const theme = React5.useContext(ThemeContext_default);
|
|
if (true) {
|
|
React5.useDebugValue(theme);
|
|
}
|
|
return theme;
|
|
}
|
|
|
|
// node_modules/@mui/private-theming/ThemeProvider/nested.js
|
|
var hasSymbol = typeof Symbol === "function" && Symbol.for;
|
|
var nested_default = hasSymbol ? Symbol.for("mui.nested") : "__THEME_NESTED__";
|
|
|
|
// node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js
|
|
var import_jsx_runtime3 = __toESM(require_jsx_runtime());
|
|
function mergeOuterLocalTheme(outerTheme, localTheme) {
|
|
if (typeof localTheme === "function") {
|
|
const mergedTheme = localTheme(outerTheme);
|
|
if (true) {
|
|
if (!mergedTheme) {
|
|
console.error(["MUI: You should return an object from your theme function, i.e.", "<ThemeProvider theme={() => ({})} />"].join("\n"));
|
|
}
|
|
}
|
|
return mergedTheme;
|
|
}
|
|
return _extends({}, outerTheme, localTheme);
|
|
}
|
|
function ThemeProvider(props) {
|
|
const {
|
|
children,
|
|
theme: localTheme
|
|
} = props;
|
|
const outerTheme = useTheme();
|
|
if (true) {
|
|
if (outerTheme === null && typeof localTheme === "function") {
|
|
console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join("\n"));
|
|
}
|
|
}
|
|
const theme = React6.useMemo(() => {
|
|
const output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme);
|
|
if (output != null) {
|
|
output[nested_default] = outerTheme !== null;
|
|
}
|
|
return output;
|
|
}, [localTheme, outerTheme]);
|
|
return (0, import_jsx_runtime3.jsx)(ThemeContext_default.Provider, {
|
|
value: theme,
|
|
children
|
|
});
|
|
}
|
|
true ? ThemeProvider.propTypes = {
|
|
/**
|
|
* Your component tree.
|
|
*/
|
|
children: import_prop_types3.default.node,
|
|
/**
|
|
* A theme object. You can provide a function to extend the outer theme.
|
|
*/
|
|
theme: import_prop_types3.default.oneOfType([import_prop_types3.default.object, import_prop_types3.default.func]).isRequired
|
|
} : void 0;
|
|
if (true) {
|
|
true ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;
|
|
}
|
|
var ThemeProvider_default = ThemeProvider;
|
|
|
|
// node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js
|
|
init_exactProp();
|
|
init_styled_engine();
|
|
init_useThemeWithoutDefault();
|
|
|
|
// node_modules/@mui/system/esm/RtlProvider/index.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
var React7 = __toESM(require_react());
|
|
var import_prop_types4 = __toESM(require_prop_types());
|
|
var import_jsx_runtime4 = __toESM(require_jsx_runtime());
|
|
var _excluded4 = ["value"];
|
|
var RtlContext = React7.createContext();
|
|
function RtlProvider(_ref) {
|
|
let {
|
|
value
|
|
} = _ref, props = _objectWithoutPropertiesLoose(_ref, _excluded4);
|
|
return (0, import_jsx_runtime4.jsx)(RtlContext.Provider, _extends({
|
|
value: value != null ? value : true
|
|
}, props));
|
|
}
|
|
true ? RtlProvider.propTypes = {
|
|
children: import_prop_types4.default.node,
|
|
value: import_prop_types4.default.bool
|
|
} : void 0;
|
|
var useRtl = () => {
|
|
const value = React7.useContext(RtlContext);
|
|
return value != null ? value : false;
|
|
};
|
|
var RtlProvider_default = RtlProvider;
|
|
|
|
// node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js
|
|
var import_jsx_runtime5 = __toESM(require_jsx_runtime());
|
|
var EMPTY_THEME = {};
|
|
function useThemeScoping(themeId, upperTheme, localTheme, isPrivate = false) {
|
|
return React8.useMemo(() => {
|
|
const resolvedTheme = themeId ? upperTheme[themeId] || upperTheme : upperTheme;
|
|
if (typeof localTheme === "function") {
|
|
const mergedTheme = localTheme(resolvedTheme);
|
|
const result = themeId ? _extends({}, upperTheme, {
|
|
[themeId]: mergedTheme
|
|
}) : mergedTheme;
|
|
if (isPrivate) {
|
|
return () => result;
|
|
}
|
|
return result;
|
|
}
|
|
return themeId ? _extends({}, upperTheme, {
|
|
[themeId]: localTheme
|
|
}) : _extends({}, upperTheme, localTheme);
|
|
}, [themeId, upperTheme, localTheme, isPrivate]);
|
|
}
|
|
function ThemeProvider2(props) {
|
|
const {
|
|
children,
|
|
theme: localTheme,
|
|
themeId
|
|
} = props;
|
|
const upperTheme = useThemeWithoutDefault_default(EMPTY_THEME);
|
|
const upperPrivateTheme = useTheme() || EMPTY_THEME;
|
|
if (true) {
|
|
if (upperTheme === null && typeof localTheme === "function" || themeId && upperTheme && !upperTheme[themeId] && typeof localTheme === "function") {
|
|
console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join("\n"));
|
|
}
|
|
}
|
|
const engineTheme = useThemeScoping(themeId, upperTheme, localTheme);
|
|
const privateTheme = useThemeScoping(themeId, upperPrivateTheme, localTheme, true);
|
|
const rtlValue = engineTheme.direction === "rtl";
|
|
return (0, import_jsx_runtime5.jsx)(ThemeProvider_default, {
|
|
theme: privateTheme,
|
|
children: (0, import_jsx_runtime5.jsx)(ThemeContext.Provider, {
|
|
value: engineTheme,
|
|
children: (0, import_jsx_runtime5.jsx)(RtlProvider_default, {
|
|
value: rtlValue,
|
|
children
|
|
})
|
|
})
|
|
});
|
|
}
|
|
true ? ThemeProvider2.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* Your component tree.
|
|
*/
|
|
children: import_prop_types5.default.node,
|
|
/**
|
|
* A theme object. You can provide a function to extend the outer theme.
|
|
*/
|
|
theme: import_prop_types5.default.oneOfType([import_prop_types5.default.func, import_prop_types5.default.object]).isRequired,
|
|
/**
|
|
* The design system's unique id for getting the corresponded theme when there are multiple design systems.
|
|
*/
|
|
themeId: import_prop_types5.default.string
|
|
} : void 0;
|
|
if (true) {
|
|
true ? ThemeProvider2.propTypes = exactProp(ThemeProvider2.propTypes) : void 0;
|
|
}
|
|
var ThemeProvider_default2 = ThemeProvider2;
|
|
|
|
// node_modules/@mui/system/esm/cssVars/createCssVarsProvider.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
init_formatMuiErrorMessage();
|
|
var React11 = __toESM(require_react());
|
|
var import_prop_types6 = __toESM(require_prop_types());
|
|
init_deepmerge();
|
|
init_styled_engine();
|
|
|
|
// node_modules/@mui/system/esm/cssVars/getInitColorSchemeScript.js
|
|
var React9 = __toESM(require_react());
|
|
var import_jsx_runtime6 = __toESM(require_jsx_runtime());
|
|
var DEFAULT_MODE_STORAGE_KEY = "mode";
|
|
var DEFAULT_COLOR_SCHEME_STORAGE_KEY = "color-scheme";
|
|
var DEFAULT_ATTRIBUTE = "data-color-scheme";
|
|
function getInitColorSchemeScript(options) {
|
|
const {
|
|
defaultMode = "light",
|
|
defaultLightColorScheme = "light",
|
|
defaultDarkColorScheme = "dark",
|
|
modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
|
|
colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
|
|
attribute = DEFAULT_ATTRIBUTE,
|
|
colorSchemeNode = "document.documentElement"
|
|
} = options || {};
|
|
return (0, import_jsx_runtime6.jsx)("script", {
|
|
// eslint-disable-next-line react/no-danger
|
|
dangerouslySetInnerHTML: {
|
|
__html: `(function() {
|
|
try {
|
|
var mode = localStorage.getItem('${modeStorageKey}') || '${defaultMode}';
|
|
var colorScheme = '';
|
|
if (mode === 'system') {
|
|
// handle system mode
|
|
var mql = window.matchMedia('(prefers-color-scheme: dark)');
|
|
if (mql.matches) {
|
|
colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
|
|
} else {
|
|
colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
|
|
}
|
|
}
|
|
if (mode === 'light') {
|
|
colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
|
|
}
|
|
if (mode === 'dark') {
|
|
colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
|
|
}
|
|
if (colorScheme) {
|
|
${colorSchemeNode}.setAttribute('${attribute}', colorScheme);
|
|
}
|
|
} catch(e){}})();`
|
|
}
|
|
}, "mui-color-scheme-init");
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/useCurrentColorScheme.js
|
|
init_extends();
|
|
var React10 = __toESM(require_react());
|
|
function getSystemMode(mode) {
|
|
if (typeof window !== "undefined" && mode === "system") {
|
|
const mql = window.matchMedia("(prefers-color-scheme: dark)");
|
|
if (mql.matches) {
|
|
return "dark";
|
|
}
|
|
return "light";
|
|
}
|
|
return void 0;
|
|
}
|
|
function processState(state, callback) {
|
|
if (state.mode === "light" || state.mode === "system" && state.systemMode === "light") {
|
|
return callback("light");
|
|
}
|
|
if (state.mode === "dark" || state.mode === "system" && state.systemMode === "dark") {
|
|
return callback("dark");
|
|
}
|
|
return void 0;
|
|
}
|
|
function getColorScheme(state) {
|
|
return processState(state, (mode) => {
|
|
if (mode === "light") {
|
|
return state.lightColorScheme;
|
|
}
|
|
if (mode === "dark") {
|
|
return state.darkColorScheme;
|
|
}
|
|
return void 0;
|
|
});
|
|
}
|
|
function initializeValue(key, defaultValue) {
|
|
if (typeof window === "undefined") {
|
|
return void 0;
|
|
}
|
|
let value;
|
|
try {
|
|
value = localStorage.getItem(key) || void 0;
|
|
if (!value) {
|
|
localStorage.setItem(key, defaultValue);
|
|
}
|
|
} catch (e) {
|
|
}
|
|
return value || defaultValue;
|
|
}
|
|
function useCurrentColorScheme(options) {
|
|
const {
|
|
defaultMode = "light",
|
|
defaultLightColorScheme,
|
|
defaultDarkColorScheme,
|
|
supportedColorSchemes = [],
|
|
modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
|
|
colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
|
|
storageWindow = typeof window === "undefined" ? void 0 : window
|
|
} = options;
|
|
const joinedColorSchemes = supportedColorSchemes.join(",");
|
|
const [state, setState] = React10.useState(() => {
|
|
const initialMode = initializeValue(modeStorageKey, defaultMode);
|
|
const lightColorScheme = initializeValue(`${colorSchemeStorageKey}-light`, defaultLightColorScheme);
|
|
const darkColorScheme = initializeValue(`${colorSchemeStorageKey}-dark`, defaultDarkColorScheme);
|
|
return {
|
|
mode: initialMode,
|
|
systemMode: getSystemMode(initialMode),
|
|
lightColorScheme,
|
|
darkColorScheme
|
|
};
|
|
});
|
|
const colorScheme = getColorScheme(state);
|
|
const setMode = React10.useCallback((mode) => {
|
|
setState((currentState) => {
|
|
if (mode === currentState.mode) {
|
|
return currentState;
|
|
}
|
|
const newMode = !mode ? defaultMode : mode;
|
|
try {
|
|
localStorage.setItem(modeStorageKey, newMode);
|
|
} catch (e) {
|
|
}
|
|
return _extends({}, currentState, {
|
|
mode: newMode,
|
|
systemMode: getSystemMode(newMode)
|
|
});
|
|
});
|
|
}, [modeStorageKey, defaultMode]);
|
|
const setColorScheme = React10.useCallback((value) => {
|
|
if (!value) {
|
|
setState((currentState) => {
|
|
try {
|
|
localStorage.setItem(`${colorSchemeStorageKey}-light`, defaultLightColorScheme);
|
|
localStorage.setItem(`${colorSchemeStorageKey}-dark`, defaultDarkColorScheme);
|
|
} catch (e) {
|
|
}
|
|
return _extends({}, currentState, {
|
|
lightColorScheme: defaultLightColorScheme,
|
|
darkColorScheme: defaultDarkColorScheme
|
|
});
|
|
});
|
|
} else if (typeof value === "string") {
|
|
if (value && !joinedColorSchemes.includes(value)) {
|
|
console.error(`\`${value}\` does not exist in \`theme.colorSchemes\`.`);
|
|
} else {
|
|
setState((currentState) => {
|
|
const newState = _extends({}, currentState);
|
|
processState(currentState, (mode) => {
|
|
try {
|
|
localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
|
|
} catch (e) {
|
|
}
|
|
if (mode === "light") {
|
|
newState.lightColorScheme = value;
|
|
}
|
|
if (mode === "dark") {
|
|
newState.darkColorScheme = value;
|
|
}
|
|
});
|
|
return newState;
|
|
});
|
|
}
|
|
} else {
|
|
setState((currentState) => {
|
|
const newState = _extends({}, currentState);
|
|
const newLightColorScheme = value.light === null ? defaultLightColorScheme : value.light;
|
|
const newDarkColorScheme = value.dark === null ? defaultDarkColorScheme : value.dark;
|
|
if (newLightColorScheme) {
|
|
if (!joinedColorSchemes.includes(newLightColorScheme)) {
|
|
console.error(`\`${newLightColorScheme}\` does not exist in \`theme.colorSchemes\`.`);
|
|
} else {
|
|
newState.lightColorScheme = newLightColorScheme;
|
|
try {
|
|
localStorage.setItem(`${colorSchemeStorageKey}-light`, newLightColorScheme);
|
|
} catch (error) {
|
|
}
|
|
}
|
|
}
|
|
if (newDarkColorScheme) {
|
|
if (!joinedColorSchemes.includes(newDarkColorScheme)) {
|
|
console.error(`\`${newDarkColorScheme}\` does not exist in \`theme.colorSchemes\`.`);
|
|
} else {
|
|
newState.darkColorScheme = newDarkColorScheme;
|
|
try {
|
|
localStorage.setItem(`${colorSchemeStorageKey}-dark`, newDarkColorScheme);
|
|
} catch (error) {
|
|
}
|
|
}
|
|
}
|
|
return newState;
|
|
});
|
|
}
|
|
}, [joinedColorSchemes, colorSchemeStorageKey, defaultLightColorScheme, defaultDarkColorScheme]);
|
|
const handleMediaQuery = React10.useCallback((e) => {
|
|
if (state.mode === "system") {
|
|
setState((currentState) => _extends({}, currentState, {
|
|
systemMode: e != null && e.matches ? "dark" : "light"
|
|
}));
|
|
}
|
|
}, [state.mode]);
|
|
const mediaListener = React10.useRef(handleMediaQuery);
|
|
mediaListener.current = handleMediaQuery;
|
|
React10.useEffect(() => {
|
|
const handler = (...args) => mediaListener.current(...args);
|
|
const media = window.matchMedia("(prefers-color-scheme: dark)");
|
|
media.addListener(handler);
|
|
handler(media);
|
|
return () => media.removeListener(handler);
|
|
}, []);
|
|
React10.useEffect(() => {
|
|
const handleStorage = (event) => {
|
|
const value = event.newValue;
|
|
if (typeof event.key === "string" && event.key.startsWith(colorSchemeStorageKey) && (!value || joinedColorSchemes.match(value))) {
|
|
if (event.key.endsWith("light")) {
|
|
setColorScheme({
|
|
light: value
|
|
});
|
|
}
|
|
if (event.key.endsWith("dark")) {
|
|
setColorScheme({
|
|
dark: value
|
|
});
|
|
}
|
|
}
|
|
if (event.key === modeStorageKey && (!value || ["light", "dark", "system"].includes(value))) {
|
|
setMode(value || defaultMode);
|
|
}
|
|
};
|
|
if (storageWindow) {
|
|
storageWindow.addEventListener("storage", handleStorage);
|
|
return () => storageWindow.removeEventListener("storage", handleStorage);
|
|
}
|
|
return void 0;
|
|
}, [setColorScheme, setMode, modeStorageKey, colorSchemeStorageKey, joinedColorSchemes, defaultMode, storageWindow]);
|
|
return _extends({}, state, {
|
|
colorScheme,
|
|
setMode,
|
|
setColorScheme
|
|
});
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/createCssVarsProvider.js
|
|
var import_jsx_runtime7 = __toESM(require_jsx_runtime());
|
|
var import_jsx_runtime8 = __toESM(require_jsx_runtime());
|
|
var _excluded5 = ["colorSchemes", "components", "generateCssVars", "cssVarPrefix"];
|
|
var DISABLE_CSS_TRANSITION = "*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";
|
|
function createCssVarsProvider(options) {
|
|
const {
|
|
themeId,
|
|
/**
|
|
* This `theme` object needs to follow a certain structure to
|
|
* be used correctly by the finel `CssVarsProvider`. It should have a
|
|
* `colorSchemes` key with the light and dark (and any other) palette.
|
|
* It should also ideally have a vars object created using `prepareCssVars`.
|
|
*/
|
|
theme: defaultTheme4 = {},
|
|
attribute: defaultAttribute = DEFAULT_ATTRIBUTE,
|
|
modeStorageKey: defaultModeStorageKey = DEFAULT_MODE_STORAGE_KEY,
|
|
colorSchemeStorageKey: defaultColorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
|
|
defaultMode: designSystemMode = "light",
|
|
defaultColorScheme: designSystemColorScheme,
|
|
disableTransitionOnChange: designSystemTransitionOnChange = false,
|
|
resolveTheme: resolveTheme2,
|
|
excludeVariablesFromRoot
|
|
} = options;
|
|
if (!defaultTheme4.colorSchemes || typeof designSystemColorScheme === "string" && !defaultTheme4.colorSchemes[designSystemColorScheme] || typeof designSystemColorScheme === "object" && !defaultTheme4.colorSchemes[designSystemColorScheme == null ? void 0 : designSystemColorScheme.light] || typeof designSystemColorScheme === "object" && !defaultTheme4.colorSchemes[designSystemColorScheme == null ? void 0 : designSystemColorScheme.dark]) {
|
|
console.error(`MUI: \`${designSystemColorScheme}\` does not exist in \`theme.colorSchemes\`.`);
|
|
}
|
|
const ColorSchemeContext = React11.createContext(void 0);
|
|
if (true) {
|
|
ColorSchemeContext.displayName = "ColorSchemeContext";
|
|
}
|
|
const useColorScheme = () => {
|
|
const value = React11.useContext(ColorSchemeContext);
|
|
if (!value) {
|
|
throw new Error(true ? `MUI: \`useColorScheme\` must be called under <CssVarsProvider />` : formatMuiErrorMessage(19));
|
|
}
|
|
return value;
|
|
};
|
|
function CssVarsProvider({
|
|
children,
|
|
theme: themeProp = defaultTheme4,
|
|
modeStorageKey = defaultModeStorageKey,
|
|
colorSchemeStorageKey = defaultColorSchemeStorageKey,
|
|
attribute = defaultAttribute,
|
|
defaultMode = designSystemMode,
|
|
defaultColorScheme = designSystemColorScheme,
|
|
disableTransitionOnChange = designSystemTransitionOnChange,
|
|
storageWindow = typeof window === "undefined" ? void 0 : window,
|
|
documentNode = typeof document === "undefined" ? void 0 : document,
|
|
colorSchemeNode = typeof document === "undefined" ? void 0 : document.documentElement,
|
|
colorSchemeSelector = ":root",
|
|
disableNestedContext = false,
|
|
disableStyleSheetGeneration = false
|
|
}) {
|
|
const hasMounted = React11.useRef(false);
|
|
const upperTheme = useTheme();
|
|
const ctx = React11.useContext(ColorSchemeContext);
|
|
const nested = !!ctx && !disableNestedContext;
|
|
const scopedTheme = themeProp[themeId];
|
|
const _ref = scopedTheme || themeProp, {
|
|
colorSchemes = {},
|
|
components = {},
|
|
generateCssVars = () => ({
|
|
vars: {},
|
|
css: {}
|
|
}),
|
|
cssVarPrefix
|
|
} = _ref, restThemeProp = _objectWithoutPropertiesLoose(_ref, _excluded5);
|
|
const allColorSchemes = Object.keys(colorSchemes);
|
|
const defaultLightColorScheme2 = typeof defaultColorScheme === "string" ? defaultColorScheme : defaultColorScheme.light;
|
|
const defaultDarkColorScheme2 = typeof defaultColorScheme === "string" ? defaultColorScheme : defaultColorScheme.dark;
|
|
const {
|
|
mode: stateMode,
|
|
setMode,
|
|
systemMode,
|
|
lightColorScheme,
|
|
darkColorScheme,
|
|
colorScheme: stateColorScheme,
|
|
setColorScheme
|
|
} = useCurrentColorScheme({
|
|
supportedColorSchemes: allColorSchemes,
|
|
defaultLightColorScheme: defaultLightColorScheme2,
|
|
defaultDarkColorScheme: defaultDarkColorScheme2,
|
|
modeStorageKey,
|
|
colorSchemeStorageKey,
|
|
defaultMode,
|
|
storageWindow
|
|
});
|
|
let mode = stateMode;
|
|
let colorScheme = stateColorScheme;
|
|
if (nested) {
|
|
mode = ctx.mode;
|
|
colorScheme = ctx.colorScheme;
|
|
}
|
|
const calculatedMode = (() => {
|
|
if (mode) {
|
|
return mode;
|
|
}
|
|
if (defaultMode === "system") {
|
|
return designSystemMode;
|
|
}
|
|
return defaultMode;
|
|
})();
|
|
const calculatedColorScheme = (() => {
|
|
if (!colorScheme) {
|
|
if (calculatedMode === "dark") {
|
|
return defaultDarkColorScheme2;
|
|
}
|
|
return defaultLightColorScheme2;
|
|
}
|
|
return colorScheme;
|
|
})();
|
|
const {
|
|
css: rootCss,
|
|
vars: rootVars
|
|
} = generateCssVars();
|
|
const theme = _extends({}, restThemeProp, {
|
|
components,
|
|
colorSchemes,
|
|
cssVarPrefix,
|
|
vars: rootVars,
|
|
getColorSchemeSelector: (targetColorScheme) => `[${attribute}="${targetColorScheme}"] &`
|
|
});
|
|
const defaultColorSchemeStyleSheet = {};
|
|
const otherColorSchemesStyleSheet = {};
|
|
Object.entries(colorSchemes).forEach(([key, scheme]) => {
|
|
const {
|
|
css: css2,
|
|
vars
|
|
} = generateCssVars(key);
|
|
theme.vars = deepmerge(theme.vars, vars);
|
|
if (key === calculatedColorScheme) {
|
|
Object.keys(scheme).forEach((schemeKey) => {
|
|
if (scheme[schemeKey] && typeof scheme[schemeKey] === "object") {
|
|
theme[schemeKey] = _extends({}, theme[schemeKey], scheme[schemeKey]);
|
|
} else {
|
|
theme[schemeKey] = scheme[schemeKey];
|
|
}
|
|
});
|
|
if (theme.palette) {
|
|
theme.palette.colorScheme = key;
|
|
}
|
|
}
|
|
const resolvedDefaultColorScheme = (() => {
|
|
if (typeof defaultColorScheme === "string") {
|
|
return defaultColorScheme;
|
|
}
|
|
if (defaultMode === "dark") {
|
|
return defaultColorScheme.dark;
|
|
}
|
|
return defaultColorScheme.light;
|
|
})();
|
|
if (key === resolvedDefaultColorScheme) {
|
|
if (excludeVariablesFromRoot) {
|
|
const excludedVariables = {};
|
|
excludeVariablesFromRoot(cssVarPrefix).forEach((cssVar) => {
|
|
excludedVariables[cssVar] = css2[cssVar];
|
|
delete css2[cssVar];
|
|
});
|
|
defaultColorSchemeStyleSheet[`[${attribute}="${key}"]`] = excludedVariables;
|
|
}
|
|
defaultColorSchemeStyleSheet[`${colorSchemeSelector}, [${attribute}="${key}"]`] = css2;
|
|
} else {
|
|
otherColorSchemesStyleSheet[`${colorSchemeSelector === ":root" ? "" : colorSchemeSelector}[${attribute}="${key}"]`] = css2;
|
|
}
|
|
});
|
|
theme.vars = deepmerge(theme.vars, rootVars);
|
|
React11.useEffect(() => {
|
|
if (colorScheme && colorSchemeNode) {
|
|
colorSchemeNode.setAttribute(attribute, colorScheme);
|
|
}
|
|
}, [colorScheme, attribute, colorSchemeNode]);
|
|
React11.useEffect(() => {
|
|
let timer;
|
|
if (disableTransitionOnChange && hasMounted.current && documentNode) {
|
|
const css2 = documentNode.createElement("style");
|
|
css2.appendChild(documentNode.createTextNode(DISABLE_CSS_TRANSITION));
|
|
documentNode.head.appendChild(css2);
|
|
(() => window.getComputedStyle(documentNode.body))();
|
|
timer = setTimeout(() => {
|
|
documentNode.head.removeChild(css2);
|
|
}, 1);
|
|
}
|
|
return () => {
|
|
clearTimeout(timer);
|
|
};
|
|
}, [colorScheme, disableTransitionOnChange, documentNode]);
|
|
React11.useEffect(() => {
|
|
hasMounted.current = true;
|
|
return () => {
|
|
hasMounted.current = false;
|
|
};
|
|
}, []);
|
|
const contextValue = React11.useMemo(() => ({
|
|
mode,
|
|
systemMode,
|
|
setMode,
|
|
lightColorScheme,
|
|
darkColorScheme,
|
|
colorScheme,
|
|
setColorScheme,
|
|
allColorSchemes
|
|
}), [allColorSchemes, colorScheme, darkColorScheme, lightColorScheme, mode, setColorScheme, setMode, systemMode]);
|
|
let shouldGenerateStyleSheet = true;
|
|
if (disableStyleSheetGeneration || nested && (upperTheme == null ? void 0 : upperTheme.cssVarPrefix) === cssVarPrefix) {
|
|
shouldGenerateStyleSheet = false;
|
|
}
|
|
const element = (0, import_jsx_runtime8.jsxs)(React11.Fragment, {
|
|
children: [shouldGenerateStyleSheet && (0, import_jsx_runtime8.jsxs)(React11.Fragment, {
|
|
children: [(0, import_jsx_runtime7.jsx)(GlobalStyles, {
|
|
styles: {
|
|
[colorSchemeSelector]: rootCss
|
|
}
|
|
}), (0, import_jsx_runtime7.jsx)(GlobalStyles, {
|
|
styles: defaultColorSchemeStyleSheet
|
|
}), (0, import_jsx_runtime7.jsx)(GlobalStyles, {
|
|
styles: otherColorSchemesStyleSheet
|
|
})]
|
|
}), (0, import_jsx_runtime7.jsx)(ThemeProvider_default2, {
|
|
themeId: scopedTheme ? themeId : void 0,
|
|
theme: resolveTheme2 ? resolveTheme2(theme) : theme,
|
|
children
|
|
})]
|
|
});
|
|
if (nested) {
|
|
return element;
|
|
}
|
|
return (0, import_jsx_runtime7.jsx)(ColorSchemeContext.Provider, {
|
|
value: contextValue,
|
|
children: element
|
|
});
|
|
}
|
|
true ? CssVarsProvider.propTypes = {
|
|
/**
|
|
* The body attribute name to attach colorScheme.
|
|
*/
|
|
attribute: import_prop_types6.default.string,
|
|
/**
|
|
* The component tree.
|
|
*/
|
|
children: import_prop_types6.default.node,
|
|
/**
|
|
* The node used to attach the color-scheme attribute
|
|
*/
|
|
colorSchemeNode: import_prop_types6.default.any,
|
|
/**
|
|
* The CSS selector for attaching the generated custom properties
|
|
*/
|
|
colorSchemeSelector: import_prop_types6.default.string,
|
|
/**
|
|
* localStorage key used to store `colorScheme`
|
|
*/
|
|
colorSchemeStorageKey: import_prop_types6.default.string,
|
|
/**
|
|
* The initial color scheme used.
|
|
*/
|
|
defaultColorScheme: import_prop_types6.default.oneOfType([import_prop_types6.default.string, import_prop_types6.default.object]),
|
|
/**
|
|
* The initial mode used.
|
|
*/
|
|
defaultMode: import_prop_types6.default.string,
|
|
/**
|
|
* If `true`, the provider creates its own context and generate stylesheet as if it is a root `CssVarsProvider`.
|
|
*/
|
|
disableNestedContext: import_prop_types6.default.bool,
|
|
/**
|
|
* If `true`, the style sheet won't be generated.
|
|
*
|
|
* This is useful for controlling nested CssVarsProvider behavior.
|
|
*/
|
|
disableStyleSheetGeneration: import_prop_types6.default.bool,
|
|
/**
|
|
* Disable CSS transitions when switching between modes or color schemes.
|
|
*/
|
|
disableTransitionOnChange: import_prop_types6.default.bool,
|
|
/**
|
|
* The document to attach the attribute to.
|
|
*/
|
|
documentNode: import_prop_types6.default.any,
|
|
/**
|
|
* The key in the local storage used to store current color scheme.
|
|
*/
|
|
modeStorageKey: import_prop_types6.default.string,
|
|
/**
|
|
* The window that attaches the 'storage' event listener.
|
|
* @default window
|
|
*/
|
|
storageWindow: import_prop_types6.default.any,
|
|
/**
|
|
* The calculated theme object that will be passed through context.
|
|
*/
|
|
theme: import_prop_types6.default.object
|
|
} : void 0;
|
|
const defaultLightColorScheme = typeof designSystemColorScheme === "string" ? designSystemColorScheme : designSystemColorScheme.light;
|
|
const defaultDarkColorScheme = typeof designSystemColorScheme === "string" ? designSystemColorScheme : designSystemColorScheme.dark;
|
|
const getInitColorSchemeScript2 = (params) => getInitColorSchemeScript(_extends({
|
|
attribute: defaultAttribute,
|
|
colorSchemeStorageKey: defaultColorSchemeStorageKey,
|
|
defaultMode: designSystemMode,
|
|
defaultLightColorScheme,
|
|
defaultDarkColorScheme,
|
|
modeStorageKey: defaultModeStorageKey
|
|
}, params));
|
|
return {
|
|
CssVarsProvider,
|
|
useColorScheme,
|
|
getInitColorSchemeScript: getInitColorSchemeScript2
|
|
};
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/createGetCssVar.js
|
|
function createGetCssVar(prefix = "") {
|
|
function appendVar(...vars) {
|
|
if (!vars.length) {
|
|
return "";
|
|
}
|
|
const value = vars[0];
|
|
if (typeof value === "string" && !value.match(/(#|\(|\)|(-?(\d*\.)?\d+)(px|em|%|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc))|^(-?(\d*\.)?\d+)$|(\d+ \d+ \d+)/)) {
|
|
return `, var(--${prefix ? `${prefix}-` : ""}${value}${appendVar(...vars.slice(1))})`;
|
|
}
|
|
return `, ${value}`;
|
|
}
|
|
const getCssVar = (field, ...fallbacks) => {
|
|
return `var(--${prefix ? `${prefix}-` : ""}${field}${appendVar(...fallbacks)})`;
|
|
};
|
|
return getCssVar;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/cssVarsParser.js
|
|
var assignNestedKeys = (obj, keys, value, arrayKeys = []) => {
|
|
let temp = obj;
|
|
keys.forEach((k, index) => {
|
|
if (index === keys.length - 1) {
|
|
if (Array.isArray(temp)) {
|
|
temp[Number(k)] = value;
|
|
} else if (temp && typeof temp === "object") {
|
|
temp[k] = value;
|
|
}
|
|
} else if (temp && typeof temp === "object") {
|
|
if (!temp[k]) {
|
|
temp[k] = arrayKeys.includes(k) ? [] : {};
|
|
}
|
|
temp = temp[k];
|
|
}
|
|
});
|
|
};
|
|
var walkObjectDeep = (obj, callback, shouldSkipPaths) => {
|
|
function recurse(object, parentKeys = [], arrayKeys = []) {
|
|
Object.entries(object).forEach(([key, value]) => {
|
|
if (!shouldSkipPaths || shouldSkipPaths && !shouldSkipPaths([...parentKeys, key])) {
|
|
if (value !== void 0 && value !== null) {
|
|
if (typeof value === "object" && Object.keys(value).length > 0) {
|
|
recurse(value, [...parentKeys, key], Array.isArray(value) ? [...arrayKeys, key] : arrayKeys);
|
|
} else {
|
|
callback([...parentKeys, key], value, arrayKeys);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
recurse(obj);
|
|
};
|
|
var getCssValue = (keys, value) => {
|
|
if (typeof value === "number") {
|
|
if (["lineHeight", "fontWeight", "opacity", "zIndex"].some((prop) => keys.includes(prop))) {
|
|
return value;
|
|
}
|
|
const lastKey = keys[keys.length - 1];
|
|
if (lastKey.toLowerCase().indexOf("opacity") >= 0) {
|
|
return value;
|
|
}
|
|
return `${value}px`;
|
|
}
|
|
return value;
|
|
};
|
|
function cssVarsParser(theme, options) {
|
|
const {
|
|
prefix,
|
|
shouldSkipGeneratingVar
|
|
} = options || {};
|
|
const css2 = {};
|
|
const vars = {};
|
|
const varsWithDefaults = {};
|
|
walkObjectDeep(
|
|
theme,
|
|
(keys, value, arrayKeys) => {
|
|
if (typeof value === "string" || typeof value === "number") {
|
|
if (!shouldSkipGeneratingVar || !shouldSkipGeneratingVar(keys, value)) {
|
|
const cssVar = `--${prefix ? `${prefix}-` : ""}${keys.join("-")}`;
|
|
Object.assign(css2, {
|
|
[cssVar]: getCssValue(keys, value)
|
|
});
|
|
assignNestedKeys(vars, keys, `var(${cssVar})`, arrayKeys);
|
|
assignNestedKeys(varsWithDefaults, keys, `var(${cssVar}, ${value})`, arrayKeys);
|
|
}
|
|
}
|
|
},
|
|
(keys) => keys[0] === "vars"
|
|
// skip 'vars/*' paths
|
|
);
|
|
return {
|
|
css: css2,
|
|
vars,
|
|
varsWithDefaults
|
|
};
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/prepareCssVars.js
|
|
init_extends();
|
|
|
|
// node_modules/@babel/runtime/helpers/esm/typeof.js
|
|
function _typeof(o) {
|
|
"@babel/helpers - typeof";
|
|
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
|
|
return typeof o2;
|
|
} : function(o2) {
|
|
return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2;
|
|
}, _typeof(o);
|
|
}
|
|
|
|
// node_modules/@babel/runtime/helpers/esm/toPrimitive.js
|
|
function toPrimitive(t, r) {
|
|
if ("object" != _typeof(t) || !t)
|
|
return t;
|
|
var e = t[Symbol.toPrimitive];
|
|
if (void 0 !== e) {
|
|
var i = e.call(t, r || "default");
|
|
if ("object" != _typeof(i))
|
|
return i;
|
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
}
|
|
return ("string" === r ? String : Number)(t);
|
|
}
|
|
|
|
// node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
|
|
function toPropertyKey(t) {
|
|
var i = toPrimitive(t, "string");
|
|
return "symbol" == _typeof(i) ? i : String(i);
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/cssVars/prepareCssVars.js
|
|
init_objectWithoutPropertiesLoose();
|
|
init_deepmerge();
|
|
var _excluded6 = ["colorSchemes", "components", "defaultColorScheme"];
|
|
function prepareCssVars(theme, parserConfig) {
|
|
const {
|
|
colorSchemes = {},
|
|
defaultColorScheme = "light"
|
|
} = theme, otherTheme = _objectWithoutPropertiesLoose(theme, _excluded6);
|
|
const {
|
|
vars: rootVars,
|
|
css: rootCss,
|
|
varsWithDefaults: rootVarsWithDefaults
|
|
} = cssVarsParser(otherTheme, parserConfig);
|
|
let themeVars = rootVarsWithDefaults;
|
|
const colorSchemesMap = {};
|
|
const {
|
|
[defaultColorScheme]: light
|
|
} = colorSchemes, otherColorSchemes = _objectWithoutPropertiesLoose(colorSchemes, [defaultColorScheme].map(toPropertyKey));
|
|
Object.entries(otherColorSchemes || {}).forEach(([key, scheme]) => {
|
|
const {
|
|
vars,
|
|
css: css2,
|
|
varsWithDefaults
|
|
} = cssVarsParser(scheme, parserConfig);
|
|
themeVars = deepmerge(themeVars, varsWithDefaults);
|
|
colorSchemesMap[key] = {
|
|
css: css2,
|
|
vars
|
|
};
|
|
});
|
|
if (light) {
|
|
const {
|
|
css: css2,
|
|
vars,
|
|
varsWithDefaults
|
|
} = cssVarsParser(light, parserConfig);
|
|
themeVars = deepmerge(themeVars, varsWithDefaults);
|
|
colorSchemesMap[defaultColorScheme] = {
|
|
css: css2,
|
|
vars
|
|
};
|
|
}
|
|
const generateCssVars = (colorScheme) => {
|
|
var _parserConfig$getSele2;
|
|
if (!colorScheme) {
|
|
var _parserConfig$getSele;
|
|
const css3 = _extends({}, rootCss);
|
|
return {
|
|
css: css3,
|
|
vars: rootVars,
|
|
selector: (parserConfig == null || (_parserConfig$getSele = parserConfig.getSelector) == null ? void 0 : _parserConfig$getSele.call(parserConfig, colorScheme, css3)) || ":root"
|
|
};
|
|
}
|
|
const css2 = _extends({}, colorSchemesMap[colorScheme].css);
|
|
return {
|
|
css: css2,
|
|
vars: colorSchemesMap[colorScheme].vars,
|
|
selector: (parserConfig == null || (_parserConfig$getSele2 = parserConfig.getSelector) == null ? void 0 : _parserConfig$getSele2.call(parserConfig, colorScheme, css2)) || ":root"
|
|
};
|
|
};
|
|
return {
|
|
vars: themeVars,
|
|
generateCssVars
|
|
};
|
|
}
|
|
var prepareCssVars_default = prepareCssVars;
|
|
|
|
// node_modules/@mui/system/esm/cssVars/createCssVarsTheme.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
|
|
// node_modules/@mui/system/esm/index.js
|
|
init_responsivePropType();
|
|
|
|
// node_modules/@mui/system/esm/Container/createContainer.js
|
|
init_objectWithoutPropertiesLoose();
|
|
init_extends();
|
|
var React12 = __toESM(require_react());
|
|
var import_prop_types7 = __toESM(require_prop_types());
|
|
init_clsx();
|
|
init_generateUtilityClass();
|
|
init_composeClasses();
|
|
init_capitalize();
|
|
init_useThemeProps();
|
|
init_createTheme();
|
|
var import_jsx_runtime9 = __toESM(require_jsx_runtime());
|
|
var _excluded7 = ["className", "component", "disableGutters", "fixed", "maxWidth", "classes"];
|
|
var defaultTheme = createTheme_default();
|
|
var defaultCreateStyledComponent = styled_default("div", {
|
|
name: "MuiContainer",
|
|
slot: "Root",
|
|
overridesResolver: (props, styles) => {
|
|
const {
|
|
ownerState
|
|
} = props;
|
|
return [styles.root, styles[`maxWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
|
|
}
|
|
});
|
|
var useThemePropsDefault = (inProps) => useThemeProps({
|
|
props: inProps,
|
|
name: "MuiContainer",
|
|
defaultTheme
|
|
});
|
|
var useUtilityClasses = (ownerState, componentName) => {
|
|
const getContainerUtilityClass = (slot) => {
|
|
return generateUtilityClass(componentName, slot);
|
|
};
|
|
const {
|
|
classes,
|
|
fixed,
|
|
disableGutters,
|
|
maxWidth
|
|
} = ownerState;
|
|
const slots = {
|
|
root: ["root", maxWidth && `maxWidth${capitalize(String(maxWidth))}`, fixed && "fixed", disableGutters && "disableGutters"]
|
|
};
|
|
return composeClasses(slots, getContainerUtilityClass, classes);
|
|
};
|
|
function createContainer(options = {}) {
|
|
const {
|
|
// This will allow adding custom styled fn (for example for custom sx style function)
|
|
createStyledComponent = defaultCreateStyledComponent,
|
|
useThemeProps: useThemeProps2 = useThemePropsDefault,
|
|
componentName = "MuiContainer"
|
|
} = options;
|
|
const ContainerRoot = createStyledComponent(({
|
|
theme,
|
|
ownerState
|
|
}) => _extends({
|
|
width: "100%",
|
|
marginLeft: "auto",
|
|
boxSizing: "border-box",
|
|
marginRight: "auto",
|
|
display: "block"
|
|
}, !ownerState.disableGutters && {
|
|
paddingLeft: theme.spacing(2),
|
|
paddingRight: theme.spacing(2),
|
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
[theme.breakpoints.up("sm")]: {
|
|
paddingLeft: theme.spacing(3),
|
|
paddingRight: theme.spacing(3)
|
|
}
|
|
}), ({
|
|
theme,
|
|
ownerState
|
|
}) => ownerState.fixed && Object.keys(theme.breakpoints.values).reduce((acc, breakpointValueKey) => {
|
|
const breakpoint = breakpointValueKey;
|
|
const value = theme.breakpoints.values[breakpoint];
|
|
if (value !== 0) {
|
|
acc[theme.breakpoints.up(breakpoint)] = {
|
|
maxWidth: `${value}${theme.breakpoints.unit}`
|
|
};
|
|
}
|
|
return acc;
|
|
}, {}), ({
|
|
theme,
|
|
ownerState
|
|
}) => _extends({}, ownerState.maxWidth === "xs" && {
|
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
[theme.breakpoints.up("xs")]: {
|
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
maxWidth: Math.max(theme.breakpoints.values.xs, 444)
|
|
}
|
|
}, ownerState.maxWidth && // @ts-ignore module augmentation fails if custom breakpoints are used
|
|
ownerState.maxWidth !== "xs" && {
|
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
[theme.breakpoints.up(ownerState.maxWidth)]: {
|
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`
|
|
}
|
|
}));
|
|
const Container2 = React12.forwardRef(function Container3(inProps, ref) {
|
|
const props = useThemeProps2(inProps);
|
|
const {
|
|
className,
|
|
component = "div",
|
|
disableGutters = false,
|
|
fixed = false,
|
|
maxWidth = "lg"
|
|
} = props, other = _objectWithoutPropertiesLoose(props, _excluded7);
|
|
const ownerState = _extends({}, props, {
|
|
component,
|
|
disableGutters,
|
|
fixed,
|
|
maxWidth
|
|
});
|
|
const classes = useUtilityClasses(ownerState, componentName);
|
|
return (
|
|
// @ts-ignore theme is injected by the styled util
|
|
(0, import_jsx_runtime9.jsx)(ContainerRoot, _extends({
|
|
as: component,
|
|
ownerState,
|
|
className: clsx_default(classes.root, className),
|
|
ref
|
|
}, other))
|
|
);
|
|
});
|
|
true ? Container2.propTypes = {
|
|
children: import_prop_types7.default.node,
|
|
classes: import_prop_types7.default.object,
|
|
className: import_prop_types7.default.string,
|
|
component: import_prop_types7.default.elementType,
|
|
disableGutters: import_prop_types7.default.bool,
|
|
fixed: import_prop_types7.default.bool,
|
|
maxWidth: import_prop_types7.default.oneOfType([import_prop_types7.default.oneOf(["xs", "sm", "md", "lg", "xl", false]), import_prop_types7.default.string]),
|
|
sx: import_prop_types7.default.oneOfType([import_prop_types7.default.arrayOf(import_prop_types7.default.oneOfType([import_prop_types7.default.func, import_prop_types7.default.object, import_prop_types7.default.bool])), import_prop_types7.default.func, import_prop_types7.default.object])
|
|
} : void 0;
|
|
return Container2;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/Container/Container.js
|
|
var import_prop_types8 = __toESM(require_prop_types());
|
|
var Container = createContainer();
|
|
true ? Container.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* @ignore
|
|
*/
|
|
children: import_prop_types8.default.node,
|
|
/**
|
|
* Override or extend the styles applied to the component.
|
|
*/
|
|
classes: import_prop_types8.default.object,
|
|
/**
|
|
* The component used for the root node.
|
|
* Either a string to use a HTML element or a component.
|
|
*/
|
|
component: import_prop_types8.default.elementType,
|
|
/**
|
|
* If `true`, the left and right padding is removed.
|
|
* @default false
|
|
*/
|
|
disableGutters: import_prop_types8.default.bool,
|
|
/**
|
|
* Set the max-width to match the min-width of the current breakpoint.
|
|
* This is useful if you'd prefer to design for a fixed set of sizes
|
|
* instead of trying to accommodate a fully fluid viewport.
|
|
* It's fluid by default.
|
|
* @default false
|
|
*/
|
|
fixed: import_prop_types8.default.bool,
|
|
/**
|
|
* Determine the max-width of the container.
|
|
* The container width grows with the size of the screen.
|
|
* Set to `false` to disable `maxWidth`.
|
|
* @default 'lg'
|
|
*/
|
|
maxWidth: import_prop_types8.default.oneOfType([import_prop_types8.default.oneOf(["xs", "sm", "md", "lg", "xl", false]), import_prop_types8.default.string]),
|
|
/**
|
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
*/
|
|
sx: import_prop_types8.default.oneOfType([import_prop_types8.default.arrayOf(import_prop_types8.default.oneOfType([import_prop_types8.default.func, import_prop_types8.default.object, import_prop_types8.default.bool])), import_prop_types8.default.func, import_prop_types8.default.object])
|
|
} : void 0;
|
|
|
|
// node_modules/@mui/system/esm/Container/containerClasses.js
|
|
init_generateUtilityClasses();
|
|
init_generateUtilityClass();
|
|
var containerClasses = generateUtilityClasses("MuiContainer", ["root", "disableGutters", "fixed", "maxWidthXs", "maxWidthSm", "maxWidthMd", "maxWidthLg", "maxWidthXl"]);
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/Grid.js
|
|
var import_prop_types10 = __toESM(require_prop_types());
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/createGrid.js
|
|
init_extends();
|
|
init_objectWithoutPropertiesLoose();
|
|
var React13 = __toESM(require_react());
|
|
var import_prop_types9 = __toESM(require_prop_types());
|
|
init_clsx();
|
|
init_isMuiElement();
|
|
init_generateUtilityClass();
|
|
init_composeClasses();
|
|
init_useThemeProps();
|
|
init_useTheme();
|
|
init_styleFunctionSx();
|
|
init_createTheme();
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/gridGenerator.js
|
|
init_extends();
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/traverseBreakpoints.js
|
|
var filterBreakpointKeys = (breakpointsKeys, responsiveKeys) => breakpointsKeys.filter((key) => responsiveKeys.includes(key));
|
|
var traverseBreakpoints = (breakpoints, responsive, iterator) => {
|
|
const smallestBreakpoint = breakpoints.keys[0];
|
|
if (Array.isArray(responsive)) {
|
|
responsive.forEach((breakpointValue, index) => {
|
|
iterator((responsiveStyles, style2) => {
|
|
if (index <= breakpoints.keys.length - 1) {
|
|
if (index === 0) {
|
|
Object.assign(responsiveStyles, style2);
|
|
} else {
|
|
responsiveStyles[breakpoints.up(breakpoints.keys[index])] = style2;
|
|
}
|
|
}
|
|
}, breakpointValue);
|
|
});
|
|
} else if (responsive && typeof responsive === "object") {
|
|
const keys = Object.keys(responsive).length > breakpoints.keys.length ? breakpoints.keys : filterBreakpointKeys(breakpoints.keys, Object.keys(responsive));
|
|
keys.forEach((key) => {
|
|
if (breakpoints.keys.indexOf(key) !== -1) {
|
|
const breakpointValue = responsive[key];
|
|
if (breakpointValue !== void 0) {
|
|
iterator((responsiveStyles, style2) => {
|
|
if (smallestBreakpoint === key) {
|
|
Object.assign(responsiveStyles, style2);
|
|
} else {
|
|
responsiveStyles[breakpoints.up(key)] = style2;
|
|
}
|
|
}, breakpointValue);
|
|
}
|
|
}
|
|
});
|
|
} else if (typeof responsive === "number" || typeof responsive === "string") {
|
|
iterator((responsiveStyles, style2) => {
|
|
Object.assign(responsiveStyles, style2);
|
|
}, responsive);
|
|
}
|
|
};
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/gridGenerator.js
|
|
function appendLevel(level) {
|
|
if (!level) {
|
|
return "";
|
|
}
|
|
return `Level${level}`;
|
|
}
|
|
function isNestedContainer(ownerState) {
|
|
return ownerState.unstable_level > 0 && ownerState.container;
|
|
}
|
|
function createGetSelfSpacing(ownerState) {
|
|
return function getSelfSpacing(axis) {
|
|
return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level)})`;
|
|
};
|
|
}
|
|
function createGetParentSpacing(ownerState) {
|
|
return function getParentSpacing(axis) {
|
|
if (ownerState.unstable_level === 0) {
|
|
return `var(--Grid-${axis}Spacing)`;
|
|
}
|
|
return `var(--Grid-${axis}Spacing${appendLevel(ownerState.unstable_level - 1)})`;
|
|
};
|
|
}
|
|
function getParentColumns(ownerState) {
|
|
if (ownerState.unstable_level === 0) {
|
|
return `var(--Grid-columns)`;
|
|
}
|
|
return `var(--Grid-columns${appendLevel(ownerState.unstable_level - 1)})`;
|
|
}
|
|
var generateGridSizeStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
const getSelfSpacing = createGetSelfSpacing(ownerState);
|
|
const styles = {};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.gridSize, (appendStyle, value) => {
|
|
let style2 = {};
|
|
if (value === true) {
|
|
style2 = {
|
|
flexBasis: 0,
|
|
flexGrow: 1,
|
|
maxWidth: "100%"
|
|
};
|
|
}
|
|
if (value === "auto") {
|
|
style2 = {
|
|
flexBasis: "auto",
|
|
flexGrow: 0,
|
|
flexShrink: 0,
|
|
maxWidth: "none",
|
|
width: "auto"
|
|
};
|
|
}
|
|
if (typeof value === "number") {
|
|
style2 = {
|
|
flexGrow: 0,
|
|
flexBasis: "auto",
|
|
width: `calc(100% * ${value} / ${getParentColumns(ownerState)}${isNestedContainer(ownerState) ? ` + ${getSelfSpacing("column")}` : ""})`
|
|
};
|
|
}
|
|
appendStyle(styles, style2);
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridOffsetStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
const styles = {};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.gridOffset, (appendStyle, value) => {
|
|
let style2 = {};
|
|
if (value === "auto") {
|
|
style2 = {
|
|
marginLeft: "auto"
|
|
};
|
|
}
|
|
if (typeof value === "number") {
|
|
style2 = {
|
|
marginLeft: value === 0 ? "0px" : `calc(100% * ${value} / ${getParentColumns(ownerState)})`
|
|
};
|
|
}
|
|
appendStyle(styles, style2);
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridColumnsStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
if (!ownerState.container) {
|
|
return {};
|
|
}
|
|
const styles = isNestedContainer(ownerState) ? {
|
|
[`--Grid-columns${appendLevel(ownerState.unstable_level)}`]: getParentColumns(ownerState)
|
|
} : {
|
|
"--Grid-columns": 12
|
|
};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.columns, (appendStyle, value) => {
|
|
appendStyle(styles, {
|
|
[`--Grid-columns${appendLevel(ownerState.unstable_level)}`]: value
|
|
});
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridRowSpacingStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
if (!ownerState.container) {
|
|
return {};
|
|
}
|
|
const getParentSpacing = createGetParentSpacing(ownerState);
|
|
const styles = isNestedContainer(ownerState) ? {
|
|
// Set the default spacing as its parent spacing.
|
|
// It will be overridden if spacing props are provided
|
|
[`--Grid-rowSpacing${appendLevel(ownerState.unstable_level)}`]: getParentSpacing("row")
|
|
} : {};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.rowSpacing, (appendStyle, value) => {
|
|
var _theme$spacing;
|
|
appendStyle(styles, {
|
|
[`--Grid-rowSpacing${appendLevel(ownerState.unstable_level)}`]: typeof value === "string" ? value : (_theme$spacing = theme.spacing) == null ? void 0 : _theme$spacing.call(theme, value)
|
|
});
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridColumnSpacingStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
if (!ownerState.container) {
|
|
return {};
|
|
}
|
|
const getParentSpacing = createGetParentSpacing(ownerState);
|
|
const styles = isNestedContainer(ownerState) ? {
|
|
// Set the default spacing as its parent spacing.
|
|
// It will be overridden if spacing props are provided
|
|
[`--Grid-columnSpacing${appendLevel(ownerState.unstable_level)}`]: getParentSpacing("column")
|
|
} : {};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.columnSpacing, (appendStyle, value) => {
|
|
var _theme$spacing2;
|
|
appendStyle(styles, {
|
|
[`--Grid-columnSpacing${appendLevel(ownerState.unstable_level)}`]: typeof value === "string" ? value : (_theme$spacing2 = theme.spacing) == null ? void 0 : _theme$spacing2.call(theme, value)
|
|
});
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridDirectionStyles = ({
|
|
theme,
|
|
ownerState
|
|
}) => {
|
|
if (!ownerState.container) {
|
|
return {};
|
|
}
|
|
const styles = {};
|
|
traverseBreakpoints(theme.breakpoints, ownerState.direction, (appendStyle, value) => {
|
|
appendStyle(styles, {
|
|
flexDirection: value
|
|
});
|
|
});
|
|
return styles;
|
|
};
|
|
var generateGridStyles = ({
|
|
ownerState
|
|
}) => {
|
|
const getSelfSpacing = createGetSelfSpacing(ownerState);
|
|
const getParentSpacing = createGetParentSpacing(ownerState);
|
|
return _extends({
|
|
minWidth: 0,
|
|
boxSizing: "border-box"
|
|
}, ownerState.container && _extends({
|
|
display: "flex",
|
|
flexWrap: "wrap"
|
|
}, ownerState.wrap && ownerState.wrap !== "wrap" && {
|
|
flexWrap: ownerState.wrap
|
|
}, {
|
|
margin: `calc(${getSelfSpacing("row")} / -2) calc(${getSelfSpacing("column")} / -2)`
|
|
}, ownerState.disableEqualOverflow && {
|
|
margin: `calc(${getSelfSpacing("row")} * -1) 0px 0px calc(${getSelfSpacing("column")} * -1)`
|
|
}), (!ownerState.container || isNestedContainer(ownerState)) && _extends({
|
|
padding: `calc(${getParentSpacing("row")} / 2) calc(${getParentSpacing("column")} / 2)`
|
|
}, (ownerState.disableEqualOverflow || ownerState.parentDisableEqualOverflow) && {
|
|
padding: `${getParentSpacing("row")} 0px 0px ${getParentSpacing("column")}`
|
|
}));
|
|
};
|
|
var generateSizeClassNames = (gridSize) => {
|
|
const classNames = [];
|
|
Object.entries(gridSize).forEach(([key, value]) => {
|
|
if (value !== false && value !== void 0) {
|
|
classNames.push(`grid-${key}-${String(value)}`);
|
|
}
|
|
});
|
|
return classNames;
|
|
};
|
|
var generateSpacingClassNames = (spacing, smallestBreakpoint = "xs") => {
|
|
function isValidSpacing(val) {
|
|
if (val === void 0) {
|
|
return false;
|
|
}
|
|
return typeof val === "string" && !Number.isNaN(Number(val)) || typeof val === "number" && val > 0;
|
|
}
|
|
if (isValidSpacing(spacing)) {
|
|
return [`spacing-${smallestBreakpoint}-${String(spacing)}`];
|
|
}
|
|
if (typeof spacing === "object" && !Array.isArray(spacing)) {
|
|
const classNames = [];
|
|
Object.entries(spacing).forEach(([key, value]) => {
|
|
if (isValidSpacing(value)) {
|
|
classNames.push(`spacing-${key}-${String(value)}`);
|
|
}
|
|
});
|
|
return classNames;
|
|
}
|
|
return [];
|
|
};
|
|
var generateDirectionClasses = (direction) => {
|
|
if (direction === void 0) {
|
|
return [];
|
|
}
|
|
if (typeof direction === "object") {
|
|
return Object.entries(direction).map(([key, value]) => `direction-${key}-${value}`);
|
|
}
|
|
return [`direction-xs-${String(direction)}`];
|
|
};
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/createGrid.js
|
|
var import_jsx_runtime10 = __toESM(require_jsx_runtime());
|
|
var _excluded8 = ["className", "children", "columns", "container", "component", "direction", "wrap", "spacing", "rowSpacing", "columnSpacing", "disableEqualOverflow", "unstable_level"];
|
|
var defaultTheme2 = createTheme_default();
|
|
var defaultCreateStyledComponent2 = styled_default("div", {
|
|
name: "MuiGrid",
|
|
slot: "Root",
|
|
overridesResolver: (props, styles) => styles.root
|
|
});
|
|
function useThemePropsDefault2(props) {
|
|
return useThemeProps({
|
|
props,
|
|
name: "MuiGrid",
|
|
defaultTheme: defaultTheme2
|
|
});
|
|
}
|
|
function createGrid(options = {}) {
|
|
const {
|
|
// This will allow adding custom styled fn (for example for custom sx style function)
|
|
createStyledComponent = defaultCreateStyledComponent2,
|
|
useThemeProps: useThemeProps2 = useThemePropsDefault2,
|
|
componentName = "MuiGrid"
|
|
} = options;
|
|
const GridOverflowContext = React13.createContext(void 0);
|
|
if (true) {
|
|
GridOverflowContext.displayName = "GridOverflowContext";
|
|
}
|
|
const useUtilityClasses2 = (ownerState, theme) => {
|
|
const {
|
|
container,
|
|
direction,
|
|
spacing,
|
|
wrap,
|
|
gridSize
|
|
} = ownerState;
|
|
const slots = {
|
|
root: ["root", container && "container", wrap !== "wrap" && `wrap-xs-${String(wrap)}`, ...generateDirectionClasses(direction), ...generateSizeClassNames(gridSize), ...container ? generateSpacingClassNames(spacing, theme.breakpoints.keys[0]) : []]
|
|
};
|
|
return composeClasses(slots, (slot) => generateUtilityClass(componentName, slot), {});
|
|
};
|
|
const GridRoot = createStyledComponent(generateGridColumnsStyles, generateGridColumnSpacingStyles, generateGridRowSpacingStyles, generateGridSizeStyles, generateGridDirectionStyles, generateGridStyles, generateGridOffsetStyles);
|
|
const Grid2 = React13.forwardRef(function Grid3(inProps, ref) {
|
|
var _inProps$columns, _inProps$spacing, _ref, _inProps$rowSpacing, _ref2, _inProps$columnSpacin, _ref3, _disableEqualOverflow;
|
|
const theme = useTheme_default();
|
|
const themeProps = useThemeProps2(inProps);
|
|
const props = extendSxProp(themeProps);
|
|
const overflow2 = React13.useContext(GridOverflowContext);
|
|
const {
|
|
className,
|
|
children,
|
|
columns: columnsProp = 12,
|
|
container = false,
|
|
component = "div",
|
|
direction = "row",
|
|
wrap = "wrap",
|
|
spacing: spacingProp = 0,
|
|
rowSpacing: rowSpacingProp = spacingProp,
|
|
columnSpacing: columnSpacingProp = spacingProp,
|
|
disableEqualOverflow: themeDisableEqualOverflow,
|
|
unstable_level: level = 0
|
|
} = props, rest = _objectWithoutPropertiesLoose(props, _excluded8);
|
|
let disableEqualOverflow = themeDisableEqualOverflow;
|
|
if (level && themeDisableEqualOverflow !== void 0) {
|
|
disableEqualOverflow = inProps.disableEqualOverflow;
|
|
}
|
|
const gridSize = {};
|
|
const gridOffset = {};
|
|
const other = {};
|
|
Object.entries(rest).forEach(([key, val]) => {
|
|
if (theme.breakpoints.values[key] !== void 0) {
|
|
gridSize[key] = val;
|
|
} else if (theme.breakpoints.values[key.replace("Offset", "")] !== void 0) {
|
|
gridOffset[key.replace("Offset", "")] = val;
|
|
} else {
|
|
other[key] = val;
|
|
}
|
|
});
|
|
const columns = (_inProps$columns = inProps.columns) != null ? _inProps$columns : level ? void 0 : columnsProp;
|
|
const spacing = (_inProps$spacing = inProps.spacing) != null ? _inProps$spacing : level ? void 0 : spacingProp;
|
|
const rowSpacing = (_ref = (_inProps$rowSpacing = inProps.rowSpacing) != null ? _inProps$rowSpacing : inProps.spacing) != null ? _ref : level ? void 0 : rowSpacingProp;
|
|
const columnSpacing = (_ref2 = (_inProps$columnSpacin = inProps.columnSpacing) != null ? _inProps$columnSpacin : inProps.spacing) != null ? _ref2 : level ? void 0 : columnSpacingProp;
|
|
const ownerState = _extends({}, props, {
|
|
level,
|
|
columns,
|
|
container,
|
|
direction,
|
|
wrap,
|
|
spacing,
|
|
rowSpacing,
|
|
columnSpacing,
|
|
gridSize,
|
|
gridOffset,
|
|
disableEqualOverflow: (_ref3 = (_disableEqualOverflow = disableEqualOverflow) != null ? _disableEqualOverflow : overflow2) != null ? _ref3 : false,
|
|
// use context value if exists.
|
|
parentDisableEqualOverflow: overflow2
|
|
// for nested grid
|
|
});
|
|
const classes = useUtilityClasses2(ownerState, theme);
|
|
let result = (0, import_jsx_runtime10.jsx)(GridRoot, _extends({
|
|
ref,
|
|
as: component,
|
|
ownerState,
|
|
className: clsx_default(classes.root, className)
|
|
}, other, {
|
|
children: React13.Children.map(children, (child) => {
|
|
if (React13.isValidElement(child) && isMuiElement(child, ["Grid"])) {
|
|
var _child$props$unstable;
|
|
return React13.cloneElement(child, {
|
|
unstable_level: (_child$props$unstable = child.props.unstable_level) != null ? _child$props$unstable : level + 1
|
|
});
|
|
}
|
|
return child;
|
|
})
|
|
}));
|
|
if (disableEqualOverflow !== void 0 && disableEqualOverflow !== (overflow2 != null ? overflow2 : false)) {
|
|
result = (0, import_jsx_runtime10.jsx)(GridOverflowContext.Provider, {
|
|
value: disableEqualOverflow,
|
|
children: result
|
|
});
|
|
}
|
|
return result;
|
|
});
|
|
true ? Grid2.propTypes = {
|
|
children: import_prop_types9.default.node,
|
|
className: import_prop_types9.default.string,
|
|
columns: import_prop_types9.default.oneOfType([import_prop_types9.default.arrayOf(import_prop_types9.default.number), import_prop_types9.default.number, import_prop_types9.default.object]),
|
|
columnSpacing: import_prop_types9.default.oneOfType([import_prop_types9.default.arrayOf(import_prop_types9.default.oneOfType([import_prop_types9.default.number, import_prop_types9.default.string])), import_prop_types9.default.number, import_prop_types9.default.object, import_prop_types9.default.string]),
|
|
component: import_prop_types9.default.elementType,
|
|
container: import_prop_types9.default.bool,
|
|
direction: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["column-reverse", "column", "row-reverse", "row"]), import_prop_types9.default.arrayOf(import_prop_types9.default.oneOf(["column-reverse", "column", "row-reverse", "row"])), import_prop_types9.default.object]),
|
|
disableEqualOverflow: import_prop_types9.default.bool,
|
|
lg: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number, import_prop_types9.default.bool]),
|
|
lgOffset: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number]),
|
|
md: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number, import_prop_types9.default.bool]),
|
|
mdOffset: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number]),
|
|
rowSpacing: import_prop_types9.default.oneOfType([import_prop_types9.default.arrayOf(import_prop_types9.default.oneOfType([import_prop_types9.default.number, import_prop_types9.default.string])), import_prop_types9.default.number, import_prop_types9.default.object, import_prop_types9.default.string]),
|
|
sm: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number, import_prop_types9.default.bool]),
|
|
smOffset: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number]),
|
|
spacing: import_prop_types9.default.oneOfType([import_prop_types9.default.arrayOf(import_prop_types9.default.oneOfType([import_prop_types9.default.number, import_prop_types9.default.string])), import_prop_types9.default.number, import_prop_types9.default.object, import_prop_types9.default.string]),
|
|
sx: import_prop_types9.default.oneOfType([import_prop_types9.default.arrayOf(import_prop_types9.default.oneOfType([import_prop_types9.default.func, import_prop_types9.default.object, import_prop_types9.default.bool])), import_prop_types9.default.func, import_prop_types9.default.object]),
|
|
wrap: import_prop_types9.default.oneOf(["nowrap", "wrap-reverse", "wrap"]),
|
|
xl: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number, import_prop_types9.default.bool]),
|
|
xlOffset: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number]),
|
|
xs: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number, import_prop_types9.default.bool]),
|
|
xsOffset: import_prop_types9.default.oneOfType([import_prop_types9.default.oneOf(["auto"]), import_prop_types9.default.number])
|
|
} : void 0;
|
|
Grid2.muiName = "Grid";
|
|
return Grid2;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/Grid.js
|
|
var Grid = createGrid();
|
|
true ? Grid.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* The content of the component.
|
|
*/
|
|
children: import_prop_types10.default.node,
|
|
/**
|
|
* The number of columns.
|
|
* @default 12
|
|
*/
|
|
columns: import_prop_types10.default.oneOfType([import_prop_types10.default.arrayOf(import_prop_types10.default.number), import_prop_types10.default.number, import_prop_types10.default.object]),
|
|
/**
|
|
* Defines the horizontal space between the type `item` components.
|
|
* It overrides the value of the `spacing` prop.
|
|
*/
|
|
columnSpacing: import_prop_types10.default.oneOfType([import_prop_types10.default.arrayOf(import_prop_types10.default.oneOfType([import_prop_types10.default.number, import_prop_types10.default.string])), import_prop_types10.default.number, import_prop_types10.default.object, import_prop_types10.default.string]),
|
|
/**
|
|
* If `true`, the component will have the flex *container* behavior.
|
|
* You should be wrapping *items* with a *container*.
|
|
* @default false
|
|
*/
|
|
container: import_prop_types10.default.bool,
|
|
/**
|
|
* Defines the `flex-direction` style property.
|
|
* It is applied for all screen sizes.
|
|
* @default 'row'
|
|
*/
|
|
direction: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["column-reverse", "column", "row-reverse", "row"]), import_prop_types10.default.arrayOf(import_prop_types10.default.oneOf(["column-reverse", "column", "row-reverse", "row"])), import_prop_types10.default.object]),
|
|
/**
|
|
* If `true`, the negative margin and padding are apply only to the top and left sides of the grid.
|
|
*/
|
|
disableEqualOverflow: import_prop_types10.default.bool,
|
|
/**
|
|
* If a number, it sets the number of columns the grid item uses.
|
|
* It can't be greater than the total number of columns of the container (12 by default).
|
|
* If 'auto', the grid item's width matches its content.
|
|
* If false, the prop is ignored.
|
|
* If true, the grid item's width grows to use the space available in the grid container.
|
|
* The value is applied for the `lg` breakpoint and wider screens if not overridden.
|
|
* @default false
|
|
*/
|
|
lg: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number, import_prop_types10.default.bool]),
|
|
/**
|
|
* If a number, it sets the margin-left equals to the number of columns the grid item uses.
|
|
* If 'auto', the grid item push itself to the right-end of the container.
|
|
* The value is applied for the `lg` breakpoint and wider screens if not overridden.
|
|
*/
|
|
lgOffset: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number]),
|
|
/**
|
|
* If a number, it sets the number of columns the grid item uses.
|
|
* It can't be greater than the total number of columns of the container (12 by default).
|
|
* If 'auto', the grid item's width matches its content.
|
|
* If false, the prop is ignored.
|
|
* If true, the grid item's width grows to use the space available in the grid container.
|
|
* The value is applied for the `md` breakpoint and wider screens if not overridden.
|
|
* @default false
|
|
*/
|
|
md: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number, import_prop_types10.default.bool]),
|
|
/**
|
|
* If a number, it sets the margin-left equals to the number of columns the grid item uses.
|
|
* If 'auto', the grid item push itself to the right-end of the container.
|
|
* The value is applied for the `md` breakpoint and wider screens if not overridden.
|
|
*/
|
|
mdOffset: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number]),
|
|
/**
|
|
* Defines the vertical space between the type `item` components.
|
|
* It overrides the value of the `spacing` prop.
|
|
*/
|
|
rowSpacing: import_prop_types10.default.oneOfType([import_prop_types10.default.arrayOf(import_prop_types10.default.oneOfType([import_prop_types10.default.number, import_prop_types10.default.string])), import_prop_types10.default.number, import_prop_types10.default.object, import_prop_types10.default.string]),
|
|
/**
|
|
* If a number, it sets the number of columns the grid item uses.
|
|
* It can't be greater than the total number of columns of the container (12 by default).
|
|
* If 'auto', the grid item's width matches its content.
|
|
* If false, the prop is ignored.
|
|
* If true, the grid item's width grows to use the space available in the grid container.
|
|
* The value is applied for the `sm` breakpoint and wider screens if not overridden.
|
|
* @default false
|
|
*/
|
|
sm: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number, import_prop_types10.default.bool]),
|
|
/**
|
|
* If a number, it sets the margin-left equals to the number of columns the grid item uses.
|
|
* If 'auto', the grid item push itself to the right-end of the container.
|
|
* The value is applied for the `sm` breakpoint and wider screens if not overridden.
|
|
*/
|
|
smOffset: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number]),
|
|
/**
|
|
* Defines the space between the type `item` components.
|
|
* It can only be used on a type `container` component.
|
|
* @default 0
|
|
*/
|
|
spacing: import_prop_types10.default.oneOfType([import_prop_types10.default.arrayOf(import_prop_types10.default.oneOfType([import_prop_types10.default.number, import_prop_types10.default.string])), import_prop_types10.default.number, import_prop_types10.default.object, import_prop_types10.default.string]),
|
|
/**
|
|
* @ignore
|
|
*/
|
|
sx: import_prop_types10.default.oneOfType([import_prop_types10.default.arrayOf(import_prop_types10.default.oneOfType([import_prop_types10.default.func, import_prop_types10.default.object, import_prop_types10.default.bool])), import_prop_types10.default.func, import_prop_types10.default.object]),
|
|
/**
|
|
* @internal
|
|
* The level of the grid starts from `0`
|
|
* and increases when the grid nests inside another grid regardless of container or item.
|
|
*
|
|
* ```js
|
|
* <Grid> // level 0
|
|
* <Grid> // level 1
|
|
* <Grid> // level 2
|
|
* <Grid> // level 1
|
|
* ```
|
|
*
|
|
* Only consecutive grid is considered nesting.
|
|
* A grid container will start at `0` if there are non-Grid element above it.
|
|
*
|
|
* ```js
|
|
* <Grid> // level 0
|
|
* <div>
|
|
* <Grid> // level 0
|
|
* <Grid> // level 1
|
|
* ```
|
|
*/
|
|
unstable_level: import_prop_types10.default.number,
|
|
/**
|
|
* Defines the `flex-wrap` style property.
|
|
* It's applied for all screen sizes.
|
|
* @default 'wrap'
|
|
*/
|
|
wrap: import_prop_types10.default.oneOf(["nowrap", "wrap-reverse", "wrap"]),
|
|
/**
|
|
* If a number, it sets the number of columns the grid item uses.
|
|
* It can't be greater than the total number of columns of the container (12 by default).
|
|
* If 'auto', the grid item's width matches its content.
|
|
* If false, the prop is ignored.
|
|
* If true, the grid item's width grows to use the space available in the grid container.
|
|
* The value is applied for the `xl` breakpoint and wider screens if not overridden.
|
|
* @default false
|
|
*/
|
|
xl: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number, import_prop_types10.default.bool]),
|
|
/**
|
|
* If a number, it sets the margin-left equals to the number of columns the grid item uses.
|
|
* If 'auto', the grid item push itself to the right-end of the container.
|
|
* The value is applied for the `xl` breakpoint and wider screens if not overridden.
|
|
*/
|
|
xlOffset: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number]),
|
|
/**
|
|
* If a number, it sets the number of columns the grid item uses.
|
|
* It can't be greater than the total number of columns of the container (12 by default).
|
|
* If 'auto', the grid item's width matches its content.
|
|
* If false, the prop is ignored.
|
|
* If true, the grid item's width grows to use the space available in the grid container.
|
|
* The value is applied for all the screen sizes with the lowest priority.
|
|
* @default false
|
|
*/
|
|
xs: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number, import_prop_types10.default.bool]),
|
|
/**
|
|
* If a number, it sets the margin-left equals to the number of columns the grid item uses.
|
|
* If 'auto', the grid item push itself to the right-end of the container.
|
|
* The value is applied for the `xs` breakpoint and wider screens if not overridden.
|
|
*/
|
|
xsOffset: import_prop_types10.default.oneOfType([import_prop_types10.default.oneOf(["auto"]), import_prop_types10.default.number])
|
|
} : void 0;
|
|
|
|
// node_modules/@mui/system/esm/Unstable_Grid/gridClasses.js
|
|
init_generateUtilityClasses();
|
|
init_generateUtilityClass();
|
|
var SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
|
var DIRECTIONS = ["column-reverse", "column", "row-reverse", "row"];
|
|
var WRAPS = ["nowrap", "wrap-reverse", "wrap"];
|
|
var GRID_SIZES = ["auto", true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
|
|
var gridClasses = generateUtilityClasses("MuiGrid", [
|
|
"root",
|
|
"container",
|
|
"item",
|
|
// spacings
|
|
...SPACINGS.map((spacing) => `spacing-xs-${spacing}`),
|
|
// direction values
|
|
...DIRECTIONS.map((direction) => `direction-xs-${direction}`),
|
|
// wrap values
|
|
...WRAPS.map((wrap) => `wrap-xs-${wrap}`),
|
|
// grid sizes for all breakpoints
|
|
...GRID_SIZES.map((size) => `grid-xs-${size}`),
|
|
...GRID_SIZES.map((size) => `grid-sm-${size}`),
|
|
...GRID_SIZES.map((size) => `grid-md-${size}`),
|
|
...GRID_SIZES.map((size) => `grid-lg-${size}`),
|
|
...GRID_SIZES.map((size) => `grid-xl-${size}`)
|
|
]);
|
|
|
|
// node_modules/@mui/system/esm/Stack/Stack.js
|
|
var import_prop_types12 = __toESM(require_prop_types());
|
|
|
|
// node_modules/@mui/system/esm/Stack/createStack.js
|
|
init_objectWithoutPropertiesLoose();
|
|
init_extends();
|
|
var React14 = __toESM(require_react());
|
|
var import_prop_types11 = __toESM(require_prop_types());
|
|
init_clsx();
|
|
init_deepmerge();
|
|
init_generateUtilityClass();
|
|
init_composeClasses();
|
|
init_useThemeProps();
|
|
init_styleFunctionSx();
|
|
init_createTheme();
|
|
init_breakpoints();
|
|
init_spacing();
|
|
var import_jsx_runtime11 = __toESM(require_jsx_runtime());
|
|
var _excluded9 = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
|
|
var defaultTheme3 = createTheme_default();
|
|
var defaultCreateStyledComponent3 = styled_default("div", {
|
|
name: "MuiStack",
|
|
slot: "Root",
|
|
overridesResolver: (props, styles) => styles.root
|
|
});
|
|
function useThemePropsDefault3(props) {
|
|
return useThemeProps({
|
|
props,
|
|
name: "MuiStack",
|
|
defaultTheme: defaultTheme3
|
|
});
|
|
}
|
|
function joinChildren(children, separator) {
|
|
const childrenArray = React14.Children.toArray(children).filter(Boolean);
|
|
return childrenArray.reduce((output, child, index) => {
|
|
output.push(child);
|
|
if (index < childrenArray.length - 1) {
|
|
output.push(React14.cloneElement(separator, {
|
|
key: `separator-${index}`
|
|
}));
|
|
}
|
|
return output;
|
|
}, []);
|
|
}
|
|
var getSideFromDirection = (direction) => {
|
|
return {
|
|
row: "Left",
|
|
"row-reverse": "Right",
|
|
column: "Top",
|
|
"column-reverse": "Bottom"
|
|
}[direction];
|
|
};
|
|
var style = ({
|
|
ownerState,
|
|
theme
|
|
}) => {
|
|
let styles = _extends({
|
|
display: "flex",
|
|
flexDirection: "column"
|
|
}, handleBreakpoints({
|
|
theme
|
|
}, resolveBreakpointValues({
|
|
values: ownerState.direction,
|
|
breakpoints: theme.breakpoints.values
|
|
}), (propValue) => ({
|
|
flexDirection: propValue
|
|
})));
|
|
if (ownerState.spacing) {
|
|
const transformer = createUnarySpacing(theme);
|
|
const base = Object.keys(theme.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;
|
|
}
|
|
return acc;
|
|
}, {});
|
|
const directionValues = resolveBreakpointValues({
|
|
values: ownerState.direction,
|
|
base
|
|
});
|
|
const spacingValues = resolveBreakpointValues({
|
|
values: ownerState.spacing,
|
|
base
|
|
});
|
|
if (typeof directionValues === "object") {
|
|
Object.keys(directionValues).forEach((breakpoint, index, breakpoints) => {
|
|
const directionValue = directionValues[breakpoint];
|
|
if (!directionValue) {
|
|
const previousDirectionValue = index > 0 ? directionValues[breakpoints[index - 1]] : "column";
|
|
directionValues[breakpoint] = previousDirectionValue;
|
|
}
|
|
});
|
|
}
|
|
const styleFromPropValue = (propValue, breakpoint) => {
|
|
if (ownerState.useFlexGap) {
|
|
return {
|
|
gap: getValue(transformer, propValue)
|
|
};
|
|
}
|
|
return {
|
|
// The useFlexGap={false} implement relies on each child to give up control of the margin.
|
|
// We need to reset the margin to avoid double spacing.
|
|
"& > :not(style):not(style)": {
|
|
margin: 0
|
|
},
|
|
"& > :not(style) ~ :not(style)": {
|
|
[`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
|
|
}
|
|
};
|
|
};
|
|
styles = deepmerge(styles, handleBreakpoints({
|
|
theme
|
|
}, spacingValues, styleFromPropValue));
|
|
}
|
|
styles = mergeBreakpointsInOrder(theme.breakpoints, styles);
|
|
return styles;
|
|
};
|
|
function createStack(options = {}) {
|
|
const {
|
|
// This will allow adding custom styled fn (for example for custom sx style function)
|
|
createStyledComponent = defaultCreateStyledComponent3,
|
|
useThemeProps: useThemeProps2 = useThemePropsDefault3,
|
|
componentName = "MuiStack"
|
|
} = options;
|
|
const useUtilityClasses2 = () => {
|
|
const slots = {
|
|
root: ["root"]
|
|
};
|
|
return composeClasses(slots, (slot) => generateUtilityClass(componentName, slot), {});
|
|
};
|
|
const StackRoot = createStyledComponent(style);
|
|
const Stack2 = React14.forwardRef(function Grid2(inProps, ref) {
|
|
const themeProps = useThemeProps2(inProps);
|
|
const props = extendSxProp(themeProps);
|
|
const {
|
|
component = "div",
|
|
direction = "column",
|
|
spacing = 0,
|
|
divider,
|
|
children,
|
|
className,
|
|
useFlexGap = false
|
|
} = props, other = _objectWithoutPropertiesLoose(props, _excluded9);
|
|
const ownerState = {
|
|
direction,
|
|
spacing,
|
|
useFlexGap
|
|
};
|
|
const classes = useUtilityClasses2();
|
|
return (0, import_jsx_runtime11.jsx)(StackRoot, _extends({
|
|
as: component,
|
|
ownerState,
|
|
ref,
|
|
className: clsx_default(classes.root, className)
|
|
}, other, {
|
|
children: divider ? joinChildren(children, divider) : children
|
|
}));
|
|
});
|
|
true ? Stack2.propTypes = {
|
|
children: import_prop_types11.default.node,
|
|
direction: import_prop_types11.default.oneOfType([import_prop_types11.default.oneOf(["column-reverse", "column", "row-reverse", "row"]), import_prop_types11.default.arrayOf(import_prop_types11.default.oneOf(["column-reverse", "column", "row-reverse", "row"])), import_prop_types11.default.object]),
|
|
divider: import_prop_types11.default.node,
|
|
spacing: import_prop_types11.default.oneOfType([import_prop_types11.default.arrayOf(import_prop_types11.default.oneOfType([import_prop_types11.default.number, import_prop_types11.default.string])), import_prop_types11.default.number, import_prop_types11.default.object, import_prop_types11.default.string]),
|
|
sx: import_prop_types11.default.oneOfType([import_prop_types11.default.arrayOf(import_prop_types11.default.oneOfType([import_prop_types11.default.func, import_prop_types11.default.object, import_prop_types11.default.bool])), import_prop_types11.default.func, import_prop_types11.default.object])
|
|
} : void 0;
|
|
return Stack2;
|
|
}
|
|
|
|
// node_modules/@mui/system/esm/Stack/Stack.js
|
|
var Stack = createStack();
|
|
true ? Stack.propTypes = {
|
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
|
// └─────────────────────────────────────────────────────────────────────┘
|
|
/**
|
|
* The content of the component.
|
|
*/
|
|
children: import_prop_types12.default.node,
|
|
/**
|
|
* The component used for the root node.
|
|
* Either a string to use a HTML element or a component.
|
|
*/
|
|
component: import_prop_types12.default.elementType,
|
|
/**
|
|
* Defines the `flex-direction` style property.
|
|
* It is applied for all screen sizes.
|
|
* @default 'column'
|
|
*/
|
|
direction: import_prop_types12.default.oneOfType([import_prop_types12.default.oneOf(["column-reverse", "column", "row-reverse", "row"]), import_prop_types12.default.arrayOf(import_prop_types12.default.oneOf(["column-reverse", "column", "row-reverse", "row"])), import_prop_types12.default.object]),
|
|
/**
|
|
* Add an element between each child.
|
|
*/
|
|
divider: import_prop_types12.default.node,
|
|
/**
|
|
* Defines the space between immediate children.
|
|
* @default 0
|
|
*/
|
|
spacing: import_prop_types12.default.oneOfType([import_prop_types12.default.arrayOf(import_prop_types12.default.oneOfType([import_prop_types12.default.number, import_prop_types12.default.string])), import_prop_types12.default.number, import_prop_types12.default.object, import_prop_types12.default.string]),
|
|
/**
|
|
* The system prop, which allows defining system overrides as well as additional CSS styles.
|
|
*/
|
|
sx: import_prop_types12.default.oneOfType([import_prop_types12.default.arrayOf(import_prop_types12.default.oneOfType([import_prop_types12.default.func, import_prop_types12.default.object, import_prop_types12.default.bool])), import_prop_types12.default.func, import_prop_types12.default.object]),
|
|
/**
|
|
* If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
|
|
*
|
|
* While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
|
|
* it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
|
|
*
|
|
* To enable this flag globally, follow the theme's default props configuration.
|
|
* @default false
|
|
*/
|
|
useFlexGap: import_prop_types12.default.bool
|
|
} : void 0;
|
|
|
|
// node_modules/@mui/system/esm/Stack/stackClasses.js
|
|
init_generateUtilityClasses();
|
|
init_generateUtilityClass();
|
|
var stackClasses = generateUtilityClasses("MuiStack", ["root"]);
|
|
|
|
export {
|
|
GlobalStyles_default,
|
|
createBox,
|
|
useMediaQuery,
|
|
hexToRgb,
|
|
decomposeColor,
|
|
recomposeColor,
|
|
rgbToHex,
|
|
hslToRgb,
|
|
getLuminance,
|
|
getContrastRatio,
|
|
alpha,
|
|
darken,
|
|
lighten,
|
|
emphasize,
|
|
useRtl,
|
|
ThemeProvider_default2 as ThemeProvider_default,
|
|
createCssVarsProvider,
|
|
createGetCssVar,
|
|
prepareCssVars_default,
|
|
createContainer,
|
|
createGrid,
|
|
createStack
|
|
};
|
|
/*! Bundled license information:
|
|
|
|
@mui/private-theming/index.js:
|
|
(**
|
|
* @mui/private-theming v5.15.13
|
|
*
|
|
* @license MIT
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*)
|
|
*/
|
|
//# sourceMappingURL=chunk-CYFOGIOB.js.map
|