Type Alias: TextBlock

TextBlock = BaseUiElement & HasContent & MayHaveTitle & MayHaveStyles & object

Компонент для отображения многострочных текстовых блоков в пользовательском интерфейсе.

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

Type declaration

type

type: "textblock"

Маркер типа элемента управления.

Используется для идентификации элемента как текстового блока.

Remarks

• Всегда равен 'textblock' для этого интерфейса
• Используется контейнерами для определения типа элемента
• Позволяет TypeScript правильно типизировать элемент

Default

'textblock'

Example

const block: TextBlock = {
  id: 'plugin:text',
  type: 'textblock',  // Маркер типа
  content: 'Содержимое'
};

Remarks

Поддержка в контейнерах:

• Боковые панели (sidebar) — полная поддержка
• Модальные окна (modals) — полная поддержка
• Лента инструментов (ribbon) — не поддерживается
• Контекстное меню — не поддерживается

Иерархия интерфейсов:

TextBlock (текущий тип)
  ├── extends BaseUiElement
  │   ├── id: string (обязательно)
  │   └── onClick?: Callback (опционально)
  ├── extends HasContent
  │   └── content: string (обязательно)
  ├── extends MayHaveTitle
  │   └── title?: string (опционально)
  └── extends MayHaveStyles
      └── styles?: CSSStyles (опционально)
  └── type: 'textblock' (обязательно)
  └── contentType?: 'text' | 'html' (опционально)

Типичные сценарии использования:

• Вывод информации о документе (статистика, размер)
• Логирование операций (история, события)
• Результаты анализа (отчёты, статистика)
• Справка и инструкции
• Описание функций или возможностей
• Вывод ошибок или предупреждений
• Динамический контент (обновляемые данные)

Example

Простой текстовый блок

const textBlock: TextBlock = {
  id: 'plugin:info',
  type: 'textblock',
  title: 'Информация',
  content: 'Это простой текстовый блок с информацией о документе.'
};

Текстовый блок с HTML разметкой

const htmlBlock: TextBlock = {
  id: 'plugin:report',
  type: 'textblock',
  title: 'Отчёт',
  content: `
    <h3>Результаты анализа</h3>
    <ul>
      <li>Слов: 1250</li>
      <li>Символов: 8450</li>
      <li>Абзацев: 42</li>
    </ul>
  `,
  contentType: 'html'
};

Текстовый блок с кастомными стилями

const styledBlock: TextBlock = {
  id: 'plugin:styled',
  type: 'textblock',
  content: 'Это стилизованный текстовый блок',
  styles: {
    padding: 15,
    backgroundColor: '#f0f0f0',
    border: '1px solid #ddd',
    borderRadius: 4,
    fontFamily: 'monospace',
    fontSize: 12
  }
};

Динамически обновляемый блок с логом

let logContent = '';

export default {
  onInit: (editorApi) => {
    const logBlock: TextBlock = {
      id: 'plugin:log',
      type: 'textblock',
      title: 'Лог операций',
      content: logContent,
      contentType: 'html',
      styles: {
        height: 200,
        overflow: 'auto',
        padding: 10,
        backgroundColor: '#1e1e1e',
        color: '#00ff00',
        fontFamily: 'monospace',
        fontSize: 12,
        border: '1px solid #333'
      }
    };

    editorApi.ui.sidebar.addTab({
      id: 'plugin:panel',
      title: 'Логирование',
      content: [
        {
          type: 'controls',
          items: [logBlock]
        }
      ]
    });
  }
}

See

• BaseUiElement — базовые свойства (id, onClick)
• HasContent — свойство content
• MayHaveTitle — опциональное название
• MayHaveStyles — кастомные стили
• SidebarApi — использование в боковых панелях