pantoken / packages/plugin-kit/src / makeResolver

函式: makeResolver() ​

makeResolver(base, options?): (value) => string

Beta（測試）

建立一個解析器，將 var(--x) 參考依據 base 擴展為具體的葉節點值（外加 任何 overrides）。若使用 mode，會將 light-dark() 折疊到該分支；若不使用，則保留 light-dark() 不變。

參數 ​

base ​

唯讀 Token[]

用於解析參考的 token 集合。

options? ​

ResolveOptions

ResolveOptions.

回傳 ​

用以解析值字串的函式。

(value) => string

範例 ​

將參考鏈展開為其具體葉節點

ts
import { makeResolver } from "@pantoken/utils";
import type { Token } from "@pantoken/model";

const ir: Token[] = [
  { name: "--instui-leaf", syntax: "<color>", inherits: true, value: "#0374B5" },
  { name: "--instui-brand", syntax: "*", inherits: true, value: "var(--instui-leaf)" },
];

const resolve = makeResolver(ir);
resolve("var(--instui-brand)"); // → "#0374B5"

使用模式折疊 light-dark()，或在無模式時保留它

ts
import { makeResolver } from "@pantoken/utils";
import type { Token } from "@pantoken/model";

const ir: Token[] = [
  { name: "--instui-bg", syntax: "*", inherits: true, value: "light-dark(#fff, #000)" },
];

makeResolver(ir)("var(--instui-bg)");                 // → "light-dark(#fff, #000)"
makeResolver(ir, { mode: "light" })("var(--instui-bg)"); // → "#fff"
makeResolver(ir, { mode: "dark" })("var(--instui-bg)");  // → "#000"

使覆蓋層在名稱衝突中勝出

ts
import { makeResolver } from "@pantoken/utils";
import type { Token } from "@pantoken/model";

const ir: Token[] = [
  { name: "--instui-leaf", syntax: "<color>", inherits: true, value: "#0374B5" },
  { name: "--instui-brand", syntax: "*", inherits: true, value: "var(--instui-leaf)" },
];
const overrides: Token[] = [
  { name: "--instui-leaf", syntax: "<color>", inherits: true, value: "#000" },
];

makeResolver(ir, { overrides })("var(--instui-brand)"); // → "#000"