Перейти к содержимому
ФреймворкJavaScript

Вкладка: одна вкладка блока вкладок

Одна вкладка внутри блока вкладок. Пользователь не может вставить её сам. Вкладки создаёт и ведёт родительский блок tabs.

Вкладка сохраняет title и необязательный эмодзи icon, оба как обычный текст. Пустой значок не сохраняется. Дочерние блоки вкладываются во вкладку через contentIds. Вкладка не может содержать другой блок вкладок.

Пустая вкладка показывает «Пустая вкладка. Нажмите или перетащите блоки сюда.». Щелчок по ней добавляет во вкладку абзац.

Импорт

TypeScript
import { TabTool } from '@bloklabs/core/tools';

Формат данных

TypeScript
interface TabData {
  title: string; // Plain text label shown in the tab strip
  icon?: string; // Optional emoji shown before the title
}
// Child blocks are referenced via the block's saved `content` array
// (the in-memory `contentIds`), not stored here.
JSON
{
  "id": "tab1",
  "type": "tab",
  "data": {
    "title": "Overview",
    "icon": "📘"
  },
  "content": ["block1", "block2"]
}

Пример использования

TypeScript
// Tab is not inserted directly — it is created by the TabsTool.
import { TabsTool, TabTool } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    tabs: { class: TabsTool },
    tab: { class: TabTool },
  },
});