De pakketkaart

pantoken is een monorepo van kleine, enkel-doel pakketten gegroepeerd in buckets. Installeer degene die bij je taak past, of installeer het uniforme pantoken pakket en importeer vanuit zijn subpaden (bijvoorbeeld pantoken/css, pantoken/react, pantoken/tailwind).

Kern

Het gedeelde model en de transformer waarop alles anders bouwt.

Package	Wat het doet
@pantoken/model	Nul-afhankelijkheden TypeScript-typen: de Token vorm en het plugin-contract.
@pantoken/core	Lost de upstream tokens en iconen op tot de canonieke IR, en rendert CSS.
@pantoken/tokens	De opgeloste IR als ingebakken statische JSON, per thema, plus de ruwe Tokens Studio-bron.
@pantoken/utils	De token-resolver, referentie-regexes, case- en kleurhelpers, drift-controles, en de token→utility-class emitters.
@pantoken/plugin-kit	Bouw en composeer pantoken-plugins met definePlugin.
@pantoken/cli	pantoken generate <target> — emit native en platformbron.

Formaten

Zet de tokens om in een bestandsformaat.

Package	Output
@pantoken/css	@property-getypte CSS met light-dark() en data-URI iconen.
@pantoken/scss	SCSS-variabelen, opgelost naar een enkele modus.
@pantoken/less	Less-variabelen.
@pantoken/stylus	Stylus-variabelen.
@pantoken/dtcg	Een W3C Design Tokens (DTCG) document.
@pantoken/tokens	De IR als JavaScript en JSON (ook vermeld onder Kern).
@pantoken/icons	Een ergonomische kijk op de icon-tokens.
@pantoken/icon-font	Een icon-webfont (TTF, WOFF2) plus de bijbehorende CSS.
@pantoken/components	Een InstUI-uitziende CSS componentbibliotheek (button, alert, table, en meer) plus een basis-reset met focus-ring, prose-styling, cross-cutting utilities, en de merkfonts. Zie Components.

Renderers

Framework- en toolintegraties.

Package	Voor
@pantoken/react	React-hooks, <Icon>, en een token-provider.
@pantoken/vue, @pantoken/svelte, @pantoken/angular	De webcomponent, aangesloten in elk framework.
@pantoken/react-native	StyleSheet-vriendelijke token-objecten (geen CSS-variabelen).
@pantoken/web-components	<instui-icon> en gestylede primitieve componenten, framework-agnostisch.
@pantoken/astro	Token-setup voor Astro-sites.
@pantoken/react-markdown, @pantoken/rehype	Icon-tokens en swatches in Markdown.
@pantoken/markdown-it	Een markdown-it plugin voor icon-codes en kleur-swatches.
@pantoken/css-in-js	Een type-veilige theme voor styled-components en Emotion.
@pantoken/mui	Een Material UI theme.
@pantoken/bootstrap, @pantoken/shadcn	CSS-variabele bruggen voor Bootstrap en shadcn/ui.
@pantoken/foundation	Een Sass settings-override en CSS-overlay voor Foundation.
@pantoken/docusaurus, @pantoken/vitepress	Thema's voor Docusaurus en VitePress.
@pantoken/mintlify	Een Mintlify docs.json theme (kleuren + achtergrond).
@pantoken/storybook	Een Storybook-theme.
@pantoken/pendo	Instructure-gestijlde globale CSS voor Pendo-guides.

Bundlers

Build-tool integraties.

Package	Voor
@pantoken/vite	Een Vite-plugin met virtuele modules en CSS-injectie.
@pantoken/next	withPantoken voor Next.js transpilePackages.
@pantoken/webpack	Een webpack-plugin.
@pantoken/postcss	De @pantoken; at-rule.
@pantoken/tailwind	Een Tailwind-preset.
@pantoken/panda	Een Panda CSS-preset.

Platforms

Native en site-generator doelen, geëmitteerd door de CLI of hun eigen API.

Package	Output
@pantoken/swift	Swift-bron plus een SwiftPM manifest-stub.
@pantoken/android	Android XML-resources.
@pantoken/compose	Jetpack Compose Kotlin.
@pantoken/flutter	Flutter Dart.
@pantoken/rust	Rust-consts voor bijv. egui of iced.
@pantoken/wordpress	Een WordPress block-theme theme.json.
@pantoken/vanilla	Een Vanilla Forums variables.json.
@pantoken/drupal	Drupal theme-assets.
@pantoken/hugo, @pantoken/jekyll	Hugo en Jekyll site-data.
@pantoken/email	Inline-vriendelijke waarden voor HTML-email.

Design

Voor designtools.

Package	Output
@pantoken/figma	Een Figma Variables payload.
@pantoken/swatches	Kleur-swatches (ASE, GPL, Sketch) plus een bekijkbare SVG specimen-sheet.

Plugins

Optionele transformaties die de token- of CSS-output uitbreiden. Zie Plugins.

Package	Wat het toevoegt
@pantoken/plugin-stacking	Genoemde z-index dieptes als --instui-stacking-* tokens.
@pantoken/plugin-visual-debug	De -with-visual-debug layout-debugging outline.
@pantoken/plugin-simple-icons	Merk-iconen van simple-icons.
@pantoken/plugin-logos	Instructure productlogo's als SVG's, data-URI's, en image-tokens.
@pantoken/plugin-prune-custom-props	Een PostCSS-plugin die ongebruikte custom properties verwijdert.

Hulpmiddelen

Build-, docs- en demo-infrastructuur voor de monorepo zelf. Het grootste deel is intern, maar de onderdelen zijn zelfstandig, dus worden hier gedocumenteerd en sommige worden afzonderlijk naar npm gepubliceerd.

Package	Wat het doet
@pantoken/aggregate	Genereert het uniforme pantoken package-barel en exports vanuit zijn afhankelijkheden.
@pantoken/validate-generated	De drift-gate: controleert dat elke gegenereerde stylesheet oplost tegen de token-IR.
@pantoken/demo	De self-hosted live-demo runner: lost een @demo spec op naar een iframe en rendert kale HTML/CSS/JS same-origin, token-getheme'd.
@cssdoc/core (extern)	Een generieke CSS-documentatie-extractor (TSDoc, voor CSS): parse't doc-comments + de CSS-AST naar een model dat de docs uitgeven als de CSS API-referentie. Leeft in een eigen repo; geconsumeerd via een link-afhankelijkheid.

@pantoken/validate-generated is een run-once script (aangeroepen door pnpm run ready), dus het heeft geen API pagina; de anderen wel.

AI

Consumentgerichte AI-setup assets. Deze zijn voor projecten die pantoken gebruiken, niet voor het ontwikkelen van pantoken zelf.

• @pantoken/ai installeert AGENTS.md, llms.txt, en assistant/editor regels (Cursor, Copilot, Windsurf, Claude Code) in een consumer-repository.

Dev-plugins

Plugins die we maken voor de tools waarmee we werken, gegroepeerd per host. Ze zijn standalone en publishable.

Package	Plugt in bij
@pantoken/typedoc-plugin-demo	TypeDoc: zet een @demo <provider>:<ref> block-tag om in een in te sluiten demo-fence.
@pantoken/vite-workspace-orchestrator	Vite: rebuildt upstream workspace-pakketten (en dependents) wanneer hun bron verandert.