@workday/canvas-kit-react
Version:
The parent module that contains all Workday Canvas Kit React components
109 lines (108 loc) • 2.46 kB
JavaScript
import { buildStyleFns, buildStylePropFn } from './buildStyleFns';
export const spaceStyleFnConfigs = [
{
name: 'marginInlineStart',
properties: ['marginInlineStart'],
system: 'space',
},
{
name: 'marginInlineEnd',
properties: ['marginInlineEnd'],
system: 'space',
},
{
name: 'paddingInlineStart',
properties: ['paddingInlineStart'],
system: 'space',
},
{
name: 'paddingInlineEnd',
properties: ['paddingInlineEnd'],
system: 'space',
},
{
name: 'margin',
properties: ['margin'],
system: 'space',
},
{
name: 'marginX',
properties: ['marginLeft', 'marginRight'],
system: 'space',
},
{
name: 'marginY',
properties: ['marginTop', 'marginBottom'],
system: 'space',
},
{
name: 'marginTop',
properties: ['marginTop'],
system: 'space',
},
{
name: 'marginRight',
properties: ['marginRight'],
system: 'space',
},
{
name: 'marginBottom',
properties: ['marginBottom'],
system: 'space',
},
{
name: 'marginLeft',
properties: ['marginLeft'],
system: 'space',
},
{
name: 'padding',
properties: ['padding'],
system: 'space',
},
{
name: 'paddingX',
properties: ['paddingLeft', 'paddingRight'],
system: 'space',
},
{
name: 'paddingY',
properties: ['paddingTop', 'paddingBottom'],
system: 'space',
},
{
name: 'paddingTop',
properties: ['paddingTop'],
system: 'space',
},
{
name: 'paddingRight',
properties: ['paddingRight'],
system: 'space',
},
{
name: 'paddingBottom',
properties: ['paddingBottom'],
system: 'space',
},
{
name: 'paddingLeft',
properties: ['paddingLeft'],
system: 'space',
},
];
export const spaceStyleFns = buildStyleFns(spaceStyleFnConfigs);
/**
* A style prop function that takes component props and returns space styles.
* If no `SpaceStyleProps` are found, it returns an empty object.
*
* @example
* ```tsx
* const BoxExample = () => (
* <Box padding="xs" margin="m">
* Hello, space!
* </Box>
* );
* ```
*/
export const space = buildStylePropFn(spaceStyleFns);