Перейти к основному содержанию

clepit_core

Пакет clepit_core является родным Dart/Flutter-близнецом @clepit/core: та же JSON-модель документа, редактирование и отображение только для чтения из одной кодовой базы, для веба, мобильных и десктопа. Документы взаимозаменяемы: EditorData.toJson() здесь читается пакетом TypeScript и наоборот.

pub.dev: clepit_core · npm: @clepit/core

Установка

Shell
flutter pub add clepit_core

Editor

Editor является полной поверхностью редактирования: инструменты блоков, встроенные инструменты, панели и обработка выделения. EditorController также принимает tools и inlineTools для ограничения или расширения встроенного набора и открывает API документа, выделения и вида (EditorApi) для программных правок.

Dart
import 'package:clepit_core/clepit_core.dart';

final controller = EditorController(
  initial: EditorData.fromJson(documentJson),
);

Editor(
  controller: controller,
  config: EditorConfig(
    onChange: (data) => save(data),
  ),
);

Renderer

Renderer рисует документ только для чтения, без редакторской обвязки. Невалидные или неизвестные данные блока отображают InvalidDataPlaceholder вместо исключения, поэтому документ от более старого или более нового производителя деградирует видимо, а не роняет представление.

Dart
Renderer(
  config: RendererConfig(data: document),
);

ClepitTheme

Оформление течёт через ClepitTheme, ThemeExtension на вашем ThemeData, поэтому редактор и рендерер следуют теме приложения в светлом и тёмном режимах. Переопределения на каждый рендер идут через RendererConfig.styles.

Если вы пришли из @clepit/core

Одно и то же понятие существует с обеих сторон; имена следуют соглашениям каждой платформы.

TypeScriptDart
EditorEditor
RendererRenderer
StyleManagerThemeExtension<ClepitTheme> + ThemeData
ToolBlockTool / InlineTool
Block<T>sealed class Block
EditorAPIEditorApi + BlocksApi, SelectionApi