OriaTheme
GitHub

API參考·React編輯器橋

@oriatheme/react-editor

React 本機來源 ThemeEditor 的會話提供者、訂閱和自動預覽協調；它不會匯出可見的 UI。

包裝及環境

React 18.2或19客戶端橋接器；使用本地 CLI 安裝的 ThemeEditor 作為可見根。

bash
pnpm add @oriatheme/editor-core @oriatheme/react-editor

使用消費者專案已經選擇的套件管理器和鎖定檔案。範例僅使用包根匯出；不要從 src、dist 或註冊表範本深度匯入。

Exports

出口簽名描述
ThemeEditorProvider({ session?, options?, children }) => ReactElement提供呼叫方會話或為子樹擁有一個呼叫方會話。
useThemeEditor() => { session, snapshot }直接訂閱編輯器核心不可變狀態。
useThemeEditorAutoPreview(runtime?, mode?) => ThemeEditorAutoPreviewState合併每個動畫幀的有效修訂。
re-exported editor-core typesThemeEditorOptions, ThemeEditorSession, …便利類型/域再匯出；行為仍保留在編輯器核心中。
tsx
import { ThemeEditorProvider, useThemeEditorAutoPreview } from "@oriatheme/react-editor";

function Bridge({ runtime }: { runtime: OriaThemeRuntime }) {
  const preview = useThemeEditorAutoPreview(runtime);
  return <span>{preview.status}</span>;
}

可見的 UI 存在於您的專案中

此包不匯出工具列、選項卡、欄位或 CSS。使用 CLI 將元件複製到 Components/oria-theme-editor 中，然後讓路由僅組成本地 ThemeEditor、執行時間和選項。