pantoken / design/swatches/src / toSwatches

Funzione: toSwatches() ​

toSwatches(tokens, mode?): Swatch[]

Sperimentale

Ridurre un IR di token a un elenco piatto di campioni di colore: risolvere i riferimenti, scegliere una modalità, mantenere solo i token il cui valore è un colore esadecimale (icone e token non-colore vengono scartati).

Parametri ​

tokens ​

readonly Token[]

L'IR (es. da @pantoken/tokens).

mode? ​

Mode = "light"

Quale modalità colore risolvere (predefinita "light").

Restituisce ​

Swatch[]

La lista dei campioni, denominata dal token (senza il prefisso --instui-).

Esempi ​

Riduci l'IR dei token ai campioni in modalità chiara

ts
import { toSwatches } from "@pantoken/swatches";
import { tokens } from "@pantoken/tokens";

const swatches = toSwatches(tokens); // [{ name: "color-background-brand", hex: "#…" }, …]

Modalità scura

ts
import { toSwatches } from "@pantoken/swatches";
import { byTheme } from "@pantoken/tokens";

const swatches = toSwatches(byTheme("canvas"), "dark");