pantoken-root / css-in-js

css-in-js ​

Compatibility ​

Target: Emotion CSS-in-JS. Current format: ThemeProvider SSR emits the Pantoken token variable. Minimum host version: 11.14.0. Tested through 11.14.0. Newer releases require review.

Full compatibility matrix

Experimental

@pantoken/css-in-js — un objeto de tema de Instructure para librerías CSS-in-JS en tiempo de ejecución.

Funciona con cualquier librería que lea un tema desde props.theme — Emotion, styled-components y Stitches comparten esa convención. pantokenTheme es el objeto rebrand ya preparado, con soporte de var() para que el cambio claro/oscuro fluya a través de @pantoken/css. toStyledTheme genera uno a partir de cualquier IR (y puede hornear valores concretos con { resolve }).

Ejemplo ​

styled-components

tsx
import { ThemeProvider } from "styled-components";
import { pantokenTheme } from "@pantoken/css-in-js";
<ThemeProvider theme={pantokenTheme}>...</ThemeProvider>;
// const Btn = styled.button`background: ${({ theme }) => theme.colorBackgroundBrand};`;

Interfaces ​

Alias de tipo ​

Variables ​

Funciones ​

Referencias ​

Mode ​

Reexporta Mode

default ​

Renombra y reexporta pantokenTheme