@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 CHANGED
@@ -6199,7 +6199,7 @@ const internal_processStyles = (tag, processor) => {
6199
6199
  }
6200
6200
  };
6201
6201
 
6202
- const _excluded$t = ["values", "unit", "step"];
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$t);
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$s = ["breakpoints", "palette", "spacing", "shape"];
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$s);
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$r = ["sx"];
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$r);
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$q = ["className", "component"];
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$q);
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$p = ["variant"];
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$p);
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$o = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
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$o);
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$n = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
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$n);
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$m = ["mode", "contrastThreshold", "tonalOffset"];
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$m);
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$l = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
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$l);
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$k = ["duration", "easing", "delay"];
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$k);
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$j = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
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$j);
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$i = ["theme"];
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$i);
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$h = ["elementType", "externalSlotProps", "ownerState"];
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$h);
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$g = ["children", "closeAfterTransition", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onKeyDown", "open", "onTransitionEnter", "onTransitionExited", "slotProps", "slots"];
9840
- const useUtilityClasses$c = ownerState => {
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$g);
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$c(ownerState);
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$f = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
10204
- const useUtilityClasses$b = ownerState => {
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$f);
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$b(ownerState);
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$e = ["className", "component", "elevation", "square", "variant"];
12778
- const useUtilityClasses$a = ownerState => {
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$e);
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$a(ownerState);
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$d = ["center", "classes", "className"];
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$d);
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$c = ["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"];
13321
- const useUtilityClasses$9 = ownerState => {
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$c);
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$9(ownerState);
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$b = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
13787
- const useUtilityClasses$8 = ownerState => {
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$b);
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$8(ownerState);
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$a = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
13982
- const useUtilityClasses$7 = ownerState => {
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$a);
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$7(ownerState);
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$9 = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
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$9);
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$8 = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
14362
- const useUtilityClasses$6 = ownerState => {
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$8);
14427
+ other = _objectWithoutPropertiesLoose(props, _excluded$b);
14417
14428
  const ownerState = _extends({}, props, {
14418
14429
  component,
14419
14430
  invisible
14420
14431
  });
14421
- const classes = useUtilityClasses$6(ownerState);
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$7 = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"];
14581
- const useUtilityClasses$5 = ownerState => {
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$7);
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$5(ownerState);
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$6 = ["className", "raised"];
14945
- const useUtilityClasses$4 = ownerState => {
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$6);
15296
+ other = _objectWithoutPropertiesLoose(props, _excluded$7);
14973
15297
  const ownerState = _extends({}, props, {
14974
15298
  raised
14975
15299
  });
14976
- const classes = useUtilityClasses$4(ownerState);
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$5 = ["className", "component"];
15024
- const useUtilityClasses$3 = ownerState => {
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$5);
15378
+ other = _objectWithoutPropertiesLoose(props, _excluded$6);
15055
15379
  const ownerState = _extends({}, props, {
15056
15380
  component
15057
15381
  });
15058
- const classes = useUtilityClasses$3(ownerState);
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$4 = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "open", "slotProps", "slots", "theme"];
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$4);
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$3 = ["absolute", "children", "className", "component", "flexItem", "light", "orientation", "role", "textAlign", "variant"];
15399
- const useUtilityClasses$2 = ownerState => {
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$3);
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$2(ownerState);
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$2 = ["addEndListener", "appear", "children", "container", "direction", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
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$2);
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$1 = ["BackdropProps"],
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$1 = ownerState => {
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$1),
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$1(ownerState);
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,6 +1,6 @@
1
1
  {
2
2
  "name": "@sinco/react",
3
- "version": "1.0.10-rc.28",
3
+ "version": "1.0.10-rc.29",
4
4
  "description": "package for the configuration of mui react sinco",
5
5
  "private": false,
6
6
  "license": "MIT",
@@ -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 {};