pantoken / renderers/css-in-js/src / toStyledTheme

Function: toStyledTheme()

toStyledTheme(tokens, options?): StyledTheme

Experimental

Build a CSS-in-JS theme object from a token IR.

Parameters

tokens

readonly Token[]

The IR (e.g. from @pantoken/tokens).

options?

ToStyledThemeOptions = {}

ToStyledThemeOptions.

Returns

StyledTheme

The theme object, keyed by camelCased token name.

Examples

var()-backed (light/dark flows through `@pantoken/css`)

import { toStyledTheme } from "@pantoken/css-in-js";
import { tokens } from "@pantoken/tokens";

const theme = toStyledTheme(tokens);
// theme.colorBackgroundBrand → "var(--instui-color-background-brand)"

Bake concrete single-mode values (for SSR without CSS variables)

import { toStyledTheme } from "@pantoken/css-in-js";
import { tokens } from "@pantoken/tokens";

const dark = toStyledTheme(tokens, { resolve: "dark" });
// dark.colorBackgroundBase → a concrete value, not a var()