chuijs 4.0.2 → 4.0.4

package/framework/components/chui_file_explorer/file_explorer.js

@@ -1,17 +1,17 @@
 const fs = require("fs");
-const node_path = require("path");
-const {setStyles, formatBytes, optionOr} = require("../../modules/chui_functions");
-const {Icon, Icons} = require("../chui_icons/icons");
-const {Breadcrumb} = require("../chui_breadcrumb/breadcrumb");
-const {RovingKeyboard} = require("../../modules/chui_a11y/chui_a11y");
-const {I18n} = require("../../modules/chui_i18n/chui_i18n");
+const nodePath = require("path");
+const { setStyles, formatBytes, optionOr } = require("../../modules/chui_functions");
+const { Icon, Icons } = require("../chui_icons/icons");
+const { Breadcrumb } = require("../chui_breadcrumb/breadcrumb");
+const { RovingKeyboard } = require("../../modules/chui_a11y/chui_a11y");
+const { I18n } = require("../../modules/chui_i18n/chui_i18n");
 
 /** Вид записи: папка или файл */
-const TYPE = {FOLDER: "folder", FILE: "file"};
+const TYPE = { FOLDER: "folder", FILE: "file" };
 /** Колонка сортировки */
-const SORT = {NAME: "name", SIZE: "size", MODIFIED: "modified"};
+const SORT = { NAME: "name", SIZE: "size", MODIFIED: "modified" };
 /** Направление сортировки */
-const DIRECTION = {ASC: "asc", DESC: "desc"};
+const DIRECTION = { ASC: "asc", DESC: "desc" };
 
 /** Значок по расширению: одна таблица на все виды файлов */
 const ICON_BY_EXTENSION = {
@@ -20,7 +20,7 @@ const ICON_BY_EXTENSION = {
     audio: "mp3 wav ogg flac m4a aac",
     video: "mp4 mkv avi webm mov",
     text: "md txt rtf pdf doc docx odt",
-    code: "js mjs ts tsx jsx json css html htm php py rb java c cpp h sh sql yml yaml"
+    code: "js mjs ts tsx jsx json css html htm php py rb java c cpp h sh sql yml yaml",
 };
 
 /**
@@ -73,12 +73,12 @@ class FileExplorer {
     #up = document.createElement("button");
     #refresh = document.createElement("button");
     #search = document.createElement("input");
-    #search_box = document.createElement("file_explorer_search_box");
-    #search_clear = document.createElement("button");
+    #searchBox = document.createElement("file_explorer_search_box");
+    #searchClear = document.createElement("button");
     #hidden = document.createElement("button");
-    #path_bar = undefined;
+    #pathBar = undefined;
     #grid = document.createElement("file_explorer_grid");
-    #head_row = document.createElement("file_explorer_head_row");
+    #headRow = document.createElement("file_explorer_head_row");
     #body = document.createElement("file_explorer_body");
     #empty = document.createElement("file_explorer_empty");
     #error = document.createElement("file_explorer_error");
@@ -86,68 +86,70 @@ class FileExplorer {
     #id = undefined;
     #provider = undefined;
     #path = "";
-    #root_path = undefined;
+    #rootPath = undefined;
     #history = [];
-    #history_index = -1;
+    #historyIndex = -1;
     #entries = [];
     #selected = new Set();
     #anchor = undefined;
     #filter = "";
-    #sort = {key: SORT.NAME, direction: DIRECTION.ASC};
-    #show_hidden = false;
+    #sort = { key: SORT.NAME, direction: DIRECTION.ASC };
+    #showHidden = false;
     #loading = false;
-    #load_token = 0;
-    #error_object = undefined;
+    #loadToken = 0;
+    #errorObject = undefined;
     #selectable = true;
-    #show_size = true;
-    #show_modified = true;
+    #showSize = true;
+    #showModified = true;
     #height = "300px";
-    #title_text = undefined;
-    #label_text = undefined;
-    #empty_text = undefined;
-    #active_path = undefined;
-    #focus_path = undefined;
+    #titleText = undefined;
+    #labelText = undefined;
+    #emptyText = undefined;
+    #activePath = undefined;
+    #focusPath = undefined;
     #listeners = [];
-    #on_open = undefined;
-    #on_select = undefined;
+    #onOpen = undefined;
+    #onSelect = undefined;
     #roving = undefined;
 
-    constructor(options = {
-        id: String(),
-        title: String(),
-        label: String(),
-        path: String(),
-        root: String(),
-        provider: undefined,
-        filter: String(),
-        sort: Object(),
-        showHidden: Boolean,
-        selectable: Boolean,
-        showSize: Boolean,
-        showModified: Boolean,
-        height: String(),
-        emptyText: String(),
-        errorText: String(),
-        onOpen: undefined,
-        onSelect: undefined,
-        changeListener: undefined
-    }) {
+    constructor(
+        options = {
+            id: String(),
+            title: String(),
+            label: String(),
+            path: String(),
+            root: String(),
+            provider: undefined,
+            filter: String(),
+            sort: Object(),
+            showHidden: Boolean,
+            selectable: Boolean,
+            showSize: Boolean,
+            showModified: Boolean,
+            height: String(),
+            emptyText: String(),
+            errorText: String(),
+            onOpen: undefined,
+            onSelect: undefined,
+            changeListener: undefined,
+        }
+    ) {
         setStyles(__dirname + "/styles.css", "chUiJS_FileExplorer");
         FileExplorer.#counter += 1;
         this.#id = options.id === undefined ? `chui_file_explorer_${FileExplorer.#counter}` : options.id;
         this.#root.id = this.#id;
         this.#root.setAttribute("role", "group");
-        this.#label_text = options.label;
+        this.#labelText = options.label;
         this.#provider = typeof options.provider === "function" ? options.provider : FileExplorer.localProvider();
-        this.#root_path = options.root === undefined ? undefined : String(options.root);
+        this.#rootPath = options.root === undefined ? undefined : String(options.root);
         this.#selectable = options.selectable !== false;
-        this.#show_size = options.showSize !== false;
-        this.#show_modified = options.showModified !== false;
-        this.#show_hidden = options.showHidden === true;
-        this.#on_open = options.onOpen;
-        this.#on_select = options.onSelect;
-        if (options.emptyText !== undefined) this.#empty_text = String(options.emptyText);
-        else this.#empty_text = I18n.t("fileExplorer.empty");
+        this.#showSize = options.showSize !== false;
+        this.#showModified = options.showModified !== false;
+        this.#showHidden = options.showHidden === true;
+        this.#onOpen = options.onOpen;
+        this.#onSelect = options.onSelect;
+        if (options.emptyText !== undefined) this.#emptyText = String(options.emptyText);
+        else this.#emptyText = I18n.t("fileExplorer.empty");
         if (options.filter !== undefined) this.#filter = String(options.filter);
         this.#title.className = "file_explorer_title";
         this.#title.id = `${this.#id}_title`;
@@ -157,8 +159,8 @@ class FileExplorer {
         this.#actions.className = "file_explorer_actions";
         this.#grid.className = "file_explorer_grid";
         this.#grid.setAttribute("role", "grid");
-        this.#head_row.className = "file_explorer_head_row";
-        this.#head_row.setAttribute("role", "row");
+        this.#headRow.className = "file_explorer_head_row";
+        this.#headRow.setAttribute("role", "row");
         this.#body.className = "file_explorer_body";
         this.#body.setAttribute("role", "rowgroup");
         this.#empty.className = "file_explorer_empty";
@@ -169,12 +171,12 @@ class FileExplorer {
         this.#status.setAttribute("role", "status");
         this.#status.setAttribute("aria-live", "polite");
         this.#buildHead();
-        this.#path_bar = new Breadcrumb({label: I18n.t("fileExplorer.path")});
-        this.#path_bar.set().classList.add("file_explorer_path");
+        this.#pathBar = new Breadcrumb({ label: I18n.t("fileExplorer.path") });
+        this.#pathBar.set().classList.add("file_explorer_path");
         this.#root.appendChild(this.#title);
         this.#root.appendChild(this.#head);
-        this.#root.appendChild(this.#path_bar.set());
-        this.#grid.appendChild(this.#head_row);
+        this.#root.appendChild(this.#pathBar.set());
+        this.#grid.appendChild(this.#headRow);
         this.#grid.appendChild(this.#body);
         this.#root.appendChild(this.#grid);
         this.#root.appendChild(this.#empty);
@@ -189,9 +191,9 @@ class FileExplorer {
         this.refreshSearch();
         // Сортировка применяется только теперь: `setSort()` перерисовывает список, а строку пути
         // и прочие узлы разметки он застал бы ещё не созданными
-        const sort_key = optionOr(options.sort === undefined ? undefined : options.sort.key, undefined);
-        const sort_direction = optionOr(options.sort === undefined ? undefined : options.sort.direction, undefined);
-        if (sort_key !== undefined || sort_direction !== undefined) this.setSort(sort_key, sort_direction);
+        const sortKey = optionOr(options.sort === undefined ? undefined : options.sort.key, undefined);
+        const sortDirection = optionOr(options.sort === undefined ? undefined : options.sort.direction, undefined);
+        if (sortKey !== undefined || sortDirection !== undefined) this.setSort(sortKey, sortDirection);
         this.#grid.addEventListener("keydown", this.#onKeyDown);
         this.#grid.addEventListener("click", this.#onClick);
         this.#grid.addEventListener("dblclick", this.#onDoubleClick);
@@ -204,9 +206,9 @@ class FileExplorer {
     /** Провайдер по умолчанию: настоящая файловая система */
     static localProvider() {
         return (path) => {
-            const list = fs.readdirSync(String(path), {withFileTypes: true});
+            const list = fs.readdirSync(String(path), { withFileTypes: true });
             return list.map((entry) => {
-                const full = node_path.join(String(path), entry.name);
+                const full = nodePath.join(String(path), entry.name);
                 let size;
                 let modified;
                 try {
@@ -224,7 +226,7 @@ class FileExplorer {
                     type: entry.isDirectory() ? TYPE.FOLDER : TYPE.FILE,
                     size: size,
                     modified: modified,
-                    hidden: entry.name.startsWith(".")
+                    hidden: entry.name.startsWith("."),
                 };
             });
         };
@@ -236,11 +238,11 @@ class FileExplorer {
     }
 
     getTitle() {
-        return this.#title_text;
+        return this.#titleText;
     }
 
     getLabel() {
-        return this.#label_text;
+        return this.#labelText;
     }
 
     /** Текущая папка */
@@ -250,7 +252,7 @@ class FileExplorer {
 
     /** Корень навигации (`undefined` — подниматься можно до корня пути) */
     getRoot() {
-        return this.#root_path;
+        return this.#rootPath;
     }
 
     /** Все загруженные записи текущей папки (со скрытыми), в исходном порядке провайдера */
@@ -282,11 +284,11 @@ class FileExplorer {
     }
 
     getSort() {
-        return {key: this.#sort.key, direction: this.#sort.direction};
+        return { key: this.#sort.key, direction: this.#sort.direction };
     }
 
     isShowHidden() {
-        return this.#show_hidden;
+        return this.#showHidden;
     }
 
     isSelectable() {
@@ -302,33 +304,33 @@ class FileExplorer {
     }
 
     getEmptyText() {
-        return this.#empty_text;
+        return this.#emptyText;
     }
 
     /** Текст ошибки чтения (пустая строка, если папка прочитана) */
     getErrorText() {
-        if (this.#error_object === undefined) return "";
-        const message = this.#error_object instanceof Error ? this.#error_object.message : String(this.#error_object);
-        return I18n.t("fileExplorer.readFailed", {message: message});
+        if (this.#errorObject === undefined) return "";
+        const message = this.#errorObject instanceof Error ? this.#errorObject.message : String(this.#errorObject);
+        return I18n.t("fileExplorer.readFailed", { message: message });
     }
 
     /** История переходов и место в ней — для кнопок «назад/вперёд» */
     getHistory() {
-        return {paths: [...this.#history], index: this.#history_index};
+        return { paths: [...this.#history], index: this.#historyIndex };
     }
 
     canGoBack() {
-        return this.#history_index > 0;
+        return this.#historyIndex > 0;
     }
 
     canGoForward() {
-        return this.#history_index >= 0 && this.#history_index < this.#history.length - 1;
+        return this.#historyIndex >= 0 && this.#historyIndex < this.#history.length - 1;
     }
 
     /** Выше корня (или выше самого верхнего уровня пути) подняться нельзя */
     canGoUp() {
         if (this.#path === "") return false;
-        if (this.#root_path !== undefined && this.#path === this.#root_path.replace(/[\\/]+$/, "")) return false;
+        if (this.#rootPath !== undefined && this.#path === this.#rootPath.replace(/[\\/]+$/, "")) return false;
         return FileExplorer.#parentOf(this.#path) !== undefined;
     }
 
@@ -342,7 +344,7 @@ class FileExplorer {
     }
 
     setTitle(text = undefined) {
-        this.#title_text = text;
+        this.#titleText = text;
         if (text === undefined || text === "") {
             this.#title.hidden = true;
             this.#title.innerText = "";
@@ -356,7 +358,7 @@ class FileExplorer {
     }
 
     setLabel(text = undefined) {
-        this.#label_text = text;
+        this.#labelText = text;
         this.#syncLabel();
         return this;
     }
@@ -368,7 +370,7 @@ class FileExplorer {
     }
 
     setEmptyText(text = String()) {
-        this.#empty_text = text === undefined ? "" : String(text);
+        this.#emptyText = text === undefined ? "" : String(text);
         this.#render();
         return this;
     }
@@ -400,14 +402,17 @@ class FileExplorer {
         if (column !== undefined && Object.values(SORT).includes(column)) this.#sort.key = column;
         if (order !== undefined && Object.values(DIRECTION).includes(order)) this.#sort.direction = order;
         // До конца сборки разметки перерисовывать нечего (вызов из конструктора)
-        if (this.#path_bar !== undefined) this.#render();
+        if (this.#pathBar !== undefined) this.#render();
         return this;
     }
 
     setShowHidden(shown = Boolean()) {
-        this.#show_hidden = shown === true;
-        this.#hidden.setAttribute("aria-pressed", this.#show_hidden ? "true" : "false");
-        this.#hidden.setAttribute("aria-label", this.#show_hidden ? I18n.t("fileExplorer.hideHidden") : I18n.t("fileExplorer.showHidden"));
+        this.#showHidden = shown === true;
+        this.#hidden.setAttribute("aria-pressed", this.#showHidden ? "true" : "false");
+        this.#hidden.setAttribute(
+            "aria-label",
+            this.#showHidden ? I18n.t("fileExplorer.hideHidden") : I18n.t("fileExplorer.showHidden")
+        );
         this.#render();
         this.#announceState();
         return this;
@@ -416,7 +421,9 @@ class FileExplorer {
     setSelected(paths = Array(), silent = false) {
         if (!this.#selectable) return this;
         const allowed = new Set(this.#entries.map((entry) => entry.path));
-        this.#selected = new Set((Array.isArray(paths) ? paths : []).map((path) => String(path)).filter((path) => allowed.has(path)));
+        this.#selected = new Set(
+            (Array.isArray(paths) ? paths : []).map((path) => String(path)).filter((path) => allowed.has(path))
+        );
         this.#anchor = this.#selected.size === 0 ? undefined : [...this.#selected][this.#selected.size - 1];
         this.#applySelection();
         if (silent === false) this.#notifySelect();
@@ -431,8 +438,8 @@ class FileExplorer {
     open(entry = Object()) {
         if (entry === undefined || entry === null) return this;
         if (entry.type === TYPE.FOLDER) return this.go(entry.path);
-        this.#announce(I18n.t("fileExplorer.openedFile", {name: entry.name}));
-        if (this.#on_open !== undefined) this.#on_open(Object.assign({}, entry), this);
+        this.#announce(I18n.t("fileExplorer.openedFile", { name: entry.name }));
+        if (this.#onOpen !== undefined) this.#onOpen(Object.assign({}, entry), this);
         return this;
     }
 
@@ -443,35 +450,37 @@ class FileExplorer {
     }
 
     /** Загрузка папки: промис разрешается, когда данные пришли (устаревший ответ отбрасывается) */
-    async load(path = String(), options = {history: true, keepSelection: false}) {
+    async load(path = String(), options = { history: true, keepSelection: false }) {
         const target = path === undefined || path === null || path === "" ? this.#path : String(path);
-        const token = this.#load_token + 1;
-        this.#load_token = token;
+        const token = this.#loadToken + 1;
+        this.#loadToken = token;
         this.#loading = true;
         this.#grid.setAttribute("aria-busy", "true");
-        this.#status.innerText = I18n.t("fileExplorer.loading", {target: target});
+        this.#status.innerText = I18n.t("fileExplorer.loading", { target: target });
         let list;
         try {
             list = await Promise.resolve(this.#provider(target));
         } catch (error) {
-            if (token !== this.#load_token) return this;
+            if (token !== this.#loadToken) return this;
             this.#loading = false;
             this.#entries = [];
-            this.#error_object = error;
+            this.#errorObject = error;
             this.#path = target;
             this.#render();
-            this.#announce(I18n.t("fileExplorer.readFailed", {message: error instanceof Error ? error.message : String(error)}));
+            this.#announce(
+                I18n.t("fileExplorer.readFailed", { message: error instanceof Error ? error.message : String(error) })
+            );
             return this;
         }
-        if (token !== this.#load_token) return this;
+        if (token !== this.#loadToken) return this;
         this.#entries = FileExplorer.#normalize(list, target);
-        this.#error_object = undefined;
+        this.#errorObject = undefined;
         this.#loading = false;
         this.#path = target;
         if (options.keepSelection !== true) this.#selected.clear();
         if (options.history !== false) {
-            this.#history = this.#history.slice(0, this.#history_index + 1).concat([target]);
-            this.#history_index = this.#history.length - 1;
+            this.#history = this.#history.slice(0, this.#historyIndex + 1).concat([target]);
+            this.#historyIndex = this.#history.length - 1;
         }
         this.#render();
         this.#announceState();
@@ -480,14 +489,14 @@ class FileExplorer {
 
     back() {
         if (!this.canGoBack()) return this;
-        this.#history_index -= 1;
-        return this.load(this.#history[this.#history_index], {history: false});
+        this.#historyIndex -= 1;
+        return this.load(this.#history[this.#historyIndex], { history: false });
     }
 
     forward() {
         if (!this.canGoForward()) return this;
-        this.#history_index += 1;
-        return this.load(this.#history[this.#history_index], {history: false});
+        this.#historyIndex += 1;
+        return this.load(this.#history[this.#historyIndex], { history: false });
     }
 
     /** На уровень выше; выше корня не поднимаемся */
@@ -498,7 +507,7 @@ class FileExplorer {
 
     /** Перечитать текущую папку, сохранив выбор */
     refresh() {
-        return this.load(this.#path, {history: false, keepSelection: true});
+        return this.load(this.#path, { history: false, keepSelection: true });
     }
 
     /** Фокус на запись по пути (или на первую видимую) */
@@ -526,7 +535,8 @@ class FileExplorer {
     static #normalize(list = Array(), path = String()) {
         const source = Array.isArray(list) ? list : [];
         return source.map((item, index) => {
-            const entry = typeof item === "string" ? {name: item} : (item === null || typeof item !== "object" ? {} : item);
+            const entry =
+                typeof item === "string" ? { name: item } : item === null || typeof item !== "object" ? {} : item;
             const name = entry.name === undefined ? String(index) : String(entry.name);
             return {
                 name: name,
@@ -535,7 +545,7 @@ class FileExplorer {
                 size: entry.size === undefined ? undefined : Number(entry.size),
                 modified: entry.modified === undefined ? undefined : entry.modified,
                 hidden: entry.hidden === undefined ? name.startsWith(".") : entry.hidden === true,
-                icon: entry.icon
+                icon: entry.icon,
             };
         });
     }
@@ -590,7 +600,8 @@ class FileExplorer {
     #compare(a = Object(), b = Object()) {
         const direction = this.#sort.direction === DIRECTION.DESC ? -1 : 1;
         if (a.type !== b.type) return a.type === TYPE.FOLDER ? -1 : 1;
-        if (this.#sort.key === SORT.NAME) return direction * a.name.localeCompare(b.name, "ru", {numeric: true, sensitivity: "base"});
+        if (this.#sort.key === SORT.NAME)
+            return direction * a.name.localeCompare(b.name, "ru", { numeric: true, sensitivity: "base" });
         const value = (entry) => {
             if (this.#sort.key === SORT.SIZE) return entry.size === undefined ? undefined : Number(entry.size);
             if (entry.modified === undefined || entry.modified === null) return undefined;
@@ -599,7 +610,8 @@ class FileExplorer {
         };
         const left = value(a);
         const right = value(b);
-        if (left === undefined && right === undefined) return direction * a.name.localeCompare(b.name, "ru", {numeric: true});
+        if (left === undefined && right === undefined)
+            return direction * a.name.localeCompare(b.name, "ru", { numeric: true });
         if (left === undefined) return 1;
         if (right === undefined) return -1;
         return direction * (left - right);
@@ -607,16 +619,29 @@ class FileExplorer {
 
     #visibleEntries() {
         const filter = this.#filter.trim().toLowerCase();
-        const list = this.#entries.filter((entry) => (this.#show_hidden || entry.hidden !== true) &&
-            (filter === "" || entry.name.toLowerCase().includes(filter)));
+        const list = this.#entries.filter(
+            (entry) =>
+                (this.#showHidden || entry.hidden !== true) &&
+                (filter === "" || entry.name.toLowerCase().includes(filter))
+        );
         return list.sort((a, b) => this.#compare(a, b));
     }
 
     #buildHead() {
-        this.#actions.appendChild(this.#navButton(this.#back, Icons.NAVIGATION.ARROW_BACK, I18n.t("a11y.previous"), () => this.back()));
-        this.#actions.appendChild(this.#navButton(this.#forward, Icons.NAVIGATION.ARROW_FORWARD, I18n.t("a11y.next"), () => this.forward()));
-        this.#actions.appendChild(this.#navButton(this.#up, Icons.NAVIGATION.ARROW_UPWARD, I18n.t("fileExplorer.up"), () => this.up()));
-        this.#actions.appendChild(this.#navButton(this.#refresh, Icons.NAVIGATION.REFRESH, I18n.t("fileExplorer.refresh"), () => this.refresh()));
+        this.#actions.appendChild(
+            this.#navButton(this.#back, Icons.NAVIGATION.ARROW_BACK, I18n.t("a11y.previous"), () => this.back())
+        );
+        this.#actions.appendChild(
+            this.#navButton(this.#forward, Icons.NAVIGATION.ARROW_FORWARD, I18n.t("a11y.next"), () => this.forward())
+        );
+        this.#actions.appendChild(
+            this.#navButton(this.#up, Icons.NAVIGATION.ARROW_UPWARD, I18n.t("fileExplorer.up"), () => this.up())
+        );
+        this.#actions.appendChild(
+            this.#navButton(this.#refresh, Icons.NAVIGATION.REFRESH, I18n.t("fileExplorer.refresh"), () =>
+                this.refresh()
+            )
+        );
         this.#head.appendChild(this.#actions);
         this.#search.className = "file_explorer_search";
         this.#search.type = "search";
@@ -627,32 +652,38 @@ class FileExplorer {
         this.#search.addEventListener("input", () => this.setFilter(this.#search.value));
         // Кнопка очистки — своя: у `input[type=search]` системная кнопка очистки скрыта,
         // чтобы поле выглядело как остальные (см. стили)
-        this.#search_box.className = "file_explorer_search_box";
-        this.#search_clear.type = "button";
-        this.#search_clear.className = "file_explorer_search_clear";
-        this.#search_clear.setAttribute("aria-label", I18n.t("fileExplorer.clearSearch"));
-        const clear_glyph = new Icon(Icons.NAVIGATION.CLOSE, "16px").set();
-        clear_glyph.setAttribute("aria-hidden", "true");
-        this.#search_clear.appendChild(clear_glyph);
-        this.#search_clear.addEventListener("click", () => {
+        this.#searchBox.className = "file_explorer_search_box";
+        this.#searchClear.type = "button";
+        this.#searchClear.className = "file_explorer_search_clear";
+        this.#searchClear.setAttribute("aria-label", I18n.t("fileExplorer.clearSearch"));
+        const clearGlyph = new Icon(Icons.NAVIGATION.CLOSE, "16px").set();
+        clearGlyph.setAttribute("aria-hidden", "true");
+        this.#searchClear.appendChild(clearGlyph);
+        this.#searchClear.addEventListener("click", () => {
             this.setFilter("");
             this.#search.focus();
         });
-        this.#search_box.appendChild(this.#search);
-        this.#search_box.appendChild(this.#search_clear);
-        this.#head.appendChild(this.#search_box);
+        this.#searchBox.appendChild(this.#search);
+        this.#searchBox.appendChild(this.#searchClear);
+        this.#head.appendChild(this.#searchBox);
         this.#syncClear();
         this.#hidden.className = "file_explorer_hidden";
         this.#hidden.type = "button";
-        this.#hidden.setAttribute("aria-pressed", this.#show_hidden ? "true" : "false");
-        this.#hidden.setAttribute("aria-label", this.#show_hidden ? I18n.t("fileExplorer.hideHidden") : I18n.t("fileExplorer.showHidden"));
-        const glyph = new Icon(this.#show_hidden ? Icons.ACTIONS.VISIBILITY : Icons.ACTIONS.VISIBILITY_OFF, "18px").set();
+        this.#hidden.setAttribute("aria-pressed", this.#showHidden ? "true" : "false");
+        this.#hidden.setAttribute(
+            "aria-label",
+            this.#showHidden ? I18n.t("fileExplorer.hideHidden") : I18n.t("fileExplorer.showHidden")
+        );
+        const glyph = new Icon(
+            this.#showHidden ? Icons.ACTIONS.VISIBILITY : Icons.ACTIONS.VISIBILITY_OFF,
+            "18px"
+        ).set();
         glyph.setAttribute("aria-hidden", "true");
         this.#hidden.appendChild(glyph);
-        this.#hidden.addEventListener("click", () => this.setShowHidden(!this.#show_hidden));
+        this.#hidden.addEventListener("click", () => this.setShowHidden(!this.#showHidden));
         this.#head.appendChild(this.#hidden);
         // У панели одна остановка обхода: по кнопкам ходят стрелки/Home/End
-        this.#roving = new RovingKeyboard(this.#actions, {itemSelector: "button"});
+        this.#roving = new RovingKeyboard(this.#actions, { itemSelector: "button" });
         return this;
     }
 
@@ -672,27 +703,40 @@ class FileExplorer {
         const cell = document.createElement("file_explorer_head_cell");
         cell.className = "file_explorer_head_cell";
         cell.setAttribute("role", "columnheader");
-        cell.setAttribute("aria-sort", this.#sort.key === key
-            ? (this.#sort.direction === DIRECTION.DESC ? "descending" : "ascending")
-            : "none");
+        cell.setAttribute(
+            "aria-sort",
+            this.#sort.key === key ? (this.#sort.direction === DIRECTION.DESC ? "descending" : "ascending") : "none"
+        );
         const button = document.createElement("button");
         button.type = "button";
         button.className = "file_explorer_sort";
-        button.setAttribute("aria-label", I18n.t("fileExplorer.sortBy", {title: title}));
+        button.setAttribute("aria-label", I18n.t("fileExplorer.sortBy", { title: title }));
         const text = document.createElement("file_explorer_sort_title");
         text.innerText = title;
         button.appendChild(text);
         if (this.#sort.key === key) {
-            const glyph = new Icon(this.#sort.direction === DIRECTION.DESC ? Icons.NAVIGATION.ARROW_DOWNWARD : Icons.NAVIGATION.ARROW_UPWARD, "16px").set();
+            const glyph = new Icon(
+                this.#sort.direction === DIRECTION.DESC
+                    ? Icons.NAVIGATION.ARROW_DOWNWARD
+                    : Icons.NAVIGATION.ARROW_UPWARD,
+                "16px"
+            ).set();
             glyph.setAttribute("aria-hidden", "true");
             button.appendChild(glyph);
         }
         button.addEventListener("click", () => {
             // Повторный клик по активной колонке переворачивает порядок: «без сортировки»
             // у списка файлов смысла не имеет, поэтому цикла из трёх состояний здесь нет
-            if (this.#sort.key === key) this.setSort(key, this.#sort.direction === DIRECTION.ASC ? DIRECTION.DESC : DIRECTION.ASC);
+            if (this.#sort.key === key)
+                this.setSort(key, this.#sort.direction === DIRECTION.ASC ? DIRECTION.DESC : DIRECTION.ASC);
             else this.setSort(key, DIRECTION.ASC);
-            this.#announce(I18n.t("fileExplorer.sorted", {title: title, direction: this.#sort.direction === DIRECTION.ASC ? I18n.t("data.ascending") : I18n.t("data.descending")}));
+            this.#announce(
+                I18n.t("fileExplorer.sorted", {
+                    title: title,
+                    direction:
+                        this.#sort.direction === DIRECTION.ASC ? I18n.t("data.ascending") : I18n.t("data.descending"),
+                })
+            );
         });
         cell.appendChild(button);
         return cell;
@@ -713,9 +757,12 @@ class FileExplorer {
             return cell;
         }
         cell.classList.add("file_explorer_cell_meta");
-        cell.innerText = key === SORT.SIZE
-            ? (entry.size === undefined ? "" : formatBytes(entry.size))
-            : FileExplorer.#dateText(entry.modified);
+        cell.innerText =
+            key === SORT.SIZE
+                ? entry.size === undefined
+                    ? ""
+                    : formatBytes(entry.size)
+                : FileExplorer.#dateText(entry.modified);
         return cell;
     }
 
@@ -728,8 +775,8 @@ class FileExplorer {
         row.classList.toggle("file_explorer_row_selected", this.#selected.has(entry.path));
         row.classList.toggle("file_explorer_row_folder", entry.type === TYPE.FOLDER);
         row.appendChild(this.#cell(entry, SORT.NAME));
-        if (this.#show_size) row.appendChild(this.#cell(entry, SORT.SIZE));
-        if (this.#show_modified) row.appendChild(this.#cell(entry, SORT.MODIFIED));
+        if (this.#showSize) row.appendChild(this.#cell(entry, SORT.SIZE));
+        if (this.#showModified) row.appendChild(this.#cell(entry, SORT.MODIFIED));
         return row;
     }
 
@@ -737,27 +784,36 @@ class FileExplorer {
     #render() {
         // Строки пересобираются, а фокус живёт на строке: запоминаем её до перерисовки
         const active = document.activeElement;
-        const focused = active === null || active === undefined || !this.#grid.contains(active) ? null : active.closest("file_explorer_row");
-        if (focused !== null) this.#focus_path = focused.dataset.path;
-        this.#head_row.innerHTML = "";
+        const focused =
+            active === null || active === undefined || !this.#grid.contains(active)
+                ? null
+                : active.closest("file_explorer_row");
+        if (focused !== null) this.#focusPath = focused.dataset.path;
+        this.#headRow.innerHTML = "";
         this.#body.innerHTML = "";
-        this.#head_row.appendChild(this.#sortButton(SORT.NAME, I18n.t("fileExplorer.columnName")));
-        if (this.#show_size) this.#head_row.appendChild(this.#sortButton(SORT.SIZE, I18n.t("fileExplorer.columnSize")));
-        if (this.#show_modified) this.#head_row.appendChild(this.#sortButton(SORT.MODIFIED, I18n.t("fileExplorer.columnModified")));
+        this.#headRow.appendChild(this.#sortButton(SORT.NAME, I18n.t("fileExplorer.columnName")));
+        if (this.#showSize) this.#headRow.appendChild(this.#sortButton(SORT.SIZE, I18n.t("fileExplorer.columnSize")));
+        if (this.#showModified)
+            this.#headRow.appendChild(this.#sortButton(SORT.MODIFIED, I18n.t("fileExplorer.columnModified")));
         // Ширины колонок задаёт компонент: сетка шапки и сетка строк обязаны совпасть,
         // а какие колонки показаны, знает только он
         const columns = ["minmax(0, 1fr)"];
-        if (this.#show_size) columns.push("110px");
-        if (this.#show_modified) columns.push("160px");
+        if (this.#showSize) columns.push("110px");
+        if (this.#showModified) columns.push("160px");
         this.#grid.style.setProperty("--file_explorer_columns", columns.join(" "));
         const visible = this.#visibleEntries();
         for (const entry of visible) this.#body.appendChild(this.#rowNode(entry));
         this.#grid.hidden = visible.length === 0;
-        this.#empty.hidden = visible.length > 0 || this.#error_object !== undefined;
-        this.#empty.innerText = this.isFiltered() ? I18n.t("common.nothingFound") : this.#empty_text;
-        this.#error.hidden = this.#error_object === undefined;
+        this.#empty.hidden = visible.length > 0 || this.#errorObject !== undefined;
+        this.#empty.innerText = this.isFiltered() ? I18n.t("common.nothingFound") : this.#emptyText;
+        this.#error.hidden = this.#errorObject === undefined;
         this.#error.innerText = this.getErrorText();
-        this.#grid.setAttribute("aria-label", I18n.t("fileExplorer.gridLabel", {path: this.#path === "" ? I18n.t("fileExplorer.noFolderInline") : this.#path}));
+        this.#grid.setAttribute(
+            "aria-label",
+            I18n.t("fileExplorer.gridLabel", {
+                path: this.#path === "" ? I18n.t("fileExplorer.noFolderInline") : this.#path,
+            })
+        );
         this.#grid.setAttribute("aria-rowcount", String(visible.length + 1));
         this.#grid.setAttribute("aria-busy", this.#loading ? "true" : "false");
         this.#back.disabled = !this.canGoBack();
@@ -772,31 +828,35 @@ class FileExplorer {
 
     #renderPath() {
         const items = this.#pathItems();
-        this.#path_bar.setItems(items.map((item, index) => (index === items.length - 1
-            ? {title: item.title}
-            : {title: item.title, clickEvent: () => this.go(item.path)})));
+        this.#pathBar.setItems(
+            items.map((item, index) =>
+                index === items.length - 1
+                    ? { title: item.title }
+                    : { title: item.title, clickEvent: () => this.go(item.path) }
+            )
+        );
         return this;
     }
 
     /** Звенья пути: с корнем оставляем только путь от него */
     #pathItems() {
         const full = String(this.#path);
-        if (full === "") return [{title: I18n.t("fileExplorer.noFolder"), path: ""}];
-        const root = this.#root_path === undefined ? undefined : String(this.#root_path).replace(/[\\/]+$/, "");
+        if (full === "") return [{ title: I18n.t("fileExplorer.noFolder"), path: "" }];
+        const root = this.#rootPath === undefined ? undefined : String(this.#rootPath).replace(/[\\/]+$/, "");
         const items = [];
-        if (full.startsWith("/")) items.push({title: "/", path: "/"});
-        else if (/^[A-Za-z]:/.test(full)) items.push({title: `${full.slice(0, 2)}/`, path: `${full.slice(0, 2)}/`});
+        if (full.startsWith("/")) items.push({ title: "/", path: "/" });
+        else if (/^[A-Za-z]:/.test(full)) items.push({ title: `${full.slice(0, 2)}/`, path: `${full.slice(0, 2)}/` });
         const base = items.length > 0 ? items[0].path : "";
         const rest = full.slice(base.length).replace(/^[\\/]+/, "");
         let current = base;
         for (const part of rest.split(/[\\/]+/).filter((piece) => piece !== "")) {
-            current = current === "" ? part : (current.endsWith("/") ? `${current}${part}` : `${current}/${part}`);
-            items.push({title: part, path: current});
+            current = current === "" ? part : current.endsWith("/") ? `${current}${part}` : `${current}/${part}`;
+            items.push({ title: part, path: current });
         }
-        if (items.length === 0) items.push({title: full, path: full});
+        if (items.length === 0) items.push({ title: full, path: full });
         if (root !== undefined && root !== "") {
             const index = items.findIndex((item) => item.path === root);
-            if (index > 0) return [{title: items[index].title, path: root}].concat(items.slice(index + 1));
+            if (index > 0) return [{ title: items[index].title, path: root }].concat(items.slice(index + 1));
         }
         return items;
     }
@@ -815,14 +875,14 @@ class FileExplorer {
         const list = [...this.#body.querySelectorAll("file_explorer_row")];
         if (list.length === 0) return;
         const stop =
-            list.find((row) => row.dataset.path === this.#active_path) ??
-            list.find((row) => row.dataset.path === this.#focus_path) ??
+            list.find((row) => row.dataset.path === this.#activePath) ??
+            list.find((row) => row.dataset.path === this.#focusPath) ??
             list[0];
-        this.#active_path = stop.dataset.path;
+        this.#activePath = stop.dataset.path;
         for (const row of list) row.setAttribute("tabindex", row === stop ? "0" : "-1");
         // Фокус возвращаем только если он был в сетке: иначе перерисовка его бы украла
-        if (this.#focus_path !== undefined && stop.dataset.path === this.#focus_path) {
-            this.#focus_path = undefined;
+        if (this.#focusPath !== undefined && stop.dataset.path === this.#focusPath) {
+            this.#focusPath = undefined;
             stop.focus();
         }
         return this;
@@ -830,7 +890,7 @@ class FileExplorer {
 
     #focusRow(row = undefined) {
         if (row === undefined || row === null) return this;
-        this.#active_path = row.dataset.path;
+        this.#activePath = row.dataset.path;
         for (const other of this.#body.querySelectorAll("file_explorer_row")) {
             other.setAttribute("tabindex", other === row ? "0" : "-1");
         }
@@ -839,7 +899,10 @@ class FileExplorer {
     }
 
     #currentRow(target = undefined) {
-        const row = target === undefined || target === null || typeof target.closest !== "function" ? null : target.closest("file_explorer_row");
+        const row =
+            target === undefined || target === null || typeof target.closest !== "function"
+                ? null
+                : target.closest("file_explorer_row");
         if (row !== null) return row;
         return this.#body.querySelector('file_explorer_row[tabindex="0"]');
     }
@@ -891,25 +954,33 @@ class FileExplorer {
 
     #notifySelect() {
         const entries = this.getSelected();
-        this.#announce(entries.length === 0 ? I18n.t("fileExplorer.selectionCleared") : I18n.t("fileExplorer.selectedCount", {count: entries.length}));
+        this.#announce(
+            entries.length === 0
+                ? I18n.t("fileExplorer.selectionCleared")
+                : I18n.t("fileExplorer.selectedCount", { count: entries.length })
+        );
         for (const listener of [...this.#listeners]) listener(entries, this);
-        if (this.#on_select !== undefined) this.#on_select(entries, this);
+        if (this.#onSelect !== undefined) this.#onSelect(entries, this);
         return this;
     }
 
     /** Что видно сейчас: количество, пустота, поиск и ошибка чтения */
     #announceState() {
-        if (this.#error_object !== undefined) {
+        if (this.#errorObject !== undefined) {
             this.#status.innerText = this.getErrorText();
             return this;
         }
         const visible = this.#visibleEntries().length;
-        const total = this.#entries.filter((entry) => this.#show_hidden || entry.hidden !== true).length;
+        const total = this.#entries.filter((entry) => this.#showHidden || entry.hidden !== true).length;
         if (this.isFiltered()) {
-            this.#status.innerText = visible === 0 ? I18n.t("common.nothingFound") : I18n.t("fileExplorer.foundCount", {found: visible, total: total});
+            this.#status.innerText =
+                visible === 0
+                    ? I18n.t("common.nothingFound")
+                    : I18n.t("fileExplorer.foundCount", { found: visible, total: total });
             return this;
         }
-        this.#status.innerText = visible === 0 ? this.#empty_text : I18n.t("fileExplorer.entriesCount", {count: visible});
+        this.#status.innerText =
+            visible === 0 ? this.#emptyText : I18n.t("fileExplorer.entriesCount", { count: visible });
         return this;
     }
 
@@ -922,12 +993,12 @@ class FileExplorer {
 
     /** Кнопка очистки видна, только когда есть что очищать */
     #syncClear() {
-        this.#search_clear.hidden = this.#filter === "";
+        this.#searchClear.hidden = this.#filter === "";
         return this;
     }
 
     #syncLabel() {
-        if (this.#title_text !== undefined && this.#title_text !== "") {
+        if (this.#titleText !== undefined && this.#titleText !== "") {
             this.#root.setAttribute("aria-labelledby", this.#title.id);
             this.#root.removeAttribute("aria-label");
         } else {
@@ -938,8 +1009,8 @@ class FileExplorer {
     }
 
     #accessibleName() {
-        if (this.#title_text !== undefined && this.#title_text !== "") return this.#title_text;
-        if (this.#label_text !== undefined && this.#label_text !== "") return this.#label_text;
+        if (this.#titleText !== undefined && this.#titleText !== "") return this.#titleText;
+        if (this.#labelText !== undefined && this.#labelText !== "") return this.#labelText;
         return I18n.t("fileExplorer.title");
     }
 
@@ -953,7 +1024,7 @@ class FileExplorer {
         // иначе ближайшая перерисовка вернула бы фокус не туда, где он был
         const row = event.target instanceof Element ? event.target.closest("file_explorer_row") : null;
         if (row === null || row.dataset.path === undefined) return;
-        this.#active_path = row.dataset.path;
+        this.#activePath = row.dataset.path;
     };
 
     #onClick = (event) => {
@@ -1034,4 +1105,4 @@ class FileExplorer {
     };
 }
 
-exports.FileExplorer = FileExplorer
+exports.FileExplorer = FileExplorer;