UNPKG

1.92 kBJavaScriptView Raw
1import { createUnarySpacing } from '@material-ui/system';
2let warnOnce;
3export default function createSpacing(spacingInput = 8) {
4 // Already transformed.
5 if (spacingInput.mui) {
6 return spacingInput;
7 } // Material Design layouts are visually balanced. Most measurements align to an 8dp grid applied, which aligns both spacing and the overall layout.
8 // Smaller components, such as icons and type, can align to a 4dp grid.
9 // https://material.io/design/layout/understanding-layout.html#usage
10
11
12 const transform = createUnarySpacing({
13 spacing: spacingInput
14 });
15
16 const spacing = (...args) => {
17 if (process.env.NODE_ENV !== 'production') {
18 if (!(args.length <= 4)) {
19 console.error(`Material-UI: Too many arguments provided, expected between 0 and 4, got ${args.length}`);
20 }
21 }
22
23 if (args.length === 0) {
24 return transform(1);
25 }
26
27 if (args.length === 1) {
28 return transform(args[0]);
29 }
30
31 return args.map(argument => {
32 if (typeof argument === 'string') {
33 return argument;
34 }
35
36 const output = transform(argument);
37 return typeof output === 'number' ? `${output}px` : output;
38 }).join(' ');
39 }; // Backward compatibility, to remove in v5.
40
41
42 Object.defineProperty(spacing, 'unit', {
43 get: () => {
44 if (process.env.NODE_ENV !== 'production') {
45 if (!warnOnce || process.env.NODE_ENV === 'test') {
46 console.error(['Material-UI: theme.spacing.unit usage has been deprecated.', 'It will be removed in v5.', 'You can replace `theme.spacing.unit * y` with `theme.spacing(y)`.', '', 'You can use the `https://github.com/mui-org/material-ui/tree/master/packages/material-ui-codemod/README.md#theme-spacing-api` migration helper to make the process smoother.'].join('\n'));
47 }
48
49 warnOnce = true;
50 }
51
52 return spacingInput;
53 }
54 });
55 spacing.mui = true;
56 return spacing;
57}
\No newline at end of file