Skip to content

pantoken / css-in-js

css-in-js

Eksperimentell

@pantoken/css-in-js — eit Instructure-temaobjekt for runtime CSS-in-JS-bibliotek.

Fungerer med alle bibliotek som les eit tema frå props.theme — Emotion, styled-components, og Stitches deler alle den konvensjonen. pantokenTheme er det ferdige rebrand-objektet, var()-støtta slik at lys/mørk-skj switching flyt gjennom @pantoken/css. toStyledTheme byggjer eit frå kva for eit IR (og kan bake inn konkrete verdiar med { resolve }).

Døme

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

Grensesnitt

Typealias

Variablar

Funksjonar

Referansar

Mode

Reeksporterer Mode


default

Omdøyper og re-eksporterer pantokenTheme