blocksuite

BlockSuite

Предупреждение

Этот репозиторий будет претерпевать серьезные изменения, поэтому мы приостановим принятие PRS.

Подробнее: #9045

---

Обзор

Люди, которые действительно серьезно относятся к редактору, должны создавать свои собственные рамки.

BlockSuite - это инструментарий для строительства редакторов и совместных приложений. Он реализует серию инфраструктуры редактирования контента, самостоятельно компоненты пользовательского интерфейса и редакторы.

Вы можете рассматривать BlockSuite в качестве библиотеки компонентов пользовательского интерфейса для создания различных редакторов, основанной на минимизированной ванильной структуре в качестве времени выполнения. С BlockSuite вы можете:

• Повторно используйте несколько сторонних редакторов BlockSuite:
  • PageEditor : комплексный редактор документов на основе блоков, предлагающий обширную настройку и гибкость.
  • EdgelessEditor : графический редактор с поддержкой рендеринга Opt-In, но также имеет те же самые богатые текстовые возможности с PageEditor .
• Настройте, расширяйте и улучшайте эти редакторы с помощью богатого набора компонентов и примеров BlockSuite. Все компоненты BlockSuite (включая редакторы) являются собственными веб-компонентами, что делает их фреймворками-агрессиями и простыми в взаимодействии с популярными рамками.
• Или постройте новые редакторы с нуля на основе базовой ванильной структуры.

? BlockSuite в настоящее время находится на ранней стадии, и компоненты и возможности расширения все еще находятся под утонченностью. Надеюсь, вы сможете следить за обновлениями, попробовать или поделиться своими отзывами!

Мотивация

BlockSuite возник из базы аффинных знаний, с целями дизайна, включая:

• Поддержка мультимодального редактируемого контента . При рассмотрении знаний как единого источника истины, создание его различных режимов представления (например, текст, слайды, карты разума, таблицы) по -прежнему требуют множества несовместимых структур. В идеале, независимо от того, как изменяется представление контента, должна быть последовательная структура, которая помогает.
• Организация и визуализация сложных знаний . Это требует, чтобы структура была изначально управлять состоянием в нескольких документах.
• Подготовка сотрудничества : сотрудничество в реальном времени часто рассматривается как дополнительный плагин, но на самом деле мы могли бы изначально использовать основную технологию CRDT для управления редактором, что помогает создать более четкий и надежный поток данных.

Во время развития Affine стало ясно, что BlockSuite выходил за рамки просто является внутренним редактором и превращается в универсальную структуру. Вот почему мы решили независимо от открытого исходного кода.

Функции

С редакторами BlockSuite вы можете выборочно использовать все функции редактирования в Affine:

И под капюшоном, ванильная рамка BlockSuite поддерживает:

• Определение пользовательских блоков и встроенных встроений.
• Инкрементные обновления, сотрудничество в реальном времени и даже децентрализованная синхронизация данных на основе механизма потоковой передачи документа документа.
• Написание комплексной логики редактирования типа на основе механизма команд, аналогично реагированным крючкам, предназначенным для редактирования документов.
• Постоянство документов и совместимость с различными сторонними форматами (такими как Markdown и HTML) на основе блочного снимка и трансформатора.
• Государственное планирование по нескольким документам и повторное использование одного документа в нескольких редакторах.

Чтобы попробовать BlockSuite, обратитесь к примеру быстрого старта и начните с предустановленных редакторов в @blocksuite/presets .

Архитектура

Отношения между BlockSuite и Affine аналогичны отношениям между редактором Monaco и VSCODE, но с одним основным отличием: BlockSuite не генерируется на основе аффинной кодовой базы, но поддерживается независимо с другим технологическим стеком - Affine использует React, в то время как BlockSuite использует веб -компоненты.

Эта разница привела к тому, что BlockSuite устанавливает четкие границы на основе философии, ориентированной на компонент, обеспечивая:

• Как аффинные, так и другие проекты должны в равной степени повторно использовать и расширять блоксуйты через компоненты без каких -либо привилегий.
• Компоненты BlockSuite можно легко использовать независимо от того, используете ли вы React или другие рамки.

С этой целью проект BlockSuite структурирован вокруг пакетов ключей, которые классифицируются на две группы: безголовный фреймворк и предварительно построенные компоненты редактирования.

Рамки
@blocksuite/store	Уровень данных для моделирования Совместных документов состояний. Он изначально построен на библиотеке CRDT YJS, питание всех документов BlockSuite со встроенным сотрудником в реальном времени и возможностях путешествия во времени.
@blocksuite/inline	Минимальные богатые текстовые компоненты для встроенного редактирования. BlockSuite позволяет расщеплять богатый текстовый контент в разных узлах блоков в разные встроенные редакторы, что делает сложный контент удобным композицией. Это значительно уменьшает сложность, необходимую для реализации традиционных функций редактирования богатых текстов.
@blocksuite/block-std	Фреймворк-агентская библиотека для моделирования редактируемых блоков. Его возможности охватывают структуру полей блока, событий, выбора, поддержки буфера обмена и т. Д.

Компоненты
@blocksuite/blocks	Реализации блоков по умолчанию для составления предустановленных редакторов, включая виджеты, принадлежащие каждому блоку.
@blocksuite/presets	Редактируемые компоненты, включающие редакторы, включающие в себя редакторы ( PageEditor / EdgelessEditor ) и вспомогательные компоненты пользовательского интерфейса, названные фрагментами ( CopilotPanel , DocTitle ...).

Ресурсы

• ? Ресурсы
  • Канарская игровая площадка
  • Примеры
  • BlockSuite в Stackblitz
  • Тестирование сотрудничества в реальном времени
  • BlockSuite Ecosystem CI
  • Редактор BlockSvite на основе VUE
• Документация
• ? Хорошие первые проблемы
• ? ️ GitHub обсуждения
• Канал раздора
• Выпуски

Здание

См. Building.md для инструкций о том, как построить и тестировать блоксюйт из Source.

Внося

BlockSuite принимает запросы на тягу на GitHub. Прежде чем вы начнете вносить свой вклад, пожалуйста, убедитесь, что вы прочитали и приняли наше лицензионное соглашение о лицензии. Чтобы указать ваше соглашение, просто отредактируйте этот файл и отправьте запрос на вытяжку.

Лицензия

MPL 2.0