Skip to content

pantoken / packages/utils/src / makeResolver

함수: makeResolver()

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

베타

base를 기준으로 var(--x) 참조를 구체적인 리프 값으로 확장하는 해결자(resolver)를 작성합니다(및 any overrides). With mode it collapses light-dark() to that branch; without, it leaves light-dark() in place.

매개변수

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"