pantoken-root / packages/core/src / modifyExpression

Función: modifyExpression() ​

modifyExpression(base, modify): string

Beta

La forma de expresión CSS de applyModify: las mismas operaciones, pero aplicadas a base en tiempo de pintura en lugar de a un hex en tiempo de compilación, por lo que un origen var(--instui-…) como var(--instui-…) sobrevive en la hoja de estilos y continúa rastreando a lo que ese token se resuelva (incluyendo un par light-dark(), y cualquier reorientación en tiempo de ejecución de la primitiva de la que deriva)).

La sintaxis de color relativa resuelve l en la escala 0–100 tanto en hsl() como en lch(), y un canal alfa omitido hereda el del origen — coincidiendo con el paso de alfa de applyModify.

Parámetros ​

base ​

string

El color base (literal, var(--token) o el resultado de un helper anidado).

modify ​

TokenModify

El espacio de color en el que opera el modificador (p. ej., "hsl").

Devuelve ​

string

Una expresión color-mix().

Ejemplo ​

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