@mui/system 5.10.13 → 5.10.14
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/Box/Box.js +1 -10
- package/Box/Box.spec.d.ts +1 -1
- package/Box/index.js +0 -2
- package/CHANGELOG.md +70 -2
- package/Container/Container.d.ts +13 -13
- package/Container/Container.js +2 -17
- package/Container/ContainerProps.d.ts +40 -40
- package/Container/containerClasses.d.ts +22 -22
- package/Container/containerClasses.js +0 -3
- package/Container/createContainer.d.ts +18 -18
- package/Container/createContainer.js +15 -37
- package/Container/index.js +0 -6
- package/Stack/Stack.d.ts +13 -13
- package/Stack/Stack.js +1 -12
- package/Stack/StackProps.d.ts +42 -42
- package/Stack/createStack.d.ts +21 -21
- package/Stack/createStack.js +10 -48
- package/Stack/index.d.ts +5 -5
- package/Stack/index.js +0 -9
- package/Stack/stackClasses.d.ts +8 -8
- package/Stack/stackClasses.js +0 -3
- package/ThemeProvider/ThemeProvider.js +2 -22
- package/ThemeProvider/index.js +0 -2
- package/Unstable_Grid/Grid.d.ts +12 -12
- package/Unstable_Grid/Grid.js +6 -42
- package/Unstable_Grid/GridProps.d.ts +162 -162
- package/Unstable_Grid/createGrid.d.ts +11 -11
- package/Unstable_Grid/createGrid.js +19 -49
- package/Unstable_Grid/gridClasses.d.ts +20 -20
- package/Unstable_Grid/gridClasses.js +8 -7
- package/Unstable_Grid/gridGenerator.d.ts +29 -28
- package/Unstable_Grid/gridGenerator.js +22 -63
- package/Unstable_Grid/index.d.ts +5 -5
- package/Unstable_Grid/index.js +0 -9
- package/borders.js +0 -14
- package/breakpoints.js +3 -32
- package/colorManipulator.js +13 -55
- package/compose.js +0 -7
- package/createBox.js +5 -20
- package/createBox.spec.d.ts +1 -1
- package/createStyled.js +27 -71
- package/createTheme/createBreakpoints.js +22 -37
- package/createTheme/createSpacing.d.ts +10 -10
- package/createTheme/createSpacing.js +4 -8
- package/createTheme/createTheme.js +6 -16
- package/createTheme/index.js +0 -2
- package/cssGrid.js +0 -21
- package/cssVars/createCssVarsProvider.js +24 -72
- package/cssVars/createCssVarsProvider.spec.d.ts +1 -1
- package/cssVars/createGetCssVar.d.ts +5 -5
- package/cssVars/createGetCssVar.js +2 -7
- package/cssVars/cssVarsParser.d.ts +65 -65
- package/cssVars/cssVarsParser.js +3 -15
- package/cssVars/getInitColorSchemeScript.d.ts +42 -42
- package/cssVars/getInitColorSchemeScript.js +0 -6
- package/cssVars/index.d.ts +3 -3
- package/cssVars/index.js +0 -3
- package/cssVars/useCurrentColorScheme.d.ts +53 -53
- package/cssVars/useCurrentColorScheme.js +20 -49
- package/display.js +0 -6
- package/esm/Box/Box.js +1 -6
- package/esm/Container/Container.js +3 -14
- package/esm/Container/createContainer.js +15 -25
- package/esm/Stack/Stack.js +1 -9
- package/esm/Stack/createStack.js +10 -29
- package/esm/ThemeProvider/ThemeProvider.js +2 -11
- package/esm/Unstable_Grid/Grid.js +6 -39
- package/esm/Unstable_Grid/createGrid.js +18 -35
- package/esm/Unstable_Grid/gridClasses.js +8 -4
- package/esm/Unstable_Grid/gridGenerator.js +20 -38
- package/esm/borders.js +0 -6
- package/esm/breakpoints.js +7 -22
- package/esm/colorManipulator.js +13 -43
- package/esm/compose.js +0 -5
- package/esm/createBox.js +5 -7
- package/esm/createStyled.js +27 -64
- package/esm/createTheme/createBreakpoints.js +22 -34
- package/esm/createTheme/createSpacing.js +4 -7
- package/esm/createTheme/createTheme.js +6 -9
- package/esm/cssGrid.js +0 -9
- package/esm/cssVars/createCssVarsProvider.js +24 -58
- package/esm/cssVars/createGetCssVar.js +2 -6
- package/esm/cssVars/cssVarsParser.js +3 -11
- package/esm/cssVars/useCurrentColorScheme.js +20 -44
- package/esm/getThemeValue.js +0 -2
- package/esm/index.js +1 -2
- package/esm/memoize.js +0 -1
- package/esm/merge.js +0 -3
- package/esm/palette.js +0 -3
- package/esm/propsToClassKey.js +4 -7
- package/esm/sizing.js +0 -5
- package/esm/spacing.js +3 -23
- package/esm/style.js +2 -19
- package/esm/styleFunctionSx/extendSxProp.js +3 -10
- package/esm/styleFunctionSx/styleFunctionSx.js +3 -16
- package/esm/sx/sx.js +0 -2
- package/esm/useTheme.js +0 -2
- package/esm/useThemeProps/getThemeProps.js +0 -2
- package/esm/useThemeWithoutDefault.js +0 -3
- package/flexbox.js +0 -4
- package/getThemeValue.js +0 -14
- package/index.js +1 -55
- package/index.spec.d.ts +1 -1
- package/legacy/Box/Box.js +1 -6
- package/legacy/Container/Container.js +3 -14
- package/legacy/Container/createContainer.js +29 -39
- package/legacy/Stack/Stack.js +1 -9
- package/legacy/Stack/createStack.js +17 -37
- package/legacy/ThemeProvider/ThemeProvider.js +3 -12
- package/legacy/Unstable_Grid/Grid.js +6 -39
- package/legacy/Unstable_Grid/createGrid.js +34 -53
- package/legacy/Unstable_Grid/gridGenerator.js +36 -58
- package/legacy/borders.js +0 -6
- package/legacy/breakpoints.js +9 -28
- package/legacy/colorManipulator.js +16 -48
- package/legacy/compose.js +0 -6
- package/legacy/createBox.js +9 -11
- package/legacy/createStyled.js +27 -68
- package/legacy/createTheme/createBreakpoints.js +20 -33
- package/legacy/createTheme/createSpacing.js +4 -9
- package/legacy/createTheme/createTheme.js +7 -13
- package/legacy/cssGrid.js +0 -9
- package/legacy/cssVars/createCssVarsProvider.js +90 -129
- package/legacy/cssVars/createGetCssVar.js +2 -10
- package/legacy/cssVars/cssVarsParser.js +7 -20
- package/legacy/cssVars/getInitColorSchemeScript.js +14 -15
- package/legacy/cssVars/useCurrentColorScheme.js +43 -69
- package/legacy/getThemeValue.js +0 -3
- package/legacy/index.js +2 -3
- package/legacy/memoize.js +0 -1
- package/legacy/merge.js +0 -3
- package/legacy/palette.js +0 -3
- package/legacy/propsToClassKey.js +2 -5
- package/legacy/sizing.js +0 -5
- package/legacy/spacing.js +6 -27
- package/legacy/style.js +6 -24
- package/legacy/styleFunctionSx/extendSxProp.js +3 -11
- package/legacy/styleFunctionSx/styleFunctionSx.js +6 -21
- package/legacy/sx/sx.js +0 -2
- package/legacy/useTheme.js +0 -2
- package/legacy/useThemeProps/getThemeProps.js +2 -4
- package/legacy/useThemeProps/useThemeProps.js +2 -2
- package/legacy/useThemeWithoutDefault.js +0 -3
- package/memoize.js +0 -2
- package/merge.js +0 -5
- package/modern/Box/Box.js +1 -6
- package/modern/Container/Container.js +3 -14
- package/modern/Container/createContainer.js +15 -25
- package/modern/Stack/Stack.js +1 -9
- package/modern/Stack/createStack.js +10 -29
- package/modern/ThemeProvider/ThemeProvider.js +2 -11
- package/modern/Unstable_Grid/Grid.js +6 -39
- package/modern/Unstable_Grid/createGrid.js +18 -34
- package/modern/Unstable_Grid/gridClasses.js +8 -4
- package/modern/Unstable_Grid/gridGenerator.js +20 -36
- package/modern/borders.js +0 -6
- package/modern/breakpoints.js +7 -21
- package/modern/colorManipulator.js +13 -43
- package/modern/compose.js +0 -5
- package/modern/createBox.js +5 -7
- package/modern/createStyled.js +27 -63
- package/modern/createTheme/createBreakpoints.js +22 -34
- package/modern/createTheme/createSpacing.js +4 -7
- package/modern/createTheme/createTheme.js +6 -9
- package/modern/cssGrid.js +0 -9
- package/modern/cssVars/createCssVarsProvider.js +24 -58
- package/modern/cssVars/createGetCssVar.js +2 -6
- package/modern/cssVars/cssVarsParser.js +3 -11
- package/modern/cssVars/useCurrentColorScheme.js +20 -44
- package/modern/getThemeValue.js +0 -2
- package/modern/index.js +2 -3
- package/modern/memoize.js +0 -1
- package/modern/merge.js +0 -3
- package/modern/palette.js +0 -3
- package/modern/propsToClassKey.js +4 -7
- package/modern/sizing.js +0 -4
- package/modern/spacing.js +3 -22
- package/modern/style.js +2 -19
- package/modern/styleFunctionSx/extendSxProp.js +3 -10
- package/modern/styleFunctionSx/styleFunctionSx.js +3 -16
- package/modern/sx/sx.js +0 -2
- package/modern/useTheme.js +0 -2
- package/modern/useThemeProps/getThemeProps.js +0 -2
- package/modern/useThemeWithoutDefault.js +0 -3
- package/package.json +6 -6
- package/palette.js +0 -6
- package/positions.js +0 -6
- package/propsToClassKey.js +4 -10
- package/responsivePropType.js +0 -3
- package/shadows.js +0 -3
- package/sizing.js +0 -11
- package/spacing.js +3 -37
- package/style.js +2 -24
- package/styleFunctionSx/extendSxProp.js +3 -15
- package/styleFunctionSx/index.js +0 -5
- package/styleFunctionSx/styleFunctionSx.js +3 -21
- package/styleFunctionSx/styleFunctionSx.spec.d.ts +1 -1
- package/styled.js +0 -3
- package/sx/index.js +0 -2
- package/sx/sx.js +0 -4
- package/typography.js +0 -4
- package/useTheme.js +0 -6
- package/useThemeProps/getThemeProps.js +0 -4
- package/useThemeProps/index.js +0 -3
- package/useThemeProps/useThemeProps.js +0 -4
- package/useThemeWithoutDefault.js +0 -4
package/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/** @license MUI v5.10.
|
|
1
|
+
/** @license MUI v5.10.14
|
|
2
2
|
*
|
|
3
3
|
* This source code is licensed under the MIT license found in the
|
|
4
4
|
* LICENSE file in the root directory of this source tree.
|
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
"use strict";
|
|
7
7
|
|
|
8
8
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
9
|
-
|
|
10
9
|
Object.defineProperty(exports, "__esModule", {
|
|
11
10
|
value: true
|
|
12
11
|
});
|
|
@@ -327,11 +326,8 @@ Object.defineProperty(exports, "useThemeWithoutDefault", {
|
|
|
327
326
|
return _useThemeWithoutDefault.default;
|
|
328
327
|
}
|
|
329
328
|
});
|
|
330
|
-
|
|
331
329
|
var _styledEngine = require("@mui/styled-engine");
|
|
332
|
-
|
|
333
330
|
var _borders = _interopRequireWildcard(require("./borders"));
|
|
334
|
-
|
|
335
331
|
Object.keys(_borders).forEach(function (key) {
|
|
336
332
|
if (key === "default" || key === "__esModule") return;
|
|
337
333
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -343,15 +339,10 @@ Object.keys(_borders).forEach(function (key) {
|
|
|
343
339
|
}
|
|
344
340
|
});
|
|
345
341
|
});
|
|
346
|
-
|
|
347
342
|
var _breakpoints = _interopRequireWildcard(require("./breakpoints"));
|
|
348
|
-
|
|
349
343
|
var _compose = _interopRequireDefault(require("./compose"));
|
|
350
|
-
|
|
351
344
|
var _display = _interopRequireDefault(require("./display"));
|
|
352
|
-
|
|
353
345
|
var _flexbox = _interopRequireWildcard(require("./flexbox"));
|
|
354
|
-
|
|
355
346
|
Object.keys(_flexbox).forEach(function (key) {
|
|
356
347
|
if (key === "default" || key === "__esModule") return;
|
|
357
348
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -363,9 +354,7 @@ Object.keys(_flexbox).forEach(function (key) {
|
|
|
363
354
|
}
|
|
364
355
|
});
|
|
365
356
|
});
|
|
366
|
-
|
|
367
357
|
var _cssGrid = _interopRequireWildcard(require("./cssGrid"));
|
|
368
|
-
|
|
369
358
|
Object.keys(_cssGrid).forEach(function (key) {
|
|
370
359
|
if (key === "default" || key === "__esModule") return;
|
|
371
360
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -377,9 +366,7 @@ Object.keys(_cssGrid).forEach(function (key) {
|
|
|
377
366
|
}
|
|
378
367
|
});
|
|
379
368
|
});
|
|
380
|
-
|
|
381
369
|
var _palette = _interopRequireWildcard(require("./palette"));
|
|
382
|
-
|
|
383
370
|
Object.keys(_palette).forEach(function (key) {
|
|
384
371
|
if (key === "default" || key === "__esModule") return;
|
|
385
372
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -391,9 +378,7 @@ Object.keys(_palette).forEach(function (key) {
|
|
|
391
378
|
}
|
|
392
379
|
});
|
|
393
380
|
});
|
|
394
|
-
|
|
395
381
|
var _positions = _interopRequireWildcard(require("./positions"));
|
|
396
|
-
|
|
397
382
|
Object.keys(_positions).forEach(function (key) {
|
|
398
383
|
if (key === "default" || key === "__esModule") return;
|
|
399
384
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -405,11 +390,8 @@ Object.keys(_positions).forEach(function (key) {
|
|
|
405
390
|
}
|
|
406
391
|
});
|
|
407
392
|
});
|
|
408
|
-
|
|
409
393
|
var _shadows = _interopRequireDefault(require("./shadows"));
|
|
410
|
-
|
|
411
394
|
var _sizing = _interopRequireWildcard(require("./sizing"));
|
|
412
|
-
|
|
413
395
|
Object.keys(_sizing).forEach(function (key) {
|
|
414
396
|
if (key === "default" || key === "__esModule") return;
|
|
415
397
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -421,9 +403,7 @@ Object.keys(_sizing).forEach(function (key) {
|
|
|
421
403
|
}
|
|
422
404
|
});
|
|
423
405
|
});
|
|
424
|
-
|
|
425
406
|
var _spacing = _interopRequireWildcard(require("./spacing"));
|
|
426
|
-
|
|
427
407
|
Object.keys(_spacing).forEach(function (key) {
|
|
428
408
|
if (key === "default" || key === "__esModule") return;
|
|
429
409
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -435,11 +415,8 @@ Object.keys(_spacing).forEach(function (key) {
|
|
|
435
415
|
}
|
|
436
416
|
});
|
|
437
417
|
});
|
|
438
|
-
|
|
439
418
|
var _style = _interopRequireWildcard(require("./style"));
|
|
440
|
-
|
|
441
419
|
var _typography = _interopRequireWildcard(require("./typography"));
|
|
442
|
-
|
|
443
420
|
Object.keys(_typography).forEach(function (key) {
|
|
444
421
|
if (key === "default" || key === "__esModule") return;
|
|
445
422
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -451,19 +428,12 @@ Object.keys(_typography).forEach(function (key) {
|
|
|
451
428
|
}
|
|
452
429
|
});
|
|
453
430
|
});
|
|
454
|
-
|
|
455
431
|
var _styleFunctionSx = _interopRequireWildcard(require("./styleFunctionSx"));
|
|
456
|
-
|
|
457
432
|
var _sx = _interopRequireDefault(require("./sx"));
|
|
458
|
-
|
|
459
433
|
var _getThemeValue = _interopRequireDefault(require("./getThemeValue"));
|
|
460
|
-
|
|
461
434
|
var _Box = _interopRequireDefault(require("./Box"));
|
|
462
|
-
|
|
463
435
|
var _createBox = _interopRequireDefault(require("./createBox"));
|
|
464
|
-
|
|
465
436
|
var _createStyled = _interopRequireWildcard(require("./createStyled"));
|
|
466
|
-
|
|
467
437
|
Object.keys(_createStyled).forEach(function (key) {
|
|
468
438
|
if (key === "default" || key === "__esModule") return;
|
|
469
439
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -475,25 +445,15 @@ Object.keys(_createStyled).forEach(function (key) {
|
|
|
475
445
|
}
|
|
476
446
|
});
|
|
477
447
|
});
|
|
478
|
-
|
|
479
448
|
var _styled = _interopRequireDefault(require("./styled"));
|
|
480
|
-
|
|
481
449
|
var _createTheme = _interopRequireDefault(require("./createTheme"));
|
|
482
|
-
|
|
483
450
|
var _createBreakpoints = _interopRequireDefault(require("./createTheme/createBreakpoints"));
|
|
484
|
-
|
|
485
451
|
var _createSpacing = _interopRequireDefault(require("./createTheme/createSpacing"));
|
|
486
|
-
|
|
487
452
|
var _shape = _interopRequireDefault(require("./createTheme/shape"));
|
|
488
|
-
|
|
489
453
|
var _useThemeProps = _interopRequireWildcard(require("./useThemeProps"));
|
|
490
|
-
|
|
491
454
|
var _useTheme = _interopRequireDefault(require("./useTheme"));
|
|
492
|
-
|
|
493
455
|
var _useThemeWithoutDefault = _interopRequireDefault(require("./useThemeWithoutDefault"));
|
|
494
|
-
|
|
495
456
|
var _colorManipulator = require("./colorManipulator");
|
|
496
|
-
|
|
497
457
|
Object.keys(_colorManipulator).forEach(function (key) {
|
|
498
458
|
if (key === "default" || key === "__esModule") return;
|
|
499
459
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -505,17 +465,11 @@ Object.keys(_colorManipulator).forEach(function (key) {
|
|
|
505
465
|
}
|
|
506
466
|
});
|
|
507
467
|
});
|
|
508
|
-
|
|
509
468
|
var _ThemeProvider = _interopRequireDefault(require("./ThemeProvider"));
|
|
510
|
-
|
|
511
469
|
var _createCssVarsProvider = _interopRequireDefault(require("./cssVars/createCssVarsProvider"));
|
|
512
|
-
|
|
513
470
|
var _createGetCssVar = _interopRequireDefault(require("./cssVars/createGetCssVar"));
|
|
514
|
-
|
|
515
471
|
var _createContainer = _interopRequireDefault(require("./Container/createContainer"));
|
|
516
|
-
|
|
517
472
|
var _Container = _interopRequireWildcard(require("./Container"));
|
|
518
|
-
|
|
519
473
|
Object.keys(_Container).forEach(function (key) {
|
|
520
474
|
if (key === "default" || key === "__esModule") return;
|
|
521
475
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -527,11 +481,8 @@ Object.keys(_Container).forEach(function (key) {
|
|
|
527
481
|
}
|
|
528
482
|
});
|
|
529
483
|
});
|
|
530
|
-
|
|
531
484
|
var _Grid = _interopRequireDefault(require("./Unstable_Grid/Grid"));
|
|
532
|
-
|
|
533
485
|
var _Unstable_Grid = require("./Unstable_Grid");
|
|
534
|
-
|
|
535
486
|
Object.keys(_Unstable_Grid).forEach(function (key) {
|
|
536
487
|
if (key === "default" || key === "__esModule") return;
|
|
537
488
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -543,11 +494,8 @@ Object.keys(_Unstable_Grid).forEach(function (key) {
|
|
|
543
494
|
}
|
|
544
495
|
});
|
|
545
496
|
});
|
|
546
|
-
|
|
547
497
|
var _Stack = _interopRequireDefault(require("./Stack/Stack"));
|
|
548
|
-
|
|
549
498
|
var _Stack2 = require("./Stack");
|
|
550
|
-
|
|
551
499
|
Object.keys(_Stack2).forEach(function (key) {
|
|
552
500
|
if (key === "default" || key === "__esModule") return;
|
|
553
501
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -559,7 +507,5 @@ Object.keys(_Stack2).forEach(function (key) {
|
|
|
559
507
|
}
|
|
560
508
|
});
|
|
561
509
|
});
|
|
562
|
-
|
|
563
510
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
564
|
-
|
|
565
511
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
package/index.spec.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
package/legacy/Box/Box.js
CHANGED
|
@@ -1,25 +1,20 @@
|
|
|
1
1
|
import PropTypes from 'prop-types';
|
|
2
2
|
import createBox from '../createBox';
|
|
3
3
|
var Box = createBox();
|
|
4
|
-
process.env.NODE_ENV !== "production" ? Box.propTypes
|
|
5
|
-
/* remove-proptypes */
|
|
6
|
-
= {
|
|
4
|
+
process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
|
|
7
5
|
// ----------------------------- Warning --------------------------------
|
|
8
6
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
9
7
|
// | To update them edit the d.ts file and run "yarn proptypes" |
|
|
10
8
|
// ----------------------------------------------------------------------
|
|
11
|
-
|
|
12
9
|
/**
|
|
13
10
|
* @ignore
|
|
14
11
|
*/
|
|
15
12
|
children: PropTypes.node,
|
|
16
|
-
|
|
17
13
|
/**
|
|
18
14
|
* The component used for the root node.
|
|
19
15
|
* Either a string to use a HTML element or a component.
|
|
20
16
|
*/
|
|
21
17
|
component: PropTypes.elementType,
|
|
22
|
-
|
|
23
18
|
/**
|
|
24
19
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
25
20
|
*/
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import PropTypes from 'prop-types';
|
|
2
2
|
import createContainer from './createContainer';
|
|
3
|
+
|
|
3
4
|
/**
|
|
4
5
|
*
|
|
5
6
|
* Demos:
|
|
@@ -11,38 +12,30 @@ import createContainer from './createContainer';
|
|
|
11
12
|
*
|
|
12
13
|
* - [Container API](https://mui.com/system/api/container/)
|
|
13
14
|
*/
|
|
14
|
-
|
|
15
15
|
var Container = createContainer();
|
|
16
|
-
process.env.NODE_ENV !== "production" ? Container.propTypes
|
|
17
|
-
/* remove-proptypes */
|
|
18
|
-
= {
|
|
16
|
+
process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
|
|
19
17
|
// ----------------------------- Warning --------------------------------
|
|
20
18
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
21
19
|
// | To update them edit TypeScript types and run "yarn proptypes" |
|
|
22
20
|
// ----------------------------------------------------------------------
|
|
23
|
-
|
|
24
21
|
/**
|
|
25
22
|
* @ignore
|
|
26
23
|
*/
|
|
27
24
|
children: PropTypes.node,
|
|
28
|
-
|
|
29
25
|
/**
|
|
30
26
|
* Override or extend the styles applied to the component.
|
|
31
27
|
*/
|
|
32
28
|
classes: PropTypes.object,
|
|
33
|
-
|
|
34
29
|
/**
|
|
35
30
|
* The component used for the root node.
|
|
36
31
|
* Either a string to use a HTML element or a component.
|
|
37
32
|
*/
|
|
38
33
|
component: PropTypes.elementType,
|
|
39
|
-
|
|
40
34
|
/**
|
|
41
35
|
* If `true`, the left and right padding is removed.
|
|
42
36
|
* @default false
|
|
43
37
|
*/
|
|
44
38
|
disableGutters: PropTypes.bool,
|
|
45
|
-
|
|
46
39
|
/**
|
|
47
40
|
* Set the max-width to match the min-width of the current breakpoint.
|
|
48
41
|
* This is useful if you'd prefer to design for a fixed set of sizes
|
|
@@ -51,17 +44,13 @@ process.env.NODE_ENV !== "production" ? Container.propTypes
|
|
|
51
44
|
* @default false
|
|
52
45
|
*/
|
|
53
46
|
fixed: PropTypes.bool,
|
|
54
|
-
|
|
55
47
|
/**
|
|
56
48
|
* Determine the max-width of the container.
|
|
57
49
|
* The container width grows with the size of the screen.
|
|
58
50
|
* Set to `false` to disable `maxWidth`.
|
|
59
51
|
* @default 'lg'
|
|
60
52
|
*/
|
|
61
|
-
maxWidth: PropTypes
|
|
62
|
-
/* @typescript-to-proptypes-ignore */
|
|
63
|
-
.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
64
|
-
|
|
53
|
+
maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
65
54
|
/**
|
|
66
55
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
67
56
|
*/
|
|
@@ -18,7 +18,6 @@ var defaultCreateStyledComponent = systemStyled('div', {
|
|
|
18
18
|
return [styles.root, styles["maxWidth".concat(capitalize(String(ownerState.maxWidth)))], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
|
|
19
19
|
}
|
|
20
20
|
});
|
|
21
|
-
|
|
22
21
|
var useThemePropsDefault = function useThemePropsDefault(inProps) {
|
|
23
22
|
return useThemePropsSystem({
|
|
24
23
|
props: inProps,
|
|
@@ -26,33 +25,30 @@ var useThemePropsDefault = function useThemePropsDefault(inProps) {
|
|
|
26
25
|
defaultTheme: defaultTheme
|
|
27
26
|
});
|
|
28
27
|
};
|
|
29
|
-
|
|
30
28
|
var useUtilityClasses = function useUtilityClasses(ownerState, componentName) {
|
|
31
29
|
var getContainerUtilityClass = function getContainerUtilityClass(slot) {
|
|
32
30
|
return generateUtilityClass(componentName, slot);
|
|
33
31
|
};
|
|
34
|
-
|
|
35
32
|
var classes = ownerState.classes,
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
33
|
+
fixed = ownerState.fixed,
|
|
34
|
+
disableGutters = ownerState.disableGutters,
|
|
35
|
+
maxWidth = ownerState.maxWidth;
|
|
39
36
|
var slots = {
|
|
40
37
|
root: ['root', maxWidth && "maxWidth".concat(capitalize(String(maxWidth))), fixed && 'fixed', disableGutters && 'disableGutters']
|
|
41
38
|
};
|
|
42
39
|
return composeClasses(slots, getContainerUtilityClass, classes);
|
|
43
40
|
};
|
|
44
|
-
|
|
45
41
|
export default function createContainer() {
|
|
46
42
|
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
47
43
|
var _options$createStyled = options.createStyledComponent,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
44
|
+
createStyledComponent = _options$createStyled === void 0 ? defaultCreateStyledComponent : _options$createStyled,
|
|
45
|
+
_options$useThemeProp = options.useThemeProps,
|
|
46
|
+
useThemeProps = _options$useThemeProp === void 0 ? useThemePropsDefault : _options$useThemeProp,
|
|
47
|
+
_options$componentNam = options.componentName,
|
|
48
|
+
componentName = _options$componentNam === void 0 ? 'MuiContainer' : _options$componentNam;
|
|
53
49
|
var ContainerRoot = createStyledComponent(function (_ref) {
|
|
54
50
|
var theme = _ref.theme,
|
|
55
|
-
|
|
51
|
+
ownerState = _ref.ownerState;
|
|
56
52
|
return _extends({
|
|
57
53
|
width: '100%',
|
|
58
54
|
marginLeft: 'auto',
|
|
@@ -68,27 +64,26 @@ export default function createContainer() {
|
|
|
68
64
|
}));
|
|
69
65
|
}, function (_ref3) {
|
|
70
66
|
var theme = _ref3.theme,
|
|
71
|
-
|
|
67
|
+
ownerState = _ref3.ownerState;
|
|
72
68
|
return ownerState.fixed && Object.keys(theme.breakpoints.values).reduce(function (acc, breakpointValueKey) {
|
|
73
69
|
var breakpoint = breakpointValueKey;
|
|
74
70
|
var value = theme.breakpoints.values[breakpoint];
|
|
75
|
-
|
|
76
71
|
if (value !== 0) {
|
|
77
72
|
// @ts-ignore
|
|
78
73
|
acc[theme.breakpoints.up(breakpoint)] = {
|
|
79
74
|
maxWidth: "".concat(value).concat(theme.breakpoints.unit)
|
|
80
75
|
};
|
|
81
76
|
}
|
|
82
|
-
|
|
83
77
|
return acc;
|
|
84
78
|
}, {});
|
|
85
79
|
}, function (_ref4) {
|
|
86
80
|
var theme = _ref4.theme,
|
|
87
|
-
|
|
81
|
+
ownerState = _ref4.ownerState;
|
|
88
82
|
return _extends({}, ownerState.maxWidth === 'xs' && _defineProperty({}, theme.breakpoints.up('xs'), {
|
|
89
83
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
90
84
|
maxWidth: Math.max(theme.breakpoints.values.xs, 444)
|
|
91
|
-
}), ownerState.maxWidth &&
|
|
85
|
+
}), ownerState.maxWidth &&
|
|
86
|
+
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
92
87
|
ownerState.maxWidth !== 'xs' && _defineProperty({}, theme.breakpoints.up(ownerState.maxWidth), {
|
|
93
88
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
94
89
|
maxWidth: "".concat(theme.breakpoints.values[ownerState.maxWidth]).concat(theme.breakpoints.unit)
|
|
@@ -96,33 +91,32 @@ export default function createContainer() {
|
|
|
96
91
|
});
|
|
97
92
|
var Container = /*#__PURE__*/React.forwardRef(function Container(inProps, ref) {
|
|
98
93
|
var props = useThemeProps(inProps);
|
|
99
|
-
|
|
100
94
|
var className = props.className,
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
95
|
+
_props$component = props.component,
|
|
96
|
+
component = _props$component === void 0 ? 'div' : _props$component,
|
|
97
|
+
_props$disableGutters = props.disableGutters,
|
|
98
|
+
disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,
|
|
99
|
+
_props$fixed = props.fixed,
|
|
100
|
+
fixed = _props$fixed === void 0 ? false : _props$fixed,
|
|
101
|
+
_props$maxWidth = props.maxWidth,
|
|
102
|
+
maxWidth = _props$maxWidth === void 0 ? 'lg' : _props$maxWidth,
|
|
103
|
+
classesProp = props.classes,
|
|
104
|
+
other = _objectWithoutProperties(props, ["className", "component", "disableGutters", "fixed", "maxWidth", "classes"]);
|
|
112
105
|
var ownerState = _extends({}, props, {
|
|
113
106
|
component: component,
|
|
114
107
|
disableGutters: disableGutters,
|
|
115
108
|
fixed: fixed,
|
|
116
109
|
maxWidth: maxWidth
|
|
117
|
-
});
|
|
118
|
-
|
|
110
|
+
});
|
|
119
111
|
|
|
112
|
+
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
120
113
|
var classes = useUtilityClasses(ownerState, componentName);
|
|
121
114
|
return (
|
|
122
115
|
/*#__PURE__*/
|
|
123
116
|
// @ts-ignore theme is injected by the styled util
|
|
124
117
|
_jsx(ContainerRoot, _extends({
|
|
125
|
-
as: component
|
|
118
|
+
as: component
|
|
119
|
+
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
126
120
|
,
|
|
127
121
|
ownerState: ownerState,
|
|
128
122
|
className: clsx(classes.root, className),
|
|
@@ -130,18 +124,14 @@ export default function createContainer() {
|
|
|
130
124
|
}, other))
|
|
131
125
|
);
|
|
132
126
|
});
|
|
133
|
-
process.env.NODE_ENV !== "production" ? Container.propTypes
|
|
134
|
-
/* remove-proptypes */
|
|
135
|
-
= {
|
|
127
|
+
process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
|
|
136
128
|
children: PropTypes.node,
|
|
137
129
|
classes: PropTypes.object,
|
|
138
130
|
className: PropTypes.string,
|
|
139
131
|
component: PropTypes.elementType,
|
|
140
132
|
disableGutters: PropTypes.bool,
|
|
141
133
|
fixed: PropTypes.bool,
|
|
142
|
-
maxWidth: PropTypes
|
|
143
|
-
/* @typescript-to-proptypes-ignore */
|
|
144
|
-
.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
134
|
+
maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
145
135
|
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
146
136
|
} : void 0;
|
|
147
137
|
return Container;
|
package/legacy/Stack/Stack.js
CHANGED
|
@@ -11,39 +11,31 @@ import createStack from './createStack';
|
|
|
11
11
|
*
|
|
12
12
|
* - [Stack API](https://mui.com/system/api/stack/)
|
|
13
13
|
*/
|
|
14
|
-
|
|
15
14
|
var Stack = createStack();
|
|
16
|
-
process.env.NODE_ENV !== "production" ? Stack.propTypes
|
|
17
|
-
/* remove-proptypes */
|
|
18
|
-
= {
|
|
15
|
+
process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ = {
|
|
19
16
|
// ----------------------------- Warning --------------------------------
|
|
20
17
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
21
18
|
// | To update them edit TypeScript types and run "yarn proptypes" |
|
|
22
19
|
// ----------------------------------------------------------------------
|
|
23
|
-
|
|
24
20
|
/**
|
|
25
21
|
* The content of the component.
|
|
26
22
|
*/
|
|
27
23
|
children: PropTypes.node,
|
|
28
|
-
|
|
29
24
|
/**
|
|
30
25
|
* Defines the `flex-direction` style property.
|
|
31
26
|
* It is applied for all screen sizes.
|
|
32
27
|
* @default 'column'
|
|
33
28
|
*/
|
|
34
29
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
35
|
-
|
|
36
30
|
/**
|
|
37
31
|
* Add an element between each child.
|
|
38
32
|
*/
|
|
39
33
|
divider: PropTypes.node,
|
|
40
|
-
|
|
41
34
|
/**
|
|
42
35
|
* Defines the space between immediate children.
|
|
43
36
|
* @default 0
|
|
44
37
|
*/
|
|
45
38
|
spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
46
|
-
|
|
47
39
|
/**
|
|
48
40
|
* The system prop, which allows defining system overrides as well as additional CSS styles.
|
|
49
41
|
*/
|
|
@@ -22,7 +22,6 @@ var defaultCreateStyledComponent = systemStyled('div', {
|
|
|
22
22
|
return styles.root;
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
|
-
|
|
26
25
|
function useThemePropsDefault(props) {
|
|
27
26
|
return useThemePropsSystem({
|
|
28
27
|
props: props,
|
|
@@ -30,6 +29,7 @@ function useThemePropsDefault(props) {
|
|
|
30
29
|
defaultTheme: defaultTheme
|
|
31
30
|
});
|
|
32
31
|
}
|
|
32
|
+
|
|
33
33
|
/**
|
|
34
34
|
* Return an array with the separator React element interspersed between
|
|
35
35
|
* each React node of the input children.
|
|
@@ -37,23 +37,18 @@ function useThemePropsDefault(props) {
|
|
|
37
37
|
* > joinChildren([1,2,3], 0)
|
|
38
38
|
* [1,0,2,0,3]
|
|
39
39
|
*/
|
|
40
|
-
|
|
41
|
-
|
|
42
40
|
function joinChildren(children, separator) {
|
|
43
41
|
var childrenArray = React.Children.toArray(children).filter(Boolean);
|
|
44
42
|
return childrenArray.reduce(function (output, child, index) {
|
|
45
43
|
output.push(child);
|
|
46
|
-
|
|
47
44
|
if (index < childrenArray.length - 1) {
|
|
48
45
|
output.push( /*#__PURE__*/React.cloneElement(separator, {
|
|
49
46
|
key: "separator-".concat(index)
|
|
50
47
|
}));
|
|
51
48
|
}
|
|
52
|
-
|
|
53
49
|
return output;
|
|
54
50
|
}, []);
|
|
55
51
|
}
|
|
56
|
-
|
|
57
52
|
var getSideFromDirection = function getSideFromDirection(direction) {
|
|
58
53
|
return {
|
|
59
54
|
row: 'Left',
|
|
@@ -62,11 +57,9 @@ var getSideFromDirection = function getSideFromDirection(direction) {
|
|
|
62
57
|
'column-reverse': 'Bottom'
|
|
63
58
|
}[direction];
|
|
64
59
|
};
|
|
65
|
-
|
|
66
60
|
export var style = function style(_ref) {
|
|
67
61
|
var ownerState = _ref.ownerState,
|
|
68
|
-
|
|
69
|
-
|
|
62
|
+
theme = _ref.theme;
|
|
70
63
|
var styles = _extends({
|
|
71
64
|
display: 'flex',
|
|
72
65
|
flexDirection: 'column'
|
|
@@ -80,14 +73,12 @@ export var style = function style(_ref) {
|
|
|
80
73
|
flexDirection: propValue
|
|
81
74
|
};
|
|
82
75
|
}));
|
|
83
|
-
|
|
84
76
|
if (ownerState.spacing) {
|
|
85
77
|
var transformer = createUnarySpacing(theme);
|
|
86
78
|
var base = Object.keys(theme.breakpoints.values).reduce(function (acc, breakpoint) {
|
|
87
79
|
if (_typeof(ownerState.spacing) === 'object' && ownerState.spacing[breakpoint] != null || _typeof(ownerState.direction) === 'object' && ownerState.direction[breakpoint] != null) {
|
|
88
80
|
acc[breakpoint] = true;
|
|
89
81
|
}
|
|
90
|
-
|
|
91
82
|
return acc;
|
|
92
83
|
}, {});
|
|
93
84
|
var directionValues = resolveBreakpointValues({
|
|
@@ -98,18 +89,15 @@ export var style = function style(_ref) {
|
|
|
98
89
|
values: ownerState.spacing,
|
|
99
90
|
base: base
|
|
100
91
|
});
|
|
101
|
-
|
|
102
92
|
if (_typeof(directionValues) === 'object') {
|
|
103
93
|
Object.keys(directionValues).forEach(function (breakpoint, index, breakpoints) {
|
|
104
94
|
var directionValue = directionValues[breakpoint];
|
|
105
|
-
|
|
106
95
|
if (!directionValue) {
|
|
107
96
|
var previousDirectionValue = index > 0 ? directionValues[breakpoints[index - 1]] : 'column';
|
|
108
97
|
directionValues[breakpoint] = previousDirectionValue;
|
|
109
98
|
}
|
|
110
99
|
});
|
|
111
100
|
}
|
|
112
|
-
|
|
113
101
|
var styleFromPropValue = function styleFromPropValue(propValue, breakpoint) {
|
|
114
102
|
return {
|
|
115
103
|
'& > :not(style) + :not(style)': _defineProperty({
|
|
@@ -117,24 +105,21 @@ export var style = function style(_ref) {
|
|
|
117
105
|
}, "margin".concat(getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)), getValue(transformer, propValue))
|
|
118
106
|
};
|
|
119
107
|
};
|
|
120
|
-
|
|
121
108
|
styles = deepmerge(styles, handleBreakpoints({
|
|
122
109
|
theme: theme
|
|
123
110
|
}, spacingValues, styleFromPropValue));
|
|
124
111
|
}
|
|
125
|
-
|
|
126
112
|
styles = mergeBreakpointsInOrder(theme.breakpoints, styles);
|
|
127
113
|
return styles;
|
|
128
114
|
};
|
|
129
115
|
export default function createStack() {
|
|
130
116
|
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
131
117
|
var _options$createStyled = options.createStyledComponent,
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
118
|
+
createStyledComponent = _options$createStyled === void 0 ? defaultCreateStyledComponent : _options$createStyled,
|
|
119
|
+
_options$useThemeProp = options.useThemeProps,
|
|
120
|
+
useThemeProps = _options$useThemeProp === void 0 ? useThemePropsDefault : _options$useThemeProp,
|
|
121
|
+
_options$componentNam = options.componentName,
|
|
122
|
+
componentName = _options$componentNam === void 0 ? 'MuiStack' : _options$componentNam;
|
|
138
123
|
var useUtilityClasses = function useUtilityClasses() {
|
|
139
124
|
var slots = {
|
|
140
125
|
root: ['root']
|
|
@@ -143,23 +128,20 @@ export default function createStack() {
|
|
|
143
128
|
return generateUtilityClass(componentName, slot);
|
|
144
129
|
}, {});
|
|
145
130
|
};
|
|
146
|
-
|
|
147
131
|
var StackRoot = createStyledComponent(style);
|
|
148
132
|
var Stack = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
|
|
149
133
|
var themeProps = useThemeProps(inProps);
|
|
150
134
|
var props = extendSxProp(themeProps); // `color` type conflicts with html color attribute.
|
|
151
|
-
|
|
152
135
|
var _props$component = props.component,
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
136
|
+
component = _props$component === void 0 ? 'div' : _props$component,
|
|
137
|
+
_props$direction = props.direction,
|
|
138
|
+
direction = _props$direction === void 0 ? 'column' : _props$direction,
|
|
139
|
+
_props$spacing = props.spacing,
|
|
140
|
+
spacing = _props$spacing === void 0 ? 0 : _props$spacing,
|
|
141
|
+
divider = props.divider,
|
|
142
|
+
children = props.children,
|
|
143
|
+
className = props.className,
|
|
144
|
+
other = _objectWithoutProperties(props, ["component", "direction", "spacing", "divider", "children", "className"]);
|
|
163
145
|
var ownerState = {
|
|
164
146
|
direction: direction,
|
|
165
147
|
spacing: spacing
|
|
@@ -174,9 +156,7 @@ export default function createStack() {
|
|
|
174
156
|
children: divider ? joinChildren(children, divider) : children
|
|
175
157
|
}));
|
|
176
158
|
});
|
|
177
|
-
process.env.NODE_ENV !== "production" ? Stack.propTypes
|
|
178
|
-
/* remove-proptypes */
|
|
179
|
-
= {
|
|
159
|
+
process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ = {
|
|
180
160
|
children: PropTypes.node,
|
|
181
161
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
182
162
|
divider: PropTypes.node,
|