code: function marginAndPaddingStyles(scale) {
    const styles = {};
  
    shorthands.forEach(([propShorthand, prop]) => {
      directions.forEach(([directionShorthand, direction]) => {
        scale.forEach((unit, idx) => {
          styles[`${propShorthand}${directionShorthand}${idx}`] = {
            [`${prop}${direction}`]: unit,
          };
        });
      });
    });
  
    return styles;
  }
docs: Whitespace Styles
  
  Padding
  base: p
  modifiers: h, v, t, r, b, l
  scale: 0, 1, 2, 3, 4, 5, 6
  
  Margin
  base: m
  modifiers: h, v, t, r, b, l
  scale: 0, 1, 2, 3, 4, 5, 6
  
  Example:
  mb1 = marginBottom: 0.5 * rem
  ph1 = paddingHorizontal: 4 * rem