pantoken / primitives

primitives ​

Beta

Các lớp tiện ích tùy chọn cho bảng màu nguyên thủy pantoken thô (--instui-primitive-*).

Các tiện ích ngữ nghĩa trong @pantoken/components cố tình chỉ lộ các token ngữ nghĩa — một ghi đè màu ở đó luôn là một role (bg-brand), không bao giờ là một mẫu màu thô. Gói này là lối thoát: một lớp cho mỗi token nguyên thủy trong trường hợp hiếm hoi khi nhà phát triển cần truy cập trực tiếp bảng màu. Tải nó riêng biệt (@pantoken/plugin-primitives/primitives.css), tách khỏi tầng ngữ nghĩa.

Ví dụ ​

Xây dựng stylesheet nguyên thủy

ts
import { primitivesCss } from "@pantoken/plugin-primitives";
import { tokens } from "@pantoken/tokens";

const names = (p: string) => tokens.filter((t) => t.name.startsWith(p)).map((t) => t.name);
const css = primitivesCss({
  color: names("--instui-primitive-color-"),
  fontFamily: names("--instui-primitive-font-family-"),
  fontWeight: names("--instui-primitive-font-weight-"),
});
// .instui-bg-primitive-color-white { background: var(--instui-primitive-color-white); }

Giao diện ​

Hàm ​

Tham chiếu ​

default ​

Đổi tên và xuất lại primitivesCss