@sinco/react 1.0.10-rc.28 → 1.0.10-rc.29
Sign up to get free protection for your applications and to get access to all the features.
- package/index.js +675 -91
- package/package.json +1 -1
- package/src/lib/Components/PageHeader.d.ts +14 -0
package/index.js
CHANGED
@@ -6199,7 +6199,7 @@ const internal_processStyles = (tag, processor) => {
|
|
6199
6199
|
}
|
6200
6200
|
};
|
6201
6201
|
|
6202
|
-
const _excluded$
|
6202
|
+
const _excluded$w = ["values", "unit", "step"];
|
6203
6203
|
const sortBreakpointsValues = values => {
|
6204
6204
|
const breakpointsAsArray = Object.keys(values).map(key => ({
|
6205
6205
|
key,
|
@@ -6234,7 +6234,7 @@ function createBreakpoints(breakpoints) {
|
|
6234
6234
|
unit = 'px',
|
6235
6235
|
step = 5
|
6236
6236
|
} = breakpoints,
|
6237
|
-
other = _objectWithoutPropertiesLoose(breakpoints, _excluded$
|
6237
|
+
other = _objectWithoutPropertiesLoose(breakpoints, _excluded$w);
|
6238
6238
|
const sortedValues = sortBreakpointsValues(values);
|
6239
6239
|
const keys = Object.keys(sortedValues);
|
6240
6240
|
function up(key) {
|
@@ -7318,7 +7318,7 @@ const styleFunctionSx = unstable_createStyleFunctionSx();
|
|
7318
7318
|
styleFunctionSx.filterProps = ['sx'];
|
7319
7319
|
var styleFunctionSx$1 = styleFunctionSx;
|
7320
7320
|
|
7321
|
-
const _excluded$
|
7321
|
+
const _excluded$v = ["breakpoints", "palette", "spacing", "shape"];
|
7322
7322
|
function createTheme$1(options = {}, ...args) {
|
7323
7323
|
const {
|
7324
7324
|
breakpoints: breakpointsInput = {},
|
@@ -7326,7 +7326,7 @@ function createTheme$1(options = {}, ...args) {
|
|
7326
7326
|
spacing: spacingInput,
|
7327
7327
|
shape: shapeInput = {}
|
7328
7328
|
} = options,
|
7329
|
-
other = _objectWithoutPropertiesLoose(options, _excluded$
|
7329
|
+
other = _objectWithoutPropertiesLoose(options, _excluded$v);
|
7330
7330
|
const breakpoints = createBreakpoints(breakpointsInput);
|
7331
7331
|
const spacing = createSpacing(spacingInput);
|
7332
7332
|
let muiTheme = deepmerge({
|
@@ -7364,7 +7364,7 @@ function useTheme$2(defaultTheme = systemDefaultTheme$1) {
|
|
7364
7364
|
return useTheme$3(defaultTheme);
|
7365
7365
|
}
|
7366
7366
|
|
7367
|
-
const _excluded$
|
7367
|
+
const _excluded$u = ["sx"];
|
7368
7368
|
const splitProps = props => {
|
7369
7369
|
var _props$theme$unstable, _props$theme;
|
7370
7370
|
const result = {
|
@@ -7385,7 +7385,7 @@ function extendSxProp(props) {
|
|
7385
7385
|
const {
|
7386
7386
|
sx: inSx
|
7387
7387
|
} = props,
|
7388
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
7388
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$u);
|
7389
7389
|
const {
|
7390
7390
|
systemProps,
|
7391
7391
|
otherProps
|
@@ -7411,7 +7411,7 @@ function extendSxProp(props) {
|
|
7411
7411
|
|
7412
7412
|
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}
|
7413
7413
|
|
7414
|
-
const _excluded$
|
7414
|
+
const _excluded$t = ["className", "component"];
|
7415
7415
|
function createBox(options = {}) {
|
7416
7416
|
const {
|
7417
7417
|
themeId,
|
@@ -7429,7 +7429,7 @@ function createBox(options = {}) {
|
|
7429
7429
|
className,
|
7430
7430
|
component = 'div'
|
7431
7431
|
} = _extendSxProp,
|
7432
|
-
other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded$
|
7432
|
+
other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded$t);
|
7433
7433
|
return /*#__PURE__*/jsx(BoxRoot, _extends({
|
7434
7434
|
as: component,
|
7435
7435
|
ref: ref,
|
@@ -7440,7 +7440,7 @@ function createBox(options = {}) {
|
|
7440
7440
|
return Box;
|
7441
7441
|
}
|
7442
7442
|
|
7443
|
-
const _excluded$
|
7443
|
+
const _excluded$s = ["variant"];
|
7444
7444
|
function isEmpty$1(string) {
|
7445
7445
|
return string.length === 0;
|
7446
7446
|
}
|
@@ -7454,7 +7454,7 @@ function propsToClassKey(props) {
|
|
7454
7454
|
const {
|
7455
7455
|
variant
|
7456
7456
|
} = props,
|
7457
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
7457
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$s);
|
7458
7458
|
let classKey = variant || '';
|
7459
7459
|
Object.keys(other).sort().forEach(key => {
|
7460
7460
|
if (key === 'color') {
|
@@ -7466,7 +7466,7 @@ function propsToClassKey(props) {
|
|
7466
7466
|
return classKey;
|
7467
7467
|
}
|
7468
7468
|
|
7469
|
-
const _excluded$
|
7469
|
+
const _excluded$r = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
|
7470
7470
|
function isEmpty(obj) {
|
7471
7471
|
return Object.keys(obj).length === 0;
|
7472
7472
|
}
|
@@ -7561,7 +7561,7 @@ function createStyled(input = {}) {
|
|
7561
7561
|
skipSx: inputSkipSx,
|
7562
7562
|
overridesResolver
|
7563
7563
|
} = inputOptions,
|
7564
|
-
options = _objectWithoutPropertiesLoose(inputOptions, _excluded$
|
7564
|
+
options = _objectWithoutPropertiesLoose(inputOptions, _excluded$r);
|
7565
7565
|
|
7566
7566
|
// if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.
|
7567
7567
|
const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver : componentSlot && componentSlot !== 'Root' || false;
|
@@ -7941,6 +7941,17 @@ function lighten(color, coefficient) {
|
|
7941
7941
|
return recomposeColor(color);
|
7942
7942
|
}
|
7943
7943
|
|
7944
|
+
/**
|
7945
|
+
* Darken or lighten a color, depending on its luminance.
|
7946
|
+
* Light colors are darkened, dark colors are lightened.
|
7947
|
+
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
|
7948
|
+
* @param {number} coefficient=0.15 - multiplier in the range 0 - 1
|
7949
|
+
* @returns {string} A CSS color string. Hex input values are returned as rgb
|
7950
|
+
*/
|
7951
|
+
function emphasize(color, coefficient = 0.15) {
|
7952
|
+
return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
|
7953
|
+
}
|
7954
|
+
|
7944
7955
|
const ThemeContext = /*#__PURE__*/React.createContext(null);
|
7945
7956
|
if (process.env.NODE_ENV !== 'production') {
|
7946
7957
|
ThemeContext.displayName = 'ThemeContext';
|
@@ -8091,7 +8102,7 @@ if (process.env.NODE_ENV !== 'production') {
|
|
8091
8102
|
process.env.NODE_ENV !== "production" ? ThemeProvider$1.propTypes = exactProp(ThemeProvider$1.propTypes) : void 0;
|
8092
8103
|
}
|
8093
8104
|
|
8094
|
-
const _excluded$
|
8105
|
+
const _excluded$q = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
|
8095
8106
|
const defaultTheme$3 = createTheme$1();
|
8096
8107
|
// widening Theme to any so that the consumer can own the theme structure.
|
8097
8108
|
const defaultCreateStyledComponent = systemStyled('div', {
|
@@ -8220,7 +8231,7 @@ function createStack(options = {}) {
|
|
8220
8231
|
className,
|
8221
8232
|
useFlexGap = false
|
8222
8233
|
} = props,
|
8223
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
8234
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$q);
|
8224
8235
|
const ownerState = {
|
8225
8236
|
direction,
|
8226
8237
|
spacing,
|
@@ -8394,7 +8405,7 @@ const green = {
|
|
8394
8405
|
};
|
8395
8406
|
var green$1 = green;
|
8396
8407
|
|
8397
|
-
const _excluded$
|
8408
|
+
const _excluded$p = ["mode", "contrastThreshold", "tonalOffset"];
|
8398
8409
|
const light = {
|
8399
8410
|
// The colors used to style the text.
|
8400
8411
|
text: {
|
@@ -8563,7 +8574,7 @@ function createPalette(palette) {
|
|
8563
8574
|
contrastThreshold = 3,
|
8564
8575
|
tonalOffset = 0.2
|
8565
8576
|
} = palette,
|
8566
|
-
other = _objectWithoutPropertiesLoose(palette, _excluded$
|
8577
|
+
other = _objectWithoutPropertiesLoose(palette, _excluded$p);
|
8567
8578
|
const primary = palette.primary || getDefaultPrimary(mode);
|
8568
8579
|
const secondary = palette.secondary || getDefaultSecondary(mode);
|
8569
8580
|
const error = palette.error || getDefaultError(mode);
|
@@ -8687,7 +8698,7 @@ const theme2 = createTheme({ palette: {
|
|
8687
8698
|
return paletteOutput;
|
8688
8699
|
}
|
8689
8700
|
|
8690
|
-
const _excluded$
|
8701
|
+
const _excluded$o = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
|
8691
8702
|
function round(value) {
|
8692
8703
|
return Math.round(value * 1e5) / 1e5;
|
8693
8704
|
}
|
@@ -8718,7 +8729,7 @@ function createTypography(palette, typography) {
|
|
8718
8729
|
allVariants,
|
8719
8730
|
pxToRem: pxToRem2
|
8720
8731
|
} = _ref,
|
8721
|
-
other = _objectWithoutPropertiesLoose(_ref, _excluded$
|
8732
|
+
other = _objectWithoutPropertiesLoose(_ref, _excluded$o);
|
8722
8733
|
if (process.env.NODE_ENV !== 'production') {
|
8723
8734
|
if (typeof fontSize !== 'number') {
|
8724
8735
|
console.error('MUI: `fontSize` is required to be a number.');
|
@@ -8785,7 +8796,7 @@ function createShadow(...px) {
|
|
8785
8796
|
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)];
|
8786
8797
|
var shadows$1 = shadows;
|
8787
8798
|
|
8788
|
-
const _excluded$
|
8799
|
+
const _excluded$n = ["duration", "easing", "delay"];
|
8789
8800
|
// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves
|
8790
8801
|
// to learn the context in which each easing should be used.
|
8791
8802
|
const easing = {
|
@@ -8836,7 +8847,7 @@ function createTransitions(inputTransitions) {
|
|
8836
8847
|
easing: easingOption = mergedEasing.easeInOut,
|
8837
8848
|
delay = 0
|
8838
8849
|
} = options,
|
8839
|
-
other = _objectWithoutPropertiesLoose(options, _excluded$
|
8850
|
+
other = _objectWithoutPropertiesLoose(options, _excluded$n);
|
8840
8851
|
if (process.env.NODE_ENV !== 'production') {
|
8841
8852
|
const isString = value => typeof value === 'string';
|
8842
8853
|
// IE11 support, replace with Number.isNaN
|
@@ -8883,7 +8894,7 @@ const zIndex = {
|
|
8883
8894
|
};
|
8884
8895
|
var zIndex$1 = zIndex;
|
8885
8896
|
|
8886
|
-
const _excluded$
|
8897
|
+
const _excluded$m = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
|
8887
8898
|
function createTheme(options = {}, ...args) {
|
8888
8899
|
const {
|
8889
8900
|
mixins: mixinsInput = {},
|
@@ -8891,7 +8902,7 @@ function createTheme(options = {}, ...args) {
|
|
8891
8902
|
transitions: transitionsInput = {},
|
8892
8903
|
typography: typographyInput = {}
|
8893
8904
|
} = options,
|
8894
|
-
other = _objectWithoutPropertiesLoose(options, _excluded$
|
8905
|
+
other = _objectWithoutPropertiesLoose(options, _excluded$m);
|
8895
8906
|
if (options.vars) {
|
8896
8907
|
throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`vars\` is a private field used for CSS variables support.
|
8897
8908
|
Please use another name.` : formatMuiErrorMessage(18));
|
@@ -8981,12 +8992,12 @@ const styled = createStyled({
|
|
8981
8992
|
});
|
8982
8993
|
var styled$1 = styled;
|
8983
8994
|
|
8984
|
-
const _excluded$
|
8995
|
+
const _excluded$l = ["theme"];
|
8985
8996
|
function ThemeProvider(_ref) {
|
8986
8997
|
let {
|
8987
8998
|
theme: themeInput
|
8988
8999
|
} = _ref,
|
8989
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$
|
9000
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$l);
|
8990
9001
|
const scopedTheme = themeInput[THEME_ID];
|
8991
9002
|
return /*#__PURE__*/jsx(ThemeProvider$1, _extends({}, props, {
|
8992
9003
|
themeId: scopedTheme ? THEME_ID : undefined,
|
@@ -9182,7 +9193,7 @@ function mergeSlotProps(parameters) {
|
|
9182
9193
|
};
|
9183
9194
|
}
|
9184
9195
|
|
9185
|
-
const _excluded$
|
9196
|
+
const _excluded$k = ["elementType", "externalSlotProps", "ownerState"];
|
9186
9197
|
/**
|
9187
9198
|
* @ignore - do not document.
|
9188
9199
|
* Builds the props to be passed into the slot of an unstyled component.
|
@@ -9198,7 +9209,7 @@ function useSlotProps(parameters) {
|
|
9198
9209
|
externalSlotProps,
|
9199
9210
|
ownerState
|
9200
9211
|
} = parameters,
|
9201
|
-
rest = _objectWithoutPropertiesLoose(parameters, _excluded$
|
9212
|
+
rest = _objectWithoutPropertiesLoose(parameters, _excluded$k);
|
9202
9213
|
const resolvedComponentsProps = resolveComponentProps(externalSlotProps, ownerState);
|
9203
9214
|
const {
|
9204
9215
|
props: mergedProps,
|
@@ -9836,8 +9847,8 @@ function getModalUtilityClass(slot) {
|
|
9836
9847
|
}
|
9837
9848
|
generateUtilityClasses('MuiModal', ['root', 'hidden', 'backdrop']);
|
9838
9849
|
|
9839
|
-
const _excluded$
|
9840
|
-
const useUtilityClasses$
|
9850
|
+
const _excluded$j = ["children", "closeAfterTransition", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onKeyDown", "open", "onTransitionEnter", "onTransitionExited", "slotProps", "slots"];
|
9851
|
+
const useUtilityClasses$e = ownerState => {
|
9841
9852
|
const {
|
9842
9853
|
open,
|
9843
9854
|
exited
|
@@ -9905,7 +9916,7 @@ const Modal$2 = /*#__PURE__*/React.forwardRef(function Modal(props, forwardedRef
|
|
9905
9916
|
slotProps = {},
|
9906
9917
|
slots = {}
|
9907
9918
|
} = props,
|
9908
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
9919
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$j);
|
9909
9920
|
// TODO: `modal`` must change its type in this file to match the type of methods
|
9910
9921
|
// provided by `ModalManager`
|
9911
9922
|
const manager = managerProp;
|
@@ -9980,7 +9991,7 @@ const Modal$2 = /*#__PURE__*/React.forwardRef(function Modal(props, forwardedRef
|
|
9980
9991
|
hideBackdrop,
|
9981
9992
|
keepMounted
|
9982
9993
|
});
|
9983
|
-
const classes = useUtilityClasses$
|
9994
|
+
const classes = useUtilityClasses$e(ownerState);
|
9984
9995
|
const handleEnter = () => {
|
9985
9996
|
setExited(false);
|
9986
9997
|
if (onTransitionEnter) {
|
@@ -10200,8 +10211,8 @@ function getSvgIconUtilityClass(slot) {
|
|
10200
10211
|
}
|
10201
10212
|
generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
|
10202
10213
|
|
10203
|
-
const _excluded$
|
10204
|
-
const useUtilityClasses$
|
10214
|
+
const _excluded$i = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
|
10215
|
+
const useUtilityClasses$d = ownerState => {
|
10205
10216
|
const {
|
10206
10217
|
color,
|
10207
10218
|
fontSize,
|
@@ -10266,7 +10277,7 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
|
|
10266
10277
|
titleAccess,
|
10267
10278
|
viewBox = '0 0 24 24'
|
10268
10279
|
} = props,
|
10269
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
10280
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$i);
|
10270
10281
|
const ownerState = _extends({}, props, {
|
10271
10282
|
color,
|
10272
10283
|
component,
|
@@ -10279,7 +10290,7 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
|
|
10279
10290
|
if (!inheritViewBox) {
|
10280
10291
|
more.viewBox = viewBox;
|
10281
10292
|
}
|
10282
|
-
const classes = useUtilityClasses$
|
10293
|
+
const classes = useUtilityClasses$d(ownerState);
|
10283
10294
|
return /*#__PURE__*/jsxs(SvgIconRoot, _extends({
|
10284
10295
|
as: component,
|
10285
10296
|
className: clsx(classes.root, className),
|
@@ -12774,8 +12785,8 @@ function getPaperUtilityClass(slot) {
|
|
12774
12785
|
}
|
12775
12786
|
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']);
|
12776
12787
|
|
12777
|
-
const _excluded$
|
12778
|
-
const useUtilityClasses$
|
12788
|
+
const _excluded$h = ["className", "component", "elevation", "square", "variant"];
|
12789
|
+
const useUtilityClasses$c = ownerState => {
|
12779
12790
|
const {
|
12780
12791
|
square,
|
12781
12792
|
elevation,
|
@@ -12829,14 +12840,14 @@ const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
|
|
12829
12840
|
square = false,
|
12830
12841
|
variant = 'elevation'
|
12831
12842
|
} = props,
|
12832
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
12843
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$h);
|
12833
12844
|
const ownerState = _extends({}, props, {
|
12834
12845
|
component,
|
12835
12846
|
elevation,
|
12836
12847
|
square,
|
12837
12848
|
variant
|
12838
12849
|
});
|
12839
|
-
const classes = useUtilityClasses$
|
12850
|
+
const classes = useUtilityClasses$c(ownerState);
|
12840
12851
|
if (process.env.NODE_ENV !== 'production') {
|
12841
12852
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
12842
12853
|
const theme = useTheme();
|
@@ -12987,7 +12998,7 @@ process.env.NODE_ENV !== "production" ? Ripple.propTypes = {
|
|
12987
12998
|
const touchRippleClasses = generateUtilityClasses('MuiTouchRipple', ['root', 'ripple', 'rippleVisible', 'ripplePulsate', 'child', 'childLeaving', 'childPulsate']);
|
12988
12999
|
var touchRippleClasses$1 = touchRippleClasses;
|
12989
13000
|
|
12990
|
-
const _excluded$
|
13001
|
+
const _excluded$g = ["center", "classes", "className"];
|
12991
13002
|
let _$1 = t => t,
|
12992
13003
|
_t$1,
|
12993
13004
|
_t2$1,
|
@@ -13116,7 +13127,7 @@ const TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps,
|
|
13116
13127
|
classes = {},
|
13117
13128
|
className
|
13118
13129
|
} = props,
|
13119
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
13130
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$g);
|
13120
13131
|
const [ripples, setRipples] = React.useState([]);
|
13121
13132
|
const nextKey = React.useRef(0);
|
13122
13133
|
const rippleCallback = React.useRef(null);
|
@@ -13317,8 +13328,8 @@ function getButtonBaseUtilityClass(slot) {
|
|
13317
13328
|
const buttonBaseClasses = generateUtilityClasses('MuiButtonBase', ['root', 'disabled', 'focusVisible']);
|
13318
13329
|
var buttonBaseClasses$1 = buttonBaseClasses;
|
13319
13330
|
|
13320
|
-
const _excluded$
|
13321
|
-
const useUtilityClasses$
|
13331
|
+
const _excluded$f = ["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"];
|
13332
|
+
const useUtilityClasses$b = ownerState => {
|
13322
13333
|
const {
|
13323
13334
|
disabled,
|
13324
13335
|
focusVisible,
|
@@ -13419,7 +13430,7 @@ const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, re
|
|
13419
13430
|
touchRippleRef,
|
13420
13431
|
type
|
13421
13432
|
} = props,
|
13422
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
13433
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$f);
|
13423
13434
|
const buttonRef = React.useRef(null);
|
13424
13435
|
const rippleRef = React.useRef(null);
|
13425
13436
|
const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
|
@@ -13586,7 +13597,7 @@ const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, re
|
|
13586
13597
|
tabIndex,
|
13587
13598
|
focusVisible
|
13588
13599
|
});
|
13589
|
-
const classes = useUtilityClasses$
|
13600
|
+
const classes = useUtilityClasses$b(ownerState);
|
13590
13601
|
return /*#__PURE__*/jsxs(ButtonBaseRoot, _extends({
|
13591
13602
|
as: ComponentProp,
|
13592
13603
|
className: clsx(classes.root, className),
|
@@ -13783,8 +13794,8 @@ function getIconButtonUtilityClass(slot) {
|
|
13783
13794
|
const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
|
13784
13795
|
var iconButtonClasses$1 = iconButtonClasses;
|
13785
13796
|
|
13786
|
-
const _excluded$
|
13787
|
-
const useUtilityClasses$
|
13797
|
+
const _excluded$e = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
|
13798
|
+
const useUtilityClasses$a = ownerState => {
|
13788
13799
|
const {
|
13789
13800
|
classes,
|
13790
13801
|
disabled,
|
@@ -13884,7 +13895,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(inProps, re
|
|
13884
13895
|
disableFocusRipple = false,
|
13885
13896
|
size = 'medium'
|
13886
13897
|
} = props,
|
13887
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
13898
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$e);
|
13888
13899
|
const ownerState = _extends({}, props, {
|
13889
13900
|
edge,
|
13890
13901
|
color,
|
@@ -13892,7 +13903,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(inProps, re
|
|
13892
13903
|
disableFocusRipple,
|
13893
13904
|
size
|
13894
13905
|
});
|
13895
|
-
const classes = useUtilityClasses$
|
13906
|
+
const classes = useUtilityClasses$a(ownerState);
|
13896
13907
|
return /*#__PURE__*/jsx(IconButtonRoot, _extends({
|
13897
13908
|
className: clsx(classes.root, className),
|
13898
13909
|
centerRipple: true,
|
@@ -13978,8 +13989,8 @@ function getTypographyUtilityClass(slot) {
|
|
13978
13989
|
}
|
13979
13990
|
generateUtilityClasses('MuiTypography', ['root', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'inherit', 'button', 'caption', 'overline', 'alignLeft', 'alignRight', 'alignCenter', 'alignJustify', 'noWrap', 'gutterBottom', 'paragraph']);
|
13980
13991
|
|
13981
|
-
const _excluded$
|
13982
|
-
const useUtilityClasses$
|
13992
|
+
const _excluded$d = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
|
13993
|
+
const useUtilityClasses$9 = ownerState => {
|
13983
13994
|
const {
|
13984
13995
|
align,
|
13985
13996
|
gutterBottom,
|
@@ -14033,22 +14044,22 @@ const defaultVariantMapping = {
|
|
14033
14044
|
};
|
14034
14045
|
|
14035
14046
|
// TODO v6: deprecate these color values in v5.x and remove the transformation in v6
|
14036
|
-
const colorTransformations = {
|
14047
|
+
const colorTransformations$1 = {
|
14037
14048
|
primary: 'primary.main',
|
14038
14049
|
textPrimary: 'text.primary',
|
14039
14050
|
secondary: 'secondary.main',
|
14040
14051
|
textSecondary: 'text.secondary',
|
14041
14052
|
error: 'error.main'
|
14042
14053
|
};
|
14043
|
-
const transformDeprecatedColors = color => {
|
14044
|
-
return colorTransformations[color] || color;
|
14054
|
+
const transformDeprecatedColors$1 = color => {
|
14055
|
+
return colorTransformations$1[color] || color;
|
14045
14056
|
};
|
14046
14057
|
const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, ref) {
|
14047
14058
|
const themeProps = useThemeProps({
|
14048
14059
|
props: inProps,
|
14049
14060
|
name: 'MuiTypography'
|
14050
14061
|
});
|
14051
|
-
const color = transformDeprecatedColors(themeProps.color);
|
14062
|
+
const color = transformDeprecatedColors$1(themeProps.color);
|
14052
14063
|
const props = extendSxProp(_extends({}, themeProps, {
|
14053
14064
|
color
|
14054
14065
|
}));
|
@@ -14062,7 +14073,7 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
|
|
14062
14073
|
variant = 'body1',
|
14063
14074
|
variantMapping = defaultVariantMapping
|
14064
14075
|
} = props,
|
14065
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
14076
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$d);
|
14066
14077
|
const ownerState = _extends({}, props, {
|
14067
14078
|
align,
|
14068
14079
|
color,
|
@@ -14075,7 +14086,7 @@ const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, re
|
|
14075
14086
|
variantMapping
|
14076
14087
|
});
|
14077
14088
|
const Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
|
14078
|
-
const classes = useUtilityClasses$
|
14089
|
+
const classes = useUtilityClasses$9(ownerState);
|
14079
14090
|
return /*#__PURE__*/jsx(TypographyRoot, _extends({
|
14080
14091
|
as: Component,
|
14081
14092
|
ref: ref,
|
@@ -14160,7 +14171,7 @@ process.env.NODE_ENV !== "production" ? Typography.propTypes /* remove-proptypes
|
|
14160
14171
|
} : void 0;
|
14161
14172
|
var Typography$1 = Typography;
|
14162
14173
|
|
14163
|
-
const _excluded$
|
14174
|
+
const _excluded$c = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
|
14164
14175
|
const styles = {
|
14165
14176
|
entering: {
|
14166
14177
|
opacity: 1
|
@@ -14197,7 +14208,7 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
|
|
14197
14208
|
// eslint-disable-next-line react/prop-types
|
14198
14209
|
TransitionComponent = Transition$1
|
14199
14210
|
} = props,
|
14200
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
14211
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$c);
|
14201
14212
|
const nodeRef = React.useRef(null);
|
14202
14213
|
const handleRef = useForkRef(nodeRef, children.ref, ref);
|
14203
14214
|
const normalizedTransitionCallback = callback => maybeIsAppearing => {
|
@@ -14358,8 +14369,8 @@ function getBackdropUtilityClass(slot) {
|
|
14358
14369
|
}
|
14359
14370
|
generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);
|
14360
14371
|
|
14361
|
-
const _excluded$
|
14362
|
-
const useUtilityClasses$
|
14372
|
+
const _excluded$b = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
|
14373
|
+
const useUtilityClasses$8 = ownerState => {
|
14363
14374
|
const {
|
14364
14375
|
classes,
|
14365
14376
|
invisible
|
@@ -14413,12 +14424,12 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
|
|
14413
14424
|
TransitionComponent = Fade$1,
|
14414
14425
|
transitionDuration
|
14415
14426
|
} = props,
|
14416
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
14427
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$b);
|
14417
14428
|
const ownerState = _extends({}, props, {
|
14418
14429
|
component,
|
14419
14430
|
invisible
|
14420
14431
|
});
|
14421
|
-
const classes = useUtilityClasses$
|
14432
|
+
const classes = useUtilityClasses$8(ownerState);
|
14422
14433
|
const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
|
14423
14434
|
return /*#__PURE__*/jsx(TransitionComponent, _extends({
|
14424
14435
|
in: open,
|
@@ -14562,6 +14573,319 @@ process.env.NODE_ENV !== "production" ? Box$1.propTypes /* remove-proptypes */ =
|
|
14562
14573
|
} : void 0;
|
14563
14574
|
var Box$2 = Box$1;
|
14564
14575
|
|
14576
|
+
var MoreHorizIcon = createSvgIcon$1( /*#__PURE__*/jsx("path", {
|
14577
|
+
d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"
|
14578
|
+
}), 'MoreHoriz');
|
14579
|
+
|
14580
|
+
const _excluded$a = ["slots", "slotProps"];
|
14581
|
+
const BreadcrumbCollapsedButton = styled$1(ButtonBase$1)(({
|
14582
|
+
theme
|
14583
|
+
}) => _extends({
|
14584
|
+
display: 'flex',
|
14585
|
+
marginLeft: `calc(${theme.spacing(1)} * 0.5)`,
|
14586
|
+
marginRight: `calc(${theme.spacing(1)} * 0.5)`
|
14587
|
+
}, theme.palette.mode === 'light' ? {
|
14588
|
+
backgroundColor: theme.palette.grey[100],
|
14589
|
+
color: theme.palette.grey[700]
|
14590
|
+
} : {
|
14591
|
+
backgroundColor: theme.palette.grey[700],
|
14592
|
+
color: theme.palette.grey[100]
|
14593
|
+
}, {
|
14594
|
+
borderRadius: 2,
|
14595
|
+
'&:hover, &:focus': _extends({}, theme.palette.mode === 'light' ? {
|
14596
|
+
backgroundColor: theme.palette.grey[200]
|
14597
|
+
} : {
|
14598
|
+
backgroundColor: theme.palette.grey[600]
|
14599
|
+
}),
|
14600
|
+
'&:active': _extends({
|
14601
|
+
boxShadow: theme.shadows[0]
|
14602
|
+
}, theme.palette.mode === 'light' ? {
|
14603
|
+
backgroundColor: emphasize(theme.palette.grey[200], 0.12)
|
14604
|
+
} : {
|
14605
|
+
backgroundColor: emphasize(theme.palette.grey[600], 0.12)
|
14606
|
+
})
|
14607
|
+
}));
|
14608
|
+
const BreadcrumbCollapsedIcon = styled$1(MoreHorizIcon)({
|
14609
|
+
width: 24,
|
14610
|
+
height: 16
|
14611
|
+
});
|
14612
|
+
|
14613
|
+
/**
|
14614
|
+
* @ignore - internal component.
|
14615
|
+
*/
|
14616
|
+
function BreadcrumbCollapsed(props) {
|
14617
|
+
const {
|
14618
|
+
slots = {},
|
14619
|
+
slotProps = {}
|
14620
|
+
} = props,
|
14621
|
+
otherProps = _objectWithoutPropertiesLoose(props, _excluded$a);
|
14622
|
+
const ownerState = props;
|
14623
|
+
return /*#__PURE__*/jsx("li", {
|
14624
|
+
children: /*#__PURE__*/jsx(BreadcrumbCollapsedButton, _extends({
|
14625
|
+
focusRipple: true
|
14626
|
+
}, otherProps, {
|
14627
|
+
ownerState: ownerState,
|
14628
|
+
children: /*#__PURE__*/jsx(BreadcrumbCollapsedIcon, _extends({
|
14629
|
+
as: slots.CollapsedIcon,
|
14630
|
+
ownerState: ownerState
|
14631
|
+
}, slotProps.collapsedIcon))
|
14632
|
+
}))
|
14633
|
+
});
|
14634
|
+
}
|
14635
|
+
process.env.NODE_ENV !== "production" ? BreadcrumbCollapsed.propTypes = {
|
14636
|
+
/**
|
14637
|
+
* The props used for the CollapsedIcon slot.
|
14638
|
+
* @default {}
|
14639
|
+
*/
|
14640
|
+
slotProps: PropTypes.shape({
|
14641
|
+
collapsedIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
|
14642
|
+
}),
|
14643
|
+
/**
|
14644
|
+
* The components used for each slot inside the BreadcumbCollapsed.
|
14645
|
+
* Either a string to use a HTML element or a component.
|
14646
|
+
* @default {}
|
14647
|
+
*/
|
14648
|
+
slots: PropTypes.shape({
|
14649
|
+
CollapsedIcon: PropTypes.elementType
|
14650
|
+
}),
|
14651
|
+
/**
|
14652
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
14653
|
+
*/
|
14654
|
+
sx: PropTypes.object
|
14655
|
+
} : void 0;
|
14656
|
+
|
14657
|
+
function getBreadcrumbsUtilityClass(slot) {
|
14658
|
+
return generateUtilityClass('MuiBreadcrumbs', slot);
|
14659
|
+
}
|
14660
|
+
const breadcrumbsClasses = generateUtilityClasses('MuiBreadcrumbs', ['root', 'ol', 'li', 'separator']);
|
14661
|
+
var breadcrumbsClasses$1 = breadcrumbsClasses;
|
14662
|
+
|
14663
|
+
const _excluded$9 = ["children", "className", "component", "slots", "slotProps", "expandText", "itemsAfterCollapse", "itemsBeforeCollapse", "maxItems", "separator"];
|
14664
|
+
const useUtilityClasses$7 = ownerState => {
|
14665
|
+
const {
|
14666
|
+
classes
|
14667
|
+
} = ownerState;
|
14668
|
+
const slots = {
|
14669
|
+
root: ['root'],
|
14670
|
+
li: ['li'],
|
14671
|
+
ol: ['ol'],
|
14672
|
+
separator: ['separator']
|
14673
|
+
};
|
14674
|
+
return composeClasses(slots, getBreadcrumbsUtilityClass, classes);
|
14675
|
+
};
|
14676
|
+
const BreadcrumbsRoot = styled$1(Typography$1, {
|
14677
|
+
name: 'MuiBreadcrumbs',
|
14678
|
+
slot: 'Root',
|
14679
|
+
overridesResolver: (props, styles) => {
|
14680
|
+
return [{
|
14681
|
+
[`& .${breadcrumbsClasses$1.li}`]: styles.li
|
14682
|
+
}, styles.root];
|
14683
|
+
}
|
14684
|
+
})({});
|
14685
|
+
const BreadcrumbsOl = styled$1('ol', {
|
14686
|
+
name: 'MuiBreadcrumbs',
|
14687
|
+
slot: 'Ol',
|
14688
|
+
overridesResolver: (props, styles) => styles.ol
|
14689
|
+
})({
|
14690
|
+
display: 'flex',
|
14691
|
+
flexWrap: 'wrap',
|
14692
|
+
alignItems: 'center',
|
14693
|
+
padding: 0,
|
14694
|
+
margin: 0,
|
14695
|
+
listStyle: 'none'
|
14696
|
+
});
|
14697
|
+
const BreadcrumbsSeparator = styled$1('li', {
|
14698
|
+
name: 'MuiBreadcrumbs',
|
14699
|
+
slot: 'Separator',
|
14700
|
+
overridesResolver: (props, styles) => styles.separator
|
14701
|
+
})({
|
14702
|
+
display: 'flex',
|
14703
|
+
userSelect: 'none',
|
14704
|
+
marginLeft: 8,
|
14705
|
+
marginRight: 8
|
14706
|
+
});
|
14707
|
+
function insertSeparators(items, className, separator, ownerState) {
|
14708
|
+
return items.reduce((acc, current, index) => {
|
14709
|
+
if (index < items.length - 1) {
|
14710
|
+
acc = acc.concat(current, /*#__PURE__*/jsx(BreadcrumbsSeparator, {
|
14711
|
+
"aria-hidden": true,
|
14712
|
+
className: className,
|
14713
|
+
ownerState: ownerState,
|
14714
|
+
children: separator
|
14715
|
+
}, `separator-${index}`));
|
14716
|
+
} else {
|
14717
|
+
acc.push(current);
|
14718
|
+
}
|
14719
|
+
return acc;
|
14720
|
+
}, []);
|
14721
|
+
}
|
14722
|
+
const Breadcrumbs = /*#__PURE__*/React.forwardRef(function Breadcrumbs(inProps, ref) {
|
14723
|
+
const props = useThemeProps({
|
14724
|
+
props: inProps,
|
14725
|
+
name: 'MuiBreadcrumbs'
|
14726
|
+
});
|
14727
|
+
const {
|
14728
|
+
children,
|
14729
|
+
className,
|
14730
|
+
component = 'nav',
|
14731
|
+
slots = {},
|
14732
|
+
slotProps = {},
|
14733
|
+
expandText = 'Show path',
|
14734
|
+
itemsAfterCollapse = 1,
|
14735
|
+
itemsBeforeCollapse = 1,
|
14736
|
+
maxItems = 8,
|
14737
|
+
separator = '/'
|
14738
|
+
} = props,
|
14739
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$9);
|
14740
|
+
const [expanded, setExpanded] = React.useState(false);
|
14741
|
+
const ownerState = _extends({}, props, {
|
14742
|
+
component,
|
14743
|
+
expanded,
|
14744
|
+
expandText,
|
14745
|
+
itemsAfterCollapse,
|
14746
|
+
itemsBeforeCollapse,
|
14747
|
+
maxItems,
|
14748
|
+
separator
|
14749
|
+
});
|
14750
|
+
const classes = useUtilityClasses$7(ownerState);
|
14751
|
+
const collapsedIconSlotProps = useSlotProps({
|
14752
|
+
elementType: slots.CollapsedIcon,
|
14753
|
+
externalSlotProps: slotProps.collapsedIcon,
|
14754
|
+
ownerState
|
14755
|
+
});
|
14756
|
+
const listRef = React.useRef(null);
|
14757
|
+
const renderItemsBeforeAndAfter = allItems => {
|
14758
|
+
const handleClickExpand = () => {
|
14759
|
+
setExpanded(true);
|
14760
|
+
|
14761
|
+
// The clicked element received the focus but gets removed from the DOM.
|
14762
|
+
// Let's keep the focus in the component after expanding.
|
14763
|
+
// Moving it to the <ol> or <nav> does not cause any announcement in NVDA.
|
14764
|
+
// By moving it to some link/button at least we have some announcement.
|
14765
|
+
const focusable = listRef.current.querySelector('a[href],button,[tabindex]');
|
14766
|
+
if (focusable) {
|
14767
|
+
focusable.focus();
|
14768
|
+
}
|
14769
|
+
};
|
14770
|
+
|
14771
|
+
// This defends against someone passing weird input, to ensure that if all
|
14772
|
+
// items would be shown anyway, we just show all items without the EllipsisItem
|
14773
|
+
if (itemsBeforeCollapse + itemsAfterCollapse >= allItems.length) {
|
14774
|
+
if (process.env.NODE_ENV !== 'production') {
|
14775
|
+
console.error(['MUI: You have provided an invalid combination of props to the Breadcrumbs.', `itemsAfterCollapse={${itemsAfterCollapse}} + itemsBeforeCollapse={${itemsBeforeCollapse}} >= maxItems={${maxItems}}`].join('\n'));
|
14776
|
+
}
|
14777
|
+
return allItems;
|
14778
|
+
}
|
14779
|
+
return [...allItems.slice(0, itemsBeforeCollapse), /*#__PURE__*/jsx(BreadcrumbCollapsed, {
|
14780
|
+
"aria-label": expandText,
|
14781
|
+
slots: {
|
14782
|
+
CollapsedIcon: slots.CollapsedIcon
|
14783
|
+
},
|
14784
|
+
slotProps: {
|
14785
|
+
collapsedIcon: collapsedIconSlotProps
|
14786
|
+
},
|
14787
|
+
onClick: handleClickExpand
|
14788
|
+
}, "ellipsis"), ...allItems.slice(allItems.length - itemsAfterCollapse, allItems.length)];
|
14789
|
+
};
|
14790
|
+
const allItems = React.Children.toArray(children).filter(child => {
|
14791
|
+
if (process.env.NODE_ENV !== 'production') {
|
14792
|
+
if (reactIs$2.exports.isFragment(child)) {
|
14793
|
+
console.error(["MUI: The Breadcrumbs component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
|
14794
|
+
}
|
14795
|
+
}
|
14796
|
+
return /*#__PURE__*/React.isValidElement(child);
|
14797
|
+
}).map((child, index) => /*#__PURE__*/jsx("li", {
|
14798
|
+
className: classes.li,
|
14799
|
+
children: child
|
14800
|
+
}, `child-${index}`));
|
14801
|
+
return /*#__PURE__*/jsx(BreadcrumbsRoot, _extends({
|
14802
|
+
ref: ref,
|
14803
|
+
component: component,
|
14804
|
+
color: "text.secondary",
|
14805
|
+
className: clsx(classes.root, className),
|
14806
|
+
ownerState: ownerState
|
14807
|
+
}, other, {
|
14808
|
+
children: /*#__PURE__*/jsx(BreadcrumbsOl, {
|
14809
|
+
className: classes.ol,
|
14810
|
+
ref: listRef,
|
14811
|
+
ownerState: ownerState,
|
14812
|
+
children: insertSeparators(expanded || maxItems && allItems.length <= maxItems ? allItems : renderItemsBeforeAndAfter(allItems), classes.separator, separator, ownerState)
|
14813
|
+
})
|
14814
|
+
}));
|
14815
|
+
});
|
14816
|
+
process.env.NODE_ENV !== "production" ? Breadcrumbs.propTypes /* remove-proptypes */ = {
|
14817
|
+
// ----------------------------- Warning --------------------------------
|
14818
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
14819
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
14820
|
+
// ----------------------------------------------------------------------
|
14821
|
+
/**
|
14822
|
+
* The content of the component.
|
14823
|
+
*/
|
14824
|
+
children: PropTypes.node,
|
14825
|
+
/**
|
14826
|
+
* Override or extend the styles applied to the component.
|
14827
|
+
*/
|
14828
|
+
classes: PropTypes.object,
|
14829
|
+
/**
|
14830
|
+
* @ignore
|
14831
|
+
*/
|
14832
|
+
className: PropTypes.string,
|
14833
|
+
/**
|
14834
|
+
* The component used for the root node.
|
14835
|
+
* Either a string to use a HTML element or a component.
|
14836
|
+
*/
|
14837
|
+
component: PropTypes.elementType,
|
14838
|
+
/**
|
14839
|
+
* Override the default label for the expand button.
|
14840
|
+
*
|
14841
|
+
* For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
|
14842
|
+
* @default 'Show path'
|
14843
|
+
*/
|
14844
|
+
expandText: PropTypes.string,
|
14845
|
+
/**
|
14846
|
+
* If max items is exceeded, the number of items to show after the ellipsis.
|
14847
|
+
* @default 1
|
14848
|
+
*/
|
14849
|
+
itemsAfterCollapse: integerPropType,
|
14850
|
+
/**
|
14851
|
+
* If max items is exceeded, the number of items to show before the ellipsis.
|
14852
|
+
* @default 1
|
14853
|
+
*/
|
14854
|
+
itemsBeforeCollapse: integerPropType,
|
14855
|
+
/**
|
14856
|
+
* Specifies the maximum number of breadcrumbs to display. When there are more
|
14857
|
+
* than the maximum number, only the first `itemsBeforeCollapse` and last `itemsAfterCollapse`
|
14858
|
+
* will be shown, with an ellipsis in between.
|
14859
|
+
* @default 8
|
14860
|
+
*/
|
14861
|
+
maxItems: integerPropType,
|
14862
|
+
/**
|
14863
|
+
* Custom separator node.
|
14864
|
+
* @default '/'
|
14865
|
+
*/
|
14866
|
+
separator: PropTypes.node,
|
14867
|
+
/**
|
14868
|
+
* The props used for each slot inside the Breadcumb.
|
14869
|
+
* @default {}
|
14870
|
+
*/
|
14871
|
+
slotProps: PropTypes.shape({
|
14872
|
+
collapsedIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
|
14873
|
+
}),
|
14874
|
+
/**
|
14875
|
+
* The components used for each slot inside the Breadcumb.
|
14876
|
+
* Either a string to use a HTML element or a component.
|
14877
|
+
* @default {}
|
14878
|
+
*/
|
14879
|
+
slots: PropTypes.shape({
|
14880
|
+
CollapsedIcon: PropTypes.elementType
|
14881
|
+
}),
|
14882
|
+
/**
|
14883
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
14884
|
+
*/
|
14885
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
14886
|
+
} : void 0;
|
14887
|
+
var Breadcrumbs$1 = Breadcrumbs;
|
14888
|
+
|
14565
14889
|
function getButtonUtilityClass(slot) {
|
14566
14890
|
return generateUtilityClass('MuiButton', slot);
|
14567
14891
|
}
|
@@ -14577,8 +14901,8 @@ if (process.env.NODE_ENV !== 'production') {
|
|
14577
14901
|
}
|
14578
14902
|
var ButtonGroupContext$1 = ButtonGroupContext;
|
14579
14903
|
|
14580
|
-
const _excluded$
|
14581
|
-
const useUtilityClasses$
|
14904
|
+
const _excluded$8 = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"];
|
14905
|
+
const useUtilityClasses$6 = ownerState => {
|
14582
14906
|
const {
|
14583
14907
|
color,
|
14584
14908
|
disableElevation,
|
@@ -14803,7 +15127,7 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
|
|
14803
15127
|
type,
|
14804
15128
|
variant = 'text'
|
14805
15129
|
} = props,
|
14806
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
15130
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$8);
|
14807
15131
|
const ownerState = _extends({}, props, {
|
14808
15132
|
color,
|
14809
15133
|
component,
|
@@ -14815,7 +15139,7 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
|
|
14815
15139
|
type,
|
14816
15140
|
variant
|
14817
15141
|
});
|
14818
|
-
const classes = useUtilityClasses$
|
15142
|
+
const classes = useUtilityClasses$6(ownerState);
|
14819
15143
|
const startIcon = startIconProp && /*#__PURE__*/jsx(ButtonStartIcon, {
|
14820
15144
|
className: classes.startIcon,
|
14821
15145
|
ownerState: ownerState,
|
@@ -14941,8 +15265,8 @@ function getCardUtilityClass(slot) {
|
|
14941
15265
|
}
|
14942
15266
|
generateUtilityClasses('MuiCard', ['root']);
|
14943
15267
|
|
14944
|
-
const _excluded$
|
14945
|
-
const useUtilityClasses$
|
15268
|
+
const _excluded$7 = ["className", "raised"];
|
15269
|
+
const useUtilityClasses$5 = ownerState => {
|
14946
15270
|
const {
|
14947
15271
|
classes
|
14948
15272
|
} = ownerState;
|
@@ -14969,11 +15293,11 @@ const Card = /*#__PURE__*/React.forwardRef(function Card(inProps, ref) {
|
|
14969
15293
|
className,
|
14970
15294
|
raised = false
|
14971
15295
|
} = props,
|
14972
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
15296
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$7);
|
14973
15297
|
const ownerState = _extends({}, props, {
|
14974
15298
|
raised
|
14975
15299
|
});
|
14976
|
-
const classes = useUtilityClasses$
|
15300
|
+
const classes = useUtilityClasses$5(ownerState);
|
14977
15301
|
return /*#__PURE__*/jsx(CardRoot, _extends({
|
14978
15302
|
className: clsx(classes.root, className),
|
14979
15303
|
elevation: raised ? 8 : undefined,
|
@@ -15020,8 +15344,8 @@ function getCardContentUtilityClass(slot) {
|
|
15020
15344
|
}
|
15021
15345
|
generateUtilityClasses('MuiCardContent', ['root']);
|
15022
15346
|
|
15023
|
-
const _excluded$
|
15024
|
-
const useUtilityClasses$
|
15347
|
+
const _excluded$6 = ["className", "component"];
|
15348
|
+
const useUtilityClasses$4 = ownerState => {
|
15025
15349
|
const {
|
15026
15350
|
classes
|
15027
15351
|
} = ownerState;
|
@@ -15051,11 +15375,11 @@ const CardContent = /*#__PURE__*/React.forwardRef(function CardContent(inProps,
|
|
15051
15375
|
className,
|
15052
15376
|
component = 'div'
|
15053
15377
|
} = props,
|
15054
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
15378
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$6);
|
15055
15379
|
const ownerState = _extends({}, props, {
|
15056
15380
|
component
|
15057
15381
|
});
|
15058
|
-
const classes = useUtilityClasses$
|
15382
|
+
const classes = useUtilityClasses$4(ownerState);
|
15059
15383
|
return /*#__PURE__*/jsx(CardContentRoot, _extends({
|
15060
15384
|
as: component,
|
15061
15385
|
className: clsx(classes.root, className),
|
@@ -15092,7 +15416,7 @@ process.env.NODE_ENV !== "production" ? CardContent.propTypes /* remove-proptype
|
|
15092
15416
|
} : void 0;
|
15093
15417
|
var CardContent$1 = CardContent;
|
15094
15418
|
|
15095
|
-
const _excluded$
|
15419
|
+
const _excluded$5 = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "open", "slotProps", "slots", "theme"];
|
15096
15420
|
const ModalRoot = styled$1('div', {
|
15097
15421
|
name: 'MuiModal',
|
15098
15422
|
slot: 'Root',
|
@@ -15171,7 +15495,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
|
|
15171
15495
|
// eslint-disable-next-line react/prop-types
|
15172
15496
|
theme
|
15173
15497
|
} = props,
|
15174
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
15498
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$5);
|
15175
15499
|
const [exited, setExited] = React.useState(true);
|
15176
15500
|
const commonProps = {
|
15177
15501
|
container,
|
@@ -15395,8 +15719,8 @@ function getDividerUtilityClass(slot) {
|
|
15395
15719
|
}
|
15396
15720
|
generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
|
15397
15721
|
|
15398
|
-
const _excluded$
|
15399
|
-
const useUtilityClasses$
|
15722
|
+
const _excluded$4 = ["absolute", "children", "className", "component", "flexItem", "light", "orientation", "role", "textAlign", "variant"];
|
15723
|
+
const useUtilityClasses$3 = ownerState => {
|
15400
15724
|
const {
|
15401
15725
|
absolute,
|
15402
15726
|
children,
|
@@ -15537,7 +15861,7 @@ const Divider = /*#__PURE__*/React.forwardRef(function Divider(inProps, ref) {
|
|
15537
15861
|
textAlign = 'center',
|
15538
15862
|
variant = 'fullWidth'
|
15539
15863
|
} = props,
|
15540
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
15864
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$4);
|
15541
15865
|
const ownerState = _extends({}, props, {
|
15542
15866
|
absolute,
|
15543
15867
|
component,
|
@@ -15548,7 +15872,7 @@ const Divider = /*#__PURE__*/React.forwardRef(function Divider(inProps, ref) {
|
|
15548
15872
|
textAlign,
|
15549
15873
|
variant
|
15550
15874
|
});
|
15551
|
-
const classes = useUtilityClasses$
|
15875
|
+
const classes = useUtilityClasses$3(ownerState);
|
15552
15876
|
return /*#__PURE__*/jsx(DividerRoot, _extends({
|
15553
15877
|
as: component,
|
15554
15878
|
className: clsx(classes.root, className),
|
@@ -15627,7 +15951,7 @@ process.env.NODE_ENV !== "production" ? Divider.propTypes /* remove-proptypes */
|
|
15627
15951
|
} : void 0;
|
15628
15952
|
var Divider$1 = Divider;
|
15629
15953
|
|
15630
|
-
const _excluded$
|
15954
|
+
const _excluded$3 = ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
|
15631
15955
|
function getTranslateValue(direction, node, resolvedContainer) {
|
15632
15956
|
const rect = node.getBoundingClientRect();
|
15633
15957
|
const containerRect = resolvedContainer && resolvedContainer.getBoundingClientRect();
|
@@ -15716,7 +16040,7 @@ const Slide = /*#__PURE__*/React.forwardRef(function Slide(props, ref) {
|
|
15716
16040
|
// eslint-disable-next-line react/prop-types
|
15717
16041
|
TransitionComponent = Transition$1
|
15718
16042
|
} = props,
|
15719
|
-
other = _objectWithoutPropertiesLoose(props, _excluded$
|
16043
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$3);
|
15720
16044
|
const childrenRef = React.useRef(null);
|
15721
16045
|
const handleRef = useForkRef(children.ref, childrenRef, ref);
|
15722
16046
|
const normalizedTransitionCallback = callback => isAppearing => {
|
@@ -15944,7 +16268,7 @@ function getDrawerUtilityClass(slot) {
|
|
15944
16268
|
}
|
15945
16269
|
generateUtilityClasses('MuiDrawer', ['root', 'docked', 'paper', 'paperAnchorLeft', 'paperAnchorRight', 'paperAnchorTop', 'paperAnchorBottom', 'paperAnchorDockedLeft', 'paperAnchorDockedRight', 'paperAnchorDockedTop', 'paperAnchorDockedBottom', 'modal']);
|
15946
16270
|
|
15947
|
-
const _excluded$
|
16271
|
+
const _excluded$2 = ["BackdropProps"],
|
15948
16272
|
_excluded2 = ["anchor", "BackdropProps", "children", "className", "elevation", "hideBackdrop", "ModalProps", "onClose", "open", "PaperProps", "SlideProps", "TransitionComponent", "transitionDuration", "variant"];
|
15949
16273
|
const overridesResolver = (props, styles) => {
|
15950
16274
|
const {
|
@@ -15952,7 +16276,7 @@ const overridesResolver = (props, styles) => {
|
|
15952
16276
|
} = props;
|
15953
16277
|
return [styles.root, (ownerState.variant === 'permanent' || ownerState.variant === 'persistent') && styles.docked, styles.modal];
|
15954
16278
|
};
|
15955
|
-
const useUtilityClasses$
|
16279
|
+
const useUtilityClasses$2 = ownerState => {
|
15956
16280
|
const {
|
15957
16281
|
classes,
|
15958
16282
|
anchor,
|
@@ -16084,7 +16408,7 @@ const Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {
|
|
16084
16408
|
transitionDuration = defaultTransitionDuration,
|
16085
16409
|
variant = 'temporary'
|
16086
16410
|
} = props,
|
16087
|
-
ModalProps = _objectWithoutPropertiesLoose(props.ModalProps, _excluded$
|
16411
|
+
ModalProps = _objectWithoutPropertiesLoose(props.ModalProps, _excluded$2),
|
16088
16412
|
other = _objectWithoutPropertiesLoose(props, _excluded2);
|
16089
16413
|
|
16090
16414
|
// Let's assume that the Drawer will always be rendered on user space.
|
@@ -16102,7 +16426,7 @@ const Drawer = /*#__PURE__*/React.forwardRef(function Drawer(inProps, ref) {
|
|
16102
16426
|
open,
|
16103
16427
|
variant
|
16104
16428
|
}, other);
|
16105
|
-
const classes = useUtilityClasses$
|
16429
|
+
const classes = useUtilityClasses$2(ownerState);
|
16106
16430
|
const drawer = /*#__PURE__*/jsx(DrawerPaper, _extends({
|
16107
16431
|
elevation: variant === 'temporary' ? elevation : 0,
|
16108
16432
|
square: true
|
@@ -16244,7 +16568,7 @@ function getLinearProgressUtilityClass(slot) {
|
|
16244
16568
|
}
|
16245
16569
|
generateUtilityClasses('MuiLinearProgress', ['root', 'colorPrimary', 'colorSecondary', 'determinate', 'indeterminate', 'buffer', 'query', 'dashed', 'dashedColorPrimary', 'dashedColorSecondary', 'bar', 'barColorPrimary', 'barColorSecondary', 'bar1Indeterminate', 'bar1Determinate', 'bar1Buffer', 'bar2Indeterminate', 'bar2Buffer']);
|
16246
16570
|
|
16247
|
-
const _excluded = ["className", "color", "value", "valueBuffer", "variant"];
|
16571
|
+
const _excluded$1 = ["className", "color", "value", "valueBuffer", "variant"];
|
16248
16572
|
let _ = t => t,
|
16249
16573
|
_t,
|
16250
16574
|
_t2,
|
@@ -16301,7 +16625,7 @@ const bufferKeyframe = keyframes(_t3 || (_t3 = _`
|
|
16301
16625
|
background-position: -200px -23px;
|
16302
16626
|
}
|
16303
16627
|
`));
|
16304
|
-
const useUtilityClasses = ownerState => {
|
16628
|
+
const useUtilityClasses$1 = ownerState => {
|
16305
16629
|
const {
|
16306
16630
|
classes,
|
16307
16631
|
variant,
|
@@ -16478,12 +16802,12 @@ const LinearProgress = /*#__PURE__*/React.forwardRef(function LinearProgress(inP
|
|
16478
16802
|
valueBuffer,
|
16479
16803
|
variant = 'indeterminate'
|
16480
16804
|
} = props,
|
16481
|
-
other = _objectWithoutPropertiesLoose(props, _excluded);
|
16805
|
+
other = _objectWithoutPropertiesLoose(props, _excluded$1);
|
16482
16806
|
const ownerState = _extends({}, props, {
|
16483
16807
|
color,
|
16484
16808
|
variant
|
16485
16809
|
});
|
16486
|
-
const classes = useUtilityClasses(ownerState);
|
16810
|
+
const classes = useUtilityClasses$1(ownerState);
|
16487
16811
|
const theme = useTheme();
|
16488
16812
|
const rootProps = {};
|
16489
16813
|
const inlineStyles = {
|
@@ -16579,6 +16903,231 @@ process.env.NODE_ENV !== "production" ? LinearProgress.propTypes /* remove-propt
|
|
16579
16903
|
} : void 0;
|
16580
16904
|
var LinearProgress$1 = LinearProgress;
|
16581
16905
|
|
16906
|
+
function getLinkUtilityClass(slot) {
|
16907
|
+
return generateUtilityClass('MuiLink', slot);
|
16908
|
+
}
|
16909
|
+
const linkClasses = generateUtilityClasses('MuiLink', ['root', 'underlineNone', 'underlineHover', 'underlineAlways', 'button', 'focusVisible']);
|
16910
|
+
var linkClasses$1 = linkClasses;
|
16911
|
+
|
16912
|
+
const colorTransformations = {
|
16913
|
+
primary: 'primary.main',
|
16914
|
+
textPrimary: 'text.primary',
|
16915
|
+
secondary: 'secondary.main',
|
16916
|
+
textSecondary: 'text.secondary',
|
16917
|
+
error: 'error.main'
|
16918
|
+
};
|
16919
|
+
const transformDeprecatedColors = color => {
|
16920
|
+
return colorTransformations[color] || color;
|
16921
|
+
};
|
16922
|
+
const getTextDecoration = ({
|
16923
|
+
theme,
|
16924
|
+
ownerState
|
16925
|
+
}) => {
|
16926
|
+
const transformedColor = transformDeprecatedColors(ownerState.color);
|
16927
|
+
const color = getPath(theme, `palette.${transformedColor}`, false) || ownerState.color;
|
16928
|
+
const channelColor = getPath(theme, `palette.${transformedColor}Channel`);
|
16929
|
+
if ('vars' in theme && channelColor) {
|
16930
|
+
return `rgba(${channelColor} / 0.4)`;
|
16931
|
+
}
|
16932
|
+
return alpha(color, 0.4);
|
16933
|
+
};
|
16934
|
+
var getTextDecoration$1 = getTextDecoration;
|
16935
|
+
|
16936
|
+
const _excluded = ["className", "color", "component", "onBlur", "onFocus", "TypographyClasses", "underline", "variant", "sx"];
|
16937
|
+
const useUtilityClasses = ownerState => {
|
16938
|
+
const {
|
16939
|
+
classes,
|
16940
|
+
component,
|
16941
|
+
focusVisible,
|
16942
|
+
underline
|
16943
|
+
} = ownerState;
|
16944
|
+
const slots = {
|
16945
|
+
root: ['root', `underline${capitalize(underline)}`, component === 'button' && 'button', focusVisible && 'focusVisible']
|
16946
|
+
};
|
16947
|
+
return composeClasses(slots, getLinkUtilityClass, classes);
|
16948
|
+
};
|
16949
|
+
const LinkRoot = styled$1(Typography$1, {
|
16950
|
+
name: 'MuiLink',
|
16951
|
+
slot: 'Root',
|
16952
|
+
overridesResolver: (props, styles) => {
|
16953
|
+
const {
|
16954
|
+
ownerState
|
16955
|
+
} = props;
|
16956
|
+
return [styles.root, styles[`underline${capitalize(ownerState.underline)}`], ownerState.component === 'button' && styles.button];
|
16957
|
+
}
|
16958
|
+
})(({
|
16959
|
+
theme,
|
16960
|
+
ownerState
|
16961
|
+
}) => {
|
16962
|
+
return _extends({}, ownerState.underline === 'none' && {
|
16963
|
+
textDecoration: 'none'
|
16964
|
+
}, ownerState.underline === 'hover' && {
|
16965
|
+
textDecoration: 'none',
|
16966
|
+
'&:hover': {
|
16967
|
+
textDecoration: 'underline'
|
16968
|
+
}
|
16969
|
+
}, ownerState.underline === 'always' && _extends({
|
16970
|
+
textDecoration: 'underline'
|
16971
|
+
}, ownerState.color !== 'inherit' && {
|
16972
|
+
textDecorationColor: getTextDecoration$1({
|
16973
|
+
theme,
|
16974
|
+
ownerState
|
16975
|
+
})
|
16976
|
+
}, {
|
16977
|
+
'&:hover': {
|
16978
|
+
textDecorationColor: 'inherit'
|
16979
|
+
}
|
16980
|
+
}), ownerState.component === 'button' && {
|
16981
|
+
position: 'relative',
|
16982
|
+
WebkitTapHighlightColor: 'transparent',
|
16983
|
+
backgroundColor: 'transparent',
|
16984
|
+
// Reset default value
|
16985
|
+
// We disable the focus ring for mouse, touch and keyboard users.
|
16986
|
+
outline: 0,
|
16987
|
+
border: 0,
|
16988
|
+
margin: 0,
|
16989
|
+
// Remove the margin in Safari
|
16990
|
+
borderRadius: 0,
|
16991
|
+
padding: 0,
|
16992
|
+
// Remove the padding in Firefox
|
16993
|
+
cursor: 'pointer',
|
16994
|
+
userSelect: 'none',
|
16995
|
+
verticalAlign: 'middle',
|
16996
|
+
MozAppearance: 'none',
|
16997
|
+
// Reset
|
16998
|
+
WebkitAppearance: 'none',
|
16999
|
+
// Reset
|
17000
|
+
'&::-moz-focus-inner': {
|
17001
|
+
borderStyle: 'none' // Remove Firefox dotted outline.
|
17002
|
+
},
|
17003
|
+
|
17004
|
+
[`&.${linkClasses$1.focusVisible}`]: {
|
17005
|
+
outline: 'auto'
|
17006
|
+
}
|
17007
|
+
});
|
17008
|
+
});
|
17009
|
+
const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
|
17010
|
+
const props = useThemeProps({
|
17011
|
+
props: inProps,
|
17012
|
+
name: 'MuiLink'
|
17013
|
+
});
|
17014
|
+
const {
|
17015
|
+
className,
|
17016
|
+
color = 'primary',
|
17017
|
+
component = 'a',
|
17018
|
+
onBlur,
|
17019
|
+
onFocus,
|
17020
|
+
TypographyClasses,
|
17021
|
+
underline = 'always',
|
17022
|
+
variant = 'inherit',
|
17023
|
+
sx
|
17024
|
+
} = props,
|
17025
|
+
other = _objectWithoutPropertiesLoose(props, _excluded);
|
17026
|
+
const {
|
17027
|
+
isFocusVisibleRef,
|
17028
|
+
onBlur: handleBlurVisible,
|
17029
|
+
onFocus: handleFocusVisible,
|
17030
|
+
ref: focusVisibleRef
|
17031
|
+
} = useIsFocusVisible();
|
17032
|
+
const [focusVisible, setFocusVisible] = React.useState(false);
|
17033
|
+
const handlerRef = useForkRef(ref, focusVisibleRef);
|
17034
|
+
const handleBlur = event => {
|
17035
|
+
handleBlurVisible(event);
|
17036
|
+
if (isFocusVisibleRef.current === false) {
|
17037
|
+
setFocusVisible(false);
|
17038
|
+
}
|
17039
|
+
if (onBlur) {
|
17040
|
+
onBlur(event);
|
17041
|
+
}
|
17042
|
+
};
|
17043
|
+
const handleFocus = event => {
|
17044
|
+
handleFocusVisible(event);
|
17045
|
+
if (isFocusVisibleRef.current === true) {
|
17046
|
+
setFocusVisible(true);
|
17047
|
+
}
|
17048
|
+
if (onFocus) {
|
17049
|
+
onFocus(event);
|
17050
|
+
}
|
17051
|
+
};
|
17052
|
+
const ownerState = _extends({}, props, {
|
17053
|
+
color,
|
17054
|
+
component,
|
17055
|
+
focusVisible,
|
17056
|
+
underline,
|
17057
|
+
variant
|
17058
|
+
});
|
17059
|
+
const classes = useUtilityClasses(ownerState);
|
17060
|
+
return /*#__PURE__*/jsx(LinkRoot, _extends({
|
17061
|
+
color: color,
|
17062
|
+
className: clsx(classes.root, className),
|
17063
|
+
classes: TypographyClasses,
|
17064
|
+
component: component,
|
17065
|
+
onBlur: handleBlur,
|
17066
|
+
onFocus: handleFocus,
|
17067
|
+
ref: handlerRef,
|
17068
|
+
ownerState: ownerState,
|
17069
|
+
variant: variant,
|
17070
|
+
sx: [...(!Object.keys(colorTransformations).includes(color) ? [{
|
17071
|
+
color
|
17072
|
+
}] : []), ...(Array.isArray(sx) ? sx : [sx])]
|
17073
|
+
}, other));
|
17074
|
+
});
|
17075
|
+
process.env.NODE_ENV !== "production" ? Link.propTypes /* remove-proptypes */ = {
|
17076
|
+
// ----------------------------- Warning --------------------------------
|
17077
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
17078
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
17079
|
+
// ----------------------------------------------------------------------
|
17080
|
+
/**
|
17081
|
+
* The content of the component.
|
17082
|
+
*/
|
17083
|
+
children: PropTypes.node,
|
17084
|
+
/**
|
17085
|
+
* Override or extend the styles applied to the component.
|
17086
|
+
*/
|
17087
|
+
classes: PropTypes.object,
|
17088
|
+
/**
|
17089
|
+
* @ignore
|
17090
|
+
*/
|
17091
|
+
className: PropTypes.string,
|
17092
|
+
/**
|
17093
|
+
* The color of the link.
|
17094
|
+
* @default 'primary'
|
17095
|
+
*/
|
17096
|
+
color: PropTypes /* @typescript-to-proptypes-ignore */.any,
|
17097
|
+
/**
|
17098
|
+
* The component used for the root node.
|
17099
|
+
* Either a string to use a HTML element or a component.
|
17100
|
+
*/
|
17101
|
+
component: elementTypeAcceptingRef$1,
|
17102
|
+
/**
|
17103
|
+
* @ignore
|
17104
|
+
*/
|
17105
|
+
onBlur: PropTypes.func,
|
17106
|
+
/**
|
17107
|
+
* @ignore
|
17108
|
+
*/
|
17109
|
+
onFocus: PropTypes.func,
|
17110
|
+
/**
|
17111
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
17112
|
+
*/
|
17113
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
17114
|
+
/**
|
17115
|
+
* `classes` prop applied to the [`Typography`](/material-ui/api/typography/) element.
|
17116
|
+
*/
|
17117
|
+
TypographyClasses: PropTypes.object,
|
17118
|
+
/**
|
17119
|
+
* Controls when the link should have an underline.
|
17120
|
+
* @default 'always'
|
17121
|
+
*/
|
17122
|
+
underline: PropTypes.oneOf(['always', 'hover', 'none']),
|
17123
|
+
/**
|
17124
|
+
* Applies the theme typography styles.
|
17125
|
+
* @default 'inherit'
|
17126
|
+
*/
|
17127
|
+
variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body1', 'body2', 'button', 'caption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'inherit', 'overline', 'subtitle1', 'subtitle2']), PropTypes.string])
|
17128
|
+
} : void 0;
|
17129
|
+
var Link$1 = Link;
|
17130
|
+
|
16582
17131
|
const Stack = createStack({
|
16583
17132
|
createStyledComponent: styled$1('div', {
|
16584
17133
|
name: 'MuiStack',
|
@@ -17436,6 +17985,41 @@ const PageContent = styled$1(Stack$1)(({
|
|
17436
17985
|
position: "fixed",
|
17437
17986
|
width: "100%"
|
17438
17987
|
}));
|
17988
|
+
const PageHeader = page => {
|
17989
|
+
return /*#__PURE__*/React__default.createElement(ThemeProvider, {
|
17990
|
+
theme: SincoTheme
|
17991
|
+
}, /*#__PURE__*/React__default.createElement("div", {
|
17992
|
+
style: {
|
17993
|
+
minHeight: 56
|
17994
|
+
}
|
17995
|
+
}, /*#__PURE__*/React__default.createElement(PageContent, null, Array.isArray(page.breadcrumbs) && page.breadcrumbs.length > 0 && /*#__PURE__*/React__default.createElement(Breadcrumbs$1, null, page.breadcrumbs.map((element, i) => {
|
17996
|
+
return /*#__PURE__*/React__default.createElement(Link$1, {
|
17997
|
+
underline: "hover",
|
17998
|
+
color: "inherit",
|
17999
|
+
href: element.link,
|
18000
|
+
key: i
|
18001
|
+
}, element.name);
|
18002
|
+
})), /*#__PURE__*/React__default.createElement(Stack$1, {
|
18003
|
+
width: "90%",
|
18004
|
+
justifyContent: "space-between",
|
18005
|
+
flexDirection: "row",
|
18006
|
+
alignItems: "center"
|
18007
|
+
}, /*#__PURE__*/React__default.createElement(Stack$1, {
|
18008
|
+
gap: 1.5,
|
18009
|
+
flexDirection: "row",
|
18010
|
+
alignItems: "center"
|
18011
|
+
}, page.back, /*#__PURE__*/React__default.createElement(Stack$1, null, /*#__PURE__*/React__default.createElement(Typography$1, {
|
18012
|
+
variant: "h6",
|
18013
|
+
color: "text.primary"
|
18014
|
+
}, page.title), /*#__PURE__*/React__default.createElement(Typography$1, {
|
18015
|
+
variant: "caption",
|
18016
|
+
color: "text.secondary"
|
18017
|
+
}, page.subtitle))), /*#__PURE__*/React__default.createElement(Stack$1, {
|
18018
|
+
gap: 1,
|
18019
|
+
alignItems: "center",
|
18020
|
+
flexDirection: "row"
|
18021
|
+
}, page.actions)), page.tabs)));
|
18022
|
+
};
|
17439
18023
|
|
17440
18024
|
var classof$2 = classofRaw$2;
|
17441
18025
|
|
@@ -22892,4 +23476,4 @@ const useDynamicColor = url => {
|
|
22892
23476
|
};
|
22893
23477
|
};
|
22894
23478
|
|
22895
|
-
export { DrawerComponent, EmptyState, PageContent, SincoTheme, ToastNotification, UrlImage, dynamicColor, useDynamicColor };
|
23479
|
+
export { DrawerComponent, EmptyState, PageContent, PageHeader, SincoTheme, ToastNotification, UrlImage, dynamicColor, useDynamicColor };
|
package/package.json
CHANGED
@@ -1,4 +1,16 @@
|
|
1
1
|
import React from "react";
|
2
|
+
interface BreadcrumbCode {
|
3
|
+
link: string;
|
4
|
+
name: string;
|
5
|
+
}
|
6
|
+
interface Pageheader {
|
7
|
+
back?: React.ReactNode;
|
8
|
+
title?: string;
|
9
|
+
subtitle?: string;
|
10
|
+
breadcrumbs?: BreadcrumbCode[];
|
11
|
+
actions?: React.ReactNode;
|
12
|
+
tabs?: React.ReactNode;
|
13
|
+
}
|
2
14
|
export declare const PageContent: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
|
3
15
|
children?: React.ReactNode;
|
4
16
|
direction?: import("@mui/system").ResponsiveStyleValue<"column" | "column-reverse" | "row" | "row-reverse"> | undefined;
|
@@ -9,3 +21,5 @@ export declare const PageContent: import("@emotion/styled").StyledComponent<impo
|
|
9
21
|
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
10
22
|
ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
|
11
23
|
}, keyof import("@mui/material/OverridableComponent").CommonProps | "direction" | ("border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform") | "children" | "spacing" | "divider" | "useFlexGap" | "sx"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
|
24
|
+
export declare const PageHeader: (page: Pageheader) => JSX.Element;
|
25
|
+
export {};
|