Material Plus

關於這個專案

Material Plus 是直接實作 Material Design 3 規範的 React 元件庫，而不是包裝別處既有的實作，所以它的色彩角色、字級級距與外形就是規範所定義的那些。它補上的，是任何一個 Material 專案最終都會自己寫一遍的那堆元件：能正確處理中日韓輸入法組字的輸入欄、與你自己那套圖示相合的圖示包裝——把它們抽出來，配上文件與測試。在應用程式需要的地方，它還會超出規範：既有 Material 已列出之元件的擴充版本，也有規範完全沒有提到的圖表、資料表格與命令面板。

主題只要一行：設定一個來源色，所有色彩角色就隨之而來，正如 Material 由一個來源色產生配色那樣。函式庫裡沒有任何屬於頁面層級的東西——沒有重置樣式，沒有 Provider，沒有全域樣式——它會讀取頁面上既有的 Material 系統權杖。因此已經在用 Material 的專案可以保留原本的設定，只補上缺少的元件。中文、日文與韓文的組字輸入，無論你的變更處理函式對值做了什麼都不會被打斷，而這正是多數 Material 輸入欄默默帶著的毛病。

這個套件僅提供 ESM，附帶 TypeScript 型別定義，而且是真正能搖樹優化的：單一元件以 gzip 壓縮後只有 3.8 kB，一百二十多個全部加起來是 130.6 kB，樣式表也以同樣方式拆分。它不需任何設定就能在 Next.js 伺服器元件中運作，在各主流打包工具中都能解析，翻譯則以啟動時交出一次的模組形式接收。

功能

• 文件網站

• TypeScript 型別

• 多語言支援

• 經測試驗證

• 內建無障礙支援

• 深色模式

• 支援搖樹優化