chuijs 4.0.2 → 4.0.3

package/framework/components/chui_inputs/chui_date/date.js

@@ -1,10 +1,10 @@
-const {Animation} = require('../../../modules/chui_animations/animations');
-const {Calendar} = require('../../chui_calendar/calendar');
-const {Icon, Icons} = require('../../chui_icons/icons');
-const {makeKeyboardButton} = require('../../../modules/chui_a11y/chui_a11y');
-const {I18n} = require('../../../modules/chui_i18n/chui_i18n');
-const {dropdownPlacement} = require('../../../modules/chui_functions');
-const {Validate} = require('../../../modules/chui_validate/chui_validate');
+const { Animation } = require("../../../modules/chui_animations/animations");
+const { Calendar } = require("../../chui_calendar/calendar");
+const { Icon, Icons } = require("../../chui_icons/icons");
+const { makeKeyboardButton } = require("../../../modules/chui_a11y/chui_a11y");
+const { I18n } = require("../../../modules/chui_i18n/chui_i18n");
+const { dropdownPlacement } = require("../../../modules/chui_functions");
+const { Validate } = require("../../../modules/chui_validate/chui_validate");
 
 const MONTHS_IN_YEAR = 12;
 /** Сколько лет на одной странице выбора года */
@@ -13,50 +13,65 @@ const isDayNumber = (cell) => /^\d+$/.test(String(cell).trim());
 
 class DateInput {
     #id = require("randomstring").generate();
-    #chui_date_input = document.createElement('chui_date_input');
-    #date_main_block = document.createElement('date_main_block');
-    #input = document.createElement('input');
-    #label = document.createElement('label');
-    #date_dropdown_open = document.createElement('date_dropdown_open');
-    #date_dropdown_open_disabled = document.createElement('date_dropdown_open');
-    #dropdown = document.createElement('date_select_dropdown');
+    #chui_date_input = document.createElement("chui_date_input");
+    #date_main_block = document.createElement("date_main_block");
+    #input = document.createElement("input");
+    #label = document.createElement("label");
+    #date_dropdown_open = document.createElement("date_dropdown_open");
+    #date_dropdown_open_disabled = document.createElement("date_dropdown_open");
+    #dropdown = document.createElement("date_select_dropdown");
     // Слушатель окна храним полем, чтобы можно было снять в destroy()
     #window_click_event = (event) => {
         if (!this.#date_main_block.contains(event.target)) this.#closeDropdown();
     };
     #dropdown_id = require("randomstring").generate();
     #date_now = new Date();
-    #date_month_list = document.createElement('date_month_list');
-    #date_year_list = document.createElement('date_year_list');
-    #date_calendar_title = document.createElement('date_calendar_title');
+    #date_month_list = document.createElement("date_month_list");
+    #date_year_list = document.createElement("date_year_list");
+    #date_calendar_title = document.createElement("date_calendar_title");
     #calendar_year = this.#date_now.getFullYear();
     #calendar_month = this.#date_now.getMonth();
     // Экран календаря: месяцы (по умолчанию) или выбор года
     #view = "months";
     constructor(options = { name: String(), title: String(), required: Boolean() }) {
-        require('../../../modules/chui_functions').setStyles(__dirname + "/styles.css", 'chUiJS_DateInput');
-        this.#input.type = 'date';
+        require("../../../modules/chui_functions").setStyles(__dirname + "/styles.css", "chUiJS_DateInput");
+        this.#input.type = "date";
         this.#input.className = "date_input";
         this.#input.id = this.#id;
         if (options.name !== undefined) this.#input.name = options.name;
         if (options.required !== undefined) this.#input.required = options.required;
         // Валидация и показ ошибки: правила из options (required/pattern/…). Текст ошибки — в корень
         // поля (под контролом), рамку получает сам контрол: подпись и поле — две строки одной колонки
-        Validate.installField(this, options, this.#chui_date_input, undefined, () => this.#input.value, this.#date_main_block);
-        this.#date_dropdown_open.innerHTML = new Icon(Icons.HARDWARE.KEYBOARD_ARROW_DOWN, undefined, "var(--blue_prime_background)").getHTML();
-        this.#date_dropdown_open_disabled.innerHTML = new Icon(Icons.HARDWARE.KEYBOARD_ARROW_DOWN, undefined, "var(--text_color_disabled)").getHTML();
+        Validate.installField(
+            this,
+            options,
+            this.#chui_date_input,
+            undefined,
+            () => this.#input.value,
+            this.#date_main_block
+        );
+        this.#date_dropdown_open.innerHTML = new Icon(
+            Icons.HARDWARE.KEYBOARD_ARROW_DOWN,
+            undefined,
+            "var(--blue_prime_background)"
+        ).getHTML();
+        this.#date_dropdown_open_disabled.innerHTML = new Icon(
+            Icons.HARDWARE.KEYBOARD_ARROW_DOWN,
+            undefined,
+            "var(--text_color_disabled)"
+        ).getHTML();
         // Курсор выключенного поля даёт его контейнер (`.date_main_block_disabled`),
         // курсор наследуется и на стрелку
         if (options.title !== undefined) {
-            this.#label.classList.add('date_input_label')
+            this.#label.classList.add("date_input_label");
             this.#label.innerText = options.title;
-            this.#label.setAttribute('for', this.#id);
+            this.#label.setAttribute("for", this.#id);
             this.#chui_date_input.appendChild(this.#label);
         }
         // Рамку с кольцом при фокусе рисует общее правило темы (`date_main_block:hover`,
         // `:focus-within`), а не компонент: прежде он ставил то же самое инлайном,
         // а на `blur` снимал весь атрибут `style`
-        this.#dropdown.setAttribute('id', this.#dropdown_id);
+        this.#dropdown.setAttribute("id", this.#dropdown_id);
         // Доступность: поле — combobox, календарь — диалог с состоянием раскрытия
         this.#input.setAttribute("role", "combobox");
         this.#input.setAttribute("aria-haspopup", "dialog");
@@ -67,10 +82,13 @@ class DateInput {
         // Клавиатура календаря: стрелки по дням, Enter выбирает, Escape закрывает
         this.#dropdown.addEventListener("keydown", (event) => {
             // Заголовок и список годов — свои кнопки: у них своя обработка Enter/Space
-            if (event.target instanceof Element &&
-                (event.target === this.#date_calendar_title || event.target.closest("date_year") !== null)) return;
+            if (
+                event.target instanceof Element &&
+                (event.target === this.#date_calendar_title || event.target.closest("date_year") !== null)
+            )
+                return;
             const days = this.#visibleDays();
-            const current = days.findIndex(day => day === document.activeElement);
+            const current = days.findIndex((day) => day === document.activeElement);
             if (event.key === "Escape") {
                 event.preventDefault();
                 this.#closeDropdown();
@@ -103,38 +121,38 @@ class DateInput {
         this.#buildYear(this.#calendar_year);
         this.#showMonth(this.#calendar_month);
         //LISTENERS
-        this.#chui_date_input.addEventListener('click', (event) => {
+        this.#chui_date_input.addEventListener("click", (event) => {
             if (!this.#input.disabled) {
                 if (event.target.parentNode === this.#date_main_block) {
-                    this.#input.focus()
+                    this.#input.focus();
                     this.#openDropdown();
                 }
             }
         });
-        window.addEventListener('click', this.#window_click_event);
+        window.addEventListener("click", this.#window_click_event);
         this.#date_main_block.appendChild(this.#input);
         this.#date_main_block.appendChild(this.#date_dropdown_open);
         this.#date_main_block.appendChild(this.#dropdown);
         this.#chui_date_input.appendChild(this.#date_main_block);
     }
     #buildCalendarHeader() {
-        const header = document.createElement('date_calendar_header');
-        const previous = document.createElement('date_calendar_nav');
+        const header = document.createElement("date_calendar_header");
+        const previous = document.createElement("date_calendar_nav");
         previous.setAttribute("role", "button");
         previous.setAttribute("tabindex", "0");
         previous.setAttribute("aria-label", I18n.t("date.previous"));
         previous.innerHTML = new Icon(Icons.HARDWARE.KEYBOARD_ARROW_LEFT, undefined, "var(--text_color)").getHTML();
-        previous.addEventListener('click', (event) => {
+        previous.addEventListener("click", (event) => {
             event.stopPropagation();
             this.#goBack();
         });
         makeKeyboardButton(previous);
-        const next = document.createElement('date_calendar_nav');
+        const next = document.createElement("date_calendar_nav");
         next.setAttribute("role", "button");
         next.setAttribute("tabindex", "0");
         next.setAttribute("aria-label", I18n.t("date.next"));
         next.innerHTML = new Icon(Icons.HARDWARE.KEYBOARD_ARROW_RIGHT, undefined, "var(--text_color)").getHTML();
-        next.addEventListener('click', (event) => {
+        next.addEventListener("click", (event) => {
             event.stopPropagation();
             this.#goForward();
         });
@@ -230,22 +248,22 @@ class DateInput {
         this.#buildYears();
     }
     #buildYear(year) {
-        this.#date_month_list.innerHTML = '';
+        this.#date_month_list.innerHTML = "";
         for (let i = 0; i < MONTHS_IN_YEAR; i++) {
             const cal = new Calendar(year, i + 1);
-            const date_month_main = document.createElement('date_month_main');
-            date_month_main.setAttribute('month-name', cal.getMonthName());
-            date_month_main.setAttribute('month-index', String(cal.getMonth()));
-            date_month_main.style.width = 'fit-content';
+            const date_month_main = document.createElement("date_month_main");
+            date_month_main.setAttribute("month-name", cal.getMonthName());
+            date_month_main.setAttribute("month-index", String(cal.getMonth()));
+            date_month_main.style.width = "fit-content";
             for (let row of cal.getCalendar()) {
-                const date_week = document.createElement('date_week');
+                const date_week = document.createElement("date_week");
                 let index = 0;
                 for (let cell of row) {
-                    const date_day = document.createElement('date_day');
+                    const date_day = document.createElement("date_day");
                     if (cell !== undefined) {
                         date_day.innerText = cell;
                         if (isDayNumber(cell)) {
-                            date_day.classList = 'date_day';
+                            date_day.classList = "date_day";
                             date_day.setAttribute("tabindex", "-1");
                             date_day.setAttribute("role", "button");
                             date_day.addEventListener("click", () => {
@@ -254,7 +272,7 @@ class DateInput {
                                 // Выбор в календаре — такое же изменение значения, как правка в поле:
                                 // без события слушатели (в том числе составные поля вроде
                                 // DateTimeInput и DateRangeInput) о нём не узнали бы
-                                this.#input.dispatchEvent(new Event("change", {bubbles: true}));
+                                this.#input.dispatchEvent(new Event("change", { bubbles: true }));
                                 this.#closeDropdown();
                             });
                         }
@@ -295,23 +313,27 @@ class DateInput {
     }
     /** Полное удаление: снять слушатели окна */
     destroy() {
-        window.removeEventListener('click', this.#window_click_event);
+        window.removeEventListener("click", this.#window_click_event);
         this.#closeDropdown();
     }
     // Дни текущего видимого месяца (по ним ходят стрелки)
     #visibleDays() {
-        const month = this.#date_month_list.querySelector('date_month_main[month-index="' + this.#calendar_month + '"]');
+        const month = this.#date_month_list.querySelector(
+            'date_month_main[month-index="' + this.#calendar_month + '"]'
+        );
         if (month === null) return [];
-        return [...month.querySelectorAll("date_day")].filter(day => day.classList.contains("date_day"));
+        return [...month.querySelectorAll("date_day")].filter((day) => day.classList.contains("date_day"));
     }
     #showMonth(index) {
         this.#calendar_month = index;
-        const months = this.#date_month_list.querySelectorAll('date_month_main');
+        const months = this.#date_month_list.querySelectorAll("date_month_main");
         for (let month of months) {
-            month.style.display = Number(month.getAttribute('month-index')) === index ? 'block' : 'none';
+            month.style.display = Number(month.getAttribute("month-index")) === index ? "block" : "none";
         }
-        this.#date_calendar_title.innerText = new Date(this.#calendar_year, index)
-            .toLocaleString(I18n.getLocale(), {month: 'long'}).toUpperCase() + ' ' + this.#calendar_year;
+        this.#date_calendar_title.innerText =
+            new Date(this.#calendar_year, index).toLocaleString(I18n.getLocale(), { month: "long" }).toUpperCase() +
+            " " +
+            this.#calendar_year;
     }
     #goToMonth(delta) {
         let month = this.#calendar_month + delta;
@@ -329,30 +351,44 @@ class DateInput {
         }
         this.#showMonth(month);
     }
-    getName() { return this.#input.name; }
-    getTitle() { return this.#label.innerText; }
-    getValue() { return this.#input.value; }
-    setValue(date = String()) { this.#input.value = date; }
+    getName() {
+        return this.#input.name;
+    }
+    getTitle() {
+        return this.#label.innerText;
+    }
+    getValue() {
+        return this.#input.value;
+    }
+    setValue(date = String()) {
+        this.#input.value = date;
+    }
     setDisabled(boolean = Boolean()) {
-        this.#input.disabled = boolean
+        this.#input.disabled = boolean;
         if (boolean) {
-            this.#date_main_block.classList.add("date_main_block_disabled")
-            this.#input.className = "date_input_disabled"
-            this.#label.className = "date_input_label_disabled"
+            this.#date_main_block.classList.add("date_main_block_disabled");
+            this.#input.className = "date_input_disabled";
+            this.#label.className = "date_input_label_disabled";
             this.#date_dropdown_open.remove();
             this.#date_main_block.appendChild(this.#date_dropdown_open_disabled);
         } else {
-            this.#date_main_block.classList.remove("date_main_block_disabled")
-            this.#input.className = "date_input"
-            this.#label.className = "date_input_label"
+            this.#date_main_block.classList.remove("date_main_block_disabled");
+            this.#input.className = "date_input";
+            this.#label.className = "date_input_label";
             this.#date_dropdown_open_disabled.remove();
             this.#date_main_block.appendChild(this.#date_dropdown_open);
         }
     }
-    set() { return this.#chui_date_input; }
+    set() {
+        return this.#chui_date_input;
+    }
 }
 
 const formatLocalDate = (date) =>
-    date.getFullYear() + "-" + String(date.getMonth() + 1).padStart(2, "0") + "-" + String(date.getDate()).padStart(2, "0");
+    date.getFullYear() +
+    "-" +
+    String(date.getMonth() + 1).padStart(2, "0") +
+    "-" +
+    String(date.getDate()).padStart(2, "0");
 
-exports.DateInput = DateInput
+exports.DateInput = DateInput;

package/framework/components/chui_inputs/chui_date/styles.css

@@ -15,13 +15,13 @@ chui_date_input {
 /* Нативные части поля даты: индикатор календаря не нужен (календарь свой, значок — тоже),
    а поля ввода даты собираются в одну строку. Правила только для своего поля: без области
    они прятали бы чужие нативные поля ввода во всём приложении. */
-chui_date_input input[type=date]::-webkit-calendar-picker-indicator {
-    display: none
+chui_date_input input[type="date"]::-webkit-calendar-picker-indicator {
+    display: none;
 }
 
-chui_date_input input[type=date]::-webkit-datetime-edit-text {
+chui_date_input input[type="date"]::-webkit-datetime-edit-text {
     padding: 0;
-    width: 100%
+    width: 100%;
 }
 
 date_select_dropdown {
@@ -137,7 +137,7 @@ date_day {
     width: 20px;
     border-radius: var(--border_radius);
     padding: var(--control_padding);
-    text-align: center
+    text-align: center;
 }
 
 .date_day:hover {
@@ -154,12 +154,13 @@ date_dropdown_open {
     cursor: pointer;
     box-sizing: border-box;
     height: 100%;
-    padding-block: 0 0; padding-inline: 0 10px;
+    padding-block: 0 0;
+    padding-inline: 0 10px;
     margin: 0;
     display: inline-flex;
     justify-content: center;
     align-items: center;
-    color: var(--badge_cancel_text)
+    color: var(--badge_cancel_text);
 }
 
 date_main_block {
@@ -196,8 +197,8 @@ date_main_block {
     width: max-content;
     margin: 0 0 var(--margin);
     font-size: var(--font_labels_size);
-    font-weight:500;
-    color: var(--text_color)
+    font-weight: 500;
+    color: var(--text_color);
 }
 
 /* DISABLED STYLES */
@@ -214,7 +215,7 @@ date_main_block {
     width: max-content;
     margin: 0 0 var(--margin);
     font-size: var(--font_labels_size);
-    font-weight:500
+    font-weight: 500;
 }
 
 .date_input_disabled {
@@ -230,4 +231,4 @@ date_main_block {
     background: transparent;
     border: none;
     font-size: var(--font_default_size);
-}
+}

package/framework/components/chui_inputs/chui_date_range/date_range.js

@@ -1,8 +1,8 @@
-const {setStyles} = require('../../../modules/chui_functions');
-const {DateInput} = require('../chui_date/date');
-const {Icon, Icons} = require('../../chui_icons/icons');
-const {Validate} = require('../../../modules/chui_validate/chui_validate');
-const {I18n} = require('../../../modules/chui_i18n/chui_i18n');
+const { setStyles } = require("../../../modules/chui_functions");
+const { DateInput } = require("../chui_date/date");
+const { Icon, Icons } = require("../../chui_icons/icons");
+const { Validate } = require("../../../modules/chui_validate/chui_validate");
+const { I18n } = require("../../../modules/chui_i18n/chui_i18n");
 
 // Значение пары для правил — «начало..конец»: так его видит `validate()`
 const RANGE_PATTERN = "^[0-9]{4}-[0-9]{2}-[0-9]{2}\\.\\.[0-9]{4}-[0-9]{2}-[0-9]{2}$";
@@ -54,19 +54,21 @@ class DateRangeInput {
     #listeners = [];
     #on_change = undefined;
 
-    constructor(options = {
-        id: String(),
-        name: String(),
-        title: String(),
-        label: String(),
-        startTitle: String(),
-        endTitle: String(),
-        separator: undefined,
-        value: undefined,
-        disabled: Boolean(),
-        changeListener: undefined,
-        onChange: undefined
-    }) {
+    constructor(
+        options = {
+            id: String(),
+            name: String(),
+            title: String(),
+            label: String(),
+            startTitle: String(),
+            endTitle: String(),
+            separator: undefined,
+            value: undefined,
+            disabled: Boolean(),
+            changeListener: undefined,
+            onChange: undefined,
+        }
+    ) {
         setStyles(__dirname + "/styles.css", "chUiJS_DateRangeInput");
         DateRangeInput.#counter += 1;
         this.#id = options.id === undefined ? `chui_date_range_input_${DateRangeInput.#counter}` : options.id;
@@ -74,15 +76,20 @@ class DateRangeInput {
         this.#label_text = options.label;
         this.#on_change = options.onChange;
         if (options.changeListener !== undefined) this.addChangeListener(options.changeListener);
-        if (options.messages !== undefined && options.messages.validate !== undefined) this.#ordering_message = String(options.messages.validate);
+        if (options.messages !== undefined && options.messages.validate !== undefined)
+            this.#ordering_message = String(options.messages.validate);
         // Общий текст берётся из словаря: своё сообщение поля важнее перевода
         if (this.#ordering_message === undefined) this.#ordering_message = I18n.t("dateRange.wrongOrder");
         this.#root.id = this.#id;
         this.#label.className = "date_range_label";
         this.#row.className = "date_range_row";
         this.#row.setAttribute("role", "group");
-        this.#start = new DateInput({title: options.startTitle === undefined ? I18n.t("dateRange.start") : options.startTitle});
-        this.#end = new DateInput({title: options.endTitle === undefined ? I18n.t("dateRange.end") : options.endTitle});
+        this.#start = new DateInput({
+            title: options.startTitle === undefined ? I18n.t("dateRange.start") : options.startTitle,
+        });
+        this.#end = new DateInput({
+            title: options.endTitle === undefined ? I18n.t("dateRange.end") : options.endTitle,
+        });
         this.#separator.className = "date_range_separator";
         this.#separator.setAttribute("aria-hidden", "true");
         const glyph = new Icon(options.separator === undefined ? Icons.NAVIGATION.EAST : options.separator).set();
@@ -102,9 +109,13 @@ class DateRangeInput {
         this.#root.appendChild(this.#label);
         this.#root.appendChild(this.#row);
         this.#root.appendChild(this.#status);
-        this.setLabel(options.label === undefined
-            ? (options.title === undefined ? I18n.t("dateRange.label") : options.title)
-            : options.label);
+        this.setLabel(
+            options.label === undefined
+                ? options.title === undefined
+                    ? I18n.t("dateRange.label")
+                    : options.title
+                : options.label
+        );
         const rules = Validate.rulesFrom(options);
         // У поля даты min/max — это не границы Validate, а порядок пары
         delete rules.min;
@@ -144,7 +155,7 @@ class DateRangeInput {
 
     /** Период: строки «ГГГГ-ММ-ДД», пустая строка — дата не выбрана */
     getValue() {
-        return {start: this.#start.getValue(), end: this.#end.getValue()};
+        return { start: this.#start.getValue(), end: this.#end.getValue() };
     }
 
     getStart() {
@@ -161,8 +172,8 @@ class DateRangeInput {
         const start = DateRangeInput.#display(value.start);
         const end = DateRangeInput.#display(value.end);
         if (start === "" && end === "") return I18n.t("dateRange.empty");
-        if (start === "") return I18n.t("dateRange.to", {end: end});
-        if (end === "") return I18n.t("dateRange.from", {start: start});
+        if (start === "") return I18n.t("dateRange.to", { end: end });
+        if (end === "") return I18n.t("dateRange.from", { start: start });
         return `${start} — ${end}`;
     }
 
@@ -215,7 +226,7 @@ class DateRangeInput {
             this.#syncLimits();
             return this;
         }
-        const pair = Array.isArray(value) ? {start: value[0], end: value[1]} : value;
+        const pair = Array.isArray(value) ? { start: value[0], end: value[1] } : value;
         const start = DateRangeInput.#parseDate(pair.start);
         const end = DateRangeInput.#parseDate(pair.end);
         if (start === undefined || end === undefined) {
@@ -319,4 +330,4 @@ class DateRangeInput {
     }
 }
 
-exports.DateRangeInput = DateRangeInput
+exports.DateRangeInput = DateRangeInput;

package/framework/components/chui_inputs/chui_datetime/datetime.js

@@ -1,8 +1,8 @@
-const {setStyles} = require('../../../modules/chui_functions');
-const {DateInput} = require('../chui_date/date');
-const {TimeInput} = require('../chui_time/time');
-const {Validate} = require('../../../modules/chui_validate/chui_validate');
-const {I18n} = require('../../../modules/chui_i18n/chui_i18n');
+const { setStyles } = require("../../../modules/chui_functions");
+const { DateInput } = require("../chui_date/date");
+const { TimeInput } = require("../chui_time/time");
+const { Validate } = require("../../../modules/chui_validate/chui_validate");
+const { I18n } = require("../../../modules/chui_i18n/chui_i18n");
 
 // Значение поля — «ГГГГ-ММ-ДДTЧЧ:ММ»: тот же вид, что у нативного datetime-local,
 // и такой же однозначный для сравнений (ширина всех частей постоянная)
@@ -51,21 +51,23 @@ class DateTimeInput {
     #listeners = [];
     #on_change = undefined;
 
-    constructor(options = {
-        id: String(),
-        name: String(),
-        title: String(),
-        label: String(),
-        dateTitle: String(),
-        timeTitle: String(),
-        value: undefined,
-        step: Number(),
-        min: String(),
-        max: String(),
-        disabled: Boolean(),
-        changeListener: undefined,
-        onChange: undefined
-    }) {
+    constructor(
+        options = {
+            id: String(),
+            name: String(),
+            title: String(),
+            label: String(),
+            dateTitle: String(),
+            timeTitle: String(),
+            value: undefined,
+            step: Number(),
+            min: String(),
+            max: String(),
+            disabled: Boolean(),
+            changeListener: undefined,
+            onChange: undefined,
+        }
+    ) {
         setStyles(__dirname + "/styles.css", "chUiJS_DateTimeInput");
         DateTimeInput.#counter += 1;
         this.#id = options.id === undefined ? `chui_datetime_input_${DateTimeInput.#counter}` : options.id;
@@ -80,7 +82,9 @@ class DateTimeInput {
         this.#row.className = "datetime_row";
         // Группа: у пары полей должно быть общее имя, иначе они читаются как два отдельных поля
         this.#row.setAttribute("role", "group");
-        this.#date = new DateInput({title: options.dateTitle === undefined ? I18n.t("date.label") : options.dateTitle});
+        this.#date = new DateInput({
+            title: options.dateTitle === undefined ? I18n.t("date.label") : options.dateTitle,
+        });
         this.#time = new TimeInput({
             title: options.timeTitle === undefined ? I18n.t("time.label") : options.timeTitle,
             step: options.step,
@@ -93,9 +97,13 @@ class DateTimeInput {
         else this.#label.hidden = true;
         this.#root.appendChild(this.#label);
         this.#root.appendChild(this.#row);
-        this.setLabel(options.label === undefined
-            ? (options.title === undefined ? I18n.t("dateTime.label") : options.title)
-            : options.label);
+        this.setLabel(
+            options.label === undefined
+                ? options.title === undefined
+                    ? I18n.t("dateTime.label")
+                    : options.title
+                : options.label
+        );
         // `min`/`max` как числа здесь не работают: у поля времени это окно, а не границы Validate
         const rules = Validate.rulesFrom(options);
         delete rules.min;
@@ -106,8 +114,8 @@ class DateTimeInput {
             const custom = own_validate === undefined ? undefined : own_validate(value);
             if (custom !== undefined && custom !== null && custom !== true) return custom;
             const moment = String(value);
-            if (this.#min !== undefined && moment < this.#min) return I18n.t("dateTime.min", {min: this.#min});
-            if (this.#max !== undefined && moment > this.#max) return I18n.t("dateTime.max", {max: this.#max});
+            if (this.#min !== undefined && moment < this.#min) return I18n.t("dateTime.min", { min: this.#min });
+            if (this.#max !== undefined && moment > this.#max) return I18n.t("dateTime.max", { max: this.#max });
             return undefined;
         };
         Validate.installField(this, rules, this.#root, undefined, () => this.#rawValue(), this.#row);
@@ -292,4 +300,4 @@ class DateTimeInput {
     }
 }
 
-exports.DateTimeInput = DateTimeInput
+exports.DateTimeInput = DateTimeInput;