@skbkontur/react-ui 6.4.1 → 6.4.2-static-css.0

package/lib/theming/themeToCssVars.d.ts

@@ -0,0 +1,47 @@
+import type { Theme } from './Theme.js';
+/**
+ * Префикс всех CSS-переменных темы.
+ * Без префикса потребитель не отличит переменные react-ui от своих.
+ */
+export declare const THEME_CSS_VAR_PREFIX = "--kontur-";
+/**
+ * Имя CSS-переменной для переменной темы.
+ * Имя переменной темы не переименовывается в kebab-case, чтобы его можно было
+ * один в один сопоставить с документацией темы: `btnBgDefault` -> `--kontur-btnBgDefault`.
+ */
+export declare function getThemeCssVarName(themeKey: string): string;
+/**
+ * Собирает пары «имя CSS-переменной — значение» для всех переменных темы.
+ *
+ * Проброски и шаблоны превращаются в ссылки `var(--kontur-<источник>)`, а арифметические
+ * геттеры — в `calc()` из тех же ссылок, чтобы переопределение одной переменной
+ * автоматически меняло все производные от неё. Остальные значения эмитируются литералом.
+ *
+ * @param theme Объект темы
+ * @returns Объект вида `{ '--kontur-bgSecondary': 'var(--kontur-bgDefault)' }`
+ */
+export declare function themeToCssVarsMap(theme: Theme): Record<string, string>;
+/**
+ * Подпись темы: её значения, а не сгенерированный из них CSS.
+ *
+ * Из подписи считается имя класса-носителя, и потому она обязана быть
+ * устойчивой к сборке приложения. Текст блока таким свойством не обладает:
+ * `calc()` собирается из исходного текста геттера, и минификатор потребителя
+ * сворачивает в нём константы — `* (8 - 1)` превращается в `* 7`. Значение то
+ * же, текст другой, хеш другой, и совпасть с извлечённым на сборке файлом ему
+ * уже нечем. Сами же значения темы минификатор не меняет.
+ *
+ * @param theme Объект темы
+ * @returns Строка вида `bgDefault:#fff;btnBgDefault:…`
+ */
+export declare function themeValuesSignature(theme: Theme): string;
+/**
+ * Превращает тему в блок объявлений CSS-переменных.
+ *
+ * Блок не обёрнут в селектор — это делает вызывающий код,
+ * например `:root { ... }` или `.my-scope { ... }`.
+ *
+ * @param theme Объект темы
+ * @returns Строка объявлений, по одному на строку
+ */
+export declare function themeToCssVars(theme: Theme): string;