Skip to content

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

Funktion: toStyledTheme()

toStyledTheme(tokens, options?): StyledTheme

Experimentell

Erzeuge ein CSS-in-JS-Theme-Objekt aus einem Token-IR.

Parameter

tokens

readonly Token[]

Das IR (z. B. von @pantoken/tokens).

options?

ToStyledThemeOptions = {}

ToStyledThemeOptions.

Rückgabe

StyledTheme

Das Theme-Objekt, nach camelCased Token-Namen indiziert.

Beispiele

var()-basiert, Hell-/Dunkel-Flows über @pantoken/css

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

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

Konkrete Single-Mode-Werte einbetten (für SSR ohne CSS-Variablen)

ts
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()