Skip to content

pantoken / renderers/css-in-js/src / toStyledTheme

ฟังก์ชัน: toStyledTheme()

toStyledTheme(tokens, options?): StyledTheme

ทดลอง

สร้างอ็อบเจ็กต์ธีม CSS-in-JS จาก token IR.

พารามิเตอร์

tokens

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

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

options?

ToStyledThemeOptions = {}

ToStyledThemeOptions.

คืนค่า

StyledTheme

อ็อบเจ็กต์ธีม โดยใช้ชื่อโทเค็นแบบ camelCased เป็นคีย์

ตัวอย่าง

อาศัย var(), การไหลแบบสว่าง/มืด ผ่าน @pantoken/css

ts
import { toStyledTheme } from "@pantoken/css-in-js";
import { tokens } from "@pantoken/tokens";

const theme = toStyledTheme(tokens);
// theme.colorBackgroundBrand → "var(--instui-color-background-brand)"

สร้างค่าแบบโหมดเดียวที่เป็นค่าคงที่ (สำหรับ SSR โดยไม่ใช้ตัวแปร CSS)

ts
import { toStyledTheme } from "@pantoken/css-in-js";
import { tokens } from "@pantoken/tokens";

const dark = toStyledTheme(tokens, { resolve: "dark" });
// dark.colorBackgroundBase → a concrete value, not a var()