Skip to content

pantoken-root / packages/core/src / modifyExpression

Функція: modifyExpression() ​

modifyExpression(base, modify): string

Бета

Форма CSS-виразу для applyModify: ті самі обчислення, але застосовані до base під час рендерингу (paint time) замість до hex під час збірки, тому var(--instui-…) походження зберігається в таблиці стилів і продовжує відстежувати те, до чого вирішується цей токен (включно з light-dark() парою, та будь-яким перенаправленням примітива під час виконання, від якого він походить)).

Синтаксис відносного кольору розв'язує l у шкалі 0–100 як у hsl(), так і в lch(), а опущений канал альфа успадковує значення походження — що відповідає передаванню альфи в applyModify.

Параметри ​

base ​

string

Базовий колір (літерал, var(--token) або результат вкладеного хелпера).

modify ​

TokenModify

Колірний простір, у якому працює модифікатор (наприклад, "hsl").

Повертає ​

string

Вираз color-mix().

Приклад ​

ts
import { modifyExpression } from "@pantoken/core";

modifyExpression("var(--x)", { type: "alpha", value: 0.2, space: "hsl" });
// → "color-mix(in srgb, var(--x) 20%, transparent)"
modifyExpression("var(--x)", { type: "darken", value: 0.1, space: "hsl" });
// → "hsl(from var(--x) h s calc(l * 0.9))"
modifyExpression("var(--x)", { type: "lighten", value: 0.1, space: "hsl" });
// → "hsl(from var(--x) h s calc(l + (100 - l) * 0.1))"