Pakettikartta

pantoken on monorepo, joka sisältää pieniä, yksittäistehtäviin tarkoitettuja paketteja ryhmiteltyinä lokeroihin. Asenna se, joka sopii tehtävääsi, tai asenna yhtenäinen pantoken-paketti ja tuo sen alipoluista (esimerkiksi pantoken/css, pantoken/react, pantoken/tailwind).

Ydin

Jaettu malli ja muunnin, jonka päälle kaikki muu rakentuu.

Paketti	Mitä se tekee
@pantoken/model	Nollariippuvuuksiset TypeScript-tyypit: Token-muoto ja plugin-sopimus.
@pantoken/core	Ratkaisee upstream-tokenit ja -ikonit kanoniseen IR:ään ja renderöi CSS:n.
@pantoken/tokens	Ratkaistu IR vendoroituna staattisena JSON:na, teemakohtaisesti, sekä Tokens Studio -lähde raakamuodossa.
@pantoken/utils	Token-resolveri, viitteen regexit, case- ja väriapufunktiot, drift-tarkistukset ja token→utility-class -emitters.
@pantoken/plugin-kit	Rakenna ja yhdistä pantoken-pluginia käyttäen definePlugin.
@pantoken/cli	pantoken generate <target> — emittoi natiiveja ja alustakohtaisia lähteitä.

Muodot

Muuta tokenit tiedostomuodoksi.

Paketti	Tuotos
@pantoken/css	@property-tyyppinen CSS, jossa light-dark() ja data-URI-ikonit.
@pantoken/scss	SCSS-muuttujat, ratkaistu yhdeksi tilaksi.
@pantoken/less	Less-muuttujat.
@pantoken/stylus	Stylus-muuttujat.
@pantoken/dtcg	W3C Design Tokens (DTCG) -dokumentti.
@pantoken/tokens	IR JavaScript- ja JSON-muodossa (myös lueteltu Ydinosassa).
@pantoken/icons	Ergonominen näkymä ikonitokeneille.
@pantoken/icon-font	Ikoniverkkofontti (TTF, WOFF2) ja sen CSS.
@pantoken/components	InstUI-tyylinen CSS-komponenttikirjasto (painike, hälytys, taulukko ja muuta) sekä perusreset ja fokuskehä, prose-tyylittely, poikkileikkaukselliset utilitit ja brändifontit. Katso Components.

Renderöijät

Kehykset ja työkaluintegroinnit.

Paketti	Käyttötarkoitus
@pantoken/react	React-hookit, <Icon> ja token-provider.
@pantoken/vue, @pantoken/svelte, @pantoken/angular	Web-komponentti, kytketty kuhunkin kehykseen.
@pantoken/react-native	StyleSheet-ystävälliset token-objektit (ei CSS-muuttujia).
@pantoken/web-components	<instui-icon> ja styled-primitiiivit, kehyksettömiä.
@pantoken/astro	Token-asetukset Astro-sivustoille.
@pantoken/react-markdown, @pantoken/rehype	Ikonitokenit ja värinäytteet Markdownissa.
@pantoken/markdown-it	markdown-it -plugin ikonikoodeille ja värinäytteille.
@pantoken/css-in-js	Tyyppiturvallinen teema styled-componentsille ja Emotionille.
@pantoken/mui	Material UI -teema.
@pantoken/bootstrap, @pantoken/shadcn	CSS-muuttujasiltoja Bootstrapille ja shadcn/ui:lle.
@pantoken/foundation	Sass-asetusten ylikirjoitus ja CSS-peitto Foundationille.
@pantoken/docusaurus, @pantoken/vitepress	Teemat Docusaurusille ja VitePressille.
@pantoken/mintlify	Mintlify-docs.json -teema (värit + tausta).
@pantoken/storybook	Storybook-teema.
@pantoken/pendo	Instructure-tyylinen globaalinen CSS Pendo-opastuksiin.

Kokoajat

Build-työkalujen integraatiot.

Paketti	Käyttötarkoitus
@pantoken/vite	Vite-plugin, jossa virtuaalimoduulit ja CSS-injektio.
@pantoken/next	withPantoken Next.js:lle transpilePackages.
@pantoken/webpack	Webpack-plugin.
@pantoken/postcss	@pantoken; -at-rule.
@pantoken/tailwind	Tailwind-preset.
@pantoken/panda	Panda CSS -preset.

Alustat

Natiivit ja sivugeneraattorit, CLI:n tai oman API:n emittoimia.

Paketti	Tuotos
@pantoken/swift	Swift-lähdekoodi ja SwiftPM-manifestin stub.
@pantoken/android	Android XML -resurssit.
@pantoken/compose	Jetpack Compose Kotlin.
@pantoken/flutter	Flutter Dart.
@pantoken/rust	Rust-consteja esim. egui:lle tai iced:lle.
@pantoken/wordpress	WordPress block-teema theme.json.
@pantoken/vanilla	Vanilla Forums variables.json.
@pantoken/drupal	Drupal-teema-assetit.
@pantoken/hugo, @pantoken/jekyll	Hugo- ja Jekyll-sivustodata.
@pantoken/email	Inline-ystävällisiä arvoja HTML-sähköposteille.

Suunnittelu

Suunnittelutyökaluille.

Paketti	Tuotos
@pantoken/figma	Figma Variables -payload.
@pantoken/swatches	Väriäytteitä (ASE, GPL, Sketch) sekä nähtävä SVG-näytearkki.

Lisäosat

Valinnaiset transformaatiot, jotka laajentavat token- tai CSS-tuotosta. Katso Plugins.

Paketti	Mitä se lisää
@pantoken/plugin-stacking	Nimetyt z-index-syvyyksiä --instui-stacking-*-tokeneina.
@pantoken/plugin-visual-debug	-with-visual-debug-layoutin debug-rajauksen.
@pantoken/plugin-simple-icons	Brändi-ikonit simple-icons:sta.
@pantoken/plugin-logos	Instructure-tuotteiden logot SVG:inä, data-URI:ina ja kuvatokeneina.
@pantoken/plugin-prune-custom-props	PostCSS-plugin, joka pudottaa käyttämättömät custom-propsit.

Työkalut

Monorepon build-, docs- ja demo-infrastruktuuri. Suurin osa on sisäistä, mutta osia dokumentoidaan täällä ja jotkut julkaistaan npm:ssä itsenäisinä paketteina.

Paketti	Mitä se tekee
@pantoken/aggregate	Generoi yhtenäisen pantoken-paketin barrelin ja exports riippuvuuksistaan.
@pantoken/validate-generated	Drift-portti: tarkistaa, että jokainen generoitu stylesheet ratkaistaan token-IR:ään vastaan.
@pantoken/demo	Itseisännöity live-demo-runner: ratkaisee @demo-spesifikaation iframeksi ja renderöi paljaan HTML/CSS/JS:n same-origin, token-teemoitettuna.
@cssdoc/core (ulkoinen)	Geneerinen CSS-dokumentaation purkaja (TSDoc, CSS:lle): jäsentää doc-kommentit + CSS AST:n malliksi, jonka dokumentaatio emittoi CSS API -referenssinä. Elää omassa repossaan; kulutetaan link-riippuvuutena.

@pantoken/validate-generated on kertakäynnistys-skripti (kutsuu pnpm run ready), joten sillä ei ole API-sivua; muilla on.

AI

Käyttäjäkohteiset AI-asetukset. Nämä ovat projekteille, jotka käyttävät pantokenia, eivät pantokenin kehittämiseen.

• @pantoken/ai asentaa AGENTS.md, llms.txt ja assistentti/editor-säännöt (Cursor, Copilot, Windsurf, Claude Code) kuluttajarekpoon.

Kehittäjälisäosat

Työkaluille kirjoittamamme plugin:t, ryhmiteltynä hostin mukaan. Ne ovat itsenäisiä ja julkaistavissa.

Paketti	Kytkeytyy
@pantoken/typedoc-plugin-demo	TypeDoc: muuttaa @demo <provider>:<ref>-block-tagin upotettavaksi demo-fenciksi.
@pantoken/vite-workspace-orchestrator	Vite: uudelleen rakentaa upstream-työtilan paketit (ja riippuvat) kun niiden lähde muuttuu.