design-system-simplefi
Version:
Design System for SimpleFi Applications
46 lines • 1.81 kB
JavaScript
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
import React from 'react';
import { Box } from 'reflexbox';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { path, pipe } from 'ramda';
import { pxToRem } from '../../../utils';
var getColWidth = function (cols) {
if (cols === 'auto')
return { flex: '1 1 auto' };
return { width: cols / 12 };
};
var getColPadding = pipe(path(['theme', 'layout', 'columnGutter']), function (gutter) { return gutter / 2; }, pxToRem);
var StyledCol = styled(Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n"])), getColPadding, getColPadding);
var Col = function (_a) {
var children = _a.children, cols = _a.cols, offset = _a.offset;
return (React.createElement(StyledCol, __assign({ ml: (100 / 12) * offset + "%" }, getColWidth(cols)), children));
};
Col.propTypes = {
cols: PropTypes.oneOfType([
PropTypes.number,
PropTypes.oneOf(['auto']),
]),
offset: PropTypes.number,
};
Col.defaultProps = {
cols: 'auto',
offset: 0,
};
export default Col;
var templateObject_1;
//# sourceMappingURL=Col.js.map