- 78 SDK pages per language (components, composables, advanced API, guides, architecture, getting-started) - vector-edit.md user guide page (5 languages) - Update stale ru/programmable/cli/inspecting.md - Fix YAML frontmatter quoting for colons in descriptions 474 files, 0 missing pages across de/es/fr/it/pl/ru. VitePress build verified — all 546 SDK pages render.
61 lines
4.5 KiB
Markdown
61 lines
4.5 KiB
Markdown
---
|
||
title: Vue SDK
|
||
description: Создавайте редакторы на базе OpenPencil с помощью headless-компосаблов и примитивов для Vue.
|
||
---
|
||
|
||
# Vue SDK
|
||
|
||
`@open-pencil/vue` существует для того, чтобы OpenPencil мог быть чем-то большим, чем самостоятельное дизайн-приложение.
|
||
|
||
Цель — сделать OpenPencil набором инструментов, который можно встроить в другие продукты, внутренние инструменты и редакторы под конкретные задачи, а не только использовать в виде единого стандартного интерфейса.
|
||
|
||
Приложение OpenPencil — одна из возможных компоновок этого набора. SDK — это то, с помощью чего вы создаёте другие.
|
||
|
||
SDK предоставляет:
|
||
|
||
- инжектированный контекст редактора
|
||
- рендеринг холста на базе CanvasKit
|
||
- компосаблы для выделения, команд, меню, панелей свойств и переменных
|
||
- headless-структурные примитивы: `PageListRoot`, `PropertyListRoot`, `ToolbarRoot`
|
||
- встроенные i18n-примитивы для меню, панелей, диалогов и пользовательских переключателей языка
|
||
|
||
## С чего начать
|
||
|
||
<SdkCardGroup>
|
||
<SdkCard title="Начало работы" to="/programmable/sdk/getting-started" description="Установка пакета, создание экземпляра редактора и монтирование основных примитивов." />
|
||
<SdkCard title="Архитектура" to="/programmable/sdk/architecture" description="Как компосаблы, примитивы и контекст редактора взаимодействуют друг с другом." />
|
||
<SdkCard title="Руководства" to="/programmable/sdk/guides/custom-editor-shell" description="Создание оболочек, панелей свойств и навигационных панелей." />
|
||
<SdkCard title="Справочник API" to="/programmable/sdk/api/" description="Компоненты, компосаблы и расширенные публичные API." />
|
||
</SdkCardGroup>
|
||
|
||
## Зачем нужен SDK
|
||
|
||
Разным продуктам и командам нужны разные поверхности для редактирования.
|
||
|
||
Иногда нужен полноценный дизайн-редактор. Иногда — встроенный холст внутри другого приложения. Иногда — внутренний рабочий инструмент, редактор шаблонов или поверхность для редактирования с ИИ-помощником, заточенная под узкую задачу.
|
||
|
||
SDK — это слой, который делает всё это возможным.
|
||
|
||
## Принципы проектирования
|
||
|
||
- **Headless прежде всего**: логика и структура без стилей приложения
|
||
- **Компосаблы вместо обёрток**: используйте компосаблы, когда нет значимой структурной координации
|
||
- **Осознанное публичное API**: стабильные экспорты из `packages/vue/src/index.ts`
|
||
- **Интеграция с фреймворком**: Vue-интеграция поверх `@open-pencil/core`
|
||
|
||
## Как устроен пакет
|
||
|
||
SDK состоит из двух основных слоёв:
|
||
|
||
1. **Компосаблы** — для состояния и действий редактора
|
||
2. **Примитивы** — для значимой структуры UI
|
||
|
||
Если вам нужны только состояние и действия редактора — начните с компосаблов.
|
||
Если вы создаёте переиспользуемые строительные блоки UI редактора — начните с примитивов.
|
||
|
||
## Разделы API
|
||
|
||
- [Компоненты](/programmable/sdk/api/components/)
|
||
- [Компосаблы](/programmable/sdk/api/composables/)
|
||
- [Расширенные](/programmable/sdk/api/advanced/)
|