[theme] Return default value for spacing when no args provided (mui#1…

…5891)

* [theme] Add default value for spacing

* Something I still see in people code

It should be more explicit

docs/src/pages/guides/migration-v3/migration-v3.md

@@ -126,9 +126,9 @@ yarn add @material-ui/styles@next
   ```
 - You can safely remove the next variant from the theme creation:
 
-  ```js
+  ```diff
   typography: {
-    useNextVariants: true,
+  - useNextVariants: true,
   },
   ```
 
@@ -143,6 +143,8 @@ yarn add @material-ui/styles@next
   }
   ```
 
+  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 migration process smoother.
+
   *Tip: you can provide more than 1 argument: theme.spacing(1, 2) // = '8px 16px'*
 
   You can use [the migration helper](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-codemod/README.md#theme-spacing-api) on your project to make this smoother.

packages/material-ui/src/styles/createSpacing.js

@@ -32,7 +32,11 @@ export default function createSpacing(spacingInput = 8) {
   }
 
   const spacing = (...args) => {
-    warning(args.length <= 4, `Too many arguments, expected [1, 4], got ${args.length}`);
+    warning(args.length <= 4, `Too many arguments, expected between 1 and 4, got ${args.length}`);
+
+    if (args.length === 0) {
+      return transform(1);
+    }
 
     if (args.length === 1) {
       return transform(args[0]);

packages/material-ui/src/styles/createSpacing.test.js

@@ -22,6 +22,14 @@ describe('createSpacing', () => {
     createSpacing(spacing);
   });
 
+  it('should support a default value when no arguments are provided', () => {
+    let spacing;
+    spacing = createSpacing();
+    assert.strictEqual(spacing(), 8);
+    spacing = createSpacing(factor => `${0.25 * factor}rem`);
+    assert.strictEqual(spacing(), '0.25rem');
+  });
+
   it('should support multiple arguments', () => {
     let spacing;
     spacing = createSpacing();