1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 |
|
5 | Object.defineProperty(exports, "__esModule", {
|
6 | value: true
|
7 | });
|
8 | exports.isUnitless = isUnitless;
|
9 | exports.getUnit = getUnit;
|
10 | exports.toUnitless = toUnitless;
|
11 | exports.convertLength = convertLength;
|
12 | exports.alignProperty = alignProperty;
|
13 | exports.fontGrid = fontGrid;
|
14 | exports.responsiveProperty = responsiveProperty;
|
15 |
|
16 | var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
17 |
|
18 | function isUnitless(value) {
|
19 | return String(parseFloat(value)).length === String(value).length;
|
20 | }
|
21 |
|
22 |
|
23 |
|
24 |
|
25 | function getUnit(input) {
|
26 | return String(input).match(/[\d.\-+]*\s*(.*)/)[1] || '';
|
27 | }
|
28 |
|
29 |
|
30 | function toUnitless(length) {
|
31 | return parseFloat(length);
|
32 | }
|
33 |
|
34 |
|
35 |
|
36 | function convertLength(baseFontSize) {
|
37 | return function (length, toUnit) {
|
38 | var fromUnit = getUnit(length);
|
39 |
|
40 | if (fromUnit === toUnit) {
|
41 | return length;
|
42 | }
|
43 |
|
44 |
|
45 | var pxLength = toUnitless(length);
|
46 |
|
47 | if (fromUnit !== 'px') {
|
48 | if (fromUnit === 'em') {
|
49 | pxLength = toUnitless(length) * toUnitless(baseFontSize);
|
50 | } else if (fromUnit === 'rem') {
|
51 | pxLength = toUnitless(length) * toUnitless(baseFontSize);
|
52 | return length;
|
53 | }
|
54 | }
|
55 |
|
56 |
|
57 | var outputLength = pxLength;
|
58 |
|
59 | if (toUnit !== 'px') {
|
60 | if (toUnit === 'em') {
|
61 | outputLength = pxLength / toUnitless(baseFontSize);
|
62 | } else if (toUnit === 'rem') {
|
63 | outputLength = pxLength / toUnitless(baseFontSize);
|
64 | } else {
|
65 | return length;
|
66 | }
|
67 | }
|
68 |
|
69 | return parseFloat(outputLength.toFixed(5)) + toUnit;
|
70 | };
|
71 | }
|
72 |
|
73 | function alignProperty(_ref) {
|
74 | var size = _ref.size,
|
75 | grid = _ref.grid;
|
76 | var sizeBelow = size - size % grid;
|
77 | var sizeAbove = sizeBelow + grid;
|
78 | return size - sizeBelow < sizeAbove - size ? sizeBelow : sizeAbove;
|
79 | }
|
80 |
|
81 |
|
82 |
|
83 |
|
84 | function fontGrid(_ref2) {
|
85 | var lineHeight = _ref2.lineHeight,
|
86 | pixels = _ref2.pixels,
|
87 | htmlFontSize = _ref2.htmlFontSize;
|
88 | return pixels / (lineHeight * htmlFontSize);
|
89 | }
|
90 |
|
91 |
|
92 |
|
93 |
|
94 |
|
95 |
|
96 |
|
97 |
|
98 |
|
99 |
|
100 |
|
101 |
|
102 |
|
103 |
|
104 |
|
105 |
|
106 |
|
107 |
|
108 |
|
109 |
|
110 |
|
111 |
|
112 |
|
113 |
|
114 |
|
115 |
|
116 |
|
117 |
|
118 |
|
119 |
|
120 |
|
121 |
|
122 |
|
123 |
|
124 | function responsiveProperty(_ref3) {
|
125 | var cssProperty = _ref3.cssProperty,
|
126 | min = _ref3.min,
|
127 | max = _ref3.max,
|
128 | _ref3$unit = _ref3.unit,
|
129 | unit = _ref3$unit === void 0 ? 'rem' : _ref3$unit,
|
130 | _ref3$breakpoints = _ref3.breakpoints,
|
131 | breakpoints = _ref3$breakpoints === void 0 ? [600, 960, 1280] : _ref3$breakpoints,
|
132 | _ref3$transform = _ref3.transform,
|
133 | transform = _ref3$transform === void 0 ? null : _ref3$transform;
|
134 | var output = (0, _defineProperty2.default)({}, cssProperty, "".concat(min).concat(unit));
|
135 | var factor = (max - min) / breakpoints[breakpoints.length - 1];
|
136 | breakpoints.forEach(function (breakpoint) {
|
137 | var value = min + factor * breakpoint;
|
138 |
|
139 | if (transform !== null) {
|
140 | value = transform(value);
|
141 | }
|
142 |
|
143 | output["@media (min-width:".concat(breakpoint, "px)")] = (0, _defineProperty2.default)({}, cssProperty, "".concat(Math.round(value * 10000) / 10000).concat(unit));
|
144 | });
|
145 | return output;
|
146 | } |
\ | No newline at end of file |