Runtime, Bootstrap и переходы

Среда выполнения — это единственный источник состояния браузера.

import { migrateOriaStandardV1ToV2 } from "@oriatheme/core";
import { createOriaThemeRuntime } from "@oriatheme/runtime-dom";
import { oriaPresetThemes } from "@oriatheme/presets";

const runtime = createOriaThemeRuntime({
  presets: oriaPresetThemes,
  defaultThemeId: "oria-default",
  migrations: [migrateOriaStandardV1ToV2],
  transition: { type: "view-transition", respectReducedMotion: true },
});

runtime.start();
runtime.setTheme("oria-ocean", { animate: true });
runtime.setAppearance("system");

После запуска среда выполнения отслеживает обновления системного режима, постоянства и перекрестных таблиц. Вызовите уничтожение, когда SPA удаляет среду выполнения. Поле миграции в этом примере — единственный способ принять сохраненные пользовательские темы версии 1; без него данные v1 безопасно отклоняются. См. «Миграция с версии 1».

Три первых слоя краски

1. SSR/SSG сначала выводит статические переменные, сгенерированные из доверенной, полностью разрешенной темы по умолчанию.
2. Запустите createBootstrapStorageScript в голове или вызовите bootstrapTheme перед монтированием Vite.
3. Поставщик платформы или среда выполнения повторно проверяет все состояние и становится владельцем после запуска.

import { createBootstrapStorageScript } from "@oriatheme/runtime-dom";

const bootstrapScript = createBootstrapStorageScript({ contract: { name: "oria-standard", version: 2 } });
// In a Next Server Component head:
<script id="oria-theme-bootstrap" dangerouslySetInnerHTML={{ __html: bootstrapScript }} />

Только явные действия оживляют

Передавайте animate для инициируемых пользователем вызовов setTheme или setAppearance. Bootstrap, восстановление, системные изменения и синхронизация между вкладками всегда переключаются атомарно без анимации; соблюдайте ограниченное движение.