pantoken / design/swatches/src / toSwatches

ฟังก์ชัน: toSwatches() ​

toSwatches(tokens, mode?): Swatch[]

ทดลอง

ลดโทเค็น IR ให้เป็นรายการสวอทสีแบบแถวเดียว: แก้ไขการอ้างอิง, เลือกโหมด, เก็บเฉพาะ tokens ที่มีค่าสีเป็นรูปแบบ hex (ไอคอนและโทเค็นที่ไม่ใช่สีจะถูกทิ้ง).

พารามิเตอร์ ​

tokens ​

อ่านอย่างเดียว Token[]

IR (เช่น จาก @pantoken/tokens)

mode? ​

Mode = "light"

เลือกโหมดสีที่จะทำการแก้ไข (ค่าปริยาย "light").

คืนค่า ​

Swatch[]

รายการสวอท ตั้งชื่อโดยโทเค็น (โดยไม่มีคำนำหน้า --instui-).

ตัวอย่าง ​

ย่อโทเค็น IR ให้เป็นสวอทในโหมดสว่าง

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

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

โหมดมืด

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

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