ФреймворкJavaScript

Theme API: светлая, тёмная и автоматическая темы

Чтение и смена цветовой темы редактора на лету. Заданный режим и реально отрисованная тема — два разных вопроса: `get()` отвечает на первый, `getResolved()` — на второй. Чтобы получать уведомления вместо опроса, передайте опцию конфигурации ядра `onThemeChange`: она срабатывает с разрешённой темой при её изменении (включая смену системной настройки, пока режим равен 'auto').

Редактировать на GitHub

Как получить экземпляр редактора

Методы ниже вызываются на редакторе, созданном через new Blok(). Они доступны после того, как разрешится editor.isReady.

TypeScript

// You already hold the instance returned by the constructor.
const editor = new Blok({ holder: 'editor' });
await editor.isReady;

// Call any API method on it.
editor.caret.setToLastBlock('end');

Методы

theme.get()

'light' | 'dark' | 'auto'

The configured theme mode — exactly what was passed as `config.theme` or last set via `theme.set()`. Returns 'auto' when the editor follows the OS preference, so this is not the theme currently painted.

Когда использовать

Возвращает заданный режим — 'auto', 'light' или 'dark', — а не то, что отображается сейчас. Для этого есть getResolved().

TypeScript

console.log(editor.theme.get()); // 'auto'

theme.set(mode)

void

Set the theme mode. Pass 'light' or 'dark' to pin it, or 'auto' to follow the OS preference via prefers-color-scheme.

Когда использовать

Меняет тему на месте: без пересоздания редактора и без перерисовки содержимого блоков.

TypeScript

editor.theme.set('dark');

// Back to following the OS
editor.theme.set('auto');

theme.getResolved()

'light' | 'dark'

The theme after evaluating the OS preference when the mode is 'auto' — the theme actually being painted. Use it to match surrounding UI to the editor.

Когда использовать

Возвращает 'light' или 'dark' с учётом настройки ОС, чтобы интерфейс вокруг редактора мог совпадать с ним.

TypeScript

editor.theme.set('auto');
console.log(editor.theme.getResolved()); // 'dark' on a dark-mode OS