@redocly/theme 0.1.2 → 0.1.5

package/utils/media-css.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateMediaQueries = exports.breakpoints = void 0;
+exports.breakpoints = { small: '50rem', medium: '85rem', large: '105rem' };
+function generateMediaQueries(breakpoints) {
+    var result = { print: '@media print' };
+    for (var _i = 0, _a = Object.entries(breakpoints); _i < _a.length; _i++) {
+        var _b = _a[_i], key = _b[0], value = _b[1];
+        result[key] = "@media screen and (min-width: ".concat(value, ")");
+    }
+    return result;
+}
+exports.generateMediaQueries = generateMediaQueries;

package/utils/theme-helpers.d.ts

@@ -0,0 +1,3 @@
+import type { FlattenSimpleInterpolation } from 'styled-components';
+export declare function getTypographyCssRulesByComponentName(componentName: string, fallbackName?: string): Record<string, string>;
+export declare function typography(componentName: string, fallbackName?: string): FlattenSimpleInterpolation;

package/utils/theme-helpers.js

@@ -0,0 +1,32 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.typography = exports.getTypographyCssRulesByComponentName = void 0;
+var styled_components_1 = require("styled-components");
+var typographyProperties = Object.entries({
+    fontSize: 'font-size',
+    fontWeight: 'font-weight',
+    fontFamily: 'font-family',
+    lineHeight: 'line-height',
+    color: 'color',
+    textTransform: 'text-transform',
+});
+function getTypographyCssRulesByComponentName(componentName, fallbackName) {
+    var result = {};
+    for (var _i = 0, typographyProperties_1 = typographyProperties; _i < typographyProperties_1.length; _i++) {
+        var _a = typographyProperties_1[_i], styledPropertyName = _a[0], cssPropertyName = _a[1];
+        var cssVariable = "--".concat(componentName, "-").concat(cssPropertyName);
+        var fallbackVariable = fallbackName ? ",var(--".concat(fallbackName, "-").concat(cssPropertyName, ")") : '';
+        result[styledPropertyName] = "var(".concat(cssVariable).concat(fallbackVariable, ")");
+    }
+    return result;
+}
+exports.getTypographyCssRulesByComponentName = getTypographyCssRulesByComponentName;
+function typography(componentName, fallbackName) {
+    return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", "\n  "], ["\n    ", "\n  "])), getTypographyCssRulesByComponentName(componentName, fallbackName));
+}
+exports.typography = typography;
+var templateObject_1;