import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box } from '@workday/canvas-kit-react/layout';
const baseStyles = {
    border: 'dotted 2px',
    color: 'blackPepper500',
    display: 'inline-block',
    verticalAlign: 'bottom',
};
export const Space = () => (_jsxs("div", { children: [_jsx(Box, { backgroundColor: "cinnamon300", margin: "xxs", padding: "s", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Small" }) }), _jsx(Box, { backgroundColor: "sourLemon300", margin: "xxs", padding: "m", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Medium" }) }), _jsx(Box, { backgroundColor: "blueberry300", margin: "xxs", padding: "l", textAlign: "center", ...baseStyles, children: _jsx(Box, { border: "dotted 2px", borderColor: "blackPepper500", children: "Large" }) })] }));
