chuijs 4.0.1 → 4.0.3

package/framework/components/chui_data_grid/data_grid.js

@@ -1,13 +1,13 @@
-const {setStyles, optionOr} = require('../../modules/chui_functions');
-const {A11Y_ACTIVE_CLASS} = require('../../modules/chui_a11y/chui_a11y');
-const {Icon, Icons} = require('../chui_icons/icons');
-const {Dialog} = require('../chui_modal/modal');
-const {ContentBlock} = require('../chui_content_block/content_block');
-const {Button} = require('../chui_button/button');
-const {I18n} = require('../../modules/chui_i18n/chui_i18n');
-const {Desktop} = require('../../modules/chui_services/desktop');
-const {CheckBox} = require('../chui_inputs/chui_check_box/check_box');
-const {Select} = require('../chui_inputs/chui_select_box/select_box');
+const { setStyles, optionOr } = require("../../modules/chui_functions");
+const { A11Y_ACTIVE_CLASS } = require("../../modules/chui_a11y/chui_a11y");
+const { Icon, Icons } = require("../chui_icons/icons");
+const { Dialog } = require("../chui_modal/modal");
+const { ContentBlock } = require("../chui_content_block/content_block");
+const { Button } = require("../chui_button/button");
+const { I18n } = require("../../modules/chui_i18n/chui_i18n");
+const { Desktop } = require("../../modules/chui_services/desktop");
+const { CheckBox } = require("../chui_inputs/chui_check_box/check_box");
+const { Select } = require("../chui_inputs/chui_select_box/select_box");
 
 /**
  * `DataGrid` — сетка данных с описанием колонок.
@@ -81,7 +81,7 @@ class DataGridBody {
         START: "start",
         CENTER: "center",
         END: "end",
-        NEAREST: "nearest"
+        NEAREST: "nearest",
     };
     static DEFAULT_BUFFER = 6;
     static DEFAULT_LOAD_THRESHOLD = 3;
@@ -110,28 +110,30 @@ class DataGridBody {
     #loading_more = false;
     // Длина, для которой запрос уже сделан: не просим ещё раз, пока данных не прибавилось
     #requested_at = -1;
-    #window_state = {from: 0, to: 0};
+    #window_state = { from: 0, to: 0 };
     #raf = null;
     #refresh_raf = null;
     #resize_observer = undefined;
     #bound = false;
 
-    constructor(options = {
-        id: String(),
-        itemTag: String(),
-        itemHeight: Number(),
-        buffer: Number(),
-        height: String(),
-        emptyText: String(),
-        loadingText: String(),
-        hasMore: Boolean(),
-        loadMoreThreshold: Number(),
-        renderItem: undefined,
-        onItemClick: undefined,
-        onActivate: undefined,
-        onRender: undefined,
-        onLoadMore: undefined
-    }) {
+    constructor(
+        options = {
+            id: String(),
+            itemTag: String(),
+            itemHeight: Number(),
+            buffer: Number(),
+            height: String(),
+            emptyText: String(),
+            loadingText: String(),
+            hasMore: Boolean(),
+            loadMoreThreshold: Number(),
+            renderItem: undefined,
+            onItemClick: undefined,
+            onActivate: undefined,
+            onRender: undefined,
+            onLoadMore: undefined,
+        }
+    ) {
         DataGridBody.#counter += 1;
         this.#id = optionOr(options.id, `chui_data_grid_body_${DataGridBody.#counter}`);
         this.#item_tag = optionOr(options.itemTag, "data_grid_row");
@@ -143,7 +145,8 @@ class DataGridBody {
         this.#on_render = options.onRender;
         this.#on_load_more = options.onLoadMore;
         this.#loading_text = optionOr(options.loadingText, I18n.t("common.loading"));
-        this.#load_threshold = options.loadMoreThreshold === undefined ? DataGridBody.DEFAULT_LOAD_THRESHOLD : options.loadMoreThreshold;
+        this.#load_threshold =
+            options.loadMoreThreshold === undefined ? DataGridBody.DEFAULT_LOAD_THRESHOLD : options.loadMoreThreshold;
         // Без onLoadMore тело считает, что загружено всё
         this.#has_more = options.hasMore === undefined ? options.onLoadMore !== undefined : options.hasMore === true;
         this.#root.id = this.#id;
@@ -163,7 +166,7 @@ class DataGridBody {
         this.#root.appendChild(this.#loader);
         this.#applyLoader();
         this.setHeight(optionOr(options.height, DataGrid.DEFAULT_HEIGHT));
-        this.#root.addEventListener("scroll", this.#onScroll, {passive: true});
+        this.#root.addEventListener("scroll", this.#onScroll, { passive: true });
         // Размер тела зависит от layout'а и появляется только после вставки в документ:
         // по нему считается окно, поэтому пересобираем его при изменении размера. Работу
         // уводим в кадр: правки layout внутри колбэка ResizeObserver дают
@@ -174,19 +177,29 @@ class DataGridBody {
     }
 
     // === ЧТЕНИЕ ===
-    getId() { return this.#id; }
-    getItemHeight() { return this.#item_height; }
+    getId() {
+        return this.#id;
+    }
+    getItemHeight() {
+        return this.#item_height;
+    }
     /** Окно, которое сейчас в DOM (вместе с запасом `buffer`) */
-    getRenderedRange() { return {...this.#window_state}; }
+    getRenderedRange() {
+        return { ...this.#window_state };
+    }
     /** Только видимые строки — без запаса; это то, что реально видит пользователь */
     getVisibleRange() {
         const from = this.#firstVisible();
-        return {from: from, to: Math.min(this.#items.length, from + this.#visibleCount())};
+        return { from: from, to: Math.min(this.#items.length, from + this.#visibleCount()) };
     }
     /** Узел строки, если он сейчас в окне: узлов на всё содержимое нет */
-    getItemElement(index = Number()) { return this.#nodes.get(index); }
+    getItemElement(index = Number()) {
+        return this.#nodes.get(index);
+    }
     /** Корень тела: его вставляет сетка */
-    set() { return this.#root; }
+    set() {
+        return this.#root;
+    }
 
     // === ИЗМЕНЕНИЕ ===
     setHeight(height = String()) {
@@ -351,15 +364,15 @@ class DataGridBody {
             if (node.previousSibling !== previous) this.#root.insertBefore(node, previous.nextSibling);
             previous = node;
         }
-        this.#window_state = {from: from, to: to};
+        this.#window_state = { from: from, to: to };
         this.#syncSpacers();
-        if (this.#on_render !== undefined) this.#on_render({from: from, to: to});
+        if (this.#on_render !== undefined) this.#on_render({ from: from, to: to });
         this.#checkLoadMore(to);
     }
 
     #syncSpacers() {
         const count = this.#items.length;
-        const {from, to} = this.#window_state;
+        const { from, to } = this.#window_state;
         this.#spacer_top.style.height = count === 0 ? "0px" : `${from * this.#item_height}px`;
         this.#spacer_bottom.style.height = count === 0 ? "0px" : `${Math.max(0, (count - to) * this.#item_height)}px`;
     }
@@ -399,22 +412,22 @@ class DataGridBody {
         let node = event.target;
         while (node !== null && node !== this.#root) {
             if (node.parentElement === this.#root && node.dataset.index !== undefined) {
-                return {index: Number(node.dataset.index), node: node};
+                return { index: Number(node.dataset.index), node: node };
             }
             node = node.parentElement;
         }
-        return {index: -1, node: undefined};
+        return { index: -1, node: undefined };
     }
 
     #onItemClick = (event) => {
-        const {index, node} = this.#itemFromEvent(event);
+        const { index, node } = this.#itemFromEvent(event);
         if (index === -1) return;
         // Событие сетке нужно целиком: по нему она читает модификаторы Ctrl/Shift
         if (this.#on_item_click !== undefined) this.#on_item_click(this.#items[index], index, node, event);
     };
 
     #onItemDblClick = (event) => {
-        const {index, node} = this.#itemFromEvent(event);
+        const { index, node } = this.#itemFromEvent(event);
         if (index === -1) return;
         if (this.#on_activate !== undefined) this.#on_activate(this.#items[index], index, node);
     };
@@ -436,24 +449,24 @@ class DataGrid {
     static SELECTION = {
         NONE: "none",
         SINGLE: "single",
-        MULTI: "multi"
+        MULTI: "multi",
     };
     static SORT = {
         NONE: "none",
         ASC: "asc",
-        DESC: "desc"
+        DESC: "desc",
     };
     static SORT_ATTRIBUTE = {
         ASC: "ascending",
         DESC: "descending",
-        NONE: "none"
+        NONE: "none",
     };
     /** Тип редактора ячейки (`column.editType`) */
     static EDIT_TYPE = {
         TEXT: "text",
         NUMBER: "number",
         CHECKBOX: "checkbox",
-        SELECT: "select"
+        SELECT: "select",
     };
     /** Виды агрегатов для группировки (`aggregates`) */
     static AGGREGATE = {
@@ -461,7 +474,7 @@ class DataGrid {
         AVG: "avg",
         MIN: "min",
         MAX: "max",
-        COUNT: "count"
+        COUNT: "count",
     };
     // Значения — ключи словаря: подпись агрегата берётся при показе
     static AGGREGATE_LABEL = {
@@ -469,12 +482,12 @@ class DataGrid {
         avg: "dataGrid.aggregate.avg",
         min: "dataGrid.aggregate.min",
         max: "dataGrid.aggregate.max",
-        count: "dataGrid.aggregate.count"
+        count: "dataGrid.aggregate.count",
     };
     /** Что экспортирует `exportCSV()`: текущий вид или все загруженные строки */
     static EXPORT = {
         VIEW: "view",
-        ALL: "all"
+        ALL: "all",
     };
     /** Куда выравнивать строку в `scrollToRow()` (тело сетки — своё, см. `DataGridBody`) */
     static ALIGN = DataGridBody.ALIGN;
@@ -517,7 +530,7 @@ class DataGrid {
     #row_index = new Map();
     #filter = "";
     #filter_keys = [];
-    #sort = {key: undefined, direction: DataGrid.SORT.NONE};
+    #sort = { key: undefined, direction: DataGrid.SORT.NONE };
     #group_by = undefined;
     #group_label = undefined;
     #aggregates = {};
@@ -525,7 +538,7 @@ class DataGrid {
     #collapsed = new Map();
     #editable = undefined;
     #editing = undefined;
-    #active = {row: 0, col: 0};
+    #active = { row: 0, col: 0 };
     #entry_count = 0;
 
     // Производные данные (пересобираются одним проходом — см. #recompute)
@@ -560,39 +573,41 @@ class DataGrid {
     // Перестановка колонок
     #drag = undefined;
 
-    constructor(options = {
-        id: String(),
-        columns: Array(),
-        data: Array(),
-        rowHeight: Number(),
-        height: String(),
-        buffer: Number(),
-        selectable: String(),
-        rowKey: undefined,
-        filterKeys: Array(),
-        emptyText: String(),
-        label: String(),
-        editable: undefined,
-        pinned: undefined,
-        hiddenColumns: Array(),
-        columnChooser: Boolean(),
-        columnReorder: Boolean(),
-        dataSource: undefined,
-        pageSize: Number(),
-        rowClass: undefined,
-        groupBy: undefined,
-        groupLabel: undefined,
-        aggregates: Object(),
-        groupCollapsed: Boolean(),
-        onRowActivate: undefined,
-        onSelectionChange: undefined,
-        onCellEdit: undefined,
-        onActiveCellChange: undefined,
-        onColumnOrderChange: undefined,
-        onDataLoad: undefined,
-        onDataError: undefined,
-    }) {
-        setStyles(__dirname + "/styles.css", 'chUiJS_DataGrid');
+    constructor(
+        options = {
+            id: String(),
+            columns: Array(),
+            data: Array(),
+            rowHeight: Number(),
+            height: String(),
+            buffer: Number(),
+            selectable: String(),
+            rowKey: undefined,
+            filterKeys: Array(),
+            emptyText: String(),
+            label: String(),
+            editable: undefined,
+            pinned: undefined,
+            hiddenColumns: Array(),
+            columnChooser: Boolean(),
+            columnReorder: Boolean(),
+            dataSource: undefined,
+            pageSize: Number(),
+            rowClass: undefined,
+            groupBy: undefined,
+            groupLabel: undefined,
+            aggregates: Object(),
+            groupCollapsed: Boolean(),
+            onRowActivate: undefined,
+            onSelectionChange: undefined,
+            onCellEdit: undefined,
+            onActiveCellChange: undefined,
+            onColumnOrderChange: undefined,
+            onDataLoad: undefined,
+            onDataError: undefined,
+        }
+    ) {
+        setStyles(__dirname + "/styles.css", "chUiJS_DataGrid");
         DataGrid.#counter = DataGrid.#counter + 1;
         this.#id = optionOr(options.id, `chui_data_grid_${DataGrid.#counter}`);
         this.#columns = DataGrid.#normalizeColumns(options.columns);
@@ -631,7 +646,9 @@ class DataGrid {
         this.#scroll.appendChild(this.#head);
         this.#root.appendChild(this.#scroll);
         this.#error.appendChild(this.#error_text);
-        this.#error.appendChild(new Button({title: I18n.t("dataGrid.retry"), clickEvent: () => this.retryLoad()}).set());
+        this.#error.appendChild(
+            new Button({ title: I18n.t("dataGrid.retry"), clickEvent: () => this.retryLoad() }).set()
+        );
         this.#error.hidden = true;
         this.#root.insertBefore(this.#error, this.#scroll);
         this.#status.classList.add("chui_visually_hidden");
@@ -666,7 +683,7 @@ class DataGrid {
                 this.#syncActiveCells();
                 // Смещения закреплённых колонок считаются по отрисованным узлам
                 this.#syncPinned();
-            }
+            },
         });
         this.#scroll.appendChild(this.#list.set());
         this.#root.appendChild(this.#status);
@@ -686,7 +703,7 @@ class DataGrid {
         this.#resize_observer = new ResizeObserver(() => this.#syncPinned());
         this.#resize_observer.observe(this.#scroll);
         // Горизонтальная прокрутка: закреплённые колонки удерживаем на месте
-        this.#scroll.addEventListener("scroll", this.#onScrollX, {passive: true});
+        this.#scroll.addEventListener("scroll", this.#onScrollX, { passive: true });
 
         this.#reindex();
         this.#buildHeader();
@@ -778,8 +795,8 @@ class DataGrid {
     /** Ячейка CSV: кавычки удваиваются, разделитель и перевод строки берутся в кавычки */
     static #csvCell(value = undefined, delimiter = String()) {
         const text = String(value === undefined || value === null ? "" : value);
-        const quoted = text.includes("\"") || text.includes(delimiter) || text.includes("\n") || text.includes("\r");
-        return quoted ? `"${text.replace(/"/g, "\"\"")}"` : text;
+        const quoted = text.includes('"') || text.includes(delimiter) || text.includes("\n") || text.includes("\r");
+        return quoted ? `"${text.replace(/"/g, '""')}"` : text;
     }
 
     /** Ответ сервера: массив строк или `{rows, total}` */
@@ -829,7 +846,10 @@ class DataGrid {
         this.#entry_count = this.#entries.length;
         // Число строк для скринридера: элементы списка плюс строка заголовка, а в серверном
         // режиме — то, что сообщил сервер (иначе он знал бы только про загруженное окно)
-        this.#root.setAttribute("aria-rowcount", String((this.#server_total === undefined ? this.#entry_count : this.#server_total) + 1));
+        this.#root.setAttribute(
+            "aria-rowcount",
+            String((this.#server_total === undefined ? this.#entry_count : this.#server_total) + 1)
+        );
         this.#syncColumns();
         this.#list.setItems(this.#entries);
         this.#list.setHasMore(this.#has_more);
@@ -860,9 +880,11 @@ class DataGrid {
         if (this.#data_source !== undefined) return rows.slice();
         const text = this.#filter.trim().toLowerCase();
         if (text === "" || this.#filter_keys.length === 0) return rows.slice();
-        return rows.filter((row) => this.#filter_keys.some((key) => {
-            return DataGrid.#valueText(row[key]).toLowerCase().includes(text);
-        }));
+        return rows.filter((row) =>
+            this.#filter_keys.some((key) => {
+                return DataGrid.#valueText(row[key]).toLowerCase().includes(text);
+            })
+        );
     }
 
     /** Сортировка стабильная: при равных значениях строки остаются в исходном порядке */
@@ -870,11 +892,13 @@ class DataGrid {
         const key = this.#sort.key;
         if (key === undefined || this.#sort.direction === DataGrid.SORT.NONE) return rows.slice();
         const column = this.#columns.find((item) => item.key === key);
-        const compare = column !== undefined && typeof column.compare === "function"
-            ? column.compare
-            : (left, right) => DataGrid.#compareValues(left[key], right[key]);
+        const compare =
+            column !== undefined && typeof column.compare === "function"
+                ? column.compare
+                : (left, right) => DataGrid.#compareValues(left[key], right[key]);
         const sign = this.#sort.direction === DataGrid.SORT.DESC ? -1 : 1;
-        return rows.map((row, index) => ({row: row, index: index}))
+        return rows
+            .map((row, index) => ({ row: row, index: index }))
             .sort((left, right) => {
                 const result = compare(left.row, right.row);
                 if (result === 0 || Number.isNaN(result)) return left.index - right.index;
@@ -893,7 +917,7 @@ class DataGrid {
         const leftNumber = Number(left);
         const rightNumber = Number(right);
         if (Number.isFinite(leftNumber) && Number.isFinite(rightNumber)) return leftNumber - rightNumber;
-        return String(left).localeCompare(String(right), undefined, {numeric: true, sensitivity: "base"});
+        return String(left).localeCompare(String(right), undefined, { numeric: true, sensitivity: "base" });
     }
 
     /** Группы: порядок — первое появление ключа, поэтому он не зависит от сортировки */
@@ -903,9 +927,7 @@ class DataGrid {
         const map = new Map();
         for (const row of rows) {
             const raw = keyOf(row);
-            const key = raw === undefined || raw === null || raw === ""
-                ? I18n.t("dataGrid.groupNoValue")
-                : String(raw);
+            const key = raw === undefined || raw === null || raw === "" ? I18n.t("dataGrid.groupNoValue") : String(raw);
             if (map.has(key) === false) map.set(key, []);
             map.get(key).push(row);
         }
@@ -915,7 +937,7 @@ class DataGrid {
                 key: key,
                 rows: group_rows,
                 aggregates: this.#aggregateValues(group_rows),
-                collapsed: this.#collapsed.has(key) ? this.#collapsed.get(key) : this.#group_collapsed_default
+                collapsed: this.#collapsed.has(key) ? this.#collapsed.get(key) : this.#group_collapsed_default,
             });
         }
         return out;
@@ -928,23 +950,30 @@ class DataGrid {
             const spec = this.#aggregates[key];
             const column = this.#columns.find((item) => item.key === key);
             if (typeof spec === "function") {
-                out[key] = {text: String(spec(rows, key)), label: column === undefined ? key : column.title};
+                out[key] = { text: String(spec(rows, key)), label: column === undefined ? key : column.title };
                 continue;
             }
             const values = rows.map((row) => row[key]).filter((value) => value !== undefined && value !== null);
             const numbers = values.map((value) => Number(value)).filter((value) => Number.isFinite(value));
             let value = undefined;
             if (spec === DataGrid.AGGREGATE.COUNT) value = values.length;
-            else if (spec === DataGrid.AGGREGATE.SUM) value = DataGrid.#round(numbers.reduce((sum, item) => sum + item, 0));
-            else if (spec === DataGrid.AGGREGATE.AVG) value = numbers.length === 0 ? undefined : DataGrid.#round(numbers.reduce((sum, item) => sum + item, 0) / numbers.length);
+            else if (spec === DataGrid.AGGREGATE.SUM)
+                value = DataGrid.#round(numbers.reduce((sum, item) => sum + item, 0));
+            else if (spec === DataGrid.AGGREGATE.AVG)
+                value =
+                    numbers.length === 0
+                        ? undefined
+                        : DataGrid.#round(numbers.reduce((sum, item) => sum + item, 0) / numbers.length);
             else if (spec === DataGrid.AGGREGATE.MIN) value = numbers.length === 0 ? undefined : Math.min(...numbers);
             else if (spec === DataGrid.AGGREGATE.MAX) value = numbers.length === 0 ? undefined : Math.max(...numbers);
-            const label = I18n.t(DataGrid.AGGREGATE_LABEL[spec] === undefined ? "dataGrid.aggregate.sum" : DataGrid.AGGREGATE_LABEL[spec]);
+            const label = I18n.t(
+                DataGrid.AGGREGATE_LABEL[spec] === undefined ? "dataGrid.aggregate.sum" : DataGrid.AGGREGATE_LABEL[spec]
+            );
             out[key] = {
                 text: value === undefined ? "" : String(value),
                 label: column === undefined ? key : column.title,
                 kind: label,
-                area: `${column === undefined ? key : column.title}: ${label} ${value === undefined ? "" : value}`
+                area: `${column === undefined ? key : column.title}: ${label} ${value === undefined ? "" : value}`,
             };
         }
         return out;
@@ -972,7 +1001,7 @@ class DataGrid {
         for (let index = 0; index < this.#columns.length; index++) {
             const column = this.#columns[index];
             if (this.#hidden.has(column.key)) continue;
-            out.push({column: column, index: index});
+            out.push({ column: column, index: index });
         }
         return out;
     }
@@ -1041,10 +1070,15 @@ class DataGrid {
                 const sort = document.createElement("data_grid_sort");
                 sort.setAttribute("aria-hidden", "true");
                 cell.appendChild(sort);
-                cell.setAttribute("aria-sort", this.#sort.key === column.key ? DataGrid.SORT_ATTRIBUTE[this.#sort.direction === DataGrid.SORT.ASC ? "ASC" : "DESC"] : DataGrid.SORT_ATTRIBUTE.NONE);
+                cell.setAttribute(
+                    "aria-sort",
+                    this.#sort.key === column.key
+                        ? DataGrid.SORT_ATTRIBUTE[this.#sort.direction === DataGrid.SORT.ASC ? "ASC" : "DESC"]
+                        : DataGrid.SORT_ATTRIBUTE.NONE
+                );
                 cell.setAttribute("tabindex", "0");
                 // Подпись заголовка объясняет, что Enter и Space сортируют колонку
-                cell.setAttribute("aria-label", I18n.t("table.sortBy", {head: column.title}));
+                cell.setAttribute("aria-label", I18n.t("table.sortBy", { head: column.title }));
             }
             if (this.#column_reorder) {
                 cell.setAttribute("draggable", "true");
@@ -1061,14 +1095,18 @@ class DataGrid {
         const sort = cell.querySelector("data_grid_sort");
         if (sort === null) return;
         const active = this.#sort.key === column.key && this.#sort.direction !== DataGrid.SORT.NONE;
-        cell.setAttribute("aria-sort", active
-            ? DataGrid.SORT_ATTRIBUTE[this.#sort.direction === DataGrid.SORT.ASC ? "ASC" : "DESC"]
-            : DataGrid.SORT_ATTRIBUTE.NONE);
+        cell.setAttribute(
+            "aria-sort",
+            active
+                ? DataGrid.SORT_ATTRIBUTE[this.#sort.direction === DataGrid.SORT.ASC ? "ASC" : "DESC"]
+                : DataGrid.SORT_ATTRIBUTE.NONE
+        );
         if (active === false) {
             sort.innerHTML = "";
             return;
         }
-        const icon = this.#sort.direction === DataGrid.SORT.ASC ? Icons.NAVIGATION.EXPAND_LESS : Icons.NAVIGATION.EXPAND_MORE;
+        const icon =
+            this.#sort.direction === DataGrid.SORT.ASC ? Icons.NAVIGATION.EXPAND_LESS : Icons.NAVIGATION.EXPAND_MORE;
         // Значок состояния — акцент, как подпись отсортированной колонки
         sort.innerHTML = new Icon(icon, "16px", "var(--blue_prime_background)").getHTML();
     }
@@ -1114,9 +1152,10 @@ class DataGrid {
         const column = this.#columns[index];
         if (column === undefined) return;
         const same = this.#sort.key === column.key;
-        if (same === false) this.#sort = {key: column.key, direction: DataGrid.SORT.ASC};
-        else if (this.#sort.direction === DataGrid.SORT.ASC) this.#sort = {key: column.key, direction: DataGrid.SORT.DESC};
-        else this.#sort = {key: undefined, direction: DataGrid.SORT.NONE};
+        if (same === false) this.#sort = { key: column.key, direction: DataGrid.SORT.ASC };
+        else if (this.#sort.direction === DataGrid.SORT.ASC)
+            this.#sort = { key: column.key, direction: DataGrid.SORT.DESC };
+        else this.#sort = { key: undefined, direction: DataGrid.SORT.NONE };
         this.#applySort();
     }
 
@@ -1133,7 +1172,7 @@ class DataGrid {
         const column = this.#columns.find((item) => item.key === this.#sort.key);
         return I18n.t("dataGrid.sortSummary", {
             title: column === undefined ? this.#sort.key : column.title,
-            direction: I18n.t(this.#sort.direction === DataGrid.SORT.DESC ? "data.descending" : "data.ascending")
+            direction: I18n.t(this.#sort.direction === DataGrid.SORT.DESC ? "data.descending" : "data.ascending"),
         });
     }
 
@@ -1165,7 +1204,8 @@ class DataGrid {
         // строка теряла бы подсветку при включённом `rowClass`
         if (typeof this.#row_class === "function") {
             const classes = this.#row_class(row, entry.rowIndex);
-            if (classes !== undefined && classes !== null && String(classes).trim() !== "") node.className = String(classes).trim();
+            if (classes !== undefined && classes !== null && String(classes).trim() !== "")
+                node.className = String(classes).trim();
         }
         node.classList.toggle("data_grid_row_selected", this.#selected.has(key));
         if (this.#selection === DataGrid.SELECTION.NONE) node.removeAttribute("aria-selected");
@@ -1177,7 +1217,8 @@ class DataGrid {
             cell.setAttribute("aria-colindex", String(visible.index + 1));
             cell.dataset.column = String(visible.index);
             DataGrid.#applyAlign(cell, visible.column.align);
-            if (this.#editable !== undefined) cell.setAttribute("aria-readonly", this.#isColumnEditable(visible.index) ? "false" : "true");
+            if (this.#editable !== undefined)
+                cell.setAttribute("aria-readonly", this.#isColumnEditable(visible.index) ? "false" : "true");
             if (editing && this.#editing.col === visible.index && this.#editing.node !== undefined) {
                 cell.classList.add("data_grid_cell_editing");
                 // У редактора-списка свой отступ: его рамку рисует сам компонент
@@ -1196,8 +1237,12 @@ class DataGrid {
         if (typeof column.render === "function") {
             const content = column.render(row, index);
             if (content instanceof Node) cell.appendChild(content);
-            else if (content !== undefined && content !== null && typeof content.set === "function") cell.appendChild(content.set());
-            else cell.appendChild(document.createTextNode(content === undefined || content === null ? "" : String(content)));
+            else if (content !== undefined && content !== null && typeof content.set === "function")
+                cell.appendChild(content.set());
+            else
+                cell.appendChild(
+                    document.createTextNode(content === undefined || content === null ? "" : String(content))
+                );
             return;
         }
         const value = row[column.key];
@@ -1223,15 +1268,20 @@ class DataGrid {
         cell.dataset.column = String(first.index);
         cell.tabIndex = 0;
         const toggle = document.createElement("data_grid_group_toggle");
-        toggle.innerHTML = new Icon(entry.group.collapsed ? Icons.NAVIGATION.CHEVRON_RIGHT : Icons.NAVIGATION.EXPAND_MORE, "14px", "var(--text_color_disabled)").getHTML();
+        toggle.innerHTML = new Icon(
+            entry.group.collapsed ? Icons.NAVIGATION.CHEVRON_RIGHT : Icons.NAVIGATION.EXPAND_MORE,
+            "14px",
+            "var(--text_color_disabled)"
+        ).getHTML();
         cell.appendChild(toggle);
         const title = document.createElement("data_grid_group_title");
         // Подпись группы — вся целиком: и ключ, и число строк. Отдельного счётчика рядом нет,
         // иначе он повторял бы то же число (прежде там стояла подпись «групп: N», которая
         // называла строки группы группами)
-        title.innerText = typeof this.#group_label === "function"
-            ? String(this.#group_label(entry.group.key, entry.group.rows))
-            : I18n.t("dataGrid.groupTitle", {key: entry.group.key, count: entry.group.rows.length});
+        title.innerText =
+            typeof this.#group_label === "function"
+                ? String(this.#group_label(entry.group.key, entry.group.rows))
+                : I18n.t("dataGrid.groupTitle", { key: entry.group.key, count: entry.group.rows.length });
         cell.appendChild(title);
         node.appendChild(cell);
         for (let place = 1; place < visible.length; place++) {
@@ -1274,8 +1324,8 @@ class DataGrid {
 
     #rowsSummary() {
         const shown = this.#sorted.length;
-        if (this.#groups.length === 0) return I18n.t("dataGrid.rowsSummary", {shown: shown});
-        return `${I18n.t("dataGrid.rowsSummary", {shown: shown})}, ${I18n.t("dataGrid.groupsSummary", {count: this.#groups.length})}`;
+        if (this.#groups.length === 0) return I18n.t("dataGrid.rowsSummary", { shown: shown });
+        return `${I18n.t("dataGrid.rowsSummary", { shown: shown })}, ${I18n.t("dataGrid.groupsSummary", { count: this.#groups.length })}`;
     }
     // === ВЫБОР СТРОК ВНУТРЕННЕЕ ===
     /** Ключ строки: имя поля, функция или место в исходных данных */
@@ -1312,7 +1362,8 @@ class DataGrid {
         if (from === -1 || until === -1) return this.#selectRow(to);
         const [start, end] = from <= until ? [from, until] : [until, from];
         this.#selected.clear();
-        for (let index = start; index <= end; index++) this.#selected.add(this.#keyOf(DataGrid.#entryOf(rows[index], this.#rowIndexOf(rows[index]))));
+        for (let index = start; index <= end; index++)
+            this.#selected.add(this.#keyOf(DataGrid.#entryOf(rows[index], this.#rowIndexOf(rows[index]))));
         this.#applySelection();
     }
 
@@ -1322,14 +1373,17 @@ class DataGrid {
             if (entry === undefined || entry.kind !== "row") continue;
             const selected = this.#selected.has(this.#keyOf(entry));
             node.classList.toggle("data_grid_row_selected", selected);
-            if (this.#selection !== DataGrid.SELECTION.NONE) node.setAttribute("aria-selected", selected ? "true" : "false");
+            if (this.#selection !== DataGrid.SELECTION.NONE)
+                node.setAttribute("aria-selected", selected ? "true" : "false");
         }
         this.#syncPinned();
         if (this.#on_selection_change !== undefined) {
-            const rows = this.#viewRows().filter((row) => this.#selected.has(this.#keyOf(DataGrid.#entryOf(row, this.#rowIndexOf(row)))));
+            const rows = this.#viewRows().filter((row) =>
+                this.#selected.has(this.#keyOf(DataGrid.#entryOf(row, this.#rowIndexOf(row))))
+            );
             this.#on_selection_change(rows, Array.from(this.#selected));
         }
-        this.#announce(I18n.t("dataGrid.rowsSummary", {shown: this.#selected.size}));
+        this.#announce(I18n.t("dataGrid.rowsSummary", { shown: this.#selected.size }));
     }
 
     // === АКТИВНАЯ ЯЧЕЙКА И КЛАВИАТУРА ===
@@ -1340,13 +1394,13 @@ class DataGrid {
         const visible = this.#visibleColumns();
         if (visible.length === 0) return;
         const known = visible.some((item) => item.index === col) ? col : visible[0].index;
-        this.#active = {row: place, col: known};
+        this.#active = { row: place, col: known };
         if (entry !== undefined && entry.kind === "row") {
             this.#list.scrollToIndex(place, DataGrid.ALIGN.NEAREST);
         }
         this.#syncActiveCells();
         const node = this.#cellNode(place, known);
-        if (node !== undefined && focus) node.focus({preventScroll: true});
+        if (node !== undefined && focus) node.focus({ preventScroll: true });
         if (this.#on_active_cell_change !== undefined && entry !== undefined && entry.kind === "row") {
             this.#on_active_cell_change(place, known, entry.row);
         }
@@ -1377,11 +1431,12 @@ class DataGrid {
         if (next_row < 0 || next_row >= this.#entry_count) return undefined;
         const entry = this.#entryAt(next_row);
         if (entry === undefined || entry.kind !== "row") return undefined;
-        return {row: next_row, col: visible[next].index};
+        return { row: next_row, col: visible[next].index };
     }
 
     #onRowClick = (entry = new DataGridEntry(), index = Number(), _node = new HTMLElement(), event = Object()) => {
-        const cell = event === undefined || event.target === undefined ? undefined : event.target.closest("data_grid_cell");
+        const cell =
+            event === undefined || event.target === undefined ? undefined : event.target.closest("data_grid_cell");
         const col = cell === undefined || cell === null ? this.#active.col : Number(cell.dataset.column);
         if (entry.kind === "group") {
             this.#setGroupCollapsed(entry.group.key, entry.group.collapsed === false);
@@ -1517,7 +1572,7 @@ class DataGrid {
             old_value: entry.row[column.key],
             forced: undefined,
             component: undefined,
-            node: undefined
+            node: undefined,
         };
         const node = this.#createEditor(column, entry.row, row, editing);
         if (node === undefined) return false;
@@ -1528,7 +1583,7 @@ class DataGrid {
         if (editing.component !== undefined) editing.component.focus();
         else node.focus();
         if (typeof node.select === "function" && editing.component === undefined) node.select();
-        this.#announce(I18n.t("dataGrid.editStart", {title: column.title, row: row + 1}));
+        this.#announce(I18n.t("dataGrid.editStart", { title: column.title, row: row + 1 }));
         return true;
     }
 
@@ -1540,7 +1595,7 @@ class DataGrid {
                     if (this.#editing === editing && value !== undefined) editing.forced = value;
                     this.#finishEdit(true, true, true);
                 },
-                cancel: () => this.#finishEdit(false, false, true)
+                cancel: () => this.#finishEdit(false, false, true),
             };
             const custom = column.editor(row, index, api);
             if (custom === undefined || custom === null) return undefined;
@@ -1630,23 +1685,25 @@ class DataGrid {
     }
 
     #readEditorValue(column = new DataGridColumn(), editing = Object()) {
-        if (editing.forced !== undefined) return {ok: true, value: editing.forced};
+        if (editing.forced !== undefined) return { ok: true, value: editing.forced };
         const editor = editing.node;
-        if (column.editType === DataGrid.EDIT_TYPE.CHECKBOX) return {ok: true, value: editor.checked === true};
+        if (column.editType === DataGrid.EDIT_TYPE.CHECKBOX) return { ok: true, value: editor.checked === true };
         if (column.editType === DataGrid.EDIT_TYPE.SELECT) {
             // Значение списка отдаёт компонент: у него подпись и значение живут отдельно
-            if (editing.component !== undefined) return {ok: true, value: editing.component.getSelectedValue()};
-            return {ok: true, value: editor.value};
+            if (editing.component !== undefined) return { ok: true, value: editing.component.getSelectedValue() };
+            return { ok: true, value: editor.value };
         }
         const text = editor.value;
         if (column.editType === DataGrid.EDIT_TYPE.NUMBER) {
             const normalized = String(text).trim().replace(",", ".");
-            if (normalized === "") return {ok: false, message: I18n.t("dataGrid.enterNumber", {title: column.title})};
+            if (normalized === "")
+                return { ok: false, message: I18n.t("dataGrid.enterNumber", { title: column.title }) };
             const number = Number(normalized);
-            if (Number.isNaN(number)) return {ok: false, message: I18n.t("dataGrid.notNumber", {title: column.title, text: text})};
-            return {ok: true, value: number};
+            if (Number.isNaN(number))
+                return { ok: false, message: I18n.t("dataGrid.notNumber", { title: column.title, text: text }) };
+            return { ok: true, value: number };
         }
-        return {ok: true, value: text};
+        return { ok: true, value: text };
     }
 
     /**
@@ -1658,7 +1715,7 @@ class DataGrid {
         if (editing === undefined) return false;
         const column = this.#columns[editing.col];
         const entry = this.#entryAt(editing.row);
-        const parsed = save ? this.#readEditorValue(column, editing) : {ok: true, value: editing.old_value};
+        const parsed = save ? this.#readEditorValue(column, editing) : { ok: true, value: editing.old_value };
         if (parsed.ok === false && keepInvalid) {
             // Неверный ввод объясняем и оставляем редактор: начать другую правку нельзя
             this.#announce(parsed.message);
@@ -1666,21 +1723,22 @@ class DataGrid {
         }
         const value = parsed.ok === false ? editing.old_value : parsed.value;
         this.#editing = undefined;
-        if (editing.component !== undefined && typeof editing.component.destroy === "function") editing.component.destroy();
+        if (editing.component !== undefined && typeof editing.component.destroy === "function")
+            editing.component.destroy();
         if (entry !== undefined && entry.kind === "row" && save && value !== editing.old_value) {
             entry.row[editing.key] = value;
             if (this.#on_cell_edit !== undefined) this.#on_cell_edit(entry.row, editing.key, value, editing.old_value);
-            this.#announce(I18n.t("dataGrid.saved", {title: column.title, value: DataGrid.#valueText(value)}));
+            this.#announce(I18n.t("dataGrid.saved", { title: column.title, value: DataGrid.#valueText(value) }));
         } else if (save === false && parsed.ok === false) {
-            this.#announce(I18n.t("dataGrid.editCanceledReason", {message: parsed.message}));
+            this.#announce(I18n.t("dataGrid.editCanceledReason", { message: parsed.message }));
         } else if (save === false) {
-            this.#announce(I18n.t("dataGrid.editCanceled", {title: column.title}));
+            this.#announce(I18n.t("dataGrid.editCanceled", { title: column.title }));
         }
         // Агрегаты группы считаются по строкам — после правки их надо пересчитать
         this.#recompute();
         if (focus) {
             const node = this.#cellNode(editing.row, editing.col);
-            if (node !== undefined) node.focus({preventScroll: true});
+            if (node !== undefined) node.focus({ preventScroll: true });
         }
         return true;
     }
@@ -1701,7 +1759,9 @@ class DataGrid {
     #setGroupCollapsed(key = String(), collapsed = true) {
         this.#collapsed.set(String(key), collapsed === true);
         this.#recompute();
-        this.#announce(collapsed === true ? I18n.t("dataGrid.groupsSummary", {count: this.#groups.length}) : this.#rowsSummary());
+        this.#announce(
+            collapsed === true ? I18n.t("dataGrid.groupsSummary", { count: this.#groups.length }) : this.#rowsSummary()
+        );
     }
 
     // === ЗАКРЕПЛЁННЫЕ КОЛОНКИ И ГОРИЗОНТАЛЬНАЯ ПРОКРУТКА ===
@@ -1720,7 +1780,7 @@ class DataGrid {
             event.dataTransfer.effectAllowed = "move";
             event.dataTransfer.setData("text/plain", String(this.#drag));
         }
-        this.#announce(I18n.t("dataGrid.columnMove", {title: this.#columns[this.#drag].title}));
+        this.#announce(I18n.t("dataGrid.columnMove", { title: this.#columns[this.#drag].title }));
     };
 
     #onHeaderDragOver = (event) => {
@@ -1743,7 +1803,8 @@ class DataGrid {
 
     #onHeaderDragEnd = () => {
         this.#markDrop(undefined);
-        for (const cell of this.#head_row.querySelectorAll("data_grid_cell")) cell.classList.remove("data_grid_cell_dragging");
+        for (const cell of this.#head_row.querySelectorAll("data_grid_cell"))
+            cell.classList.remove("data_grid_cell_dragging");
         this.#drag = undefined;
     };
 
@@ -1758,7 +1819,8 @@ class DataGrid {
     }
 
     #markDrop(slot = undefined) {
-        for (const cell of this.#head_row.querySelectorAll("data_grid_cell")) cell.classList.remove("data_grid_cell_drop_after");
+        for (const cell of this.#head_row.querySelectorAll("data_grid_cell"))
+            cell.classList.remove("data_grid_cell_drop_after");
         if (slot === undefined) return;
         const cells = Array.from(this.#head_row.querySelectorAll("data_grid_cell[data-column]"));
         const target = cells[slot === 0 ? 0 : slot - 1];
@@ -1776,7 +1838,8 @@ class DataGrid {
         const target = slot >= visible.length ? this.#columns.length : visible[slot].index;
         const column = this.#columns[from];
         const rest = this.#columns.filter((item) => item !== column);
-        const place = slot >= visible.length ? rest.length : rest.findIndex((item) => item.key === visible[slot].column.key);
+        const place =
+            slot >= visible.length ? rest.length : rest.findIndex((item) => item.key === visible[slot].column.key);
         rest.splice(place < 0 ? rest.length : place, 0, column);
         this.#columns = rest;
         this.#onHeaderDragEnd();
@@ -1803,8 +1866,11 @@ class DataGrid {
         const to = this.#columns.indexOf(column);
         const node = this.#head_row.querySelector(`data_grid_cell[data-column="${to}"]`);
         if (node !== null) node.focus();
-        this.#announce(I18n.t("dataGrid.columnPlace", {title: column.title, place: to + 1, total: this.#columns.length}));
-        if (this.#on_column_order_change !== undefined) this.#on_column_order_change(this.getColumnOrder(), column.key, from, to);
+        this.#announce(
+            I18n.t("dataGrid.columnPlace", { title: column.title, place: to + 1, total: this.#columns.length })
+        );
+        if (this.#on_column_order_change !== undefined)
+            this.#on_column_order_change(this.getColumnOrder(), column.key, from, to);
     }
 
     // === ПОЛОСА НАД СЕТКОЙ И ДИАЛОГ КОЛОНОК ===
@@ -1812,7 +1878,7 @@ class DataGrid {
         const button = new Button({
             title: I18n.t("dataGrid.columns"),
             icon: Icons.ACTIONS.VIEW_COLUMN,
-            clickEvent: () => this.openColumnChooser()
+            clickEvent: () => this.openColumnChooser(),
         });
         const element = button.set().querySelector("button");
         if (element !== null) element.setAttribute("aria-haspopup", "dialog");
@@ -1825,10 +1891,15 @@ class DataGrid {
             this.#refreshChooser();
             return this.#chooser_dialog;
         }
-        const dialog = new Dialog({width: "340px", height: "max-content", closeOutSideClick: true, title: I18n.t("dataGrid.columns")});
-        const block = new ContentBlock({direction: "column", wrap: "nowrap", width: "-webkit-fill-available"});
+        const dialog = new Dialog({
+            width: "340px",
+            height: "max-content",
+            closeOutSideClick: true,
+            title: I18n.t("dataGrid.columns"),
+        });
+        const block = new ContentBlock({ direction: "column", wrap: "nowrap", width: "-webkit-fill-available" });
         dialog.addToBody(block);
-        dialog.addToFooter(new Button({title: I18n.t("dataGrid.showAll"), clickEvent: () => this.showAllColumns()}));
+        dialog.addToFooter(new Button({ title: I18n.t("dataGrid.showAll"), clickEvent: () => this.showAllColumns() }));
         this.#chooser_dialog = dialog;
         this.#chooser_block = block;
         document.body.appendChild(dialog.set());
@@ -1843,7 +1914,7 @@ class DataGrid {
             const checkbox = new CheckBox({
                 name: `${this.#id}_column_${column.key}`,
                 title: column.title,
-                changeListener: (event) => this.setColumnVisible(column.key, event.target.checked)
+                changeListener: (event) => this.setColumnVisible(column.key, event.target.checked),
             });
             // У CheckBox нет опции начального значения: ставим его отдельно
             checkbox.setValue(this.isColumnVisible(column.key));
@@ -1858,7 +1929,7 @@ class DataGrid {
             limit: this.#page_size,
             filter: this.#filter,
             filterKeys: this.#filter_keys,
-            sort: {key: this.#sort.key, direction: this.#sort.direction}
+            sort: { key: this.#sort.key, direction: this.#sort.direction },
         };
     }
 
@@ -1879,18 +1950,21 @@ class DataGrid {
             this.#has_more = total === undefined ? rows.length >= this.#page_size : this.#data.length < total;
             this.#reindex();
             this.#recompute();
-            this.#announce(total === undefined
-                ? I18n.t("dataGrid.loadedRows", {shown: this.#data.length})
-                : I18n.t("dataGrid.loadedRowsOf", {shown: this.#data.length, total: total}));
+            this.#announce(
+                total === undefined
+                    ? I18n.t("dataGrid.loadedRows", { shown: this.#data.length })
+                    : I18n.t("dataGrid.loadedRowsOf", { shown: this.#data.length, total: total })
+            );
             if (this.#on_data_load !== undefined) this.#on_data_load(rows, total);
         } catch (error) {
             if (request !== this.#request) return;
             this.#failed = true;
-            const message = error !== undefined && error !== null && error.message !== undefined
-                ? String(error.message)
-                : I18n.t("dataGrid.unknownError");
-            this.#setError(I18n.t("dataGrid.loadFailed", {message: message}));
-            this.#announce(I18n.t("dataGrid.loadFailedAnnounce", {message: message}));
+            const message =
+                error !== undefined && error !== null && error.message !== undefined
+                    ? String(error.message)
+                    : I18n.t("dataGrid.unknownError");
+            this.#setError(I18n.t("dataGrid.loadFailed", { message: message }));
+            this.#announce(I18n.t("dataGrid.loadFailedAnnounce", { message: message }));
             if (this.#on_data_error !== undefined) this.#on_data_error(error, this.#requestParams(this.#data.length));
         } finally {
             if (request === this.#request) {
@@ -1906,9 +1980,9 @@ class DataGrid {
         this.#error.hidden = broken === false;
         this.#error_text.innerText = broken ? String(message) : "";
         // «Нет данных» и «не удалось загрузить» — разное, поэтому подпись пустого списка меняется
-        this.#list.setEmptyText(broken
-            ? I18n.t("dataGrid.notLoaded")
-            : optionOr(this.#empty_text, I18n.t("dataGrid.empty")));
+        this.#list.setEmptyText(
+            broken ? I18n.t("dataGrid.notLoaded") : optionOr(this.#empty_text, I18n.t("dataGrid.empty"))
+        );
     }
 
     // === ЭКСПОРТ ===
@@ -1916,26 +1990,35 @@ class DataGrid {
      * CSV текущего вида: значения берутся из `render`, если он есть (в файле видно то же,
      * что в ячейках), заголовки групп не попадают, кавычки и разделитель экранируются.
      */
-    exportCSV(options = {delimiter: String(), columns: Array(), source: String(), includeHeaders: Boolean()}) {
+    exportCSV(options = { delimiter: String(), columns: Array(), source: String(), includeHeaders: Boolean() }) {
         const delimiter = optionOr(options.delimiter, ",");
         const source = optionOr(options.source, DataGrid.EXPORT.VIEW);
         const rows = source === DataGrid.EXPORT.ALL ? this.#data : this.#sorted;
         // По умолчанию — видимые колонки: скрытой колонки нет в файле, как нет и в сетке
-        const columns = options.columns === undefined
-            ? this.#visibleColumns().map((entry) => entry.column)
-            : this.#columns.filter((column) => options.columns.includes(column.key));
+        const columns =
+            options.columns === undefined
+                ? this.#visibleColumns().map((entry) => entry.column)
+                : this.#columns.filter((column) => options.columns.includes(column.key));
         const lines = [];
-        if (options.includeHeaders !== false) lines.push(columns.map((column) => DataGrid.#csvCell(column.title, delimiter)).join(delimiter));
+        if (options.includeHeaders !== false)
+            lines.push(columns.map((column) => DataGrid.#csvCell(column.title, delimiter)).join(delimiter));
         for (const row of rows) {
-            lines.push(columns.map((column) => {
-                const index = this.#rowIndexOf(row);
-                const value = typeof column.render === "function" ? column.render(row, index) : row[column.key];
-                // Компонент превращаем в текст: в файле должно быть видно то же, что в ячейке
-                const node = value instanceof Node
-                    ? value
-                    : (value !== undefined && value !== null && typeof value.set === "function" ? value.set() : value);
-                return DataGrid.#csvCell(DataGrid.#valueText(node), delimiter);
-            }).join(delimiter));
+            lines.push(
+                columns
+                    .map((column) => {
+                        const index = this.#rowIndexOf(row);
+                        const value = typeof column.render === "function" ? column.render(row, index) : row[column.key];
+                        // Компонент превращаем в текст: в файле должно быть видно то же, что в ячейке
+                        const node =
+                            value instanceof Node
+                                ? value
+                                : value !== undefined && value !== null && typeof value.set === "function"
+                                  ? value.set()
+                                  : value;
+                        return DataGrid.#csvCell(DataGrid.#valueText(node), delimiter);
+                    })
+                    .join(delimiter)
+            );
         }
         return lines.join("\r\n");
     }
@@ -1995,53 +2078,125 @@ class DataGrid {
         return out;
     }
     // === ПУБЛИЧНОЕ: ЧТЕНИЕ ===
-    getId() { return this.#id; }
-    getLabel() { return this.#label; }
+    getId() {
+        return this.#id;
+    }
+    getLabel() {
+        return this.#label;
+    }
     /** Колонки в текущем порядке (те же объекты, что читает разметка) */
-    getColumns() { return this.#columns.map((column) => ({...column})); }
-    getData() { return this.#data.slice(); }
+    getColumns() {
+        return this.#columns.map((column) => ({ ...column }));
+    }
+    getData() {
+        return this.#data.slice();
+    }
     /** Строки данных в порядке показа (без заголовков групп) */
-    getRows() { return this.#viewRows(); }
-    getRowCount() { return this.#viewRows().length; }
+    getRows() {
+        return this.#viewRows();
+    }
+    getRowCount() {
+        return this.#viewRows().length;
+    }
     /** Элементов списка: заголовки групп тоже считаются */
-    getEntryCount() { return this.#entry_count; }
-    getRowHeight() { return this.#row_height; }
-    getVisibleRange() { return this.#list.getVisibleRange(); }
-    getRenderedRange() { return this.#list.getRenderedRange(); }
-    getRowElement(index = Number()) { return this.#list.getItemElement(index); }
-    getActiveCell() { return {...this.#active, key: this.#columns[this.#active.col] === undefined ? undefined : this.#columns[this.#active.col].key}; }
-    getSelected() { return this.#selectedRows(); }
-    getSelectedKeys() { return Array.from(this.#selected); }
-    getFilter() { return this.#filter; }
-    getSort() { return {...this.#sort}; }
-    getSelectionMode() { return this.#selection; }
-    isServer() { return this.#data_source !== undefined; }
-    isLoading() { return this.#loading; }
-    getServerTotal() { return this.#server_total; }
-    getPageSize() { return this.#page_size; }
-    isEditing() { return this.#editing !== undefined; }
-    getEditingCell() { return this.#editing === undefined ? undefined : {row: this.#editing.row, col: this.#editing.col, key: this.#editing.key}; }
-    isEditable() { return this.#editable !== undefined && this.#editable !== false; }
-    isColumnEditable(col = Number()) { return this.#isColumnEditable(col); }
+    getEntryCount() {
+        return this.#entry_count;
+    }
+    getRowHeight() {
+        return this.#row_height;
+    }
+    getVisibleRange() {
+        return this.#list.getVisibleRange();
+    }
+    getRenderedRange() {
+        return this.#list.getRenderedRange();
+    }
+    getRowElement(index = Number()) {
+        return this.#list.getItemElement(index);
+    }
+    getActiveCell() {
+        return {
+            ...this.#active,
+            key: this.#columns[this.#active.col] === undefined ? undefined : this.#columns[this.#active.col].key,
+        };
+    }
+    getSelected() {
+        return this.#selectedRows();
+    }
+    getSelectedKeys() {
+        return Array.from(this.#selected);
+    }
+    getFilter() {
+        return this.#filter;
+    }
+    getSort() {
+        return { ...this.#sort };
+    }
+    getSelectionMode() {
+        return this.#selection;
+    }
+    isServer() {
+        return this.#data_source !== undefined;
+    }
+    isLoading() {
+        return this.#loading;
+    }
+    getServerTotal() {
+        return this.#server_total;
+    }
+    getPageSize() {
+        return this.#page_size;
+    }
+    isEditing() {
+        return this.#editing !== undefined;
+    }
+    getEditingCell() {
+        return this.#editing === undefined
+            ? undefined
+            : { row: this.#editing.row, col: this.#editing.col, key: this.#editing.key };
+    }
+    isEditable() {
+        return this.#editable !== undefined && this.#editable !== false;
+    }
+    isColumnEditable(col = Number()) {
+        return this.#isColumnEditable(col);
+    }
     /** Колонки в порядке показа: место в полном списке рядом с самой колонкой */
-    getVisibleColumns() { return this.#visibleColumns().map((entry) => ({...entry.column})); }
-    getHiddenColumns() { return this.#columns.filter((column) => this.#hidden.has(column.key)).map((column) => ({...column})); }
-    getPinned() { return this.#pinned.slice(); }
-    isPinned(key = String()) { return this.#isPinned(key); }
-    isColumnVisible(key = String()) { return this.#hidden.has(key) === false; }
-    isColumnReorder() { return this.#column_reorder; }
-    getColumnOrder() { return this.#columns.map((column) => column.key); }
-    getGroupBy() { return this.#group_by; }
+    getVisibleColumns() {
+        return this.#visibleColumns().map((entry) => ({ ...entry.column }));
+    }
+    getHiddenColumns() {
+        return this.#columns.filter((column) => this.#hidden.has(column.key)).map((column) => ({ ...column }));
+    }
+    getPinned() {
+        return this.#pinned.slice();
+    }
+    isPinned(key = String()) {
+        return this.#isPinned(key);
+    }
+    isColumnVisible(key = String()) {
+        return this.#hidden.has(key) === false;
+    }
+    isColumnReorder() {
+        return this.#column_reorder;
+    }
+    getColumnOrder() {
+        return this.#columns.map((column) => column.key);
+    }
+    getGroupBy() {
+        return this.#group_by;
+    }
     /** Группы с агрегатами и состоянием свёрнутости */
     getGroups() {
         return this.#groups.map((group) => ({
             key: group.key,
-            title: typeof this.#group_label === "function"
-                ? String(this.#group_label(group.key, group.rows))
-                : I18n.t("dataGrid.groupTitle", {key: group.key, count: group.rows.length}),
+            title:
+                typeof this.#group_label === "function"
+                    ? String(this.#group_label(group.key, group.rows))
+                    : I18n.t("dataGrid.groupTitle", { key: group.key, count: group.rows.length }),
             rows: group.rows.slice(),
             aggregates: group.aggregates,
-            collapsed: group.collapsed
+            collapsed: group.collapsed,
         }));
     }
     isGroupCollapsed(key = String()) {
@@ -2140,7 +2295,10 @@ class DataGrid {
         // Про фильтр сообщаем числом строк: «фильтр «n»: 3 из 12»
         const shown = this.#sorted.length;
         if (this.#filter.trim() === "") this.#announce(this.#rowsSummary());
-        else this.#announce(I18n.t("dataGrid.filterSummary", {filter: this.#filter, shown: shown, total: this.#data.length}));
+        else
+            this.#announce(
+                I18n.t("dataGrid.filterSummary", { filter: this.#filter, shown: shown, total: this.#data.length })
+            );
         return this;
     }
 
@@ -2151,7 +2309,7 @@ class DataGrid {
     /** Сортировка: `NONE` снимает её; в серверном режиме строки спрашиваются заново */
     setSort(key = undefined, direction = DataGrid.SORT.NONE) {
         const known = this.#columns.some((column) => column.key === key) ? key : undefined;
-        this.#sort = {key: known, direction: known === undefined ? DataGrid.SORT.NONE : direction};
+        this.#sort = { key: known, direction: known === undefined ? DataGrid.SORT.NONE : direction };
         if (this.#data_source !== undefined) return this.reload();
         this.#applySort();
         return this;
@@ -2174,7 +2332,8 @@ class DataGrid {
 
     setContextMenu(ctx = undefined) {
         if (this.#context_menu === ctx) return this;
-        if (this.#context_menu !== undefined && typeof this.#context_menu.detach === "function") this.#context_menu.detach();
+        if (this.#context_menu !== undefined && typeof this.#context_menu.detach === "function")
+            this.#context_menu.detach();
         this.#context_menu = ctx;
         if (ctx !== undefined && typeof ctx.attach === "function") ctx.attach(this.#root);
         return this;
@@ -2231,7 +2390,9 @@ class DataGrid {
         if (visible) this.#hidden.delete(key);
         else this.#hidden.add(key);
         // Скрытая колонка не может быть активной: курсор уходит в первую видимую
-        if (this.#hidden.has(this.#columns[this.#active.col] === undefined ? "" : this.#columns[this.#active.col].key)) {
+        if (
+            this.#hidden.has(this.#columns[this.#active.col] === undefined ? "" : this.#columns[this.#active.col].key)
+        ) {
             this.#active.col = this.#visibleColumns().length === 0 ? 0 : this.#visibleColumns()[0].index;
         }
         this.#afterLayout();
@@ -2334,7 +2495,8 @@ class DataGrid {
         this.#root.removeEventListener("keydown", this.#onKeyDown);
         this.#scroll.removeEventListener("scroll", this.#onScrollX);
         if (this.#editing !== undefined) this.#finishEdit(false, false, false);
-        if (this.#context_menu !== undefined && typeof this.#context_menu.detach === "function") this.#context_menu.detach();
+        if (this.#context_menu !== undefined && typeof this.#context_menu.detach === "function")
+            this.#context_menu.detach();
         this.#list.destroy();
         if (this.#chooser_dialog !== undefined) {
             // У диалога нет своего «удали себя»: узел снимаем с документа сами