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

实验性

@pantoken/css-in-js — 用于运行时 CSS-in-JS 库的 Instructure 主题对象。

适用于从 props.theme 读取主题的任何库 —— Emotion、styled-components 和 Stitches 都遵循该约定。pantokenTheme 是现成的 rebrand 对象, 基于 var(),因此亮/暗切换可通过 @pantoken/css 传递。toStyledTheme 从 任意 IR 构建这样的对象(并且可以使用 { resolve } 烘焙具体值)。

示例 ​

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

接口 ​

类型别名 ​

变量 ​

函数 ​

引用 ​

Mode ​

重新导出 Mode


default ​

重命名并重新导出 pantokenTheme