Die Paketkarte

pantoken ist ein Monorepo aus kleinen, zweckgebundenen Paketen, die in Buckets gruppiert sind. Installiere dasjenige, das zu deiner Aufgabe passt, oder installiere das vereinheitlichte pantoken-Paket und importiere aus seinen Subpfaden (zum Beispiel pantoken/css, pantoken/react, pantoken/tailwind).

Kern

Das gemeinsame Modell und der Transformer, auf dem alles andere aufbaut.

Package	Was es tut
@pantoken/model	Abhängigkeitsfreie TypeScript-Typen: die Token-Form und der Plugin-Vertrag.
@pantoken/core	Löst die Upstream-Tokens und Icons in die kanonische IR auf und rendert CSS.
@pantoken/tokens	Die aufgelöste IR als eingebettetes statisches JSON, pro Theme, plus die rohe Tokens Studio-Quelle.
@pantoken/utils	Der Token-Resolver, Referenz-Regexes, Case- und Farbhelfer, Drift-Checks und die Token→Utility-Class-Emitter.
@pantoken/plugin-kit	Pantoken-Plugins bauen und zusammensetzen mit definePlugin.
@pantoken/cli	pantoken generate <target> — native und plattformspezifische Quellen ausgeben.

Formate

Wandelt die Tokens in ein Dateiformat um.

Package	Ausgabe
@pantoken/css	@property-typisierte CSS mit light-dark() und data-URI-Icons.
@pantoken/scss	SCSS-Variablen, auf einen einzigen Modus aufgelöst.
@pantoken/less	Less-Variablen.
@pantoken/stylus	Stylus-Variablen.
@pantoken/dtcg	Ein W3C Design Tokens (DTCG) Dokument.
@pantoken/tokens	Die IR als JavaScript und JSON (auch unter Kern gelistet).
@pantoken/icons	Eine ergonomische Sicht auf die Icon-Tokens.
@pantoken/icon-font	Eine Icon-Webschrift (TTF, WOFF2) plus ihr CSS.
@pantoken/components	Eine InstUI-ähnliche CSS-Komponentenbibliothek (Button, Alert, Table und mehr) plus ein Basis-Reset mit Focus-Ring, Prose-Styling, Querschnitts-Utilities und Markenfonts. Siehe Components.

Renderer

Framework- und Tool-Integrationen.

Package	Für
@pantoken/react	React-Hooks, <Icon> und einen Token-Provider.
@pantoken/vue, @pantoken/svelte, @pantoken/angular	Das Web-Component, in jedes Framework eingebunden.
@pantoken/react-native	StyleSheet-freundliche Token-Objekte (keine CSS-Variablen).
@pantoken/web-components	<instui-icon> und gestylte Primitives, framework-agnostisch.
@pantoken/astro	Token-Setup für Astro-Seiten.
@pantoken/react-markdown, @pantoken/rehype	Icon-Tokens und Swatches in Markdown.
@pantoken/markdown-it	Ein markdown-it-Plugin für Icon-Codes und Farb-Swatches.
@pantoken/css-in-js	Ein typ-sicheres Theme für styled-components und Emotion.
@pantoken/mui	Ein Material-UI-Theme.
@pantoken/bootstrap, @pantoken/shadcn	CSS-Variable-Brücken für Bootstrap und shadcn/ui.
@pantoken/foundation	Eine Sass-Settings-Override und CSS-Overlay für Foundation.
@pantoken/docusaurus, @pantoken/vitepress	Themes für Docusaurus und VitePress.
@pantoken/mintlify	Ein Mintlify-docs.json-Theme (Farben + Hintergrund).
@pantoken/storybook	Ein Storybook-Theme.
@pantoken/pendo	Instructure-stilisiertes globales CSS für Pendo-Guides.

Bundler

Build-Tool-Integrationen.

Package	Für
@pantoken/vite	Ein Vite-Plugin mit virtuellen Modulen und CSS-Injektion.
@pantoken/next	withPantoken für Next.js transpilePackages.
@pantoken/webpack	Ein Webpack-Plugin.
@pantoken/postcss	Die @pantoken; At-Rule.
@pantoken/tailwind	Ein Tailwind-Preset.
@pantoken/panda	Ein Panda-CSS-Preset.

Plattformen

Native und Site-Generator-Ziele, ausgegeben vom CLI oder ihrer eigenen API.

Package	Ausgabe
@pantoken/swift	Swift-Quellcode plus ein SwiftPM-Manifest-Stubs.
@pantoken/android	Android XML-Ressourcen.
@pantoken/compose	Jetpack Compose Kotlin.
@pantoken/flutter	Flutter Dart.
@pantoken/rust	Rust-Konstanten für z. B. egui oder iced.
@pantoken/wordpress	Ein WordPress-Block-Theme theme.json.
@pantoken/vanilla	Ein Vanilla Forums variables.json.
@pantoken/drupal	Drupal-Theme-Assets.
@pantoken/hugo, @pantoken/jekyll	Hugo- und Jekyll-Site-Daten.
@pantoken/email	Inline-freundliche Werte für HTML-E-Mails.

Design

Für Design-Tools.

Package	Ausgabe
@pantoken/figma	Eine Figma Variables-Nutzlast.
@pantoken/swatches	Farbswatches (ASE, GPL, Sketch) plus ein darstellbares SVG-Specimen.

Plugins

Optionale Transformationen, die den Token- oder CSS-Output erweitern. Siehe Plugins.

Package	Was es hinzufügt
@pantoken/plugin-stacking	Benannte z-index-Tiefen als --instui-stacking-*-Tokens.
@pantoken/plugin-visual-debug	Die -with-visual-debug Layout-Debugging-Umrandung.
@pantoken/plugin-simple-icons	Marken-Icons aus simple-icons.
@pantoken/plugin-logos	Instructure-Produktlogos als SVGs, Data-URIs und Image-Tokens.
@pantoken/plugin-prune-custom-props	Ein PostCSS-Plugin, das unbenutzte Custom Properties entfernt.

Tools

Build-, Dokumentations- und Demo-Infrastruktur für das Monorepo selbst. Das meiste ist intern, aber die Teile sind eigenständig, daher dokumentieren wir sie hier und einige werden eigenständig zu npm veröffentlicht.

Package	Was es tut
@pantoken/aggregate	Generiert das vereinheitlichte pantoken Package-Barrier und exports aus seinen Abhängigkeiten.
@pantoken/validate-generated	Das Drift-Gate: prüft, dass jedes generierte Stylesheet gegen die Token-IR aufgelöst wird.
@pantoken/demo	Der selbstgehostete Live-Demo-Runner: löst eine @demo-Spezifikation zu einem iframe auf und rendert plain HTML/CSS/JS same-origin, token-gethemed.
@cssdoc/core (extern)	Ein generischer CSS-Dokumentationsextraktor (TSDoc für CSS): parst Doc-Kommentare + die CSS-AST in ein Modell, das die Docs als CSS-API-Referenz emitten. Lebt in einem eigenen Repo; als Link-Dependency konsumiert.

@pantoken/validate-generated ist ein Einmal-Skript (aufgerufen von pnpm run ready), daher hat es keine API-Seite; die anderen schon.

KI

Konsumentenorientierte KI-Setup-Assets. Diese sind für Projekte, die pantoken verwenden, nicht für die Entwicklung von pantoken selbst.

• @pantoken/ai installiert AGENTS.md, llms.txt und Assistant/Editor-Regeln (Cursor, Copilot, Windsurf, Claude Code) in ein Verbraucher-Repository.

Dev-Plugins

Plugins, die für die Tools entwickelt wurden, mit denen gearbeitet wird, gruppiert nach Host. Sie sind eigenständig und veröffentlichbar.

Package	Pluggt in
@pantoken/typedoc-plugin-demo	TypeDoc: verwandelt ein @demo <provider>:<ref> Block-Tag in einen einbettbaren Demo-Fence.
@pantoken/vite-workspace-orchestrator	Vite: baut Upstream-Workspace-Pakete (und Abhängige) neu, wenn deren Quellcode sich ändert.