Skip to content

pantoken / packages/utils/src / makeResolver

函数: makeResolver()

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

Beta

构建一个解析器,将 var(--x) 引用针对 base 展开为具体的叶值(加上 任何 overrides)。当提供 mode 时,它会将 light-dark() 折叠到该分支;否则,它会保留 light-dark() 原样。

参数

base

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