Skip to content

pantoken-root / packages/core/src / modifyExpression

Funktion: modifyExpression() ​

modifyExpression(base, modify): string

Beta

Die CSS-Ausdrucksform von applyModify: dieselben Berechnungen, aber auf base zur Renderzeit angewendet anstatt auf einen Hex-Wert zur Buildzeit, sodass eine var(--instui-…)-Quelle bis ins Stylesheet erhalten bleibt und weiterhin verfolgt, worauf dieses Token auflöst (einschließlich eines light-dark()-Paars und jeder zur Laufzeit vorgenommenen Umzuordnung der Primärvariable, von der es abgeleitet ist).

Die relative Farbsyntax löst l auf der Skala 0–100 sowohl in hsl() als auch in lch() auf, und ein weggelassener Alphakanal übernimmt den des Ursprungs — entsprechend dem Alpha-Passthrough von applyModify.

Parameter ​

base ​

string

Die Basisfarbe (Literal, var(--token) oder das Ergebnis eines geschachtelten Helpers).

modify ​

TokenModify

Der Farbraum, in dem der Modifikator arbeitet (z. B. "hsl").

Rückgabe ​

string

Ein color-mix()-Ausdruck.

Beispiel ​

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