Skip to content

API ​

pantoken est un monorepo de petits packages à but unique regroupés en buckets. Installez celui qui correspond à votre tâche, ou installez le package unifié pantoken et importez depuis ses sous-chemins (par exemple pantoken/css, pantoken/react, pantoken/tailwind).

Core ​

Le modèle partagé et le transformateur sur lequel tout le reste s'appuie.

PackageWhat it does
@pantoken/modelZero-dependency TypeScript types: the Token shape and the plugin contract.
@pantoken/coreResolves the upstream tokens and icons into the canonical IR, and renders CSS.
@pantoken/tokensThe resolved IR vendored as static JSON, per theme, plus the raw Tokens Studio source.
@pantoken/utilsThe token resolver, reference regexes, case and color helpers, drift checks, and the token→utility-class emitters.
@pantoken/plugin-kitBuild and compose pantoken plugins with definePlugin.
@pantoken/clipantoken generate <target> — emit native and platform source.

Formats ​

Transformer les tokens en un format de fichier.

PackageOutput
@pantoken/css@property-typed CSS with light-dark() and data-URI icons.
@pantoken/scssSCSS variables, resolved to a single mode.
@pantoken/lessLess variables.
@pantoken/stylusStylus variables.
@pantoken/dtcgA W3C Design Tokens (DTCG) document.
@pantoken/tokensThe IR as JavaScript and JSON (also listed under Core).
@pantoken/iconsAn ergonomic view over the icon tokens.
@pantoken/icon-fontAn icon web font (TTF, WOFF2) plus its CSS.
@pantoken/componentsAn InstUI-look CSS component library (button, alert, table, and more) plus a base reset with focus ring, prose styling, cross-cutting utilities, and the brand fonts. See Components.
@pantoken/inline-stylesGeneric CSS-to-HTML inlining for platform integrations.

Renderers ​

Intégrations framework et outils.

PackageFor
@pantoken/reactReact hooks, <Icon>, and a token provider.
@pantoken/vue, @pantoken/svelte, @pantoken/angularThe web component, wired into each framework.
@pantoken/react-nativeStyleSheet-friendly token objects (no CSS variables).
@pantoken/web-components<instui-icon> and styled primitives, framework-agnostic.
@pantoken/astroToken setup for Astro sites.
@pantoken/react-markdown, @pantoken/rehypeIcon tokens and swatches in Markdown.
@pantoken/markdown-itA markdown-it plugin for icon codes and color swatches.
@pantoken/css-in-jsA type-safe theme for styled-components and Emotion.
@pantoken/muiA Material UI theme.
@pantoken/bootstrap, @pantoken/shadcnCSS-variable bridges for Bootstrap and shadcn/ui.
@pantoken/foundationA Sass settings override and CSS overlay for Foundation.
@pantoken/docusaurus, @pantoken/vitepressThemes for Docusaurus and VitePress.
@pantoken/mintlifyA Mintlify docs.json theme (colors + background).
@pantoken/storybookA Storybook theme.
@pantoken/pendoInstructure-styled global CSS for Pendo guides.

Bundlers ​

BuildIconFontOptions

PackageFor
@pantoken/viteA Vite plugin with virtual modules and CSS injection.
@pantoken/nextwithPantoken for Next.js transpilePackages.
@pantoken/webpackA webpack plugin.
@pantoken/postcssThe @pantoken; at-rule.
@pantoken/tailwindA Tailwind preset.
@pantoken/pandaA Panda CSS preset.

Platforms ​

Cibles natives et générateurs de sites, émises par le CLI ou leur propre API.

PackageOutput
@pantoken/swiftSwift source plus a SwiftPM manifest stub.
@pantoken/androidAndroid XML resources.
@pantoken/composeJetpack Compose Kotlin.
@pantoken/flutterFlutter Dart.
@pantoken/rustRust consts for egui or iced.
@pantoken/wordpressA WordPress block-theme theme.json.
@pantoken/vanillaA Vanilla Forums variables.json.
@pantoken/drupalDrupal theme assets.
@pantoken/hugo, @pantoken/jekyllHugo and Jekyll site data.
@pantoken/emailInline-friendly values for HTML email.

Design ​

Pour les outils de design.

PackageOutput
@pantoken/figmaA Figma Variables payload.
@pantoken/swatchesColor swatches (ASE, GPL, Sketch) plus a viewable SVG specimen sheet.

Plugins ​

Transformations optionnelles qui étendent la sortie token ou CSS. Voir Plugins.

PackageWhat it adds
@pantoken/plugin-stackingNamed z-index depths as --instui-stacking-* tokens.
@pantoken/plugin-visual-debugThe -with-visual-debug layout-debugging outline.
@pantoken/plugin-simple-iconsBrand icons from simple-icons.
@pantoken/plugin-logosInstructure product logos as SVGs, data URIs, and image tokens.
@pantoken/plugin-prune-custom-propsA PostCSS plugin that drops unused custom properties.

Tools ​

Infrastructure de build, docs et démo pour le monorepo lui-même. La plupart sont internes, mais les pièces sont autonomes, donc documentées ici et certaines sont publiées séparément sur npm.

PackageWhat it does
@pantoken/aggregateGenerates the unified pantoken package barrel and exports from its dependencies.
@pantoken/validate-generatedThe drift gate: checks every generated stylesheet resolves against the token IR.
@pantoken/demoThe self-hosted live-demo runner: resolves a @demo spec to an iframe and renders bare HTML/CSS/JS same-origin, token-themed.
@cssdoc/core (external)A generic CSS documentation extractor (TSDoc, for CSS): parses doc-comments + the CSS AST into a model the docs emit as the CSS API reference. Lives in its own repo; consumed via a link dependency.

@pantoken/validate-generated est un script à exécution unique (invoked by pnpm run ready), il n'a donc pas de page API ; les autres en ont.

AI ​

@pantoken/ai — ressources d'agent orientées consommateur pour les projets qui utilisent pantoken (pas pour le développement de pantoken lui‑même).

  • @pantoken/ai installe AGENTS.md, llms.txt, et règles assistant/éditeur (Cursor, Copilot, Windsurf, Claude Code) dans un dépôt consommateur.

Dev plugins ​

Plugins que l'on rédige pour les outils avec lesquels on travaille, groupés par hôte. Ils sont autonomes et publiables.

PackagePlugs into
@pantoken/typedoc-plugin-demoTypeDoc: turns a @demo <provider>:<ref> block tag into an embeddable demo fence.
@pantoken/vite-workspace-orchestratorVite: rebuilds upstream workspace packages (and dependents) when their source changes.