Add support for absolute widths for "spacing" values.

[sdedios]

There are a number of situations where more fine-grained control of the spacing between grid items would be very helpful. Currently, the spacing property only allows a relative value of 0-10 inclusive that rely on global / fixed spacing functions for mapping the actual widths.

A couple of suggestions:

1. Enable the passing of absolute widths in the form of string values (i.e. px, em, %) as a way of defining the gutter spacing. It would make sense that this would be a IResponsiveValue<Spacing | string> as the new spacing value.
2. Add support for spacing to support a function in the form of (breakpoint: Breakpoint) => string | number so that the spacing can be dynamically computed based on breakpoint.

The tricky thing to this is that I believe the spacing has to be pre-computed, so it might require updating the grid width class computation to use the CSS calc function, or it might not even be possible.

For example:

<Grid container spacing={{xs: "10px", sm: "16px", md: "24px"}}>
     <Grid item flex={{xs: 6, sm: 4, md: 3}}>A</Grid>
     <Grid item flex={{xs: 6, sm: 4, md: 3}}>B</Grid>
     <Grid item flex={{xs: 6, sm: 4, md: 3}}>C</Grid>
     <Grid item flex={{xs: 6, sm: 4, md: 3}}>D</Grid>
</Grid>