Справочник по API · Мост редактора React

@oriatheme/react-editor

React Поставщик сеанса, подписка и координация автоматического предварительного просмотра для локального источника ThemeEditor; он не экспортирует видимый пользовательский интерфейс.

Упаковка и окружающая среда

React 18.2 или 19 клиентский мост; используйте локально установленный через CLI ThemeEditor в качестве видимого корня.

bash

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

bash

npm install @oriatheme/editor-core @oriatheme/react-editor

bash

yarn add @oriatheme/editor-core @oriatheme/react-editor

bash

bun 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 types`	`ThemeEditorOptions, ThemeEditorSession, …`	Удобный тип/реэкспорт домена; поведение остается в ядре редактора.

tsx

import { ThemeEditorProvider, useThemeEditorAutoPreview } from "@oriatheme/react-editor";

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

Видимый пользовательский интерфейс живет в вашем проекте

Этот пакет не экспортирует панель инструментов, вкладки, поля или CSS. Используйте CLI для копирования компонентов в компоненты/oria-theme-editor, а затем позвольте маршрутам составлять только локальный ThemeEditor, среду выполнения и параметры.