pantoken / packages/utils/src / makeResolver

関数: makeResolver() ​

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

ベータ

var(--x) の参照を base に対して具体的な末端値に展開するリゾルバを構築します（および 任意の overrides）。mode がある場合は light-dark() をそのブランチに畳み、ない場合は light-dark() をそのままにします。

パラメーター ​

base ​

読み取り専用 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"