chuijs 4.0.2 → 4.0.4

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,75 +81,78 @@ class DataGridBody {
         START: "start",
         CENTER: "center",
         END: "end",
-        NEAREST: "nearest"
+        NEAREST: "nearest",
     };
     static DEFAULT_BUFFER = 6;
     static DEFAULT_LOAD_THRESHOLD = 3;
     static #counter = 0;
 
     #root = document.createElement("data_grid_body");
-    #spacer_top = document.createElement("data_grid_spacer");
-    #spacer_bottom = document.createElement("data_grid_spacer");
+    #spacerTop = document.createElement("data_grid_spacer");
+    #spacerBottom = document.createElement("data_grid_spacer");
     #empty = document.createElement("data_grid_body_empty");
     #loader = document.createElement("data_grid_body_loader");
     // Окно в DOM: индекс строки → узел
     #nodes = new Map();
     #id = undefined;
     #items = [];
-    #item_height = 34;
+    #itemHeight = 34;
     #buffer = DataGridBody.DEFAULT_BUFFER;
-    #item_tag = "data_grid_row";
-    #render_item = undefined;
-    #on_item_click = undefined;
-    #on_activate = undefined;
-    #on_render = undefined;
-    #on_load_more = undefined;
-    #loading_text = undefined;
-    #load_threshold = DataGridBody.DEFAULT_LOAD_THRESHOLD;
-    #has_more = false;
-    #loading_more = false;
+    #itemTag = "data_grid_row";
+    #renderItem = undefined;
+    #onItemClickCallback = undefined;
+    #onActivate = undefined;
+    #onRender = undefined;
+    #onLoadMore = undefined;
+    #loadingText = undefined;
+    #loadThreshold = DataGridBody.DEFAULT_LOAD_THRESHOLD;
+    #hasMore = false;
+    #loadingMore = false;
     // Длина, для которой запрос уже сделан: не просим ещё раз, пока данных не прибавилось
-    #requested_at = -1;
-    #window_state = {from: 0, to: 0};
+    #requestedAt = -1;
+    #windowState = { from: 0, to: 0 };
     #raf = null;
-    #refresh_raf = null;
-    #resize_observer = undefined;
+    #refreshRaf = null;
+    #resizeObserver = 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");
-        this.#item_height = options.itemHeight === undefined ? 34 : options.itemHeight;
+        this.#itemTag = optionOr(options.itemTag, "data_grid_row");
+        this.#itemHeight = options.itemHeight === undefined ? 34 : options.itemHeight;
         this.#buffer = options.buffer === undefined ? DataGridBody.DEFAULT_BUFFER : options.buffer;
-        this.#render_item = options.renderItem;
-        this.#on_item_click = options.onItemClick;
-        this.#on_activate = options.onActivate;
-        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.#renderItem = options.renderItem;
+        this.#onItemClickCallback = options.onItemClick;
+        this.#onActivate = options.onActivate;
+        this.#onRender = options.onRender;
+        this.#onLoadMore = options.onLoadMore;
+        this.#loadingText = optionOr(options.loadingText, I18n.t("common.loading"));
+        this.#loadThreshold =
+            options.loadMoreThreshold === undefined ? DataGridBody.DEFAULT_LOAD_THRESHOLD : options.loadMoreThreshold;
         // Без onLoadMore тело считает, что загружено всё
-        this.#has_more = options.hasMore === undefined ? options.onLoadMore !== undefined : options.hasMore === true;
+        this.#hasMore = options.hasMore === undefined ? options.onLoadMore !== undefined : options.hasMore === true;
         this.#root.id = this.#id;
-        this.#spacer_top.dataset.pos = "top";
-        this.#spacer_bottom.dataset.pos = "bottom";
-        for (const spacer of [this.#spacer_top, this.#spacer_bottom]) {
+        this.#spacerTop.dataset.pos = "top";
+        this.#spacerBottom.dataset.pos = "bottom";
+        for (const spacer of [this.#spacerTop, this.#spacerBottom]) {
             spacer.setAttribute("aria-hidden", "true");
             spacer.style.height = "0px";
             this.#root.appendChild(spacer);
@@ -163,30 +166,40 @@ 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 дают
         // «ResizeObserver loop completed with undelivered notifications»
-        this.#resize_observer = new ResizeObserver(() => this.#scheduleRefresh());
-        this.#resize_observer.observe(this.#root);
+        this.#resizeObserver = new ResizeObserver(() => this.#scheduleRefresh());
+        this.#resizeObserver.observe(this.#root);
         this.#bound = true;
     }
 
     // === ЧТЕНИЕ ===
-    getId() { return this.#id; }
-    getItemHeight() { return this.#item_height; }
+    getId() {
+        return this.#id;
+    }
+    getItemHeight() {
+        return this.#itemHeight;
+    }
     /** Окно, которое сейчас в DOM (вместе с запасом `buffer`) */
-    getRenderedRange() { return {...this.#window_state}; }
+    getRenderedRange() {
+        return { ...this.#windowState };
+    }
     /** Только видимые строки — без запаса; это то, что реально видит пользователь */
     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()) {
@@ -200,7 +213,7 @@ class DataGridBody {
     }
 
     setItemHeight(height = Number()) {
-        this.#item_height = height;
+        this.#itemHeight = height;
         for (const node of this.#nodes.values()) node.style.height = `${height}px`;
         return this.refresh();
     }
@@ -214,18 +227,18 @@ class DataGridBody {
         return this;
     }
 
-    setHasMore(has_more = true) {
-        this.#has_more = has_more === true;
+    setHasMore(hasMore = true) {
+        this.#hasMore = hasMore === true;
         this.#applyLoader();
-        if (this.#has_more) this.#checkLoadMore(this.#window_state.to);
+        if (this.#hasMore) this.#checkLoadMore(this.#windowState.to);
         return this;
     }
 
     setLoadingMore(loading = true) {
-        this.#loading_more = loading === true;
+        this.#loadingMore = loading === true;
         this.#applyLoader();
         // Загрузка завершилась, но окно всё ещё у конца — возможно, нужен следующий запрос
-        if (!this.#loading_more) this.#checkLoadMore(this.#window_state.to);
+        if (!this.#loadingMore) this.#checkLoadMore(this.#windowState.to);
         return this;
     }
 
@@ -239,7 +252,7 @@ class DataGridBody {
         const count = this.#items.length;
         if (count === 0) return this;
         const target = Math.max(0, Math.min(index, count - 1));
-        const height = this.#item_height;
+        const height = this.#itemHeight;
         const view = this.#root.clientHeight || this.#visibleCount() * height;
         let top = this.#root.scrollTop;
         if (align === DataGridBody.ALIGN.START) {
@@ -255,8 +268,8 @@ class DataGridBody {
             if (target < from) top = target * height;
             else if (target >= to) top = (target + 1) * height - view;
         }
-        const max_top = Math.max(0, count * height - view);
-        top = Math.max(0, Math.min(top, max_top));
+        const maximumTop = Math.max(0, count * height - view);
+        top = Math.max(0, Math.min(top, maximumTop));
         if (top !== this.#root.scrollTop) this.#root.scrollTop = top;
         // Окно пересобираем сразу: не ждём события scroll, иначе состояние видно «на кадр позже»
         this.#renderWindow(this.#firstVisible());
@@ -271,14 +284,14 @@ class DataGridBody {
             cancelAnimationFrame(this.#raf);
             this.#raf = null;
         }
-        if (this.#refresh_raf !== null) {
-            cancelAnimationFrame(this.#refresh_raf);
-            this.#refresh_raf = null;
+        if (this.#refreshRaf !== null) {
+            cancelAnimationFrame(this.#refreshRaf);
+            this.#refreshRaf = null;
         }
         this.#root.removeEventListener("scroll", this.#onScroll);
-        if (this.#resize_observer !== undefined) {
-            this.#resize_observer.disconnect();
-            this.#resize_observer = undefined;
+        if (this.#resizeObserver !== undefined) {
+            this.#resizeObserver.disconnect();
+            this.#resizeObserver = undefined;
         }
         for (const node of this.#nodes.values()) {
             node.removeEventListener("click", this.#onItemClick);
@@ -289,35 +302,35 @@ class DataGridBody {
 
     // === ВНУТРЕННЕЕ ===
     #scheduleRefresh() {
-        if (this.#refresh_raf !== null) return;
-        this.#refresh_raf = requestAnimationFrame(() => {
-            this.#refresh_raf = null;
+        if (this.#refreshRaf !== null) return;
+        this.#refreshRaf = requestAnimationFrame(() => {
+            this.#refreshRaf = null;
             if (this.#bound) this.refresh();
         });
     }
 
     #applyLoader() {
-        this.#loader.innerText = this.#loading_text;
-        this.#loader.hidden = !this.#loading_more;
-        this.#root.dataset.loading = this.#loading_more ? "true" : "false";
+        this.#loader.innerText = this.#loadingText;
+        this.#loader.hidden = !this.#loadingMore;
+        this.#root.dataset.loading = this.#loadingMore ? "true" : "false";
         this.#syncEmpty();
     }
 
     // «Нет данных» показываем только когда данных нет и новых не ждём: иначе текст пустого
     // состояния спорил бы с индикатором догрузки на время запроса
     #syncEmpty() {
-        this.#empty.hidden = this.#items.length > 0 || this.#has_more || this.#loading_more;
+        this.#empty.hidden = this.#items.length > 0 || this.#hasMore || this.#loadingMore;
     }
 
     #firstVisible() {
         const count = this.#items.length;
         if (count === 0) return 0;
-        return Math.min(count - 1, Math.max(0, Math.floor(Math.max(0, this.#root.scrollTop) / this.#item_height)));
+        return Math.min(count - 1, Math.max(0, Math.floor(Math.max(0, this.#root.scrollTop) / this.#itemHeight)));
     }
 
     #visibleCount() {
-        const view = this.#root.clientHeight || this.#item_height * 8;
-        return Math.max(1, Math.ceil(view / this.#item_height));
+        const view = this.#root.clientHeight || this.#itemHeight * 8;
+        return Math.max(1, Math.ceil(view / this.#itemHeight));
     }
 
     /** Последний индекс окна: запас `buffer` считается в строках, а не в пикселях */
@@ -336,7 +349,7 @@ class DataGridBody {
                 this.#nodes.delete(index);
             }
         }
-        let previous = this.#spacer_top;
+        let previous = this.#spacerTop;
         for (let index = from; index < to; index++) {
             let node = this.#nodes.get(index);
             if (node === undefined) {
@@ -344,49 +357,49 @@ class DataGridBody {
                 this.#nodes.set(index, node);
             }
             // Высоту задаём инлайном: иначе фактическая геометрия разошлась бы с распорками
-            const height = `${this.#item_height}px`;
+            const height = `${this.#itemHeight}px`;
             if (node.style.height !== height) node.style.height = height;
             // insertBefore(previous.nextSibling) ставит узел сразу за предыдущим и не трогает
             // остальные, если порядок уже верный
             if (node.previousSibling !== previous) this.#root.insertBefore(node, previous.nextSibling);
             previous = node;
         }
-        this.#window_state = {from: from, to: to};
+        this.#windowState = { from: from, to: to };
         this.#syncSpacers();
-        if (this.#on_render !== undefined) this.#on_render({from: from, to: to});
+        if (this.#onRender !== undefined) this.#onRender({ from: from, to: to });
         this.#checkLoadMore(to);
     }
 
     #syncSpacers() {
         const count = this.#items.length;
-        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`;
+        const { from, to } = this.#windowState;
+        this.#spacerTop.style.height = count === 0 ? "0px" : `${from * this.#itemHeight}px`;
+        this.#spacerBottom.style.height = count === 0 ? "0px" : `${Math.max(0, (count - to) * this.#itemHeight)}px`;
     }
 
     #createItem(index = Number()) {
-        const node = document.createElement(this.#item_tag);
+        const node = document.createElement(this.#itemTag);
         node.id = `${this.#id}_item_${index}`;
         node.dataset.index = String(index);
-        if (this.#render_item === undefined) node.innerText = String(this.#items[index]);
-        else this.#render_item(this.#items[index], index, node);
+        if (this.#renderItem === undefined) node.innerText = String(this.#items[index]);
+        else this.#renderItem(this.#items[index], index, node);
         node.addEventListener("click", this.#onItemClick);
         node.addEventListener("dblclick", this.#onItemDblClick);
         return node;
     }
 
     #checkLoadMore(to = Number()) {
-        if (this.#on_load_more === undefined || this.#loading_more || !this.#has_more) return;
+        if (this.#onLoadMore === undefined || this.#loadingMore || !this.#hasMore) return;
         const count = this.#items.length;
         // Тело пусто или окно дошло до конца загруженного
-        if (count > 0 && to < count - this.#load_threshold) return;
+        if (count > 0 && to < count - this.#loadThreshold) return;
         // Запрос на такую же длину уже был: ждём данных, а не повторяем в пустоту
-        if (this.#requested_at === count) return;
-        this.#requested_at = count;
-        this.#loading_more = true;
+        if (this.#requestedAt === count) return;
+        this.#requestedAt = count;
+        this.#loadingMore = true;
         this.#applyLoader();
         try {
-            this.#on_load_more(count);
+            this.#onLoadMore(count);
         } catch (error) {
             // Ошибка обработчика не должна оставлять тело «в загрузке»;
             // #requested_at не сбрасываем — повтор это `DataGrid.loadMore()`
@@ -399,24 +412,24 @@ 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);
+        if (this.#onItemClickCallback !== undefined) this.#onItemClickCallback(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);
+        if (this.#onActivate !== undefined) this.#onActivate(this.#items[index], index, node);
     };
 
     #onScroll = () => {
@@ -424,7 +437,7 @@ class DataGridBody {
         this.#raf = requestAnimationFrame(() => {
             this.#raf = null;
             const from = this.#firstVisible();
-            const state = this.#window_state;
+            const state = this.#windowState;
             // Видимая часть уже внутри отрисованного окна — перерисовка не нужна
             if (from >= state.from && this.#endIndex(from) <= state.to) return;
             this.#renderWindow(from);
@@ -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;
@@ -492,13 +505,13 @@ class DataGrid {
     #scroll = document.createElement("data_grid_scroll");
     #bar = document.createElement("data_grid_bar");
     #head = document.createElement("data_grid_head");
-    #head_row = document.createElement("data_grid_row");
+    #headRow = document.createElement("data_grid_row");
     #error = document.createElement("data_grid_error");
-    #error_text = document.createElement("data_grid_error_text");
+    #errorText = document.createElement("data_grid_error_text");
     #status = document.createElement("data_grid_status");
     #list = undefined;
-    #chooser_dialog = undefined;
-    #chooser_block = undefined;
+    #chooserDialog = undefined;
+    #chooserBlock = undefined;
 
     // === СОСТОЯНИЕ ===
     #id = String();
@@ -507,26 +520,26 @@ class DataGrid {
     // Видимость по колонкам: ключ скрытой колонки лежит здесь, поэтому DOM собирается по видимым
     #hidden = new Set();
     #pinned = [];
-    #column_reorder = false;
+    #columnReorder = false;
     #data = [];
-    #row_height = DataGrid.DEFAULT_ROW_HEIGHT;
+    #rowHeight = DataGrid.DEFAULT_ROW_HEIGHT;
     #selection = DataGrid.SELECTION.SINGLE;
     #selected = new Set();
     #anchor = undefined;
     // Индекс строки в исходных данных: `render(row, index)` и ключ по умолчанию
-    #row_index = new Map();
+    #rowIndex = new Map();
     #filter = "";
-    #filter_keys = [];
-    #sort = {key: undefined, direction: DataGrid.SORT.NONE};
-    #group_by = undefined;
-    #group_label = undefined;
+    #filterKeys = [];
+    #sort = { key: undefined, direction: DataGrid.SORT.NONE };
+    #groupBy = undefined;
+    #groupLabel = undefined;
     #aggregates = {};
-    #group_collapsed_default = false;
+    #groupCollapsedDefault = false;
     #collapsed = new Map();
     #editable = undefined;
     #editing = undefined;
-    #active = {row: 0, col: 0};
-    #entry_count = 0;
+    #active = { row: 0, col: 0 };
+    #entryCount = 0;
 
     // Производные данные (пересобираются одним проходом — см. #recompute)
     #filtered = [];
@@ -535,103 +548,107 @@ class DataGrid {
     #entries = [];
 
     // Серверный режим
-    #data_source = undefined;
-    #page_size = DataGrid.DEFAULT_PAGE_SIZE;
-    #server_total = undefined;
+    #dataSource = undefined;
+    #pageSize = DataGrid.DEFAULT_PAGE_SIZE;
+    #serverTotal = undefined;
     #loading = false;
     #failed = false;
-    #has_more = false;
+    #hasMore = false;
     #request = 0;
 
     // Подписчики
-    #on_row_activate = undefined;
-    #on_selection_change = undefined;
-    #on_cell_edit = undefined;
-    #on_active_cell_change = undefined;
-    #on_column_order_change = undefined;
-    #on_data_load = undefined;
-    #on_data_error = undefined;
-    #row_class = undefined;
-    #custom_key = undefined;
-    #empty_text = undefined;
-    #context_menu = undefined;
-    #resize_observer = undefined;
+    #onRowActivate = undefined;
+    #onSelectionChange = undefined;
+    #onCellEdit = undefined;
+    #onActiveCellChange = undefined;
+    #onColumnOrderChange = undefined;
+    #onDataLoad = undefined;
+    #onDataError = undefined;
+    #rowClass = undefined;
+    #customKey = undefined;
+    #emptyText = undefined;
+    #contextMenu = undefined;
+    #resizeObserver = undefined;
 
     // Перестановка колонок
     #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);
         this.#hidden = new Set(DataGrid.#normalizeKeys(options.hiddenColumns, this.#columns));
         this.#data = Array.isArray(options.data) ? options.data : [];
-        this.#row_height = options.rowHeight === undefined ? DataGrid.DEFAULT_ROW_HEIGHT : options.rowHeight;
+        this.#rowHeight = options.rowHeight === undefined ? DataGrid.DEFAULT_ROW_HEIGHT : options.rowHeight;
         this.#selection = DataGrid.#normalizeSelection(options.selectable);
-        this.#custom_key = options.rowKey;
-        this.#filter_keys = DataGrid.#normalizeKeys(options.filterKeys, this.#columns);
-        this.#empty_text = options.emptyText;
+        this.#customKey = options.rowKey;
+        this.#filterKeys = DataGrid.#normalizeKeys(options.filterKeys, this.#columns);
+        this.#emptyText = options.emptyText;
         this.#editable = options.editable;
-        this.#group_by = options.groupBy;
-        this.#group_label = options.groupLabel;
+        this.#groupBy = options.groupBy;
+        this.#groupLabel = options.groupLabel;
         this.#aggregates = options.aggregates === undefined ? {} : options.aggregates;
-        this.#group_collapsed_default = options.groupCollapsed === true;
-        this.#row_class = options.rowClass;
-        this.#on_row_activate = options.onRowActivate;
-        this.#on_selection_change = options.onSelectionChange;
-        this.#on_cell_edit = options.onCellEdit;
-        this.#on_active_cell_change = options.onActiveCellChange;
-        this.#on_column_order_change = options.onColumnOrderChange;
-        this.#on_data_load = options.onDataLoad;
-        this.#on_data_error = options.onDataError;
-        this.#data_source = options.dataSource;
-        this.#page_size = DataGrid.#normalizePageSize(options.pageSize);
-        this.#column_reorder = options.columnReorder === true;
+        this.#groupCollapsedDefault = options.groupCollapsed === true;
+        this.#rowClass = options.rowClass;
+        this.#onRowActivate = options.onRowActivate;
+        this.#onSelectionChange = options.onSelectionChange;
+        this.#onCellEdit = options.onCellEdit;
+        this.#onActiveCellChange = options.onActiveCellChange;
+        this.#onColumnOrderChange = options.onColumnOrderChange;
+        this.#onDataLoad = options.onDataLoad;
+        this.#onDataError = options.onDataError;
+        this.#dataSource = options.dataSource;
+        this.#pageSize = DataGrid.#normalizePageSize(options.pageSize);
+        this.#columnReorder = options.columnReorder === true;
         this.setPinned(options.pinned);
 
         // === сборка разметки ===
         this.#root.id = this.#id;
         this.#root.setAttribute("role", "grid");
         this.#head.setAttribute("role", "rowgroup");
-        this.#head_row.setAttribute("role", "row");
-        this.#head_row.setAttribute("aria-rowindex", "1");
-        this.#head.appendChild(this.#head_row);
+        this.#headRow.setAttribute("role", "row");
+        this.#headRow.setAttribute("aria-rowindex", "1");
+        this.#head.appendChild(this.#headRow);
         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(this.#errorText);
+        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");
@@ -644,10 +661,10 @@ class DataGrid {
         this.#syncColumns();
         this.#list = new DataGridBody({
             itemTag: "data_grid_row",
-            itemHeight: this.#row_height,
+            itemHeight: this.#rowHeight,
             buffer: options.buffer,
             height: options.height === undefined ? DataGrid.DEFAULT_HEIGHT : options.height,
-            emptyText: this.#empty_text,
+            emptyText: this.#emptyText,
             hasMore: false,
             onLoadMore: () => this.loadMore(),
             renderItem: (entry, index, node) => this.#renderRow(entry, index, node),
@@ -666,32 +683,32 @@ class DataGrid {
                 this.#syncActiveCells();
                 // Смещения закреплённых колонок считаются по отрисованным узлам
                 this.#syncPinned();
-            }
+            },
         });
         this.#scroll.appendChild(this.#list.set());
         this.#root.appendChild(this.#status);
 
         // Заголовок: делегирование вместо подписки на каждую ячейку
-        this.#head_row.addEventListener("click", this.#onHeaderClick);
-        this.#head_row.addEventListener("keydown", this.#onHeaderKeyDown);
-        this.#head_row.addEventListener("dragstart", this.#onHeaderDragStart);
-        this.#head_row.addEventListener("dragover", this.#onHeaderDragOver);
-        this.#head_row.addEventListener("dragleave", this.#onHeaderDragLeave);
-        this.#head_row.addEventListener("drop", this.#onHeaderDrop);
-        this.#head_row.addEventListener("dragend", this.#onHeaderDragEnd);
+        this.#headRow.addEventListener("click", this.#onHeaderClick);
+        this.#headRow.addEventListener("keydown", this.#onHeaderKeyDown);
+        this.#headRow.addEventListener("dragstart", this.#onHeaderDragStart);
+        this.#headRow.addEventListener("dragover", this.#onHeaderDragOver);
+        this.#headRow.addEventListener("dragleave", this.#onHeaderDragLeave);
+        this.#headRow.addEventListener("drop", this.#onHeaderDrop);
+        this.#headRow.addEventListener("dragend", this.#onHeaderDragEnd);
         // capture: правку начинает перехват, иначе тело списка успеет сообщить об активации
         this.#root.addEventListener("dblclick", this.#onDoubleClick, true);
         this.#root.addEventListener("keydown", this.#onKeyDown);
         // Ширины закреплённых колонок зависят от размера окна — пересчитываем при изменении
-        this.#resize_observer = new ResizeObserver(() => this.#syncPinned());
-        this.#resize_observer.observe(this.#scroll);
+        this.#resizeObserver = new ResizeObserver(() => this.#syncPinned());
+        this.#resizeObserver.observe(this.#scroll);
         // Горизонтальная прокрутка: закреплённые колонки удерживаем на месте
-        this.#scroll.addEventListener("scroll", this.#onScrollX, {passive: true});
+        this.#scroll.addEventListener("scroll", this.#onScrollX, { passive: true });
 
         this.#reindex();
         this.#buildHeader();
         this.#recompute();
-        if (this.#data_source !== undefined) this.reload();
+        if (this.#dataSource !== undefined) this.reload();
     }
 
     // === НОРМАЛИЗАЦИЯ ВХОДА ===
@@ -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}` */
@@ -826,13 +843,16 @@ class DataGrid {
                 }
             }
         }
-        this.#entry_count = this.#entries.length;
+        this.#entryCount = 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.#serverTotal === undefined ? this.#entryCount : this.#serverTotal) + 1)
+        );
         this.#syncColumns();
         this.#list.setItems(this.#entries);
-        this.#list.setHasMore(this.#has_more);
+        this.#list.setHasMore(this.#hasMore);
         this.#syncActiveCells();
         this.#syncPinned();
     }
@@ -857,12 +877,14 @@ class DataGrid {
 
     #filterRows(rows = []) {
         // Серверный режим фильтрует сам: локальный фильтр включился бы поверх серверного
-        if (this.#data_source !== undefined) return rows.slice();
+        if (this.#dataSource !== 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);
-        }));
+        if (text === "" || this.#filterKeys.length === 0) return rows.slice();
+        return rows.filter((row) =>
+            this.#filterKeys.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,29 +917,27 @@ 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" });
     }
 
     /** Группы: порядок — первое появление ключа, поэтому он не зависит от сортировки */
     #buildGroups(rows = []) {
-        if (this.#group_by === undefined) return [];
-        const keyOf = typeof this.#group_by === "function" ? this.#group_by : (row) => row[this.#group_by];
+        if (this.#groupBy === undefined) return [];
+        const keyOf = typeof this.#groupBy === "function" ? this.#groupBy : (row) => row[this.#groupBy];
         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);
         }
         const out = [];
-        for (const [key, group_rows] of map) {
+        for (const [key, groupRows] of map) {
             out.push({
                 key: key,
-                rows: group_rows,
-                aggregates: this.#aggregateValues(group_rows),
-                collapsed: this.#collapsed.has(key) ? this.#collapsed.get(key) : this.#group_collapsed_default
+                rows: groupRows,
+                aggregates: this.#aggregateValues(groupRows),
+                collapsed: this.#collapsed.has(key) ? this.#collapsed.get(key) : this.#groupCollapsedDefault,
             });
         }
         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;
@@ -959,7 +988,7 @@ class DataGrid {
     #syncColumns() {
         const visible = this.#visibleColumns();
         this.#root.style.setProperty("--data_grid_columns", visible.map((entry) => entry.column.width).join(" "));
-        this.#root.style.setProperty("--data_grid_row_height", `${this.#row_height}px`);
+        this.#root.style.setProperty("--data_grid_row_height", `${this.#rowHeight}px`);
         const explicit = DataGrid.#explicitWidth(visible.map((entry) => entry.column));
         if (explicit > 0) this.#root.style.setProperty("--data_grid_min_width", `${explicit}px`);
         else this.#root.style.removeProperty("--data_grid_min_width");
@@ -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;
     }
@@ -993,7 +1022,7 @@ class DataGrid {
             }
         }
         this.#scroll.classList.toggle("data_grid_h_scroll", this.#scroll.scrollWidth > this.#scroll.clientWidth + 1);
-        const nodes = [this.#head_row, ...this.#renderedRows()];
+        const nodes = [this.#headRow, ...this.#renderedRows()];
         for (const row of nodes) {
             for (const cell of row.querySelectorAll("data_grid_cell[data-column]")) {
                 const index = Number(cell.dataset.column);
@@ -1008,7 +1037,7 @@ class DataGrid {
     }
 
     #cellWidth(index = Number()) {
-        const cell = this.#head_row.querySelector(`data_grid_cell[data-column="${index}"]`);
+        const cell = this.#headRow.querySelector(`data_grid_cell[data-column="${index}"]`);
         return cell === null ? 0 : Math.round(cell.getBoundingClientRect().width);
     }
 
@@ -1028,7 +1057,7 @@ class DataGrid {
 
     // === ШАПКА ===
     #buildHeader() {
-        this.#head_row.innerHTML = "";
+        this.#headRow.innerHTML = "";
         for (const entry of this.#visibleColumns()) {
             const column = entry.column;
             const cell = document.createElement("data_grid_cell");
@@ -1041,16 +1070,21 @@ 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) {
+            if (this.#columnReorder) {
                 cell.setAttribute("draggable", "true");
                 if (column.sortable === false) cell.setAttribute("tabindex", "0");
             }
-            this.#head_row.appendChild(cell);
+            this.#headRow.appendChild(cell);
             this.#syncSortMark(cell, entry.index);
         }
     }
@@ -1061,20 +1095,24 @@ 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();
     }
 
     #onHeaderClick = (event) => {
-        const cell = DataGrid.#columnFromEvent(event, this.#head_row);
+        const cell = DataGrid.#columnFromEvent(event, this.#headRow);
         if (cell === undefined) return;
         const index = Number(cell.dataset.column);
         const column = this.#columns[index];
@@ -1083,7 +1121,7 @@ class DataGrid {
     };
 
     #onHeaderKeyDown = (event) => {
-        const cell = DataGrid.#columnFromEvent(event, this.#head_row);
+        const cell = DataGrid.#columnFromEvent(event, this.#headRow);
         if (cell === undefined) return;
         const index = Number(cell.dataset.column);
         if (event.key === "Enter" || event.key === " ") {
@@ -1092,7 +1130,7 @@ class DataGrid {
             return;
         }
         if (event.altKey && (event.key === "ArrowLeft" || event.key === "ArrowRight")) {
-            if (this.#column_reorder === false) return;
+            if (this.#columnReorder === false) return;
             event.preventDefault();
             this.#moveColumn(index, event.key === "ArrowLeft" ? -1 : 1);
             return;
@@ -1104,7 +1142,7 @@ class DataGrid {
             const place = visible.findIndex((entry) => entry.index === index);
             const next = visible[place + (event.key === "ArrowRight" ? 1 : -1)];
             if (next === undefined) return;
-            const node = this.#head_row.querySelector(`data_grid_cell[data-column="${next.index}"]`);
+            const node = this.#headRow.querySelector(`data_grid_cell[data-column="${next.index}"]`);
             if (node !== null) node.focus();
         }
     };
@@ -1114,15 +1152,16 @@ 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();
     }
 
     #applySort() {
         this.#recompute();
-        for (const cell of this.#head_row.querySelectorAll("data_grid_cell[data-column]")) {
+        for (const cell of this.#headRow.querySelectorAll("data_grid_cell[data-column]")) {
             this.#syncSortMark(cell, Number(cell.dataset.column));
         }
         this.#announce(this.#sortSummary());
@@ -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"),
         });
     }
 
@@ -1163,9 +1202,10 @@ class DataGrid {
         // Свой класс строки ставим ДО класса выделения: запись в `className` затирает уже
         // проставленные классы, и после перерисовки строки (правка ячейки) выделенная
         // строка теряла бы подсветку при включённом `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 (typeof this.#rowClass === "function") {
+            const classes = this.#rowClass(row, entry.rowIndex);
+            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.#groupLabel === "function"
+                ? String(this.#groupLabel(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++) {
@@ -1262,9 +1312,9 @@ class DataGrid {
     #syncRowActive(node = new HTMLElement(), index = Number()) {
         const active = this.#active.row === index;
         for (const cell of node.querySelectorAll("data_grid_cell[data-column]")) {
-            const is_active = active && Number(cell.dataset.column) === this.#active.col;
-            cell.classList.toggle(A11Y_ACTIVE_CLASS, is_active);
-            cell.tabIndex = is_active ? 0 : -1;
+            const isActive = active && Number(cell.dataset.column) === this.#active.col;
+            cell.classList.toggle(A11Y_ACTIVE_CLASS, isActive);
+            cell.tabIndex = isActive ? 0 : -1;
         }
     }
 
@@ -1274,14 +1324,14 @@ 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 })}`;
     }
     // === ВЫБОР СТРОК ВНУТРЕННЕЕ ===
     /** Ключ строки: имя поля, функция или место в исходных данных */
     #keyOf(entry = new DataGridEntry()) {
-        if (typeof this.#custom_key === "function") return this.#custom_key(entry.row);
-        if (this.#custom_key !== undefined) return entry.row[this.#custom_key];
+        if (typeof this.#customKey === "function") return this.#customKey(entry.row);
+        if (this.#customKey !== undefined) return entry.row[this.#customKey];
         return this.#rowIndexOf(entry.row);
     }
 
@@ -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,33 +1373,36 @@ 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)))));
-            this.#on_selection_change(rows, Array.from(this.#selected));
+        if (this.#onSelectionChange !== undefined) {
+            const rows = this.#viewRows().filter((row) =>
+                this.#selected.has(this.#keyOf(DataGrid.#entryOf(row, this.#rowIndexOf(row))))
+            );
+            this.#onSelectionChange(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 }));
     }
 
     // === АКТИВНАЯ ЯЧЕЙКА И КЛАВИАТУРА ===
     #setActive(row = Number(), col = Number(), focus = true) {
-        if (this.#entry_count === 0) return;
-        const place = Math.min(Math.max(row, 0), this.#entry_count - 1);
+        if (this.#entryCount === 0) return;
+        const place = Math.min(Math.max(row, 0), this.#entryCount - 1);
         const entry = this.#entryAt(place);
         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 (this.#on_active_cell_change !== undefined && entry !== undefined && entry.kind === "row") {
-            this.#on_active_cell_change(place, known, entry.row);
+        if (node !== undefined && focus) node.focus({ preventScroll: true });
+        if (this.#onActiveCellChange !== undefined && entry !== undefined && entry.kind === "row") {
+            this.#onActiveCellChange(place, known, entry.row);
         }
     }
 
@@ -1365,23 +1419,24 @@ class DataGrid {
         const place = visible.findIndex((item) => item.index === col);
         if (place === -1) return undefined;
         let next = place + step;
-        let next_row = row;
+        let nextRow = row;
         if (next >= visible.length) {
             next = 0;
-            next_row = row + 1;
+            nextRow = row + 1;
         }
         if (next < 0) {
             next = visible.length - 1;
-            next_row = row - 1;
+            nextRow = row - 1;
         }
-        if (next_row < 0 || next_row >= this.#entry_count) return undefined;
-        const entry = this.#entryAt(next_row);
+        if (nextRow < 0 || nextRow >= this.#entryCount) return undefined;
+        const entry = this.#entryAt(nextRow);
         if (entry === undefined || entry.kind !== "row") return undefined;
-        return {row: next_row, col: visible[next].index};
+        return { row: nextRow, 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);
@@ -1413,13 +1468,13 @@ class DataGrid {
         // Space добавлял бы в выборку несуществующую строку, а перестановка колонки
         // (Alt+←/→) пересобирает шапку и ячейка под уже всплывающим событием осиротеет —
         // `closest` вернул бы null и обработчик падал бы с TypeError
-        const row_node = cell.closest("data_grid_row");
-        if (row_node === null || row_node.dataset.index === undefined) return;
-        const row = Number(row_node.dataset.index);
+        const rowNode = cell.closest("data_grid_row");
+        if (rowNode === null || rowNode.dataset.index === undefined) return;
+        const row = Number(rowNode.dataset.index);
         const col = Number(cell.dataset.column);
         const visible = this.#visibleColumns();
         const place = visible.findIndex((item) => item.index === col);
-        const last = this.#entry_count - 1;
+        const last = this.#entryCount - 1;
         const entry = this.#entryAt(row);
         if (entry !== undefined && entry.kind === "group") {
             if (event.key === "Enter" || event.key === " ") {
@@ -1440,9 +1495,9 @@ class DataGrid {
                 return;
             }
         }
-        const move = (next_row, next_col) => {
+        const move = (nextRow, nextColumn) => {
             event.preventDefault();
-            this.#setActive(next_row, next_col === undefined ? col : next_col, true);
+            this.#setActive(nextRow, nextColumn === undefined ? col : nextColumn, true);
         };
         if (event.key === "ArrowDown") return move(Math.min(row + 1, last));
         if (event.key === "ArrowUp") return move(Math.max(row - 1, 0));
@@ -1482,7 +1537,7 @@ class DataGrid {
     #activateRow(index = Number()) {
         const entry = this.#entryAt(index);
         if (entry === undefined || entry.kind !== "row") return;
-        if (this.#on_row_activate !== undefined) this.#on_row_activate(entry.row, entry.rowIndex);
+        if (this.#onRowActivate !== undefined) this.#onRowActivate(entry.row, entry.rowIndex);
     }
 
     // === ПРАВКА ЯЧЕЕК ===
@@ -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)}));
+            if (this.#onCellEdit !== undefined) this.#onCellEdit(entry.row, editing.key, value, editing.old_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()
+        );
     }
 
     // === ЗАКРЕПЛЁННЫЕ КОЛОНКИ И ГОРИЗОНТАЛЬНАЯ ПРОКРУТКА ===
@@ -1711,8 +1771,8 @@ class DataGrid {
 
     // === ПЕРЕСТАНОВКА КОЛОНОК ===
     #onHeaderDragStart = (event) => {
-        if (this.#column_reorder === false) return;
-        const cell = DataGrid.#columnFromEvent(event, this.#head_row);
+        if (this.#columnReorder === false) return;
+        const cell = DataGrid.#columnFromEvent(event, this.#headRow);
         if (cell === undefined) return;
         this.#drag = Number(cell.dataset.column);
         cell.classList.add("data_grid_cell_dragging");
@@ -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,13 +1803,14 @@ 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.#headRow.querySelectorAll("data_grid_cell"))
+            cell.classList.remove("data_grid_cell_dragging");
         this.#drag = undefined;
     };
 
     /** Место вставки по координате курсора: середина каждой видимой колонки */
     #dropSlot(clientX = Number()) {
-        const cells = Array.from(this.#head_row.querySelectorAll("data_grid_cell[data-column]"));
+        const cells = Array.from(this.#headRow.querySelectorAll("data_grid_cell[data-column]"));
         for (let place = 0; place < cells.length; place++) {
             const rect = cells[place].getBoundingClientRect();
             if (clientX < rect.left + rect.width / 2) return place;
@@ -1758,9 +1819,10 @@ 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.#headRow.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 cells = Array.from(this.#headRow.querySelectorAll("data_grid_cell[data-column]"));
         const target = cells[slot === 0 ? 0 : slot - 1];
         if (target !== undefined) target.classList.add("data_grid_cell_drop_after");
     }
@@ -1776,14 +1838,15 @@ 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();
         this.#recompute();
         this.#buildHeader();
-        if (this.#on_column_order_change !== undefined) {
-            this.#on_column_order_change(this.getColumnOrder(), column.key, from, target);
+        if (this.#onColumnOrderChange !== undefined) {
+            this.#onColumnOrderChange(this.getColumnOrder(), column.key, from, target);
         }
     }
 
@@ -1801,10 +1864,13 @@ class DataGrid {
         this.#buildHeader();
         const from = index;
         const to = this.#columns.indexOf(column);
-        const node = this.#head_row.querySelector(`data_grid_cell[data-column="${to}"]`);
+        const node = this.#headRow.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.#onColumnOrderChange !== undefined)
+            this.#onColumnOrderChange(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");
@@ -1821,33 +1887,38 @@ class DataGrid {
     }
 
     #ensureChooser() {
-        if (this.#chooser_dialog !== undefined) {
+        if (this.#chooserDialog !== undefined) {
             this.#refreshChooser();
-            return this.#chooser_dialog;
+            return this.#chooserDialog;
         }
-        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()}));
-        this.#chooser_dialog = dialog;
-        this.#chooser_block = block;
+        dialog.addToFooter(new Button({ title: I18n.t("dataGrid.showAll"), clickEvent: () => this.showAllColumns() }));
+        this.#chooserDialog = dialog;
+        this.#chooserBlock = block;
         document.body.appendChild(dialog.set());
         this.#refreshChooser();
         return dialog;
     }
 
     #refreshChooser() {
-        if (this.#chooser_block === undefined) return;
-        this.#chooser_block.clear();
+        if (this.#chooserBlock === undefined) return;
+        this.#chooserBlock.clear();
         for (const column of this.#columns) {
             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));
-            this.#chooser_block.add(checkbox);
+            this.#chooserBlock.add(checkbox);
         }
     }
 
@@ -1855,48 +1926,51 @@ class DataGrid {
     #requestParams(offset = Number()) {
         return {
             offset: offset,
-            limit: this.#page_size,
+            limit: this.#pageSize,
             filter: this.#filter,
-            filterKeys: this.#filter_keys,
-            sort: {key: this.#sort.key, direction: this.#sort.direction}
+            filterKeys: this.#filterKeys,
+            sort: { key: this.#sort.key, direction: this.#sort.direction },
         };
     }
 
     async #load(mode = "first") {
-        if (this.#data_source === undefined || this.#loading) return;
+        if (this.#dataSource === undefined || this.#loading) return;
         const request = this.#request + 1;
         this.#request = request;
         this.#loading = true;
         this.#setError(undefined);
         this.#list.setLoadingMore(true);
         try {
-            const payload = await this.#data_source(this.#requestParams(mode === "first" ? 0 : this.#data.length));
+            const payload = await this.#dataSource(this.#requestParams(mode === "first" ? 0 : this.#data.length));
             if (request !== this.#request) return;
             const rows = DataGrid.#payloadRows(payload);
             const total = DataGrid.#payloadTotal(payload);
             this.#data = mode === "first" ? rows : this.#data.concat(rows);
-            this.#server_total = total;
-            this.#has_more = total === undefined ? rows.length >= this.#page_size : this.#data.length < total;
+            this.#serverTotal = total;
+            this.#hasMore = total === undefined ? rows.length >= this.#pageSize : 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}));
-            if (this.#on_data_load !== undefined) this.#on_data_load(rows, 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.#onDataLoad !== undefined) this.#onDataLoad(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}));
-            if (this.#on_data_error !== undefined) this.#on_data_error(error, this.#requestParams(this.#data.length));
+            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.#onDataError !== undefined) this.#onDataError(error, this.#requestParams(this.#data.length));
         } finally {
             if (request === this.#request) {
                 this.#loading = false;
                 this.#list.setLoadingMore(false);
-                this.#list.setHasMore(this.#has_more && this.#failed === false);
+                this.#list.setHasMore(this.#hasMore && this.#failed === false);
             }
         }
     }
@@ -1904,11 +1978,11 @@ class DataGrid {
     #setError(message = undefined) {
         const broken = message !== undefined;
         this.#error.hidden = broken === false;
-        this.#error_text.innerText = broken ? String(message) : "";
+        this.#errorText.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.#emptyText, 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");
     }
@@ -1972,13 +2055,13 @@ class DataGrid {
     // === ДАННЫЕ И СОСТОЯНИЕ СЕТКИ ===
     /** Индекс строки в исходных данных: нужен и `render(row, index)`, и ключу по умолчанию */
     #rowIndexOf(row = Object()) {
-        const index = this.#row_index.get(row);
+        const index = this.#rowIndex.get(row);
         return index === undefined ? -1 : index;
     }
 
     #reindex() {
-        this.#row_index = new Map();
-        for (let index = 0; index < this.#data.length; index++) this.#row_index.set(this.#data[index], index);
+        this.#rowIndex = new Map();
+        for (let index = 0; index < this.#data.length; index++) this.#rowIndex.set(this.#data[index], index);
     }
 
     /** Замыкание выравнивания и прокрутки: после смены колонок всё считается заново */
@@ -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.#entryCount;
+    }
+    getRowHeight() {
+        return this.#rowHeight;
+    }
+    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.#dataSource !== undefined;
+    }
+    isLoading() {
+        return this.#loading;
+    }
+    getServerTotal() {
+        return this.#serverTotal;
+    }
+    getPageSize() {
+        return this.#pageSize;
+    }
+    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.#columnReorder;
+    }
+    getColumnOrder() {
+        return this.#columns.map((column) => column.key);
+    }
+    getGroupBy() {
+        return this.#groupBy;
+    }
     /** Группы с агрегатами и состоянием свёрнутости */
     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.#groupLabel === "function"
+                    ? String(this.#groupLabel(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()) {
@@ -2071,9 +2226,9 @@ class DataGrid {
     setData(data = []) {
         this.#data = Array.isArray(data) ? data : [];
         // Ручная замена данных выключает догрузку сервера: иначе она перезаписала бы их
-        this.#data_source = undefined;
-        this.#has_more = false;
-        this.#server_total = undefined;
+        this.#dataSource = undefined;
+        this.#hasMore = false;
+        this.#serverTotal = undefined;
         this.#selected.clear();
         this.#editing = undefined;
         this.#failed = false;
@@ -2093,26 +2248,26 @@ class DataGrid {
     }
 
     setPageSize(size = Number()) {
-        this.#page_size = DataGrid.#normalizePageSize(size);
+        this.#pageSize = DataGrid.#normalizePageSize(size);
         return this;
     }
 
     setRowHeight(height = Number()) {
-        this.#row_height = Number(height);
-        this.#list.setItemHeight(this.#row_height);
+        this.#rowHeight = Number(height);
+        this.#list.setItemHeight(this.#rowHeight);
         this.#syncColumns();
         return this;
     }
 
     /** Перечитать страницы с сервера с текущим фильтром и сортировкой */
     reload() {
-        if (this.#data_source === undefined) return this;
+        if (this.#dataSource === undefined) return this;
         this.#request = this.#request + 1;
         this.#loading = false;
         this.#failed = false;
         this.#data = [];
-        this.#has_more = true;
-        this.#server_total = undefined;
+        this.#hasMore = true;
+        this.#serverTotal = undefined;
         this.#reindex();
         this.#recompute();
         this.#load("first");
@@ -2120,27 +2275,30 @@ class DataGrid {
     }
 
     loadMore() {
-        if (this.#data_source === undefined || this.#has_more === false || this.#failed) return this;
+        if (this.#dataSource === undefined || this.#hasMore === false || this.#failed) return this;
         this.#load("more");
         return this;
     }
 
     retryLoad() {
-        if (this.#data_source === undefined) return this;
+        if (this.#dataSource === undefined) return this;
         this.#failed = false;
-        this.#list.setHasMore(this.#has_more);
+        this.#list.setHasMore(this.#hasMore);
         this.#load("more");
         return this;
     }
 
     setFilter(text = String()) {
         this.#filter = String(text);
-        if (this.#data_source !== undefined) return this.reload();
+        if (this.#dataSource !== undefined) return this.reload();
         this.#recompute();
         // Про фильтр сообщаем числом строк: «фильтр «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,8 +2309,8 @@ 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};
-        if (this.#data_source !== undefined) return this.reload();
+        this.#sort = { key: known, direction: known === undefined ? DataGrid.SORT.NONE : direction };
+        if (this.#dataSource !== undefined) return this.reload();
         this.#applySort();
         return this;
     }
@@ -2168,14 +2326,15 @@ class DataGrid {
     }
 
     setOnActiveCellChange(listener = undefined) {
-        this.#on_active_cell_change = listener;
+        this.#onActiveCellChange = listener;
         return this;
     }
 
     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();
-        this.#context_menu = ctx;
+        if (this.#contextMenu === ctx) return this;
+        if (this.#contextMenu !== undefined && typeof this.#contextMenu.detach === "function")
+            this.#contextMenu.detach();
+        this.#contextMenu = 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();
@@ -2268,13 +2429,13 @@ class DataGrid {
     }
 
     setColumnReorder(enabled = Boolean()) {
-        this.#column_reorder = enabled === true;
+        this.#columnReorder = enabled === true;
         this.#buildHeader();
         return this;
     }
 
     setGroupBy(groupBy = undefined) {
-        this.#group_by = groupBy;
+        this.#groupBy = groupBy;
         this.#collapsed.clear();
         this.#recompute();
         return this;
@@ -2322,26 +2483,27 @@ class DataGrid {
 
     /** Снять подписки и отпустить ресурсы; узел остаётся в документе */
     destroy() {
-        this.#resize_observer.disconnect();
-        this.#head_row.removeEventListener("click", this.#onHeaderClick);
-        this.#head_row.removeEventListener("keydown", this.#onHeaderKeyDown);
-        this.#head_row.removeEventListener("dragstart", this.#onHeaderDragStart);
-        this.#head_row.removeEventListener("dragover", this.#onHeaderDragOver);
-        this.#head_row.removeEventListener("dragleave", this.#onHeaderDragLeave);
-        this.#head_row.removeEventListener("drop", this.#onHeaderDrop);
-        this.#head_row.removeEventListener("dragend", this.#onHeaderDragEnd);
+        this.#resizeObserver.disconnect();
+        this.#headRow.removeEventListener("click", this.#onHeaderClick);
+        this.#headRow.removeEventListener("keydown", this.#onHeaderKeyDown);
+        this.#headRow.removeEventListener("dragstart", this.#onHeaderDragStart);
+        this.#headRow.removeEventListener("dragover", this.#onHeaderDragOver);
+        this.#headRow.removeEventListener("dragleave", this.#onHeaderDragLeave);
+        this.#headRow.removeEventListener("drop", this.#onHeaderDrop);
+        this.#headRow.removeEventListener("dragend", this.#onHeaderDragEnd);
         this.#root.removeEventListener("dblclick", this.#onDoubleClick, true);
         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.#contextMenu !== undefined && typeof this.#contextMenu.detach === "function")
+            this.#contextMenu.detach();
         this.#list.destroy();
-        if (this.#chooser_dialog !== undefined) {
+        if (this.#chooserDialog !== undefined) {
             // У диалога нет своего «удали себя»: узел снимаем с документа сами
-            const node = this.#chooser_dialog.set();
+            const node = this.#chooserDialog.set();
             if (node !== undefined && node.parentNode !== null) node.parentNode.removeChild(node);
-            this.#chooser_dialog = undefined;
-            this.#chooser_block = undefined;
+            this.#chooserDialog = undefined;
+            this.#chooserBlock = undefined;
         }
         return this;
     }