pantoken-root / packages/core/src / modifyExpression

Fonction: modifyExpression() ​

modifyExpression(base, modify): string

Bêta

La forme d'expression CSS de applyModify: mêmes calculs, mais appliqués à base au moment du rendu plutôt qu'à un hexadécimal au moment de la compilation, donc une origine var(--instui-…) survit dans la feuille de style et continue de suivre ce à quoi ce jeton résout (y compris une paire light-dark(), et toute réaffectation d'exécution du primitif dont il dérive)).

La syntaxe de couleur relative résout l sur l'échelle 0–100 dans les deux hsl() et lch(), et un canal alpha omis hérite de celui de l'origine — correspondant au passage de l'alpha de applyModify.

Paramètres ​

base ​

string

La couleur de base (littérale, var(--token) ou le résultat d'une fonction utilitaire imbriquée).

modify ​

TokenModify

L'espace colorimétrique dans lequel le modificateur agit (p. ex. "hsl").

Retourne ​

string

Une expression color-mix().

Exemple ​

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))"