UNPKG

vcc-ui

Version:

A React library for building user interfaces at Volvo Cars

103 lines (102 loc) 2.42 kB
import PropTypes from 'prop-types'; import React from 'react'; import { Flex } from '../flex'; import { Text } from '../text'; const DebugColumn = _ref => { let { size = 1, children } = _ref; return /*#__PURE__*/React.createElement(Flex, { extend: { boxSizing: 'border-box', backgroundColor: 'rgba(0, 0,0,0.1)', width: 1024 / 4 * size, marginRight: 16, height: '100vh', ':last-child': { marginRight: 0 }, fromL: { width: 1368 / 12 * size, marginRight: 24, ':last-child': { marginRight: 0 } } } }, /*#__PURE__*/React.createElement(Text, { extend: { paddingLeft: 4 }, variant: "bates", subStyle: "emphasis" }, children)); }; /** @deprecated */ export const DebugGrid = _ref2 => { let { storybook = false, disabled = false } = _ref2; return /*#__PURE__*/React.createElement("div", { style: { display: disabled ? 'none' : 'block', position: 'fixed', zIndex: 10000, pointerEvents: 'none', opacity: 0.5, top: 0, left: 0, right: 0, bottom: 0, padding: storybook ? '0 24px' : 0, boxSizing: 'border-box' } }, /*#__PURE__*/React.createElement(Flex, { extend: { flexDirection: 'row', maxWidth: 1400, height: '100vh', margin: '0 auto', width: '100%', paddingLeft: 40, paddingRight: 40, boxSizing: 'border-box', backgroundColor: 'rgba(0, 0,0, 0.05)', display: 'none', fromL: { display: 'flex' } } }, [...Array(12).keys()].map(i => /*#__PURE__*/React.createElement(DebugColumn, { key: i }, i + 1))), /*#__PURE__*/React.createElement(Flex, { extend: { flexDirection: 'row', height: '100vh', margin: '0 auto', width: '100%', paddingLeft: 16, paddingRight: 16, boxSizing: 'border-box', backgroundColor: 'rgba(0, 0,0, 0.05)', display: 'flex', fromM: { paddingLeft: 24, paddingRight: 24 }, fromL: { display: 'none' } } }, [...Array(4).keys()].map(i => /*#__PURE__*/React.createElement(DebugColumn, { key: i }, i + 1)))); }; DebugGrid.propTypes = { /** Disable debug grid */ disabled: PropTypes.bool, /** Enable if using in a storybook environment */ storybook: PropTypes.bool };