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

Kísérleti

@pantoken/css-in-js — egy Instructure témaobjektum futásidejű CSS-in-JS könyvtárakhoz.

Bármely olyan könyvtárral működik, amely a témát a props.theme-ból olvassa — az Emotion, a styled-components és a Stitches mind ezt a konvenciót osztják. A pantokenTheme az elkészült rebrand objektum, var()-alapú, így a fény/sötét váltás a @pantoken/css-n keresztül áramlik. A toStyledTheme bármelyik IR-ből összeállít egyet (és konkrét értékeket süthet a { resolve }-val).

Példa ​

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};`;

Interfészek ​

Típusaliasok ​

Változók ​

Függvények ​

Hivatkozások ​

Mode ​

Újra exportálja a Mode típusra mutató hivatkozást

default ​

Átnevezi és újra exportálja a pantokenTheme elemet