pantoken / css-in-js

css-in-js ​

Experimentell

@pantoken/css-in-js — ett Instructure-temaobjekt för runtime CSS-in-JS-bibliotek.

Fungerar med vilket bibliotek som helst som läser ett tema från props.theme — Emotion, styled-components och Stitches delar alla den konventionen. pantokenTheme är det färdiga rebrand-objektet, var()-stödd så att växling mellan ljust/mörkt går igenom @pantoken/css. toStyledTheme bygger ett från vilken IR som helst (och kan baka in konkreta värden med { resolve }).

Exempel ​

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

Gränssnitt ​

Typalias ​

Variabler ​

Funktioner ​

Referenser ​

Mode ​

Återexporterar Mode

default ​

Byter namn på och exporterar om pantokenTheme