Skip to content

pantoken / primitives

primitives

Beta

Opt-in-Hilfsklassen für die rohe pantoken-Primitive-Palette (--instui-primitive-*).

Die semantischen Hilfsfunktionen in @pantoken/components geben absichtlich nur semantische Tokens frei — eine Farbüberschreibung dort ist immer eine Rolle (bg-brand), niemals ein rohes Farbfeld. Dieses Paket ist die Ausweichmöglichkeit: eine Klasse pro primitivem Token für den seltenen Fall, dass ein Entwickler die Palette direkt benötigt. Lade es eigenständig (@pantoken/plugin-primitives/primitives.css), getrennt von der semantischen Ebene.

Beispiel

Erzeuge das primitive Stylesheet

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); }

Schnittstellen

Funktionen

Referenzen

default

Benennt um und exportiert neu primitivesCss