Pakkeoversigten

pantoken er et monorepo af små, enkeltformåls-pakker grupperet i buckets. Installer den, der passer til din opgave, eller installer den samlede pantoken pakke og importer fra dens understier (for eksempel pantoken/css, pantoken/react, pantoken/tailwind).

Kerne

Den delte model og transformeren som alt andet bygger på.

Pakke	Hvad den gør
@pantoken/model	TypeScript-typer uden afhængigheder: Token formen og plugin-kontrakten.
@pantoken/core	Løser de upstream tokens og ikoner til den kanoniske IR, og renderer CSS.
@pantoken/tokens	Den resolvede IR leveret som statisk JSON, per tema, plus den rå Tokens Studio-kilde.
@pantoken/utils	Token-resolveren, reference-regexes, case- og farvehjælpere, drift-checks, og token→utility-class emitters.
@pantoken/plugin-kit	Byg og komponér pantoken-plugins med definePlugin.
@pantoken/cli	pantoken generate <target> — emitter native og platform-kilde.

Formater

Omsæt tokens til et filformat.

Pakke	Output
@pantoken/css	@property-typet CSS med light-dark() og data-URI ikoner.
@pantoken/scss	SCSS-variabler, resolved til en enkelt mode.
@pantoken/less	Less-variabler.
@pantoken/stylus	Stylus-variabler.
@pantoken/dtcg	Et W3C Design Tokens (DTCG) dokument.
@pantoken/tokens	IR'en som JavaScript og JSON (også listet under Kerne).
@pantoken/icons	Et ergonomisk overblik over ikon-tokens.
@pantoken/icon-font	En ikon-webfont (TTF, WOFF2) plus dens CSS.
@pantoken/components	Et InstUI-look CSS komponentbibliotek (button, alert, table og mere) plus en base-reset med focus ring, prose-styling, tværgående utilities, og brand-typografier. Se Components.

Renderers

Framework- og værktøjsintegrationer.

Pakke	Til
@pantoken/react	React-hooks, <Icon>, og en token-provider.
@pantoken/vue, @pantoken/svelte, @pantoken/angular	Webkomponenten, koblet ind i hvert framework.
@pantoken/react-native	StyleSheet-venlige token-objekter (ingen CSS-variabler).
@pantoken/web-components	<instui-icon> og styled primitives, framework-agnostisk.
@pantoken/astro	Token-opsætning til Astro-sites.
@pantoken/react-markdown, @pantoken/rehype	Ikon-tokens og swatches i Markdown.
@pantoken/markdown-it	En markdown-it plugin til ikon-koder og farveswatches.
@pantoken/css-in-js	Et typesikkert tema til styled-components og Emotion.
@pantoken/mui	Et Material UI-tema.
@pantoken/bootstrap, @pantoken/shadcn	CSS-variabel-broer for Bootstrap og shadcn/ui.
@pantoken/foundation	En Sass settings-override og CSS-overlay til Foundation.
@pantoken/docusaurus, @pantoken/vitepress	Temaer til Docusaurus og VitePress.
@pantoken/mintlify	Et Mintlify docs.json tema (farver + baggrund).
@pantoken/storybook	Et Storybook-tema.
@pantoken/pendo	Instructure-stylet global CSS til Pendo-guides.

Bundlers

Build-værktøjsintegrationer.

Pakke	Til
@pantoken/vite	En Vite-plugin med virtuelle moduler og CSS-injektion.
@pantoken/next	withPantoken til Next.js transpilePackages.
@pantoken/webpack	En webpack-plugin.
@pantoken/postcss	@pantoken; at-reglen.
@pantoken/tailwind	Et Tailwind-preset.
@pantoken/panda	Et Panda CSS-preset.

Platforme

Native- og site-generator-mål, emitteret af CLI'en eller deres eget API.

Pakke	Output
@pantoken/swift	Swift-kilde plus et SwiftPM manifest-stub.
@pantoken/android	Android XML-ressourcer.
@pantoken/compose	Jetpack Compose Kotlin.
@pantoken/flutter	Flutter Dart.
@pantoken/rust	Rust-consts til fx egui eller iced.
@pantoken/wordpress	Et WordPress block-theme theme.json.
@pantoken/vanilla	En Vanilla Forums variables.json.
@pantoken/drupal	Drupal tema-assets.
@pantoken/hugo, @pantoken/jekyll	Hugo- og Jekyll-site-data.
@pantoken/email	Inline-venlige værdier til HTML-email.

Design

Til designværktøjer.

Pakke	Output
@pantoken/figma	Et Figma Variables payload.
@pantoken/swatches	Farveswatches (ASE, GPL, Sketch) plus et visuelt SVG-eksempelsheet.

Plugins

Valgfrie transformationer der udvider token- eller CSS-outputtet. Se Plugins.

Pakke	Hvad det tilføjer
@pantoken/plugin-stacking	Navngivne z-index dybder som --instui-stacking-* tokens.
@pantoken/plugin-visual-debug	-with-visual-debug layout-debugging outline.
@pantoken/plugin-simple-icons	Brand-ikoner fra simple-icons.
@pantoken/plugin-logos	Instructure produktlogos som SVG'er, data-URIs, og image-tokens.
@pantoken/plugin-prune-custom-props	En PostCSS-plugin der fjerner ubrugte custom properties.

Værktøjer

Build-, docs- og demo-infrastruktur for monorepoet selv. Mest er internt, men delene er selvstændige, så de dokumenteres her og nogle udgives til npm for sig.

Pakke	Hvad den gør
@pantoken/aggregate	Genererer den samlede pantoken pakke-barrel og exports fra dens afhængigheder.
@pantoken/validate-generated	Drift-gaten: tjekker at hver genereret stylesheet resolver mod token-IR'en.
@pantoken/demo	Den self-hosted live-demo runner: resolverer en @demo spec til et iframe og renderer ren HTML/CSS/JS same-origin, token-tematiseret.
@cssdoc/core (ekstern)	En generisk CSS-dokumentationsekstraktor (TSDoc, for CSS): parser doc-comments + CSS AST til en model som docs emitterer som CSS API-referencen. Lever i sit eget repo; forbruges via en link-afhængighed.

@pantoken/validate-generated er et run-once script (påkaldt af pnpm run ready), så det har ingen API-side; de andre har det.

AI

Forbrugerrettede AI-opsætningsassets. Disse er til projekter der bruger pantoken, ikke til at udvikle pantoken selv.

• @pantoken/ai installerer AGENTS.md, llms.txt, og assistant/editor-regler (Cursor, Copilot, Windsurf, Claude Code) i et forbruger-repository.

Dev-plugins

Plugins vi udgiver til de værktøjer vi bygger med, grupperet efter host. De er standalone og kan publiceres.

Pakke	Plugger ind i
@pantoken/typedoc-plugin-demo	TypeDoc: gør et @demo <provider>:<ref> block-tag til en indlejret demo-fence.
@pantoken/vite-workspace-orchestrator	Vite: genbygger upstream workspace-pakker (og afhængige) når deres kildekode ændrer sig.