🎨 ระบบธีมที่มีมาในตัว (Built-in Theme System) ของ iBrowe

iBrowe มาพร้อมกับธีม UI พื้นฐาน 2 แบบ คือ Dark และ Light

🌈 พฤติกรรมการเลือกธีมโดยค่าเริ่มต้น (Default Theme Behavior)

Light Theme ถูกตั้งเป็นค่าเริ่มต้นใน:

• Release Channel
• Beta Channel

Dark Theme ถูกตั้งเป็นค่าเริ่มต้นใน:

• Dev Channel
• Local Development Builds

🧩 การทำงานร่วมกับ WebUI (WebUI Integration)

ตั้งแต่ PR #774 เป็นต้นมา iBrowe มีการเปิดใช้งาน WebUI APIs ที่ช่วยให้สามารถ อ่านค่า, ตั้งค่า หรือสังเกตการเปลี่ยนแปลงของธีมที่ใช้งานอยู่ ได้ ผ่าน chrome.ibroweTheme

ประเภทธีมที่มีให้ใช้งาน (Available Theme Types):

type ThemeType = ‘Light’ | ‘Dark’

🔍 ดึงธีมปัจจุบัน (Get Current Theme) :

chrome.ibroweTheme.getIboweThemeType((themeType: ThemeType) => { console.log(“Current theme:”, themeType); });

คำอธิบาย: คำสั่งนี้ใช้สำหรับ ดึงค่าธีมปัจจุบันที่กำลังใช้งานอยู่ แล้วพิมพ์ออกทาง console เช่น “Current theme: Dark” หรือ “Current theme: Light”

🖊️ ตั้งค่าธีม (Set Theme) :

chrome.ibroweTheme.setIboweThemeType(‘Dark’); // หรือ ‘Light’

คำอธิบาย: คำสั่งนี้ใช้สำหรับ ตั้งค่าธีมที่ต้องการ ให้เป็น Dark หรือ Light ตามที่ระบุ

👂 สังเกตการเปลี่ยนแปลงของธีม (Observe Theme Changes) : chrome.ibroweTheme.onIboweThemeTypeChanged.addListener((themeType: ThemeType) => { console.log(“Theme changed to:”, themeType); });

คำอธิบาย: คำสั่งนี้ใช้สำหรับ ตรวจจับเมื่อมีการเปลี่ยนแปลงธีม ระบบจะสั่ง console.log แจ้งว่าเปลี่ยนไปเป็นธีมอะไร เช่น “Theme changed to: Dark” หรือ “Theme changed to: Light”

📎 ที่มา: ดัดแปลงจากเอกสาร API การจัดการธีมของ Brave และ PR #774 — เรียบเรียงใหม่เพื่อใช้กับโปรเจกต์ iBrowe