Skip to content

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

Función: toStyledTheme()

toStyledTheme(tokens, options?): StyledTheme

Experimental

Construir un objeto de tema CSS-in-JS a partir de un IR de tokens.

Parámetros

tokens

solo lectura Token[]

El IR (p. ej. de @pantoken/tokens).

options?

ToStyledThemeOptions = {}

ToStyledThemeOptions.

Devuelve

StyledTheme

El objeto de tema, con claves según el nombre del token en camelCase.

Ejemplos

Respaldado por var(), flujos claro/oscuro a través de @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)"

Generar valores concretos de modo único (para SSR sin variables CSS)

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