Skip to content

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

Eksperimental

@pantoken/css-in-js — objek tema Instructure untuk perpustakaan CSS-in-JS semasa runtime.

Berfungsi dengan mana-mana perpustakaan yang membaca tema daripada props.theme — Emotion, styled-components, dan Stitches semuanya berkongsi konvensyen itu. pantokenTheme ialah objek rebrand siap guna, disokong oleh var() supaya pertukaran terang/gelap mengalir melalui @pantoken/css. toStyledTheme membina satu daripada mana-mana IR (dan boleh menghasilkan nilai konkrit dengan { resolve }).

Contoh ​

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

Antaramuka ​

Alias Jenis ​

Pembolehubah ​

Fungsi ​

Rujukan ​

Mode ​

Mengeksport semula Mode


default ​

Menamakan semula dan mengeksport semula pantokenTheme