Skip to content

pantoken-root / packages/core/src / modifyExpression

Hàm: modifyExpression() ​

modifyExpression(base, modify): string

Beta

Dạng biểu thức CSS của applyModify: cùng công thức, nhưng được áp dụng cho base tại thời điểm vẽ thay vì cho một mã hex khi xây dựng, vì vậy một var(--instui-…) nguồn gốc tồn tại trong bảng kiểu và tiếp tục theo dõi bất cứ thứ gì token đó phân giải thành (bao gồm một light-dark() cặp, và bất kỳ việc thay đổi tham chiếu nguyên thủy lúc chạy nào mà nó được dẫn xuất từ).

Cú pháp màu tương đối phân giải l trên thang 0–100 trong cả hsl() và lch(), và một kênh alpha bị bỏ qua sẽ kế thừa của nguồn — phù hợp với cơ chế truyền alpha của applyModify.

Tham số ​

base ​

string

Màu cơ sở (giá trị literal, var(--token), hoặc kết quả của một helper lồng nhau).

modify ​

TokenModify

Không gian màu mà bộ điều chỉnh hoạt động trong đó (ví dụ "hsl").

Trả về ​

string

Một biểu thức color-mix().

Ví dụ ​

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