Skip to content

pantoken / css-in-js

css-in-js

Expérimental

@pantoken/css-in-js — un objet de thème Instructure pour les bibliothèques CSS-in-JS à l'exécution.

Fonctionne avec n'importe quelle bibliothèque qui lit un thème depuis props.theme — Emotion, styled-components et Stitches partagent tous cette convention. pantokenTheme est l'objet rebrand prêt à l'emploi, appuyé sur var() de sorte que le basculement clair/sombre circule via @pantoken/css. toStyledTheme génère un thème à partir de n'importe quel IR (et peut concrétiser des valeurs avec { resolve }).

Exemple

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 type

Variables

Fonctions

Références

Mode

Ré-exporte Mode


default

Renomme et ré-exporte pantokenTheme