ФреймворкJavaScript

База данных: схема, представления и строки

Блок базы данных с несколькими представлениями: доской (Kanban) и списком. Хранит схему типизированных свойств (text, select, multiSelect, date, checkbox и другие) и конфигурации представлений. Строки хранятся как дочерние блоки `database-row`. Поддерживаются группировка, изменение порядка перетаскиванием, редактирование на месте и необязательный адаптер синхронизации с бэкендом. (`sorts` и `filters` сохраняются в конфигурации представления, но пока не применяются.)

Импорт

TypeScript

import { Database } from '@bloklabs/core/tools';

Конфигурация

Опция	Тип	По умолчанию	Описание
`adapter`	`DatabaseAdapter`	`undefined`	Необязательный адаптер синхронизации с бэкендом, сохраняющий изменения схемы, строк и представлений во внешнем источнике данных.

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

TypeScript

interface DatabaseData {
  title?: string;                      // Database title
  schema: PropertyDefinition[];        // Column definitions (id, name, type, position, config)
  views: DatabaseViewConfig[];         // View configs — only 'board' and 'list' are rendered
                                       // ('table' and 'gallery' exist in the ViewType union
                                       // but fall back to the board renderer)
  activeViewId: string;                // Currently active view ID
}
// Rows are NOT stored here — they are child database-row blocks.

JSON

{
  "id": "db001",
  "type": "database",
  "data": {
    "title": "Tasks",
    "schema": [
      { "id": "prop1", "name": "Name", "type": "title", "position": "a0" },
      { "id": "prop2", "name": "Status", "type": "select", "position": "a1" }
    ],
    "views": [
      {
        "id": "v1",
        "name": "Board",
        "type": "board",
        "position": "a0",
        "sorts": [],
        "filters": [],
        "visibleProperties": ["prop1", "prop2"]
      }
    ],
    "activeViewId": "v1"
  }
}

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

TypeScript

import { Blok } from '@bloklabs/core';
import { Database, DatabaseRow } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    database: {
      class: Database,
    },
    // Required: the Database tool inserts `database-row` blocks for its rows.
    'database-row': {
      class: DatabaseRow,
    },
  },
});