clepit_core
Ang clepit_core package ang native na Dart/Flutter na kambal ng @clepit/core: parehong JSON document model, pag-edit at read-only na pag-render mula sa isang codebase, para sa web, mobile, at desktop. Palitan ang mga dokumento: ang EditorData.toJson() dito ay nababasa ng TypeScript package at kabaligtaran.
pub.dev: clepit_core · npm: @clepit/core
I-install
flutter pub add clepit_coreEditor
Ang Editor ay isang buong editing surface: mga block tool, inline tool, toolbar, at paghawak ng selection. Tumatanggap din ang EditorController ng tools at inlineTools para limitahan o palawakin ang built-in na set, at inilalantad nito ang document, selection, at view API (EditorApi) para sa programmatic na pag-edit.
import 'package:clepit_core/clepit_core.dart';
final controller = EditorController(
initial: EditorData.fromJson(documentJson),
);
Editor(
controller: controller,
config: EditorConfig(
onChange: (data) => save(data),
),
);Renderer
Iginuguhit ng Renderer ang dokumento nang read-only, walang editing chrome. Ang invalid o hindi kilalang block data ay nagre-render ng InvalidDataPlaceholder sa halip na mag-throw, kaya ang dokumento mula sa mas luma o mas bagong producer ay nakikitang bumababa sa halip na mag-crash ang view.
Renderer(
config: RendererConfig(data: document),
);ClepitTheme
Dumadaloy ang styling sa ClepitTheme, isang ThemeExtension sa iyong ThemeData, kaya sinusunod ng editor at renderer ang theme ng iyong app sa light at dark. Ang mga per-render na override ay dumadaan sa RendererConfig.styles.
Galing sa @clepit/core
Umiiral ang parehong konsepto sa magkabilang panig; sumusunod ang mga pangalan sa kombensiyon ng bawat platform.
| TypeScript | Dart |
|---|---|
| Editor | Editor |
| Renderer | Renderer |
| StyleManager | ThemeExtension<ClepitTheme> + ThemeData |
| Tool | BlockTool / InlineTool |
| Block<T> | sealed class Block |
| EditorAPI | EditorApi + BlocksApi, SelectionApi |