Interface: DocumentApi

Базовый интерфейс для работы с содержимым документа.

Предоставляет методы для манипуляции содержимым, работы с выделением, масштабированием, буфером обмена и другими операциями, общими для всех типов документов.

Конкретный набор методов зависит от типа документа (текст, таблица, презентация, pdf). Используйте свойство type для определения типа документа во время выполнения программы.

Remarks

Иерархия типов документов:

• DocumentApi — базовый интерфейс (текущий)
• TextDocumentApi extends DocumentApi — текстовые документы (Word)
• SpreadsheetDocumentApi extends DocumentApi — таблицы (Excel)
• PresentationDocumentApi extends DocumentApi — презентации (PowerPoint)
• PdfDocumentApi extends DocumentApi — просмотр PDF

Общие свойства и методы:

• selection — работа с выделением текста/элементов
• zoom — управление масштабом документа
• clipboard — работа с буфером обмена
• insertContent() — вставка текста/HTML
• insertImage() — вставка изображений
• blur() — приостановить перехват фокуса
• focus() — возобновить перехват фокуса

Example

Определение типа документа и работа

const docApi = editorApi.document;

// Определить тип документа
switch (docApi.type) {
    case 'text':
        // Используйте методы TextDocumentApi
        ...
        break;

    case 'spreadsheet':
        // Используйте методы SpreadsheetDocumentApi
        ...
        break;

    case 'presentation':
        // Используйте методы PresentationDocumentApi
        ...
        break;

    case 'pdf':
        // Используйте методы PdfDocumentApi
        ...
        break;
}

See

• TextDocumentApi — для работы с текстовыми документами
• SpreadsheetDocumentApi — для работы с таблицами
• PresentationDocumentApi — для работы с презентациями
• PdfDocumentApi — для работы с просмотром PDF
• SelectionApi — для работы с выделением
• ClipboardApi — для работы с буфером обмена

Extended by

• TextDocumentApi
• SpreadsheetDocumentApi
• PresentationDocumentApi
• PdfDocumentApi

Methods

blur()

blur(): void

Срабатывает событие потери фокуса (blur) для документа.

Используется для завершения редактирования и применения изменений, когда нужно переместить фокус на другой элемент управления.

Returns

void

void

Remarks

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

• После завершения редактирования для применения последних изменений
• Когда нужно закончить редактирование и переместить фокус на кнопку/панель
• Для скрытия курсора редактирования
• Для срабатывания событий blur в надстройках, слушающих фокус

Обратите внимание:

• blur() не сохраняет документ, только применяет форматирование
• Редактор не потеряет свои данные, фокус вернётся на кнопку/элемент UI

Example

// После редактирования в документе переместить фокус
await editorApi.document.insertContent('Новый текст');
editorApi.document.blur();

// Теперь фокус на кнопке "Сохранить"
document.querySelector('button.save')?.focus();

// Завершить редактирование при клике на кнопку "Готово"
const readyButton: Button = {
    id: 'doneBtn',
    title: 'Готово',
    onClick: () => {
        editorApi.document.blur();
        console.log('Редактирование завершено');
    }
};

See

SelectionApi — для работы с выделением перед blur()

---

focus()

focus(): void

Срабатывает событие возобновления перехвата фокуса (focus) для документа.

Используется для возврата к редактированию, когда нужно вернуться к редактированию документа

Returns

void

void

Remarks

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

• Для возврата к редактированию документа
• Для срабатывания событий focus в надстройках, слушающих фокус

Example

// После редактирования в документе переместить фокус
await editorApi.document.insertContent('Новый текст');
editorApi.document.blur();

// Теперь фокус на кнопке "Сохранить"
document.querySelector('button.save')?.focus();

// Надо вернуться к редактированию
editorApi.document.focus();

See

SelectionApi — для работы с выделением после вызова focus()

---

insertContent()

insertContent(content, contentType?): Promise<void>

Вставляет содержимое в текущую позицию курсора.

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

Parameters

content

string

Строка с содержимым для вставки

contentType?

ContentType

Формат содержимого (по умолчанию plain/text)

Returns

Promise<void>

Promise, резолвится после успешной вставки

Remarks

Поддерживаемые форматы:

Формат	Описание	Использование
plain/text	Обычный текст без форматирования	Вставка простого текста
html	HTML-разметка (вставляется в <div/>)	Вставка с форматированием

Ограничения:

• HTML должен быть валидным
• Некоторые элементы могут не поддерживаться в режиме view
• Стили могут быть переопределены правилами редактора

Example

Вставка простого текста

await editorApi.document.insertContent('Привет, мир!');

Вставка текста с форматированием (HTML)

await editorApi.document.insertContent(
    `<p><b>Важно:</b> <em>Это форматированный текст</em></p>`,
    'html'
);

Вставка сложного содержимого со стилями

await editorApi.document.insertContent(
    `<div style="background-color: #f0f0f0; padding: 10px; border-radius: 4px;">
         <h3 style="color: #234567; margin-top: 0;">Заголовок</h3>
         <p>Содержимое с форматированием</p>
     </div>`,
    'html'
);

See

ContentType — описание всех поддерживаемых форматов

---

insertImage()

insertImage(file): void

Вставляет изображение в текущую позицию курсора.

Parameters

file

File

Объект File с изображением (png, jpg, gif, svg, и т.д.)

Returns

void

Remarks

Поддерживаемые форматы:

• PNG (image/png)
• JPEG (image/jpeg)
• BMP (image/bmp)
• GIF (image/gif)
• SVG (image/svg+xml)

Ограничения:

• Максимальный размер файла зависит от конфигурации редактора
• Изображение автоматически масштабируется до размера страницы/ячейки
• Некоторые форматы могут быть перекодированы

Example

Вставка изображения из File Input

const fileInput = document.querySelector('input[type="file"]');
fileInput.addEventListener('change', (event) => {
    const file = event.target.files?.;
    if (file?.type.startsWith('image/')) {
        editorApi.document.insertImage(file);
    }
});

Вставка изображения из Blob (например, скриншот, загруженное изображение)

async function insertImageFromUrl(imageUrl: string) {
    const response = await fetch(imageUrl);
    const blob = await response.blob();

    const filename = imageUrl.split('/').pop() || 'image.png';
    const file = new File([blob], filename, { type: blob.type });

    editorApi.document.insertImage(file);
}

See

ClipboardApi — если нужно получить изображение из буфера обмена

Properties

clipboard

clipboard: ClipboardApi

API для работы с буфером обмена (копирование, вставка, вырезание).

Позволяет взаимодействовать с системным буфером обмена, получать содержимое, проверять доступность операций.

Remarks

Типичные операции:

• Копировать: clipboard.copy()
• Вырезать: clipboard.cut()
• Вставить: clipboard.paste()

Ограничения:

• Требует разрешения на доступ к буферу обмена (может быть заблокировано браузером)
• Может требовать пользовательского разрешения в некоторых браузерах

See

• ClipboardApi — полное описание методов работы с буфером обмена
• IframeSandboxConfig — как настроить разрешения iframe

Example

// Скопировать содержимое в буфер обмена
await editorApi.document.clipboard.copy();

// Вставить содержимое из буфера обмена
await editorApi.document.clipboard.paste();

// Вырезать выделение в буфер обмена
await editorApi.document.clipboard.cut();

---

selection

selection: SelectionApi

API для работы с выделением текста или элементов в документе.

Позволяет получать текущее выделение, устанавливать новое выделение, очищать выделение. Полезно для операций с выделенным контентом или программного выделения.

Remarks

Типичные операции:

• Получить текущее выделение: selection.getSelectionAsText()

See

SelectionApi — полное описание методов работы с выделением

Example

// Получить текущее выделение
const selection = await editorApi.document.selection.getSelectionAsText();
console.log('Выделено:', selection);

---

zoom

zoom: ZoomApi

API управления масштабированием (zoom) документа.

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

Remarks

Типичные операции:

• Получить текущий масштаб: zoom.getZoomLevel()
• Установить масштаб: zoom.setZoomLevel(150) (процент)

See

ZoomApi — полное описание методов управления масштабом

Example

// Получить текущий масштаб
const zoom = await editorApi.document.zoom.getZoomLevel();
console.log('Масштаб:', zoom + '%');

// Установить масштаб 150%
await editorApi.document.zoom.setZoomLevel(150);