Skip to content

pantoken / css-in-js

css-in-js

Sperimentale

@pantoken/css-in-js — un oggetto tema di Instructure per librerie CSS-in-JS a runtime.

Funziona con qualsiasi libreria che legga un tema da props.theme — Emotion, styled-components e Stitches condividono questa convenzione. pantokenTheme è l'oggetto rebrand pronto all'uso, basato su var() in modo che il passaggio light/dark venga propagato tramite @pantoken/css. toStyledTheme costruisce uno a partire da qualsiasi IR (e può materializzare valori concreti con { resolve }).

Esempio

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

Interfacce

Alias di tipo

Variabili

Funzioni

Riferimenti

Mode

Re-esporta Mode


default

Rinomina e riesporta pantokenTheme