@sinco/react 1.0.10-rc.28 → 1.0.10-rc.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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 {};
|