แนะนำ
เอกสารการใช้งาน WhereUI
WhereUI คืออะไร
WhereUI คือ UI kit กลางของ WHT สำหรับ project React / Next.js สร้างบน shadcn/ui (Base UI) และ Tailwind CSS v4 หน้าตามาจาก design system ของ WeBuilder
ไม่ใช่ npm package แต่เป็น registry แบบ shadcn — ติดตั้งแล้ว code ของ component เข้าไปอยู่ใน project ของคุณ จึงแก้ไขต่อได้เองเต็ม ๆ
จุดเด่น
ธีมครบทั้งสองโหมด
โทน slate + ฟ้าน้ำเงินตัวเดียว มีสีสถานะ success/warning/info พร้อมคู่ -soft และเงา 3 ระดับ กำหนดค่าที่เดียวใน globals.css
ออกแบบให้ภาษาไทย
ฟอนต์ IBM Plex Sans Thai ขนาดฐาน 15px line-height 1.65 กันสระและวรรณยุกต์ชนบรรทัด ตัวเลขและวันที่อ่านง่าย
พร้อมจอสัมผัส
control ทุกชนิดมีพื้นที่กดขั้นต่ำ 44px บนจอสัมผัสโดยอัตโนมัติ (มือถือและ LIFF) โดยไม่ต้องแก้ component
registry แบบ shadcn
ติดตั้งด้วย pnpm dlx shadcn add แล้ว code เข้าไปอยู่ใน project ของคุณ อ่านแก้ปรับแต่งได้เอง ไม่ล็อกเวอร์ชัน
สลับโหมดได้ทุกที่
ใช้ next-themes ตามระบบของผู้ใช้เป็นค่าเริ่มต้น สลับด้วยปุ่มหรือกด D ได้จากทุกหน้า
การรองรับ
- React 19 / Next.js App Router / Tailwind CSS v4
- จอกว้างสุด 375px ใช้งานได้ทุกหน้า
- คีย์บอร์ดใช้งานได้ครบ พร้อม focus ring ทุก interactive element
- โหมดสว่าง/มืดทำงานผ่าน design token อัตโนมัติ