@sinco/react 1.0.15-rc.61 → 1.0.15-rc.63
Sign up to get free protection for your applications and to get access to all the features.
package/index.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import React__default, { Children, isValidElement, cloneElement, useState, useEffect } from 'react';
|
3
3
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
4
|
-
import { withEmotionCache, ThemeContext, keyframes } from '@emotion/react';
|
4
|
+
import { withEmotionCache, ThemeContext, keyframes, css } from '@emotion/react';
|
5
5
|
import * as ReactDOM from 'react-dom';
|
6
6
|
import ReactDOM__default from 'react-dom';
|
7
7
|
|
@@ -3916,7 +3916,7 @@ function _objectWithoutPropertiesLoose$2(source, excluded) {
|
|
3916
3916
|
return target;
|
3917
3917
|
}
|
3918
3918
|
|
3919
|
-
const _excluded$
|
3919
|
+
const _excluded$r = ["values", "unit", "step"];
|
3920
3920
|
const sortBreakpointsValues = values => {
|
3921
3921
|
const breakpointsAsArray = Object.keys(values).map(key => ({
|
3922
3922
|
key,
|
@@ -3951,7 +3951,7 @@ function createBreakpoints(breakpoints) {
|
|
3951
3951
|
unit = 'px',
|
3952
3952
|
step = 5
|
3953
3953
|
} = breakpoints,
|
3954
|
-
other = _objectWithoutPropertiesLoose$2(breakpoints, _excluded$
|
3954
|
+
other = _objectWithoutPropertiesLoose$2(breakpoints, _excluded$r);
|
3955
3955
|
const sortedValues = sortBreakpointsValues(values);
|
3956
3956
|
const keys = Object.keys(sortedValues);
|
3957
3957
|
function up(key) {
|
@@ -5047,7 +5047,7 @@ const styleFunctionSx = unstable_createStyleFunctionSx();
|
|
5047
5047
|
styleFunctionSx.filterProps = ['sx'];
|
5048
5048
|
var styleFunctionSx$1 = styleFunctionSx;
|
5049
5049
|
|
5050
|
-
const _excluded$
|
5050
|
+
const _excluded$q = ["breakpoints", "palette", "spacing", "shape"];
|
5051
5051
|
function createTheme$1(options = {}, ...args) {
|
5052
5052
|
const {
|
5053
5053
|
breakpoints: breakpointsInput = {},
|
@@ -5055,7 +5055,7 @@ function createTheme$1(options = {}, ...args) {
|
|
5055
5055
|
spacing: spacingInput,
|
5056
5056
|
shape: shapeInput = {}
|
5057
5057
|
} = options,
|
5058
|
-
other = _objectWithoutPropertiesLoose$2(options, _excluded$
|
5058
|
+
other = _objectWithoutPropertiesLoose$2(options, _excluded$q);
|
5059
5059
|
const breakpoints = createBreakpoints(breakpointsInput);
|
5060
5060
|
const spacing = createSpacing(spacingInput);
|
5061
5061
|
let muiTheme = deepmerge({
|
@@ -5093,7 +5093,7 @@ function useTheme$1(defaultTheme = systemDefaultTheme$1) {
|
|
5093
5093
|
return useTheme$2(defaultTheme);
|
5094
5094
|
}
|
5095
5095
|
|
5096
|
-
const _excluded$
|
5096
|
+
const _excluded$p = ["sx"];
|
5097
5097
|
const splitProps = props => {
|
5098
5098
|
var _props$theme$unstable, _props$theme;
|
5099
5099
|
const result = {
|
@@ -5114,7 +5114,7 @@ function extendSxProp(props) {
|
|
5114
5114
|
const {
|
5115
5115
|
sx: inSx
|
5116
5116
|
} = props,
|
5117
|
-
other = _objectWithoutPropertiesLoose$2(props, _excluded$
|
5117
|
+
other = _objectWithoutPropertiesLoose$2(props, _excluded$p);
|
5118
5118
|
const {
|
5119
5119
|
systemProps,
|
5120
5120
|
otherProps
|
@@ -5140,7 +5140,7 @@ function extendSxProp(props) {
|
|
5140
5140
|
|
5141
5141
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
5142
5142
|
|
5143
|
-
const _excluded$
|
5143
|
+
const _excluded$o = ["className", "component"];
|
5144
5144
|
function createBox(options = {}) {
|
5145
5145
|
const {
|
5146
5146
|
themeId,
|
@@ -5158,7 +5158,7 @@ function createBox(options = {}) {
|
|
5158
5158
|
className,
|
5159
5159
|
component = 'div'
|
5160
5160
|
} = _extendSxProp,
|
5161
|
-
other = _objectWithoutPropertiesLoose$2(_extendSxProp, _excluded$
|
5161
|
+
other = _objectWithoutPropertiesLoose$2(_extendSxProp, _excluded$o);
|
5162
5162
|
return /*#__PURE__*/jsx(BoxRoot, _extends$1({
|
5163
5163
|
as: component,
|
5164
5164
|
ref: ref,
|
@@ -5169,7 +5169,7 @@ function createBox(options = {}) {
|
|
5169
5169
|
return Box;
|
5170
5170
|
}
|
5171
5171
|
|
5172
|
-
const _excluded$
|
5172
|
+
const _excluded$n = ["variant"];
|
5173
5173
|
function isEmpty$1(string) {
|
5174
5174
|
return string.length === 0;
|
5175
5175
|
}
|
@@ -5183,7 +5183,7 @@ function propsToClassKey(props) {
|
|
5183
5183
|
const {
|
5184
5184
|
variant
|
5185
5185
|
} = props,
|
5186
|
-
other = _objectWithoutPropertiesLoose$2(props, _excluded$
|
5186
|
+
other = _objectWithoutPropertiesLoose$2(props, _excluded$n);
|
5187
5187
|
let classKey = variant || '';
|
5188
5188
|
Object.keys(other).sort().forEach(key => {
|
5189
5189
|
if (key === 'color') {
|
@@ -5195,7 +5195,7 @@ function propsToClassKey(props) {
|
|
5195
5195
|
return classKey;
|
5196
5196
|
}
|
5197
5197
|
|
5198
|
-
const _excluded$
|
5198
|
+
const _excluded$m = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
|
5199
5199
|
function isEmpty(obj) {
|
5200
5200
|
return Object.keys(obj).length === 0;
|
5201
5201
|
}
|
@@ -5332,7 +5332,7 @@ function createStyled(input = {}) {
|
|
5332
5332
|
// For more details: https://github.com/mui/material-ui/pull/37908
|
5333
5333
|
overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))
|
5334
5334
|
} = inputOptions,
|
5335
|
-
options = _objectWithoutPropertiesLoose$2(inputOptions, _excluded$
|
5335
|
+
options = _objectWithoutPropertiesLoose$2(inputOptions, _excluded$m);
|
5336
5336
|
|
5337
5337
|
// if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.
|
5338
5338
|
const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver :
|
@@ -5753,7 +5753,7 @@ function lighten(color, coefficient) {
|
|
5753
5753
|
return recomposeColor(color);
|
5754
5754
|
}
|
5755
5755
|
|
5756
|
-
const _excluded$
|
5756
|
+
const _excluded$l = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
|
5757
5757
|
const defaultTheme$3 = createTheme$1();
|
5758
5758
|
// widening Theme to any so that the consumer can own the theme structure.
|
5759
5759
|
const defaultCreateStyledComponent = systemStyled('div', {
|
@@ -5886,7 +5886,7 @@ function createStack(options = {}) {
|
|
5886
5886
|
className,
|
5887
5887
|
useFlexGap = false
|
5888
5888
|
} = props,
|
5889
|
-
other = _objectWithoutPropertiesLoose$2(props, _excluded$
|
5889
|
+
other = _objectWithoutPropertiesLoose$2(props, _excluded$l);
|
5890
5890
|
const ownerState = {
|
5891
5891
|
direction,
|
5892
5892
|
spacing,
|
@@ -6060,7 +6060,7 @@ const green = {
|
|
6060
6060
|
};
|
6061
6061
|
var green$1 = green;
|
6062
6062
|
|
6063
|
-
const _excluded$
|
6063
|
+
const _excluded$k = ["mode", "contrastThreshold", "tonalOffset"];
|
6064
6064
|
const light = {
|
6065
6065
|
// The colors used to style the text.
|
6066
6066
|
text: {
|
@@ -6229,7 +6229,7 @@ function createPalette(palette) {
|
|
6229
6229
|
contrastThreshold = 3,
|
6230
6230
|
tonalOffset = 0.2
|
6231
6231
|
} = palette,
|
6232
|
-
other = _objectWithoutPropertiesLoose$3(palette, _excluded$
|
6232
|
+
other = _objectWithoutPropertiesLoose$3(palette, _excluded$k);
|
6233
6233
|
const primary = palette.primary || getDefaultPrimary(mode);
|
6234
6234
|
const secondary = palette.secondary || getDefaultSecondary(mode);
|
6235
6235
|
const error = palette.error || getDefaultError(mode);
|
@@ -6353,7 +6353,7 @@ const theme2 = createTheme({ palette: {
|
|
6353
6353
|
return paletteOutput;
|
6354
6354
|
}
|
6355
6355
|
|
6356
|
-
const _excluded$
|
6356
|
+
const _excluded$j = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
|
6357
6357
|
function round(value) {
|
6358
6358
|
return Math.round(value * 1e5) / 1e5;
|
6359
6359
|
}
|
@@ -6384,7 +6384,7 @@ function createTypography(palette, typography) {
|
|
6384
6384
|
allVariants,
|
6385
6385
|
pxToRem: pxToRem2
|
6386
6386
|
} = _ref,
|
6387
|
-
other = _objectWithoutPropertiesLoose$3(_ref, _excluded$
|
6387
|
+
other = _objectWithoutPropertiesLoose$3(_ref, _excluded$j);
|
6388
6388
|
if (process.env.NODE_ENV !== 'production') {
|
6389
6389
|
if (typeof fontSize !== 'number') {
|
6390
6390
|
console.error('MUI: `fontSize` is required to be a number.');
|
@@ -6452,7 +6452,7 @@ function createShadow(...px) {
|
|
6452
6452
|
const shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
|
6453
6453
|
var shadows$1 = shadows;
|
6454
6454
|
|
6455
|
-
const _excluded$
|
6455
|
+
const _excluded$i = ["duration", "easing", "delay"];
|
6456
6456
|
// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves
|
6457
6457
|
// to learn the context in which each easing should be used.
|
6458
6458
|
const easing = {
|
@@ -6503,7 +6503,7 @@ function createTransitions(inputTransitions) {
|
|
6503
6503
|
easing: easingOption = mergedEasing.easeInOut,
|
6504
6504
|
delay = 0
|
6505
6505
|
} = options,
|
6506
|
-
other = _objectWithoutPropertiesLoose$3(options, _excluded$
|
6506
|
+
other = _objectWithoutPropertiesLoose$3(options, _excluded$i);
|
6507
6507
|
if (process.env.NODE_ENV !== 'production') {
|
6508
6508
|
const isString = value => typeof value === 'string';
|
6509
6509
|
// IE11 support, replace with Number.isNaN
|
@@ -6553,7 +6553,7 @@ const zIndex = {
|
|
6553
6553
|
};
|
6554
6554
|
var zIndex$1 = zIndex;
|
6555
6555
|
|
6556
|
-
const _excluded$
|
6556
|
+
const _excluded$h = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
|
6557
6557
|
function createTheme(options = {}, ...args) {
|
6558
6558
|
const {
|
6559
6559
|
mixins: mixinsInput = {},
|
@@ -6561,7 +6561,7 @@ function createTheme(options = {}, ...args) {
|
|
6561
6561
|
transitions: transitionsInput = {},
|
6562
6562
|
typography: typographyInput = {}
|
6563
6563
|
} = options,
|
6564
|
-
other = _objectWithoutPropertiesLoose$3(options, _excluded$
|
6564
|
+
other = _objectWithoutPropertiesLoose$3(options, _excluded$h);
|
6565
6565
|
if (options.vars) {
|
6566
6566
|
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`vars\` is a private field used for CSS variables support.
|
6567
6567
|
Please use another name.` : formatMuiErrorMessage(18));
|
@@ -6668,8 +6668,8 @@ function getSvgIconUtilityClass(slot) {
|
|
6668
6668
|
}
|
6669
6669
|
generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
|
6670
6670
|
|
6671
|
-
const _excluded$
|
6672
|
-
const useUtilityClasses$
|
6671
|
+
const _excluded$g = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
|
6672
|
+
const useUtilityClasses$c = ownerState => {
|
6673
6673
|
const {
|
6674
6674
|
color,
|
6675
6675
|
fontSize,
|
@@ -6736,7 +6736,7 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
|
|
6736
6736
|
titleAccess,
|
6737
6737
|
viewBox = '0 0 24 24'
|
6738
6738
|
} = props,
|
6739
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
6739
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$g);
|
6740
6740
|
const hasSvgAsChild = /*#__PURE__*/React.isValidElement(children) && children.type === 'svg';
|
6741
6741
|
const ownerState = _extends$3({}, props, {
|
6742
6742
|
color,
|
@@ -6751,7 +6751,7 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
|
|
6751
6751
|
if (!inheritViewBox) {
|
6752
6752
|
more.viewBox = viewBox;
|
6753
6753
|
}
|
6754
|
-
const classes = useUtilityClasses$
|
6754
|
+
const classes = useUtilityClasses$c(ownerState);
|
6755
6755
|
return /*#__PURE__*/jsxs(SvgIconRoot, _extends$3({
|
6756
6756
|
as: component,
|
6757
6757
|
className: clsx(classes.root, className),
|
@@ -6876,6 +6876,14 @@ var InfoRounded = createSvgIcon( /*#__PURE__*/jsx("path", {
|
|
6876
6876
|
d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 15c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1s1 .45 1 1v4c0 .55-.45 1-1 1zm1-8h-2V7h2v2z"
|
6877
6877
|
}), 'InfoRounded');
|
6878
6878
|
|
6879
|
+
var KeyboardArrowDown = createSvgIcon( /*#__PURE__*/jsx("path", {
|
6880
|
+
d: "M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"
|
6881
|
+
}), 'KeyboardArrowDown');
|
6882
|
+
|
6883
|
+
var KeyboardArrowUp = createSvgIcon( /*#__PURE__*/jsx("path", {
|
6884
|
+
d: "M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z"
|
6885
|
+
}), 'KeyboardArrowUp');
|
6886
|
+
|
6879
6887
|
var WarningRounded = createSvgIcon( /*#__PURE__*/jsx("path", {
|
6880
6888
|
d: "M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12 14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z"
|
6881
6889
|
}), 'WarningRounded');
|
@@ -8762,8 +8770,8 @@ function getPaperUtilityClass(slot) {
|
|
8762
8770
|
}
|
8763
8771
|
generateUtilityClasses('MuiPaper', ['root', 'rounded', 'outlined', 'elevation', 'elevation0', 'elevation1', 'elevation2', 'elevation3', 'elevation4', 'elevation5', 'elevation6', 'elevation7', 'elevation8', 'elevation9', 'elevation10', 'elevation11', 'elevation12', 'elevation13', 'elevation14', 'elevation15', 'elevation16', 'elevation17', 'elevation18', 'elevation19', 'elevation20', 'elevation21', 'elevation22', 'elevation23', 'elevation24']);
|
8764
8772
|
|
8765
|
-
const _excluded$
|
8766
|
-
const useUtilityClasses$
|
8773
|
+
const _excluded$f = ["className", "component", "elevation", "square", "variant"];
|
8774
|
+
const useUtilityClasses$b = ownerState => {
|
8767
8775
|
const {
|
8768
8776
|
square,
|
8769
8777
|
elevation,
|
@@ -8817,14 +8825,14 @@ const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
|
|
8817
8825
|
square = false,
|
8818
8826
|
variant = 'elevation'
|
8819
8827
|
} = props,
|
8820
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
8828
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$f);
|
8821
8829
|
const ownerState = _extends$3({}, props, {
|
8822
8830
|
component,
|
8823
8831
|
elevation,
|
8824
8832
|
square,
|
8825
8833
|
variant
|
8826
8834
|
});
|
8827
|
-
const classes = useUtilityClasses$
|
8835
|
+
const classes = useUtilityClasses$b(ownerState);
|
8828
8836
|
if (process.env.NODE_ENV !== 'production') {
|
8829
8837
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
8830
8838
|
const theme = useTheme();
|
@@ -8975,15 +8983,15 @@ process.env.NODE_ENV !== "production" ? Ripple.propTypes = {
|
|
8975
8983
|
const touchRippleClasses = generateUtilityClasses('MuiTouchRipple', ['root', 'ripple', 'rippleVisible', 'ripplePulsate', 'child', 'childLeaving', 'childPulsate']);
|
8976
8984
|
var touchRippleClasses$1 = touchRippleClasses;
|
8977
8985
|
|
8978
|
-
const _excluded$
|
8979
|
-
let _ = t => t,
|
8980
|
-
_t,
|
8981
|
-
_t2,
|
8982
|
-
_t3,
|
8983
|
-
_t4;
|
8986
|
+
const _excluded$e = ["center", "classes", "className"];
|
8987
|
+
let _$1 = t => t,
|
8988
|
+
_t$1,
|
8989
|
+
_t2$1,
|
8990
|
+
_t3$1,
|
8991
|
+
_t4$1;
|
8984
8992
|
const DURATION = 550;
|
8985
8993
|
const DELAY_RIPPLE = 80;
|
8986
|
-
const enterKeyframe = keyframes(_t || (_t = _`
|
8994
|
+
const enterKeyframe = keyframes(_t$1 || (_t$1 = _$1`
|
8987
8995
|
0% {
|
8988
8996
|
transform: scale(0);
|
8989
8997
|
opacity: 0.1;
|
@@ -8994,7 +9002,7 @@ const enterKeyframe = keyframes(_t || (_t = _`
|
|
8994
9002
|
opacity: 0.3;
|
8995
9003
|
}
|
8996
9004
|
`));
|
8997
|
-
const exitKeyframe = keyframes(_t2 || (_t2 = _`
|
9005
|
+
const exitKeyframe = keyframes(_t2$1 || (_t2$1 = _$1`
|
8998
9006
|
0% {
|
8999
9007
|
opacity: 1;
|
9000
9008
|
}
|
@@ -9003,7 +9011,7 @@ const exitKeyframe = keyframes(_t2 || (_t2 = _`
|
|
9003
9011
|
opacity: 0;
|
9004
9012
|
}
|
9005
9013
|
`));
|
9006
|
-
const pulsateKeyframe = keyframes(_t3 || (_t3 = _`
|
9014
|
+
const pulsateKeyframe = keyframes(_t3$1 || (_t3$1 = _$1`
|
9007
9015
|
0% {
|
9008
9016
|
transform: scale(1);
|
9009
9017
|
}
|
@@ -9036,7 +9044,7 @@ const TouchRippleRoot = styled$1('span', {
|
|
9036
9044
|
const TouchRippleRipple = styled$1(Ripple, {
|
9037
9045
|
name: 'MuiTouchRipple',
|
9038
9046
|
slot: 'Ripple'
|
9039
|
-
})(_t4 || (_t4 = _`
|
9047
|
+
})(_t4$1 || (_t4$1 = _$1`
|
9040
9048
|
opacity: 0;
|
9041
9049
|
position: absolute;
|
9042
9050
|
|
@@ -9104,7 +9112,7 @@ const TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps,
|
|
9104
9112
|
classes = {},
|
9105
9113
|
className
|
9106
9114
|
} = props,
|
9107
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
9115
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$e);
|
9108
9116
|
const [ripples, setRipples] = React.useState([]);
|
9109
9117
|
const nextKey = React.useRef(0);
|
9110
9118
|
const rippleCallback = React.useRef(null);
|
@@ -9307,8 +9315,8 @@ function getButtonBaseUtilityClass(slot) {
|
|
9307
9315
|
const buttonBaseClasses = generateUtilityClasses('MuiButtonBase', ['root', 'disabled', 'focusVisible']);
|
9308
9316
|
var buttonBaseClasses$1 = buttonBaseClasses;
|
9309
9317
|
|
9310
|
-
const _excluded$
|
9311
|
-
const useUtilityClasses$
|
9318
|
+
const _excluded$d = ["action", "centerRipple", "children", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "LinkComponent", "onBlur", "onClick", "onContextMenu", "onDragLeave", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "tabIndex", "TouchRippleProps", "touchRippleRef", "type"];
|
9319
|
+
const useUtilityClasses$a = ownerState => {
|
9312
9320
|
const {
|
9313
9321
|
disabled,
|
9314
9322
|
focusVisible,
|
@@ -9409,7 +9417,7 @@ const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, re
|
|
9409
9417
|
touchRippleRef,
|
9410
9418
|
type
|
9411
9419
|
} = props,
|
9412
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
9420
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$d);
|
9413
9421
|
const buttonRef = React.useRef(null);
|
9414
9422
|
const rippleRef = React.useRef(null);
|
9415
9423
|
const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
|
@@ -9576,7 +9584,7 @@ const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, re
|
|
9576
9584
|
tabIndex,
|
9577
9585
|
focusVisible
|
9578
9586
|
});
|
9579
|
-
const classes = useUtilityClasses$
|
9587
|
+
const classes = useUtilityClasses$a(ownerState);
|
9580
9588
|
return /*#__PURE__*/jsxs(ButtonBaseRoot, _extends$3({
|
9581
9589
|
as: ComponentProp,
|
9582
9590
|
className: clsx(classes.root, className),
|
@@ -9773,8 +9781,8 @@ function getIconButtonUtilityClass(slot) {
|
|
9773
9781
|
const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
|
9774
9782
|
var iconButtonClasses$1 = iconButtonClasses;
|
9775
9783
|
|
9776
|
-
const _excluded$
|
9777
|
-
const useUtilityClasses$
|
9784
|
+
const _excluded$c = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
|
9785
|
+
const useUtilityClasses$9 = ownerState => {
|
9778
9786
|
const {
|
9779
9787
|
classes,
|
9780
9788
|
disabled,
|
@@ -9874,7 +9882,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(inProps, re
|
|
9874
9882
|
disableFocusRipple = false,
|
9875
9883
|
size = 'medium'
|
9876
9884
|
} = props,
|
9877
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
9885
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$c);
|
9878
9886
|
const ownerState = _extends$3({}, props, {
|
9879
9887
|
edge,
|
9880
9888
|
color,
|
@@ -9882,7 +9890,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(inProps, re
|
|
9882
9890
|
disableFocusRipple,
|
9883
9891
|
size
|
9884
9892
|
});
|
9885
|
-
const classes = useUtilityClasses$
|
9893
|
+
const classes = useUtilityClasses$9(ownerState);
|
9886
9894
|
return /*#__PURE__*/jsx(IconButtonRoot, _extends$3({
|
9887
9895
|
className: clsx(classes.root, className),
|
9888
9896
|
centerRipple: true,
|
@@ -9968,8 +9976,8 @@ function getTypographyUtilityClass(slot) {
|
|
9968
9976
|
}
|
9969
9977
|
generateUtilityClasses('MuiTypography', ['root', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'inherit', 'button', 'caption', 'overline', 'alignLeft', 'alignRight', 'alignCenter', 'alignJustify', 'noWrap', 'gutterBottom', 'paragraph']);
|
9970
9978
|
|
9971
|
-
const _excluded$
|
9972
|
-
const useUtilityClasses$
|
9979
|
+
const _excluded$b = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
|
9980
|
+
const useUtilityClasses$8 = ownerState => {
|
9973
9981
|
const {
|
9974
9982
|
align,
|
9975
9983
|
gutterBottom,
|
@@ -10055,7 +10063,7 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
|
|
10055
10063
|
variant = 'body1',
|
10056
10064
|
variantMapping = defaultVariantMapping
|
10057
10065
|
} = props,
|
10058
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
10066
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$b);
|
10059
10067
|
const ownerState = _extends$3({}, props, {
|
10060
10068
|
align,
|
10061
10069
|
color,
|
@@ -10068,7 +10076,7 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
|
|
10068
10076
|
variantMapping
|
10069
10077
|
});
|
10070
10078
|
const Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
|
10071
|
-
const classes = useUtilityClasses$
|
10079
|
+
const classes = useUtilityClasses$8(ownerState);
|
10072
10080
|
return /*#__PURE__*/jsx(TypographyRoot, _extends$3({
|
10073
10081
|
as: Component,
|
10074
10082
|
ref: ref,
|
@@ -10158,8 +10166,8 @@ function getAppBarUtilityClass(slot) {
|
|
10158
10166
|
}
|
10159
10167
|
generateUtilityClasses('MuiAppBar', ['root', 'positionFixed', 'positionAbsolute', 'positionSticky', 'positionStatic', 'positionRelative', 'colorDefault', 'colorPrimary', 'colorSecondary', 'colorInherit', 'colorTransparent', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning']);
|
10160
10168
|
|
10161
|
-
const _excluded$
|
10162
|
-
const useUtilityClasses$
|
10169
|
+
const _excluded$a = ["className", "color", "enableColorOnDark", "position"];
|
10170
|
+
const useUtilityClasses$7 = ownerState => {
|
10163
10171
|
const {
|
10164
10172
|
color,
|
10165
10173
|
position,
|
@@ -10264,13 +10272,13 @@ const AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {
|
|
10264
10272
|
enableColorOnDark = false,
|
10265
10273
|
position = 'fixed'
|
10266
10274
|
} = props,
|
10267
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
10275
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$a);
|
10268
10276
|
const ownerState = _extends$3({}, props, {
|
10269
10277
|
color,
|
10270
10278
|
position,
|
10271
10279
|
enableColorOnDark
|
10272
10280
|
});
|
10273
|
-
const classes = useUtilityClasses$
|
10281
|
+
const classes = useUtilityClasses$7(ownerState);
|
10274
10282
|
return /*#__PURE__*/jsx(AppBarRoot, _extends$3({
|
10275
10283
|
square: true,
|
10276
10284
|
component: "header",
|
@@ -10493,7 +10501,7 @@ function mergeSlotProps(parameters) {
|
|
10493
10501
|
};
|
10494
10502
|
}
|
10495
10503
|
|
10496
|
-
const _excluded$
|
10504
|
+
const _excluded$9 = ["elementType", "externalSlotProps", "ownerState", "skipResolvingSlotProps"];
|
10497
10505
|
/**
|
10498
10506
|
* @ignore - do not document.
|
10499
10507
|
* Builds the props to be passed into the slot of an unstyled component.
|
@@ -10510,7 +10518,7 @@ function useSlotProps(parameters) {
|
|
10510
10518
|
ownerState,
|
10511
10519
|
skipResolvingSlotProps = false
|
10512
10520
|
} = parameters,
|
10513
|
-
rest = _objectWithoutPropertiesLoose(parameters, _excluded$
|
10521
|
+
rest = _objectWithoutPropertiesLoose(parameters, _excluded$9);
|
10514
10522
|
const resolvedComponentsProps = skipResolvingSlotProps ? {} : resolveComponentProps(externalSlotProps, ownerState);
|
10515
10523
|
const {
|
10516
10524
|
props: mergedProps,
|
@@ -11338,7 +11346,7 @@ function useModal(parameters) {
|
|
11338
11346
|
};
|
11339
11347
|
}
|
11340
11348
|
|
11341
|
-
const _excluded$
|
11349
|
+
const _excluded$8 = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
|
11342
11350
|
const styles = {
|
11343
11351
|
entering: {
|
11344
11352
|
opacity: 1
|
@@ -11375,7 +11383,7 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
|
|
11375
11383
|
// eslint-disable-next-line react/prop-types
|
11376
11384
|
TransitionComponent = Transition$1
|
11377
11385
|
} = props,
|
11378
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
11386
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$8);
|
11379
11387
|
const nodeRef = React.useRef(null);
|
11380
11388
|
const handleRef = useForkRef(nodeRef, children.ref, ref);
|
11381
11389
|
const normalizedTransitionCallback = callback => maybeIsAppearing => {
|
@@ -11536,8 +11544,8 @@ function getBackdropUtilityClass(slot) {
|
|
11536
11544
|
}
|
11537
11545
|
generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);
|
11538
11546
|
|
11539
|
-
const _excluded$
|
11540
|
-
const useUtilityClasses$
|
11547
|
+
const _excluded$7 = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
|
11548
|
+
const useUtilityClasses$6 = ownerState => {
|
11541
11549
|
const {
|
11542
11550
|
classes,
|
11543
11551
|
invisible
|
@@ -11591,12 +11599,12 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
|
|
11591
11599
|
TransitionComponent = Fade$1,
|
11592
11600
|
transitionDuration
|
11593
11601
|
} = props,
|
11594
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
11602
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$7);
|
11595
11603
|
const ownerState = _extends$3({}, props, {
|
11596
11604
|
component,
|
11597
11605
|
invisible
|
11598
11606
|
});
|
11599
|
-
const classes = useUtilityClasses$
|
11607
|
+
const classes = useUtilityClasses$6(ownerState);
|
11600
11608
|
const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
|
11601
11609
|
return /*#__PURE__*/jsx(TransitionComponent, _extends$3({
|
11602
11610
|
in: open,
|
@@ -11740,13 +11748,398 @@ process.env.NODE_ENV !== "production" ? Box$1.propTypes /* remove-proptypes */ =
|
|
11740
11748
|
} : void 0;
|
11741
11749
|
var Box$2 = Box$1;
|
11742
11750
|
|
11751
|
+
function getButtonUtilityClass(slot) {
|
11752
|
+
return generateUtilityClass('MuiButton', slot);
|
11753
|
+
}
|
11754
|
+
const buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);
|
11755
|
+
var buttonClasses$1 = buttonClasses;
|
11756
|
+
|
11757
|
+
/**
|
11758
|
+
* @ignore - internal component.
|
11759
|
+
*/
|
11760
|
+
const ButtonGroupContext = /*#__PURE__*/React.createContext({});
|
11761
|
+
if (process.env.NODE_ENV !== 'production') {
|
11762
|
+
ButtonGroupContext.displayName = 'ButtonGroupContext';
|
11763
|
+
}
|
11764
|
+
var ButtonGroupContext$1 = ButtonGroupContext;
|
11765
|
+
|
11766
|
+
/**
|
11767
|
+
* @ignore - internal component.
|
11768
|
+
*/
|
11769
|
+
const ButtonGroupButtonContext = /*#__PURE__*/React.createContext(undefined);
|
11770
|
+
if (process.env.NODE_ENV !== 'production') {
|
11771
|
+
ButtonGroupButtonContext.displayName = 'ButtonGroupButtonContext';
|
11772
|
+
}
|
11773
|
+
var ButtonGroupButtonContext$1 = ButtonGroupButtonContext;
|
11774
|
+
|
11775
|
+
const _excluded$6 = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"];
|
11776
|
+
const useUtilityClasses$5 = ownerState => {
|
11777
|
+
const {
|
11778
|
+
color,
|
11779
|
+
disableElevation,
|
11780
|
+
fullWidth,
|
11781
|
+
size,
|
11782
|
+
variant,
|
11783
|
+
classes
|
11784
|
+
} = ownerState;
|
11785
|
+
const slots = {
|
11786
|
+
root: ['root', variant, `${variant}${capitalize(color)}`, `size${capitalize(size)}`, `${variant}Size${capitalize(size)}`, color === 'inherit' && 'colorInherit', disableElevation && 'disableElevation', fullWidth && 'fullWidth'],
|
11787
|
+
label: ['label'],
|
11788
|
+
startIcon: ['startIcon', `iconSize${capitalize(size)}`],
|
11789
|
+
endIcon: ['endIcon', `iconSize${capitalize(size)}`]
|
11790
|
+
};
|
11791
|
+
const composedClasses = composeClasses(slots, getButtonUtilityClass, classes);
|
11792
|
+
return _extends$3({}, classes, composedClasses);
|
11793
|
+
};
|
11794
|
+
const commonIconStyles = ownerState => _extends$3({}, ownerState.size === 'small' && {
|
11795
|
+
'& > *:nth-of-type(1)': {
|
11796
|
+
fontSize: 18
|
11797
|
+
}
|
11798
|
+
}, ownerState.size === 'medium' && {
|
11799
|
+
'& > *:nth-of-type(1)': {
|
11800
|
+
fontSize: 20
|
11801
|
+
}
|
11802
|
+
}, ownerState.size === 'large' && {
|
11803
|
+
'& > *:nth-of-type(1)': {
|
11804
|
+
fontSize: 22
|
11805
|
+
}
|
11806
|
+
});
|
11807
|
+
const ButtonRoot = styled$1(ButtonBase$1, {
|
11808
|
+
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
|
11809
|
+
name: 'MuiButton',
|
11810
|
+
slot: 'Root',
|
11811
|
+
overridesResolver: (props, styles) => {
|
11812
|
+
const {
|
11813
|
+
ownerState
|
11814
|
+
} = props;
|
11815
|
+
return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color)}`], styles[`size${capitalize(ownerState.size)}`], styles[`${ownerState.variant}Size${capitalize(ownerState.size)}`], ownerState.color === 'inherit' && styles.colorInherit, ownerState.disableElevation && styles.disableElevation, ownerState.fullWidth && styles.fullWidth];
|
11816
|
+
}
|
11817
|
+
})(({
|
11818
|
+
theme,
|
11819
|
+
ownerState
|
11820
|
+
}) => {
|
11821
|
+
var _theme$palette$getCon, _theme$palette;
|
11822
|
+
const inheritContainedBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey[300] : theme.palette.grey[800];
|
11823
|
+
const inheritContainedHoverBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey.A100 : theme.palette.grey[700];
|
11824
|
+
return _extends$3({}, theme.typography.button, {
|
11825
|
+
minWidth: 64,
|
11826
|
+
padding: '6px 16px',
|
11827
|
+
borderRadius: (theme.vars || theme).shape.borderRadius,
|
11828
|
+
transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color', 'color'], {
|
11829
|
+
duration: theme.transitions.duration.short
|
11830
|
+
}),
|
11831
|
+
'&:hover': _extends$3({
|
11832
|
+
textDecoration: 'none',
|
11833
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),
|
11834
|
+
// Reset on touch devices, it doesn't add specificity
|
11835
|
+
'@media (hover: none)': {
|
11836
|
+
backgroundColor: 'transparent'
|
11837
|
+
}
|
11838
|
+
}, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
|
11839
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
|
11840
|
+
// Reset on touch devices, it doesn't add specificity
|
11841
|
+
'@media (hover: none)': {
|
11842
|
+
backgroundColor: 'transparent'
|
11843
|
+
}
|
11844
|
+
}, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
|
11845
|
+
border: `1px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
|
11846
|
+
backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
|
11847
|
+
// Reset on touch devices, it doesn't add specificity
|
11848
|
+
'@media (hover: none)': {
|
11849
|
+
backgroundColor: 'transparent'
|
11850
|
+
}
|
11851
|
+
}, ownerState.variant === 'contained' && {
|
11852
|
+
backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedHoverBg : inheritContainedHoverBackgroundColor,
|
11853
|
+
boxShadow: (theme.vars || theme).shadows[4],
|
11854
|
+
// Reset on touch devices, it doesn't add specificity
|
11855
|
+
'@media (hover: none)': {
|
11856
|
+
boxShadow: (theme.vars || theme).shadows[2],
|
11857
|
+
backgroundColor: (theme.vars || theme).palette.grey[300]
|
11858
|
+
}
|
11859
|
+
}, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
|
11860
|
+
backgroundColor: (theme.vars || theme).palette[ownerState.color].dark,
|
11861
|
+
// Reset on touch devices, it doesn't add specificity
|
11862
|
+
'@media (hover: none)': {
|
11863
|
+
backgroundColor: (theme.vars || theme).palette[ownerState.color].main
|
11864
|
+
}
|
11865
|
+
}),
|
11866
|
+
'&:active': _extends$3({}, ownerState.variant === 'contained' && {
|
11867
|
+
boxShadow: (theme.vars || theme).shadows[8]
|
11868
|
+
}),
|
11869
|
+
[`&.${buttonClasses$1.focusVisible}`]: _extends$3({}, ownerState.variant === 'contained' && {
|
11870
|
+
boxShadow: (theme.vars || theme).shadows[6]
|
11871
|
+
}),
|
11872
|
+
[`&.${buttonClasses$1.disabled}`]: _extends$3({
|
11873
|
+
color: (theme.vars || theme).palette.action.disabled
|
11874
|
+
}, ownerState.variant === 'outlined' && {
|
11875
|
+
border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`
|
11876
|
+
}, ownerState.variant === 'contained' && {
|
11877
|
+
color: (theme.vars || theme).palette.action.disabled,
|
11878
|
+
boxShadow: (theme.vars || theme).shadows[0],
|
11879
|
+
backgroundColor: (theme.vars || theme).palette.action.disabledBackground
|
11880
|
+
})
|
11881
|
+
}, ownerState.variant === 'text' && {
|
11882
|
+
padding: '6px 8px'
|
11883
|
+
}, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
|
11884
|
+
color: (theme.vars || theme).palette[ownerState.color].main
|
11885
|
+
}, ownerState.variant === 'outlined' && {
|
11886
|
+
padding: '5px 15px',
|
11887
|
+
border: '1px solid currentColor'
|
11888
|
+
}, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
|
11889
|
+
color: (theme.vars || theme).palette[ownerState.color].main,
|
11890
|
+
border: theme.vars ? `1px solid rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : `1px solid ${alpha(theme.palette[ownerState.color].main, 0.5)}`
|
11891
|
+
}, ownerState.variant === 'contained' && {
|
11892
|
+
color: theme.vars ?
|
11893
|
+
// this is safe because grey does not change between default light/dark mode
|
11894
|
+
theme.vars.palette.text.primary : (_theme$palette$getCon = (_theme$palette = theme.palette).getContrastText) == null ? void 0 : _theme$palette$getCon.call(_theme$palette, theme.palette.grey[300]),
|
11895
|
+
backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedBg : inheritContainedBackgroundColor,
|
11896
|
+
boxShadow: (theme.vars || theme).shadows[2]
|
11897
|
+
}, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
|
11898
|
+
color: (theme.vars || theme).palette[ownerState.color].contrastText,
|
11899
|
+
backgroundColor: (theme.vars || theme).palette[ownerState.color].main
|
11900
|
+
}, ownerState.color === 'inherit' && {
|
11901
|
+
color: 'inherit',
|
11902
|
+
borderColor: 'currentColor'
|
11903
|
+
}, ownerState.size === 'small' && ownerState.variant === 'text' && {
|
11904
|
+
padding: '4px 5px',
|
11905
|
+
fontSize: theme.typography.pxToRem(13)
|
11906
|
+
}, ownerState.size === 'large' && ownerState.variant === 'text' && {
|
11907
|
+
padding: '8px 11px',
|
11908
|
+
fontSize: theme.typography.pxToRem(15)
|
11909
|
+
}, ownerState.size === 'small' && ownerState.variant === 'outlined' && {
|
11910
|
+
padding: '3px 9px',
|
11911
|
+
fontSize: theme.typography.pxToRem(13)
|
11912
|
+
}, ownerState.size === 'large' && ownerState.variant === 'outlined' && {
|
11913
|
+
padding: '7px 21px',
|
11914
|
+
fontSize: theme.typography.pxToRem(15)
|
11915
|
+
}, ownerState.size === 'small' && ownerState.variant === 'contained' && {
|
11916
|
+
padding: '4px 10px',
|
11917
|
+
fontSize: theme.typography.pxToRem(13)
|
11918
|
+
}, ownerState.size === 'large' && ownerState.variant === 'contained' && {
|
11919
|
+
padding: '8px 22px',
|
11920
|
+
fontSize: theme.typography.pxToRem(15)
|
11921
|
+
}, ownerState.fullWidth && {
|
11922
|
+
width: '100%'
|
11923
|
+
});
|
11924
|
+
}, ({
|
11925
|
+
ownerState
|
11926
|
+
}) => ownerState.disableElevation && {
|
11927
|
+
boxShadow: 'none',
|
11928
|
+
'&:hover': {
|
11929
|
+
boxShadow: 'none'
|
11930
|
+
},
|
11931
|
+
[`&.${buttonClasses$1.focusVisible}`]: {
|
11932
|
+
boxShadow: 'none'
|
11933
|
+
},
|
11934
|
+
'&:active': {
|
11935
|
+
boxShadow: 'none'
|
11936
|
+
},
|
11937
|
+
[`&.${buttonClasses$1.disabled}`]: {
|
11938
|
+
boxShadow: 'none'
|
11939
|
+
}
|
11940
|
+
});
|
11941
|
+
const ButtonStartIcon = styled$1('span', {
|
11942
|
+
name: 'MuiButton',
|
11943
|
+
slot: 'StartIcon',
|
11944
|
+
overridesResolver: (props, styles) => {
|
11945
|
+
const {
|
11946
|
+
ownerState
|
11947
|
+
} = props;
|
11948
|
+
return [styles.startIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
|
11949
|
+
}
|
11950
|
+
})(({
|
11951
|
+
ownerState
|
11952
|
+
}) => _extends$3({
|
11953
|
+
display: 'inherit',
|
11954
|
+
marginRight: 8,
|
11955
|
+
marginLeft: -4
|
11956
|
+
}, ownerState.size === 'small' && {
|
11957
|
+
marginLeft: -2
|
11958
|
+
}, commonIconStyles(ownerState)));
|
11959
|
+
const ButtonEndIcon = styled$1('span', {
|
11960
|
+
name: 'MuiButton',
|
11961
|
+
slot: 'EndIcon',
|
11962
|
+
overridesResolver: (props, styles) => {
|
11963
|
+
const {
|
11964
|
+
ownerState
|
11965
|
+
} = props;
|
11966
|
+
return [styles.endIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
|
11967
|
+
}
|
11968
|
+
})(({
|
11969
|
+
ownerState
|
11970
|
+
}) => _extends$3({
|
11971
|
+
display: 'inherit',
|
11972
|
+
marginRight: -4,
|
11973
|
+
marginLeft: 8
|
11974
|
+
}, ownerState.size === 'small' && {
|
11975
|
+
marginRight: -2
|
11976
|
+
}, commonIconStyles(ownerState)));
|
11977
|
+
const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
|
11978
|
+
// props priority: `inProps` > `contextProps` > `themeDefaultProps`
|
11979
|
+
const contextProps = React.useContext(ButtonGroupContext$1);
|
11980
|
+
const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext$1);
|
11981
|
+
const resolvedProps = resolveProps(contextProps, inProps);
|
11982
|
+
const props = useThemeProps({
|
11983
|
+
props: resolvedProps,
|
11984
|
+
name: 'MuiButton'
|
11985
|
+
});
|
11986
|
+
const {
|
11987
|
+
children,
|
11988
|
+
color = 'primary',
|
11989
|
+
component = 'button',
|
11990
|
+
className,
|
11991
|
+
disabled = false,
|
11992
|
+
disableElevation = false,
|
11993
|
+
disableFocusRipple = false,
|
11994
|
+
endIcon: endIconProp,
|
11995
|
+
focusVisibleClassName,
|
11996
|
+
fullWidth = false,
|
11997
|
+
size = 'medium',
|
11998
|
+
startIcon: startIconProp,
|
11999
|
+
type,
|
12000
|
+
variant = 'text'
|
12001
|
+
} = props,
|
12002
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$6);
|
12003
|
+
const ownerState = _extends$3({}, props, {
|
12004
|
+
color,
|
12005
|
+
component,
|
12006
|
+
disabled,
|
12007
|
+
disableElevation,
|
12008
|
+
disableFocusRipple,
|
12009
|
+
fullWidth,
|
12010
|
+
size,
|
12011
|
+
type,
|
12012
|
+
variant
|
12013
|
+
});
|
12014
|
+
const classes = useUtilityClasses$5(ownerState);
|
12015
|
+
const startIcon = startIconProp && /*#__PURE__*/jsx(ButtonStartIcon, {
|
12016
|
+
className: classes.startIcon,
|
12017
|
+
ownerState: ownerState,
|
12018
|
+
children: startIconProp
|
12019
|
+
});
|
12020
|
+
const endIcon = endIconProp && /*#__PURE__*/jsx(ButtonEndIcon, {
|
12021
|
+
className: classes.endIcon,
|
12022
|
+
ownerState: ownerState,
|
12023
|
+
children: endIconProp
|
12024
|
+
});
|
12025
|
+
const positionClassName = buttonGroupButtonContextPositionClassName || '';
|
12026
|
+
return /*#__PURE__*/jsxs(ButtonRoot, _extends$3({
|
12027
|
+
ownerState: ownerState,
|
12028
|
+
className: clsx(contextProps.className, classes.root, className, positionClassName),
|
12029
|
+
component: component,
|
12030
|
+
disabled: disabled,
|
12031
|
+
focusRipple: !disableFocusRipple,
|
12032
|
+
focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
|
12033
|
+
ref: ref,
|
12034
|
+
type: type
|
12035
|
+
}, other, {
|
12036
|
+
classes: classes,
|
12037
|
+
children: [startIcon, children, endIcon]
|
12038
|
+
}));
|
12039
|
+
});
|
12040
|
+
process.env.NODE_ENV !== "production" ? Button.propTypes /* remove-proptypes */ = {
|
12041
|
+
// ----------------------------- Warning --------------------------------
|
12042
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
12043
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
12044
|
+
// ----------------------------------------------------------------------
|
12045
|
+
/**
|
12046
|
+
* The content of the component.
|
12047
|
+
*/
|
12048
|
+
children: PropTypes.node,
|
12049
|
+
/**
|
12050
|
+
* Override or extend the styles applied to the component.
|
12051
|
+
*/
|
12052
|
+
classes: PropTypes.object,
|
12053
|
+
/**
|
12054
|
+
* @ignore
|
12055
|
+
*/
|
12056
|
+
className: PropTypes.string,
|
12057
|
+
/**
|
12058
|
+
* The color of the component.
|
12059
|
+
* It supports both default and custom theme colors, which can be added as shown in the
|
12060
|
+
* [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
|
12061
|
+
* @default 'primary'
|
12062
|
+
*/
|
12063
|
+
color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning']), PropTypes.string]),
|
12064
|
+
/**
|
12065
|
+
* The component used for the root node.
|
12066
|
+
* Either a string to use a HTML element or a component.
|
12067
|
+
*/
|
12068
|
+
component: PropTypes.elementType,
|
12069
|
+
/**
|
12070
|
+
* If `true`, the component is disabled.
|
12071
|
+
* @default false
|
12072
|
+
*/
|
12073
|
+
disabled: PropTypes.bool,
|
12074
|
+
/**
|
12075
|
+
* If `true`, no elevation is used.
|
12076
|
+
* @default false
|
12077
|
+
*/
|
12078
|
+
disableElevation: PropTypes.bool,
|
12079
|
+
/**
|
12080
|
+
* If `true`, the keyboard focus ripple is disabled.
|
12081
|
+
* @default false
|
12082
|
+
*/
|
12083
|
+
disableFocusRipple: PropTypes.bool,
|
12084
|
+
/**
|
12085
|
+
* If `true`, the ripple effect is disabled.
|
12086
|
+
*
|
12087
|
+
* ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
|
12088
|
+
* to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
|
12089
|
+
* @default false
|
12090
|
+
*/
|
12091
|
+
disableRipple: PropTypes.bool,
|
12092
|
+
/**
|
12093
|
+
* Element placed after the children.
|
12094
|
+
*/
|
12095
|
+
endIcon: PropTypes.node,
|
12096
|
+
/**
|
12097
|
+
* @ignore
|
12098
|
+
*/
|
12099
|
+
focusVisibleClassName: PropTypes.string,
|
12100
|
+
/**
|
12101
|
+
* If `true`, the button will take up the full width of its container.
|
12102
|
+
* @default false
|
12103
|
+
*/
|
12104
|
+
fullWidth: PropTypes.bool,
|
12105
|
+
/**
|
12106
|
+
* The URL to link to when the button is clicked.
|
12107
|
+
* If defined, an `a` element will be used as the root node.
|
12108
|
+
*/
|
12109
|
+
href: PropTypes.string,
|
12110
|
+
/**
|
12111
|
+
* The size of the component.
|
12112
|
+
* `small` is equivalent to the dense button styling.
|
12113
|
+
* @default 'medium'
|
12114
|
+
*/
|
12115
|
+
size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
|
12116
|
+
/**
|
12117
|
+
* Element placed before the children.
|
12118
|
+
*/
|
12119
|
+
startIcon: PropTypes.node,
|
12120
|
+
/**
|
12121
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
12122
|
+
*/
|
12123
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
12124
|
+
/**
|
12125
|
+
* @ignore
|
12126
|
+
*/
|
12127
|
+
type: PropTypes.oneOfType([PropTypes.oneOf(['button', 'reset', 'submit']), PropTypes.string]),
|
12128
|
+
/**
|
12129
|
+
* The variant to use.
|
12130
|
+
* @default 'text'
|
12131
|
+
*/
|
12132
|
+
variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])
|
12133
|
+
} : void 0;
|
12134
|
+
var Button$1 = Button;
|
12135
|
+
|
11743
12136
|
function getModalUtilityClass(slot) {
|
11744
12137
|
return generateUtilityClass('MuiModal', slot);
|
11745
12138
|
}
|
11746
12139
|
generateUtilityClasses('MuiModal', ['root', 'hidden', 'backdrop']);
|
11747
12140
|
|
11748
|
-
const _excluded$
|
11749
|
-
const useUtilityClasses$
|
12141
|
+
const _excluded$5 = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "onTransitionEnter", "onTransitionExited", "open", "slotProps", "slots", "theme"];
|
12142
|
+
const useUtilityClasses$4 = ownerState => {
|
11750
12143
|
const {
|
11751
12144
|
open,
|
11752
12145
|
exited,
|
@@ -11833,7 +12226,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
|
|
11833
12226
|
slots
|
11834
12227
|
// eslint-disable-next-line react/prop-types
|
11835
12228
|
} = props,
|
11836
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
12229
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$5);
|
11837
12230
|
const propsWithDefaults = _extends$3({}, props, {
|
11838
12231
|
closeAfterTransition,
|
11839
12232
|
disableAutoFocus,
|
@@ -11859,7 +12252,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
|
|
11859
12252
|
const ownerState = _extends$3({}, propsWithDefaults, {
|
11860
12253
|
exited
|
11861
12254
|
});
|
11862
|
-
const classes = useUtilityClasses$
|
12255
|
+
const classes = useUtilityClasses$4(ownerState);
|
11863
12256
|
const childProps = {};
|
11864
12257
|
if (children.props.tabIndex === undefined) {
|
11865
12258
|
childProps.tabIndex = '-1';
|
@@ -12108,18 +12501,261 @@ process.env.NODE_ENV !== "production" ? Modal.propTypes /* remove-proptypes */ =
|
|
12108
12501
|
} : void 0;
|
12109
12502
|
var Modal$1 = Modal;
|
12110
12503
|
|
12111
|
-
|
12112
|
-
|
12113
|
-
|
12114
|
-
|
12115
|
-
|
12116
|
-
|
12117
|
-
|
12118
|
-
|
12119
|
-
|
12120
|
-
|
12121
|
-
|
12122
|
-
|
12504
|
+
function getDividerUtilityClass(slot) {
|
12505
|
+
return generateUtilityClass('MuiDivider', slot);
|
12506
|
+
}
|
12507
|
+
generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
|
12508
|
+
|
12509
|
+
const _excluded$4 = ["absolute", "children", "className", "component", "flexItem", "light", "orientation", "role", "textAlign", "variant"];
|
12510
|
+
const useUtilityClasses$3 = ownerState => {
|
12511
|
+
const {
|
12512
|
+
absolute,
|
12513
|
+
children,
|
12514
|
+
classes,
|
12515
|
+
flexItem,
|
12516
|
+
light,
|
12517
|
+
orientation,
|
12518
|
+
textAlign,
|
12519
|
+
variant
|
12520
|
+
} = ownerState;
|
12521
|
+
const slots = {
|
12522
|
+
root: ['root', absolute && 'absolute', variant, light && 'light', orientation === 'vertical' && 'vertical', flexItem && 'flexItem', children && 'withChildren', children && orientation === 'vertical' && 'withChildrenVertical', textAlign === 'right' && orientation !== 'vertical' && 'textAlignRight', textAlign === 'left' && orientation !== 'vertical' && 'textAlignLeft'],
|
12523
|
+
wrapper: ['wrapper', orientation === 'vertical' && 'wrapperVertical']
|
12524
|
+
};
|
12525
|
+
return composeClasses(slots, getDividerUtilityClass, classes);
|
12526
|
+
};
|
12527
|
+
const DividerRoot = styled$1('div', {
|
12528
|
+
name: 'MuiDivider',
|
12529
|
+
slot: 'Root',
|
12530
|
+
overridesResolver: (props, styles) => {
|
12531
|
+
const {
|
12532
|
+
ownerState
|
12533
|
+
} = props;
|
12534
|
+
return [styles.root, ownerState.absolute && styles.absolute, styles[ownerState.variant], ownerState.light && styles.light, ownerState.orientation === 'vertical' && styles.vertical, ownerState.flexItem && styles.flexItem, ownerState.children && styles.withChildren, ownerState.children && ownerState.orientation === 'vertical' && styles.withChildrenVertical, ownerState.textAlign === 'right' && ownerState.orientation !== 'vertical' && styles.textAlignRight, ownerState.textAlign === 'left' && ownerState.orientation !== 'vertical' && styles.textAlignLeft];
|
12535
|
+
}
|
12536
|
+
})(({
|
12537
|
+
theme,
|
12538
|
+
ownerState
|
12539
|
+
}) => _extends$3({
|
12540
|
+
margin: 0,
|
12541
|
+
// Reset browser default style.
|
12542
|
+
flexShrink: 0,
|
12543
|
+
borderWidth: 0,
|
12544
|
+
borderStyle: 'solid',
|
12545
|
+
borderColor: (theme.vars || theme).palette.divider,
|
12546
|
+
borderBottomWidth: 'thin'
|
12547
|
+
}, ownerState.absolute && {
|
12548
|
+
position: 'absolute',
|
12549
|
+
bottom: 0,
|
12550
|
+
left: 0,
|
12551
|
+
width: '100%'
|
12552
|
+
}, ownerState.light && {
|
12553
|
+
borderColor: theme.vars ? `rgba(${theme.vars.palette.dividerChannel} / 0.08)` : alpha(theme.palette.divider, 0.08)
|
12554
|
+
}, ownerState.variant === 'inset' && {
|
12555
|
+
marginLeft: 72
|
12556
|
+
}, ownerState.variant === 'middle' && ownerState.orientation === 'horizontal' && {
|
12557
|
+
marginLeft: theme.spacing(2),
|
12558
|
+
marginRight: theme.spacing(2)
|
12559
|
+
}, ownerState.variant === 'middle' && ownerState.orientation === 'vertical' && {
|
12560
|
+
marginTop: theme.spacing(1),
|
12561
|
+
marginBottom: theme.spacing(1)
|
12562
|
+
}, ownerState.orientation === 'vertical' && {
|
12563
|
+
height: '100%',
|
12564
|
+
borderBottomWidth: 0,
|
12565
|
+
borderRightWidth: 'thin'
|
12566
|
+
}, ownerState.flexItem && {
|
12567
|
+
alignSelf: 'stretch',
|
12568
|
+
height: 'auto'
|
12569
|
+
}), ({
|
12570
|
+
ownerState
|
12571
|
+
}) => _extends$3({}, ownerState.children && {
|
12572
|
+
display: 'flex',
|
12573
|
+
whiteSpace: 'nowrap',
|
12574
|
+
textAlign: 'center',
|
12575
|
+
border: 0,
|
12576
|
+
'&::before, &::after': {
|
12577
|
+
content: '""',
|
12578
|
+
alignSelf: 'center'
|
12579
|
+
}
|
12580
|
+
}), ({
|
12581
|
+
theme,
|
12582
|
+
ownerState
|
12583
|
+
}) => _extends$3({}, ownerState.children && ownerState.orientation !== 'vertical' && {
|
12584
|
+
'&::before, &::after': {
|
12585
|
+
width: '100%',
|
12586
|
+
borderTop: `thin solid ${(theme.vars || theme).palette.divider}`
|
12587
|
+
}
|
12588
|
+
}), ({
|
12589
|
+
theme,
|
12590
|
+
ownerState
|
12591
|
+
}) => _extends$3({}, ownerState.children && ownerState.orientation === 'vertical' && {
|
12592
|
+
flexDirection: 'column',
|
12593
|
+
'&::before, &::after': {
|
12594
|
+
height: '100%',
|
12595
|
+
borderLeft: `thin solid ${(theme.vars || theme).palette.divider}`
|
12596
|
+
}
|
12597
|
+
}), ({
|
12598
|
+
ownerState
|
12599
|
+
}) => _extends$3({}, ownerState.textAlign === 'right' && ownerState.orientation !== 'vertical' && {
|
12600
|
+
'&::before': {
|
12601
|
+
width: '90%'
|
12602
|
+
},
|
12603
|
+
'&::after': {
|
12604
|
+
width: '10%'
|
12605
|
+
}
|
12606
|
+
}, ownerState.textAlign === 'left' && ownerState.orientation !== 'vertical' && {
|
12607
|
+
'&::before': {
|
12608
|
+
width: '10%'
|
12609
|
+
},
|
12610
|
+
'&::after': {
|
12611
|
+
width: '90%'
|
12612
|
+
}
|
12613
|
+
}));
|
12614
|
+
const DividerWrapper = styled$1('span', {
|
12615
|
+
name: 'MuiDivider',
|
12616
|
+
slot: 'Wrapper',
|
12617
|
+
overridesResolver: (props, styles) => {
|
12618
|
+
const {
|
12619
|
+
ownerState
|
12620
|
+
} = props;
|
12621
|
+
return [styles.wrapper, ownerState.orientation === 'vertical' && styles.wrapperVertical];
|
12622
|
+
}
|
12623
|
+
})(({
|
12624
|
+
theme,
|
12625
|
+
ownerState
|
12626
|
+
}) => _extends$3({
|
12627
|
+
display: 'inline-block',
|
12628
|
+
paddingLeft: `calc(${theme.spacing(1)} * 1.2)`,
|
12629
|
+
paddingRight: `calc(${theme.spacing(1)} * 1.2)`
|
12630
|
+
}, ownerState.orientation === 'vertical' && {
|
12631
|
+
paddingTop: `calc(${theme.spacing(1)} * 1.2)`,
|
12632
|
+
paddingBottom: `calc(${theme.spacing(1)} * 1.2)`
|
12633
|
+
}));
|
12634
|
+
const Divider = /*#__PURE__*/React.forwardRef(function Divider(inProps, ref) {
|
12635
|
+
const props = useThemeProps({
|
12636
|
+
props: inProps,
|
12637
|
+
name: 'MuiDivider'
|
12638
|
+
});
|
12639
|
+
const {
|
12640
|
+
absolute = false,
|
12641
|
+
children,
|
12642
|
+
className,
|
12643
|
+
component = children ? 'div' : 'hr',
|
12644
|
+
flexItem = false,
|
12645
|
+
light = false,
|
12646
|
+
orientation = 'horizontal',
|
12647
|
+
role = component !== 'hr' ? 'separator' : undefined,
|
12648
|
+
textAlign = 'center',
|
12649
|
+
variant = 'fullWidth'
|
12650
|
+
} = props,
|
12651
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$4);
|
12652
|
+
const ownerState = _extends$3({}, props, {
|
12653
|
+
absolute,
|
12654
|
+
component,
|
12655
|
+
flexItem,
|
12656
|
+
light,
|
12657
|
+
orientation,
|
12658
|
+
role,
|
12659
|
+
textAlign,
|
12660
|
+
variant
|
12661
|
+
});
|
12662
|
+
const classes = useUtilityClasses$3(ownerState);
|
12663
|
+
return /*#__PURE__*/jsx(DividerRoot, _extends$3({
|
12664
|
+
as: component,
|
12665
|
+
className: clsx(classes.root, className),
|
12666
|
+
role: role,
|
12667
|
+
ref: ref,
|
12668
|
+
ownerState: ownerState
|
12669
|
+
}, other, {
|
12670
|
+
children: children ? /*#__PURE__*/jsx(DividerWrapper, {
|
12671
|
+
className: classes.wrapper,
|
12672
|
+
ownerState: ownerState,
|
12673
|
+
children: children
|
12674
|
+
}) : null
|
12675
|
+
}));
|
12676
|
+
});
|
12677
|
+
|
12678
|
+
/**
|
12679
|
+
* The following flag is used to ensure that this component isn't tabbable i.e.
|
12680
|
+
* does not get highlight/focus inside of MUI List.
|
12681
|
+
*/
|
12682
|
+
Divider.muiSkipListHighlight = true;
|
12683
|
+
process.env.NODE_ENV !== "production" ? Divider.propTypes /* remove-proptypes */ = {
|
12684
|
+
// ----------------------------- Warning --------------------------------
|
12685
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
12686
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
12687
|
+
// ----------------------------------------------------------------------
|
12688
|
+
/**
|
12689
|
+
* Absolutely position the element.
|
12690
|
+
* @default false
|
12691
|
+
*/
|
12692
|
+
absolute: PropTypes.bool,
|
12693
|
+
/**
|
12694
|
+
* The content of the component.
|
12695
|
+
*/
|
12696
|
+
children: PropTypes.node,
|
12697
|
+
/**
|
12698
|
+
* Override or extend the styles applied to the component.
|
12699
|
+
*/
|
12700
|
+
classes: PropTypes.object,
|
12701
|
+
/**
|
12702
|
+
* @ignore
|
12703
|
+
*/
|
12704
|
+
className: PropTypes.string,
|
12705
|
+
/**
|
12706
|
+
* The component used for the root node.
|
12707
|
+
* Either a string to use a HTML element or a component.
|
12708
|
+
*/
|
12709
|
+
component: PropTypes.elementType,
|
12710
|
+
/**
|
12711
|
+
* If `true`, a vertical divider will have the correct height when used in flex container.
|
12712
|
+
* (By default, a vertical divider will have a calculated height of `0px` if it is the child of a flex container.)
|
12713
|
+
* @default false
|
12714
|
+
*/
|
12715
|
+
flexItem: PropTypes.bool,
|
12716
|
+
/**
|
12717
|
+
* If `true`, the divider will have a lighter color.
|
12718
|
+
* @default false
|
12719
|
+
*/
|
12720
|
+
light: PropTypes.bool,
|
12721
|
+
/**
|
12722
|
+
* The component orientation.
|
12723
|
+
* @default 'horizontal'
|
12724
|
+
*/
|
12725
|
+
orientation: PropTypes.oneOf(['horizontal', 'vertical']),
|
12726
|
+
/**
|
12727
|
+
* @ignore
|
12728
|
+
*/
|
12729
|
+
role: PropTypes /* @typescript-to-proptypes-ignore */.string,
|
12730
|
+
/**
|
12731
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
12732
|
+
*/
|
12733
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
12734
|
+
/**
|
12735
|
+
* The text alignment.
|
12736
|
+
* @default 'center'
|
12737
|
+
*/
|
12738
|
+
textAlign: PropTypes.oneOf(['center', 'left', 'right']),
|
12739
|
+
/**
|
12740
|
+
* The variant to use.
|
12741
|
+
* @default 'fullWidth'
|
12742
|
+
*/
|
12743
|
+
variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['fullWidth', 'inset', 'middle']), PropTypes.string])
|
12744
|
+
} : void 0;
|
12745
|
+
var Divider$1 = Divider;
|
12746
|
+
|
12747
|
+
const _excluded$3 = ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
|
12748
|
+
function getTranslateValue(direction, node, resolvedContainer) {
|
12749
|
+
const rect = node.getBoundingClientRect();
|
12750
|
+
const containerRect = resolvedContainer && resolvedContainer.getBoundingClientRect();
|
12751
|
+
const containerWindow = ownerWindow(node);
|
12752
|
+
let transform;
|
12753
|
+
if (node.fakeTransform) {
|
12754
|
+
transform = node.fakeTransform;
|
12755
|
+
} else {
|
12756
|
+
const computedStyle = containerWindow.getComputedStyle(node);
|
12757
|
+
transform = computedStyle.getPropertyValue('-webkit-transform') || computedStyle.getPropertyValue('transform');
|
12758
|
+
}
|
12123
12759
|
let offsetX = 0;
|
12124
12760
|
let offsetY = 0;
|
12125
12761
|
if (transform && transform !== 'none' && typeof transform === 'string') {
|
@@ -12197,7 +12833,7 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
|
|
12197
12833
|
// eslint-disable-next-line react/prop-types
|
12198
12834
|
TransitionComponent = Transition$1
|
12199
12835
|
} = props,
|
12200
|
-
other = _objectWithoutPropertiesLoose$3(props, _excluded$
|
12836
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$3);
|
12201
12837
|
const childrenRef = React.useRef(null);
|
12202
12838
|
const handleRef = useForkRef(children.ref, childrenRef, ref);
|
12203
12839
|
const normalizedTransitionCallback = callback => isAppearing => {
|
@@ -12425,7 +13061,7 @@ function getDrawerUtilityClass(slot) {
|
|
12425
13061
|
}
|
12426
13062
|
generateUtilityClasses('MuiDrawer', ['root', 'docked', 'paper', 'paperAnchorLeft', 'paperAnchorRight', 'paperAnchorTop', 'paperAnchorBottom', 'paperAnchorDockedLeft', 'paperAnchorDockedRight', 'paperAnchorDockedTop', 'paperAnchorDockedBottom', 'modal']);
|
12427
13063
|
|
12428
|
-
const _excluded$
|
13064
|
+
const _excluded$2 = ["BackdropProps"],
|
12429
13065
|
_excluded2 = ["anchor", "BackdropProps", "children", "className", "elevation", "hideBackdrop", "ModalProps", "onClose", "open", "PaperProps", "SlideProps", "TransitionComponent", "transitionDuration", "variant"];
|
12430
13066
|
const overridesResolver = (props, styles) => {
|
12431
13067
|
const {
|
@@ -12433,7 +13069,7 @@ const overridesResolver = (props, styles) => {
|
|
12433
13069
|
} = props;
|
12434
13070
|
return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, styles.modal];
|
12435
13071
|
};
|
12436
|
-
const useUtilityClasses$
|
13072
|
+
const useUtilityClasses$2 = ownerState => {
|
12437
13073
|
const {
|
12438
13074
|
classes,
|
12439
13075
|
anchor,
|
@@ -12565,7 +13201,7 @@ const Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {
|
|
12565
13201
|
transitionDuration = defaultTransitionDuration,
|
12566
13202
|
variant = 'temporary'
|
12567
13203
|
} = props,
|
12568
|
-
ModalProps = _objectWithoutPropertiesLoose$3(props.ModalProps, _excluded$
|
13204
|
+
ModalProps = _objectWithoutPropertiesLoose$3(props.ModalProps, _excluded$2),
|
12569
13205
|
other = _objectWithoutPropertiesLoose$3(props, _excluded2);
|
12570
13206
|
|
12571
13207
|
// Let's assume that the Drawer will always be rendered on user space.
|
@@ -12583,7 +13219,7 @@ const Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {
|
|
12583
13219
|
open,
|
12584
13220
|
variant
|
12585
13221
|
}, other);
|
12586
|
-
const classes = useUtilityClasses$
|
13222
|
+
const classes = useUtilityClasses$2(ownerState);
|
12587
13223
|
const drawer = /*#__PURE__*/jsx(DrawerPaper, _extends$3({
|
12588
13224
|
elevation: variant === 'temporary' ? elevation : 0,
|
12589
13225
|
square: true
|
@@ -12779,6 +13415,346 @@ process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ =
|
|
12779
13415
|
} : void 0;
|
12780
13416
|
var Stack$1 = Stack;
|
12781
13417
|
|
13418
|
+
function getLinearProgressUtilityClass(slot) {
|
13419
|
+
return generateUtilityClass('MuiLinearProgress', slot);
|
13420
|
+
}
|
13421
|
+
generateUtilityClasses('MuiLinearProgress', ['root', 'colorPrimary', 'colorSecondary', 'determinate', 'indeterminate', 'buffer', 'query', 'dashed', 'dashedColorPrimary', 'dashedColorSecondary', 'bar', 'barColorPrimary', 'barColorSecondary', 'bar1Indeterminate', 'bar1Determinate', 'bar1Buffer', 'bar2Indeterminate', 'bar2Buffer']);
|
13422
|
+
|
13423
|
+
const _excluded$1 = ["className", "color", "value", "valueBuffer", "variant"];
|
13424
|
+
let _ = t => t,
|
13425
|
+
_t,
|
13426
|
+
_t2,
|
13427
|
+
_t3,
|
13428
|
+
_t4,
|
13429
|
+
_t5,
|
13430
|
+
_t6;
|
13431
|
+
const TRANSITION_DURATION = 4; // seconds
|
13432
|
+
const indeterminate1Keyframe = keyframes(_t || (_t = _`
|
13433
|
+
0% {
|
13434
|
+
left: -35%;
|
13435
|
+
right: 100%;
|
13436
|
+
}
|
13437
|
+
|
13438
|
+
60% {
|
13439
|
+
left: 100%;
|
13440
|
+
right: -90%;
|
13441
|
+
}
|
13442
|
+
|
13443
|
+
100% {
|
13444
|
+
left: 100%;
|
13445
|
+
right: -90%;
|
13446
|
+
}
|
13447
|
+
`));
|
13448
|
+
const indeterminate2Keyframe = keyframes(_t2 || (_t2 = _`
|
13449
|
+
0% {
|
13450
|
+
left: -200%;
|
13451
|
+
right: 100%;
|
13452
|
+
}
|
13453
|
+
|
13454
|
+
60% {
|
13455
|
+
left: 107%;
|
13456
|
+
right: -8%;
|
13457
|
+
}
|
13458
|
+
|
13459
|
+
100% {
|
13460
|
+
left: 107%;
|
13461
|
+
right: -8%;
|
13462
|
+
}
|
13463
|
+
`));
|
13464
|
+
const bufferKeyframe = keyframes(_t3 || (_t3 = _`
|
13465
|
+
0% {
|
13466
|
+
opacity: 1;
|
13467
|
+
background-position: 0 -23px;
|
13468
|
+
}
|
13469
|
+
|
13470
|
+
60% {
|
13471
|
+
opacity: 0;
|
13472
|
+
background-position: 0 -23px;
|
13473
|
+
}
|
13474
|
+
|
13475
|
+
100% {
|
13476
|
+
opacity: 1;
|
13477
|
+
background-position: -200px -23px;
|
13478
|
+
}
|
13479
|
+
`));
|
13480
|
+
const useUtilityClasses$1 = ownerState => {
|
13481
|
+
const {
|
13482
|
+
classes,
|
13483
|
+
variant,
|
13484
|
+
color
|
13485
|
+
} = ownerState;
|
13486
|
+
const slots = {
|
13487
|
+
root: ['root', `color${capitalize(color)}`, variant],
|
13488
|
+
dashed: ['dashed', `dashedColor${capitalize(color)}`],
|
13489
|
+
bar1: ['bar', `barColor${capitalize(color)}`, (variant === 'indeterminate' || variant === 'query') && 'bar1Indeterminate', variant === 'determinate' && 'bar1Determinate', variant === 'buffer' && 'bar1Buffer'],
|
13490
|
+
bar2: ['bar', variant !== 'buffer' && `barColor${capitalize(color)}`, variant === 'buffer' && `color${capitalize(color)}`, (variant === 'indeterminate' || variant === 'query') && 'bar2Indeterminate', variant === 'buffer' && 'bar2Buffer']
|
13491
|
+
};
|
13492
|
+
return composeClasses(slots, getLinearProgressUtilityClass, classes);
|
13493
|
+
};
|
13494
|
+
const getColorShade = (theme, color) => {
|
13495
|
+
if (color === 'inherit') {
|
13496
|
+
return 'currentColor';
|
13497
|
+
}
|
13498
|
+
if (theme.vars) {
|
13499
|
+
return theme.vars.palette.LinearProgress[`${color}Bg`];
|
13500
|
+
}
|
13501
|
+
return theme.palette.mode === 'light' ? lighten(theme.palette[color].main, 0.62) : darken(theme.palette[color].main, 0.5);
|
13502
|
+
};
|
13503
|
+
const LinearProgressRoot = styled$1('span', {
|
13504
|
+
name: 'MuiLinearProgress',
|
13505
|
+
slot: 'Root',
|
13506
|
+
overridesResolver: (props, styles) => {
|
13507
|
+
const {
|
13508
|
+
ownerState
|
13509
|
+
} = props;
|
13510
|
+
return [styles.root, styles[`color${capitalize(ownerState.color)}`], styles[ownerState.variant]];
|
13511
|
+
}
|
13512
|
+
})(({
|
13513
|
+
ownerState,
|
13514
|
+
theme
|
13515
|
+
}) => _extends$3({
|
13516
|
+
position: 'relative',
|
13517
|
+
overflow: 'hidden',
|
13518
|
+
display: 'block',
|
13519
|
+
height: 4,
|
13520
|
+
zIndex: 0,
|
13521
|
+
// Fix Safari's bug during composition of different paint.
|
13522
|
+
'@media print': {
|
13523
|
+
colorAdjust: 'exact'
|
13524
|
+
},
|
13525
|
+
backgroundColor: getColorShade(theme, ownerState.color)
|
13526
|
+
}, ownerState.color === 'inherit' && ownerState.variant !== 'buffer' && {
|
13527
|
+
backgroundColor: 'none',
|
13528
|
+
'&::before': {
|
13529
|
+
content: '""',
|
13530
|
+
position: 'absolute',
|
13531
|
+
left: 0,
|
13532
|
+
top: 0,
|
13533
|
+
right: 0,
|
13534
|
+
bottom: 0,
|
13535
|
+
backgroundColor: 'currentColor',
|
13536
|
+
opacity: 0.3
|
13537
|
+
}
|
13538
|
+
}, ownerState.variant === 'buffer' && {
|
13539
|
+
backgroundColor: 'transparent'
|
13540
|
+
}, ownerState.variant === 'query' && {
|
13541
|
+
transform: 'rotate(180deg)'
|
13542
|
+
}));
|
13543
|
+
const LinearProgressDashed = styled$1('span', {
|
13544
|
+
name: 'MuiLinearProgress',
|
13545
|
+
slot: 'Dashed',
|
13546
|
+
overridesResolver: (props, styles) => {
|
13547
|
+
const {
|
13548
|
+
ownerState
|
13549
|
+
} = props;
|
13550
|
+
return [styles.dashed, styles[`dashedColor${capitalize(ownerState.color)}`]];
|
13551
|
+
}
|
13552
|
+
})(({
|
13553
|
+
ownerState,
|
13554
|
+
theme
|
13555
|
+
}) => {
|
13556
|
+
const backgroundColor = getColorShade(theme, ownerState.color);
|
13557
|
+
return _extends$3({
|
13558
|
+
position: 'absolute',
|
13559
|
+
marginTop: 0,
|
13560
|
+
height: '100%',
|
13561
|
+
width: '100%'
|
13562
|
+
}, ownerState.color === 'inherit' && {
|
13563
|
+
opacity: 0.3
|
13564
|
+
}, {
|
13565
|
+
backgroundImage: `radial-gradient(${backgroundColor} 0%, ${backgroundColor} 16%, transparent 42%)`,
|
13566
|
+
backgroundSize: '10px 10px',
|
13567
|
+
backgroundPosition: '0 -23px'
|
13568
|
+
});
|
13569
|
+
}, css(_t4 || (_t4 = _`
|
13570
|
+
animation: ${0} 3s infinite linear;
|
13571
|
+
`), bufferKeyframe));
|
13572
|
+
const LinearProgressBar1 = styled$1('span', {
|
13573
|
+
name: 'MuiLinearProgress',
|
13574
|
+
slot: 'Bar1',
|
13575
|
+
overridesResolver: (props, styles) => {
|
13576
|
+
const {
|
13577
|
+
ownerState
|
13578
|
+
} = props;
|
13579
|
+
return [styles.bar, styles[`barColor${capitalize(ownerState.color)}`], (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && styles.bar1Indeterminate, ownerState.variant === 'determinate' && styles.bar1Determinate, ownerState.variant === 'buffer' && styles.bar1Buffer];
|
13580
|
+
}
|
13581
|
+
})(({
|
13582
|
+
ownerState,
|
13583
|
+
theme
|
13584
|
+
}) => _extends$3({
|
13585
|
+
width: '100%',
|
13586
|
+
position: 'absolute',
|
13587
|
+
left: 0,
|
13588
|
+
bottom: 0,
|
13589
|
+
top: 0,
|
13590
|
+
transition: 'transform 0.2s linear',
|
13591
|
+
transformOrigin: 'left',
|
13592
|
+
backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main
|
13593
|
+
}, ownerState.variant === 'determinate' && {
|
13594
|
+
transition: `transform .${TRANSITION_DURATION}s linear`
|
13595
|
+
}, ownerState.variant === 'buffer' && {
|
13596
|
+
zIndex: 1,
|
13597
|
+
transition: `transform .${TRANSITION_DURATION}s linear`
|
13598
|
+
}), ({
|
13599
|
+
ownerState
|
13600
|
+
}) => (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && css(_t5 || (_t5 = _`
|
13601
|
+
width: auto;
|
13602
|
+
animation: ${0} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
|
13603
|
+
`), indeterminate1Keyframe));
|
13604
|
+
const LinearProgressBar2 = styled$1('span', {
|
13605
|
+
name: 'MuiLinearProgress',
|
13606
|
+
slot: 'Bar2',
|
13607
|
+
overridesResolver: (props, styles) => {
|
13608
|
+
const {
|
13609
|
+
ownerState
|
13610
|
+
} = props;
|
13611
|
+
return [styles.bar, styles[`barColor${capitalize(ownerState.color)}`], (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && styles.bar2Indeterminate, ownerState.variant === 'buffer' && styles.bar2Buffer];
|
13612
|
+
}
|
13613
|
+
})(({
|
13614
|
+
ownerState,
|
13615
|
+
theme
|
13616
|
+
}) => _extends$3({
|
13617
|
+
width: '100%',
|
13618
|
+
position: 'absolute',
|
13619
|
+
left: 0,
|
13620
|
+
bottom: 0,
|
13621
|
+
top: 0,
|
13622
|
+
transition: 'transform 0.2s linear',
|
13623
|
+
transformOrigin: 'left'
|
13624
|
+
}, ownerState.variant !== 'buffer' && {
|
13625
|
+
backgroundColor: ownerState.color === 'inherit' ? 'currentColor' : (theme.vars || theme).palette[ownerState.color].main
|
13626
|
+
}, ownerState.color === 'inherit' && {
|
13627
|
+
opacity: 0.3
|
13628
|
+
}, ownerState.variant === 'buffer' && {
|
13629
|
+
backgroundColor: getColorShade(theme, ownerState.color),
|
13630
|
+
transition: `transform .${TRANSITION_DURATION}s linear`
|
13631
|
+
}), ({
|
13632
|
+
ownerState
|
13633
|
+
}) => (ownerState.variant === 'indeterminate' || ownerState.variant === 'query') && css(_t6 || (_t6 = _`
|
13634
|
+
width: auto;
|
13635
|
+
animation: ${0} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;
|
13636
|
+
`), indeterminate2Keyframe));
|
13637
|
+
|
13638
|
+
/**
|
13639
|
+
* ## ARIA
|
13640
|
+
*
|
13641
|
+
* If the progress bar is describing the loading progress of a particular region of a page,
|
13642
|
+
* you should use `aria-describedby` to point to the progress bar, and set the `aria-busy`
|
13643
|
+
* attribute to `true` on that region until it has finished loading.
|
13644
|
+
*/
|
13645
|
+
const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inProps, ref) {
|
13646
|
+
const props = useThemeProps({
|
13647
|
+
props: inProps,
|
13648
|
+
name: 'MuiLinearProgress'
|
13649
|
+
});
|
13650
|
+
const {
|
13651
|
+
className,
|
13652
|
+
color = 'primary',
|
13653
|
+
value,
|
13654
|
+
valueBuffer,
|
13655
|
+
variant = 'indeterminate'
|
13656
|
+
} = props,
|
13657
|
+
other = _objectWithoutPropertiesLoose$3(props, _excluded$1);
|
13658
|
+
const ownerState = _extends$3({}, props, {
|
13659
|
+
color,
|
13660
|
+
variant
|
13661
|
+
});
|
13662
|
+
const classes = useUtilityClasses$1(ownerState);
|
13663
|
+
const theme = useTheme();
|
13664
|
+
const rootProps = {};
|
13665
|
+
const inlineStyles = {
|
13666
|
+
bar1: {},
|
13667
|
+
bar2: {}
|
13668
|
+
};
|
13669
|
+
if (variant === 'determinate' || variant === 'buffer') {
|
13670
|
+
if (value !== undefined) {
|
13671
|
+
rootProps['aria-valuenow'] = Math.round(value);
|
13672
|
+
rootProps['aria-valuemin'] = 0;
|
13673
|
+
rootProps['aria-valuemax'] = 100;
|
13674
|
+
let transform = value - 100;
|
13675
|
+
if (theme.direction === 'rtl') {
|
13676
|
+
transform = -transform;
|
13677
|
+
}
|
13678
|
+
inlineStyles.bar1.transform = `translateX(${transform}%)`;
|
13679
|
+
} else if (process.env.NODE_ENV !== 'production') {
|
13680
|
+
console.error('MUI: You need to provide a value prop ' + 'when using the determinate or buffer variant of LinearProgress .');
|
13681
|
+
}
|
13682
|
+
}
|
13683
|
+
if (variant === 'buffer') {
|
13684
|
+
if (valueBuffer !== undefined) {
|
13685
|
+
let transform = (valueBuffer || 0) - 100;
|
13686
|
+
if (theme.direction === 'rtl') {
|
13687
|
+
transform = -transform;
|
13688
|
+
}
|
13689
|
+
inlineStyles.bar2.transform = `translateX(${transform}%)`;
|
13690
|
+
} else if (process.env.NODE_ENV !== 'production') {
|
13691
|
+
console.error('MUI: You need to provide a valueBuffer prop ' + 'when using the buffer variant of LinearProgress.');
|
13692
|
+
}
|
13693
|
+
}
|
13694
|
+
return /*#__PURE__*/jsxs(LinearProgressRoot, _extends$3({
|
13695
|
+
className: clsx(classes.root, className),
|
13696
|
+
ownerState: ownerState,
|
13697
|
+
role: "progressbar"
|
13698
|
+
}, rootProps, {
|
13699
|
+
ref: ref
|
13700
|
+
}, other, {
|
13701
|
+
children: [variant === 'buffer' ? /*#__PURE__*/jsx(LinearProgressDashed, {
|
13702
|
+
className: classes.dashed,
|
13703
|
+
ownerState: ownerState
|
13704
|
+
}) : null, /*#__PURE__*/jsx(LinearProgressBar1, {
|
13705
|
+
className: classes.bar1,
|
13706
|
+
ownerState: ownerState,
|
13707
|
+
style: inlineStyles.bar1
|
13708
|
+
}), variant === 'determinate' ? null : /*#__PURE__*/jsx(LinearProgressBar2, {
|
13709
|
+
className: classes.bar2,
|
13710
|
+
ownerState: ownerState,
|
13711
|
+
style: inlineStyles.bar2
|
13712
|
+
})]
|
13713
|
+
}));
|
13714
|
+
});
|
13715
|
+
process.env.NODE_ENV !== "production" ? LinearProgress.propTypes /* remove-proptypes */ = {
|
13716
|
+
// ----------------------------- Warning --------------------------------
|
13717
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
13718
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
13719
|
+
// ----------------------------------------------------------------------
|
13720
|
+
/**
|
13721
|
+
* Override or extend the styles applied to the component.
|
13722
|
+
*/
|
13723
|
+
classes: PropTypes.object,
|
13724
|
+
/**
|
13725
|
+
* @ignore
|
13726
|
+
*/
|
13727
|
+
className: PropTypes.string,
|
13728
|
+
/**
|
13729
|
+
* The color of the component.
|
13730
|
+
* It supports both default and custom theme colors, which can be added as shown in the
|
13731
|
+
* [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
|
13732
|
+
* @default 'primary'
|
13733
|
+
*/
|
13734
|
+
color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary']), PropTypes.string]),
|
13735
|
+
/**
|
13736
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
13737
|
+
*/
|
13738
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
13739
|
+
/**
|
13740
|
+
* The value of the progress indicator for the determinate and buffer variants.
|
13741
|
+
* Value between 0 and 100.
|
13742
|
+
*/
|
13743
|
+
value: PropTypes.number,
|
13744
|
+
/**
|
13745
|
+
* The value for the buffer variant.
|
13746
|
+
* Value between 0 and 100.
|
13747
|
+
*/
|
13748
|
+
valueBuffer: PropTypes.number,
|
13749
|
+
/**
|
13750
|
+
* The variant to use.
|
13751
|
+
* Use indeterminate or query when there is no progress value.
|
13752
|
+
* @default 'indeterminate'
|
13753
|
+
*/
|
13754
|
+
variant: PropTypes.oneOf(['buffer', 'determinate', 'indeterminate', 'query'])
|
13755
|
+
} : void 0;
|
13756
|
+
var LinearProgress$1 = LinearProgress;
|
13757
|
+
|
12782
13758
|
function getToolbarUtilityClass(slot) {
|
12783
13759
|
return generateUtilityClass('MuiToolbar', slot);
|
12784
13760
|
}
|
@@ -13579,6 +14555,168 @@ const FooterActionComponent = ({
|
|
13579
14555
|
}), /*#__PURE__*/React__default.createElement(Box$2, null, labelChangeCounter), renderRightContent));
|
13580
14556
|
};
|
13581
14557
|
|
14558
|
+
const useProgress = timeProgress => {
|
14559
|
+
const [progress, setProgress] = useState(100);
|
14560
|
+
useEffect(() => {
|
14561
|
+
const interval = setInterval(() => {
|
14562
|
+
setProgress(prev => {
|
14563
|
+
if (prev <= 0) {
|
14564
|
+
clearInterval(interval);
|
14565
|
+
}
|
14566
|
+
return prev - 1;
|
14567
|
+
});
|
14568
|
+
}, timeProgress * 10);
|
14569
|
+
return () => {
|
14570
|
+
clearInterval(interval);
|
14571
|
+
};
|
14572
|
+
}, [timeProgress]);
|
14573
|
+
return {
|
14574
|
+
progressToast: progress
|
14575
|
+
};
|
14576
|
+
};
|
14577
|
+
|
14578
|
+
const ToastNotificationComponent = toast => {
|
14579
|
+
const [stateOptions, setStateOptions] = useState(true);
|
14580
|
+
const [stateToast, setStateToast] = useState(true);
|
14581
|
+
const timeProgress = toast.time || 10;
|
14582
|
+
const {
|
14583
|
+
progressToast
|
14584
|
+
} = useProgress(timeProgress);
|
14585
|
+
const toastColorConfig = toast.type || "info";
|
14586
|
+
const toastIconOption = {
|
14587
|
+
success: /*#__PURE__*/React__default.createElement(CheckCircleRounded, null),
|
14588
|
+
error: /*#__PURE__*/React__default.createElement(ErrorRounded, null),
|
14589
|
+
warning: /*#__PURE__*/React__default.createElement(WarningRounded, null),
|
14590
|
+
info: /*#__PURE__*/React__default.createElement(InfoRounded, null)
|
14591
|
+
};
|
14592
|
+
const ToastIconConfig = toastIconOption[toast.type || "info"];
|
14593
|
+
const closeToast = () => {
|
14594
|
+
setStateToast(false);
|
14595
|
+
};
|
14596
|
+
const toggleToastOptions = () => {
|
14597
|
+
setStateOptions(prevShowOptions => !prevShowOptions);
|
14598
|
+
};
|
14599
|
+
useEffect(() => {
|
14600
|
+
progressToast <= 0 && setStateToast(false);
|
14601
|
+
}, [progressToast]);
|
14602
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, stateToast && /*#__PURE__*/React__default.createElement(Stack$1, {
|
14603
|
+
position: "fixed",
|
14604
|
+
zIndex: 1400,
|
14605
|
+
right: 16,
|
14606
|
+
top: 16,
|
14607
|
+
width: 370,
|
14608
|
+
sx: {
|
14609
|
+
boxShadow: theme => theme.shadows[8]
|
14610
|
+
}
|
14611
|
+
}, /*#__PURE__*/React__default.createElement(Box$2, {
|
14612
|
+
padding: 1.5,
|
14613
|
+
gap: 1.5,
|
14614
|
+
display: "flex",
|
14615
|
+
alignItems: "center",
|
14616
|
+
sx: {
|
14617
|
+
"&.color-error": {
|
14618
|
+
backgroundColor: "#FEEBEE"
|
14619
|
+
},
|
14620
|
+
"&.color-info": {
|
14621
|
+
backgroundColor: "#E1F5FE"
|
14622
|
+
},
|
14623
|
+
"&.color-warning": {
|
14624
|
+
backgroundColor: "#FFF3E0"
|
14625
|
+
},
|
14626
|
+
"&.color-success": {
|
14627
|
+
backgroundColor: "#E8F5E9"
|
14628
|
+
}
|
14629
|
+
},
|
14630
|
+
className: `color-${toastColorConfig}`
|
14631
|
+
}, /*#__PURE__*/React__default.createElement(Stack$1, {
|
14632
|
+
p: 1,
|
14633
|
+
gap: 1,
|
14634
|
+
height: 20,
|
14635
|
+
borderRadius: 50,
|
14636
|
+
sx: {
|
14637
|
+
"&.ripple-error": {
|
14638
|
+
backgroundColor: "#D143431F"
|
14639
|
+
},
|
14640
|
+
"&.ripple-info": {
|
14641
|
+
backgroundColor: "#2D9FC51F"
|
14642
|
+
},
|
14643
|
+
"&.ripple-warning": {
|
14644
|
+
backgroundColor: "#FB85001F"
|
14645
|
+
},
|
14646
|
+
"&.ripple-success": {
|
14647
|
+
backgroundColor: "#8FC93A1F"
|
14648
|
+
}
|
14649
|
+
},
|
14650
|
+
className: `ripple-${toast.type || "info"}`
|
14651
|
+
}, /*#__PURE__*/React__default.createElement(Stack$1, {
|
14652
|
+
sx: {
|
14653
|
+
"&.icon-color.color-info": {
|
14654
|
+
color: theme => theme.palette.info.main
|
14655
|
+
},
|
14656
|
+
"&.icon-color.color-error": {
|
14657
|
+
color: theme => theme.palette.error.main
|
14658
|
+
},
|
14659
|
+
"&.icon-color.color-warning": {
|
14660
|
+
color: theme => theme.palette.warning.main
|
14661
|
+
},
|
14662
|
+
"&.icon-color.color-success": {
|
14663
|
+
color: theme => theme.palette.success.main
|
14664
|
+
}
|
14665
|
+
},
|
14666
|
+
className: `icon-color color-${toast.type || "info"}`
|
14667
|
+
}, ToastIconConfig)), /*#__PURE__*/React__default.createElement(Divider$1, {
|
14668
|
+
orientation: "vertical",
|
14669
|
+
flexItem: true
|
14670
|
+
}), /*#__PURE__*/React__default.createElement(Stack$1, {
|
14671
|
+
width: 285
|
14672
|
+
}, /*#__PURE__*/React__default.createElement(Stack$1, {
|
14673
|
+
justifyContent: "space-between",
|
14674
|
+
flexDirection: "row",
|
14675
|
+
alignItems: "center"
|
14676
|
+
}, /*#__PURE__*/React__default.createElement(Typography$1, {
|
14677
|
+
variant: "subtitle2",
|
14678
|
+
color: "text.primary"
|
14679
|
+
}, toast.title), /*#__PURE__*/React__default.createElement(IconButton$1, {
|
14680
|
+
size: "small",
|
14681
|
+
onClick: closeToast
|
14682
|
+
}, /*#__PURE__*/React__default.createElement(Close, {
|
14683
|
+
fontSize: "small"
|
14684
|
+
}))), /*#__PURE__*/React__default.createElement(Stack$1, {
|
14685
|
+
gap: 0.5
|
14686
|
+
}, /*#__PURE__*/React__default.createElement(Typography$1, {
|
14687
|
+
color: "text.primary",
|
14688
|
+
variant: "body2"
|
14689
|
+
}, toast.subtitle), !stateOptions && toast.dataOpt && toast.dataOpt.length > 0 && /*#__PURE__*/React__default.createElement(Stack$1, null, toast.dataOpt.map((element, i) => /*#__PURE__*/React__default.createElement(Typography$1, {
|
14690
|
+
variant: "caption",
|
14691
|
+
key: i
|
14692
|
+
}, "\u2022 ", element)))), /*#__PURE__*/React__default.createElement(Stack$1, {
|
14693
|
+
justifyContent: "flex-end",
|
14694
|
+
flexDirection: "row"
|
14695
|
+
}, toast.actions && /*#__PURE__*/React__default.createElement(Stack$1, {
|
14696
|
+
flexDirection: "row",
|
14697
|
+
gap: 1
|
14698
|
+
}, toast.actions), toast.seeMore && /*#__PURE__*/React__default.createElement(Button$1, {
|
14699
|
+
onClick: toggleToastOptions,
|
14700
|
+
size: "small",
|
14701
|
+
variant: "text",
|
14702
|
+
color: toastColorConfig
|
14703
|
+
}, stateOptions ? "Ver más" : "Ver menos", stateOptions ? /*#__PURE__*/React__default.createElement(KeyboardArrowDown, null) : /*#__PURE__*/React__default.createElement(KeyboardArrowUp, null))))), /*#__PURE__*/React__default.createElement(LinearProgress$1, {
|
14704
|
+
color: toastColorConfig,
|
14705
|
+
variant: "determinate",
|
14706
|
+
value: progressToast
|
14707
|
+
})));
|
14708
|
+
};
|
14709
|
+
|
14710
|
+
function PageHeaderWrapper({
|
14711
|
+
item,
|
14712
|
+
color,
|
14713
|
+
variant
|
14714
|
+
}) {
|
14715
|
+
return /*#__PURE__*/React__default.createElement(Typography$1, {
|
14716
|
+
variant: variant,
|
14717
|
+
color: color
|
14718
|
+
}, item);
|
14719
|
+
}
|
13582
14720
|
const PageHeaderComponent = ({
|
13583
14721
|
title,
|
13584
14722
|
subtitle,
|
@@ -13604,17 +14742,19 @@ const PageHeaderComponent = ({
|
|
13604
14742
|
gap: 1.5,
|
13605
14743
|
flexDirection: "row",
|
13606
14744
|
alignItems: "center"
|
13607
|
-
}, buttonBack, /*#__PURE__*/React__default.createElement(Stack$1, null, /*#__PURE__*/React__default.createElement(Stack$1, null, /*#__PURE__*/React__default.createElement(
|
13608
|
-
|
13609
|
-
|
13610
|
-
|
14745
|
+
}, buttonBack, /*#__PURE__*/React__default.createElement(Stack$1, null, /*#__PURE__*/React__default.createElement(Stack$1, null, /*#__PURE__*/React__default.createElement(PageHeaderWrapper, {
|
14746
|
+
color: "text.primary",
|
14747
|
+
item: title,
|
14748
|
+
variant: "h6"
|
14749
|
+
})), subtitle && /*#__PURE__*/React__default.createElement(Stack$1, {
|
13611
14750
|
alignItems: "center",
|
13612
14751
|
flexDirection: "row",
|
13613
14752
|
gap: 2
|
13614
|
-
}, /*#__PURE__*/React__default.createElement(
|
13615
|
-
|
13616
|
-
|
13617
|
-
|
14753
|
+
}, /*#__PURE__*/React__default.createElement(PageHeaderWrapper, {
|
14754
|
+
color: "text.secondary",
|
14755
|
+
item: subtitle,
|
14756
|
+
variant: "caption"
|
14757
|
+
})))), actions && /*#__PURE__*/React__default.createElement(Stack$1, {
|
13618
14758
|
gap: 1,
|
13619
14759
|
alignItems: "center",
|
13620
14760
|
flexDirection: "row"
|
@@ -19127,4 +20267,4 @@ const useDynamicColor = url => {
|
|
19127
20267
|
};
|
19128
20268
|
};
|
19129
20269
|
|
19130
|
-
export { AdproSincoTheme, DrawerComponent, DynamicColor, EmptyStateComponent as EmptyState, EmptyStateComponent, EmptyStateImageUrls, FooterActionComponent, PageHeaderComponent, SincoTheme, useDynamicColor };
|
20270
|
+
export { AdproSincoTheme, DrawerComponent, DynamicColor, EmptyStateComponent as EmptyState, EmptyStateComponent, EmptyStateImageUrls, FooterActionComponent, PageHeaderComponent, PageHeaderWrapper, SincoTheme, ToastNotificationComponent, useDynamicColor };
|