# 元件

本節為 Blocklet UI React 函式庫中所有可用的 UI 元件提供了詳盡的參考文件。每個元件都附有其屬性（props）、實際用法範例和最佳實踐的說明，以確保能順利地整合到您的應用程式中。

元件被組織成邏輯分類，以便於導覽和查找。請在下方選擇一個類別，以探索其中的元件。

<x-cards data-columns="3">
  <x-card data-title="版面配置" data-icon="lucide:layout-template" data-href="/components/layout">
    像 Header、Footer 和 Dashboard 這樣構成 blocklet 應用程式主要結構的核心元件。
  </x-card>
  <x-card data-title="使用者管理" data-icon="lucide:users" data-href="/components/user-management">
    一套用於處理使用者個人資料、會話管理和組織切換的元件。
  </x-card>
  <x-card data-title="元件管理" data-icon="lucide:package" data-href="/components/component-management">
    用於在應用程式中動態安裝、發布和管理 blocklet 元件的工具。
  </x-card>
  <x-card data-title="通知" data-icon="lucide:bell" data-href="/components/notifications">
    提供用於實作即時使用者通知系統的元件和工具程式。
  </x-card>
  <x-card data-title="工具程式" data-icon="lucide:wrench" data-href="/components/utilities">
    一系列輔助元件和工具程式，例如多功能的圖示元件和主題提供者。
  </x-card>
</x-cards>

---

若要開始建構您的應用程式結構，請前往 [版面配置元件](./components-layout.md) 章節。