pantoken / css-in-js

css-in-js ​

Eksperimentell

@pantoken/css-in-js — et Instructure-temaobjekt for runtime CSS-in-JS-biblioteker.

Fungerer med alle biblioteker som leser et tema fra props.theme — Emotion, styled-components, og Stitches deler alle den konvensjonen. pantokenTheme er det ferdiglagde rebrand-objektet, var()-understøttet slik at lys-/mørk-bryting flyter gjennom @pantoken/css. toStyledTheme bygger et fra hvilken som helst IR (og kan bake konkrete verdier med { resolve }).

Eksempel ​

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 ​

Typealiaser ​

Variabler ​

Funksjoner ​

Referanser ​

Mode ​

Eksporterer på nytt Mode

default ​

Omdøper og re-eksporterer pantokenTheme