@navinc/base-react-components
Version:
Nav's Pattern Library
34 lines • 901 B
JavaScript
export const spaceKeyNumbers = [0, 25, 50, 75, 100, 150, 200, 250, 300, 350, 400, 500, 600, 800, 1000];
export const spacing = {
// Small
space0: '0px',
space25: '2px',
space50: '4px',
space75: '6px',
space100: '8px',
// Medium
space150: '12px',
space200: '16px',
space250: '20px',
space300: '24px',
space350: '28px',
// Large
space400: '32px',
space500: '40px',
space600: '48px',
space800: '64px',
space1000: '80px',
};
/**
* Returns a string of space values separated by spaces.
*
* @example
* space(200) // '16px'
* space(200, 400) // '16px 32px'
* space(200, 400, 600) // '16px 32px 48px'
* space(200, 400, 600, 800) // '16px 32px 48px 64px'
*/
export const space = (...spacesNumbers) => {
return spacesNumbers.map((spaceNumber) => spacing[`space${spaceNumber}`]).join(' ');
};
//# sourceMappingURL=spacing.js.map