vgapp 1.5.7 → 1.5.8

package/app/modules/vgfiles/readme.md

@@ -1,123 +1,123 @@
-# VGFiles
-
-`VGFiles` — модуль загрузки и управления файлами с поддержкой локального режима и AJAX.
-
-## Новые фичи
-
-- Поддержка `replace` для single-mode (`limits.count = 1`): новый файл заменяет предыдущий без накопления.
-- Переименование входящих файлов через `rename: true | (file, index) => string`.
-- `smartdrop`: глобальная подсветка dropzone, если на экране только одна видимая зона дропа.
-- Расширенный lifecycle для внешних файлов из `data-file`: парсинг `customData`, `src/image`, бинарных метаданных.
-- Интеграция с `VGFilePreview` в info-списке (`ui.nameOnly: true`) для inline-аудио, скачивания и предпросмотра по клику.
-- Авто-обогащение аудиофайлов метаданными (title/cover) через `extractAudioMetadata`.
-- Гибкие confirm-хуки для удаления (`removes.single.confirm`, `removes.all.confirm`) с контрактом `accepted/data`.
-- Повторная загрузка упавших файлов через `data-vg-reload="file"` и кнопки retry.
-- Проброс `customData` файла в `data-*` атрибуты элементов списка.
-
-## Базовые возможности
-
-- Выбор файлов через `<input type="file">` и drag&drop.
-- Лимиты: количество, размер файла, общий размер, MIME-типы.
-- Режимы загрузки: `sequential` и `parallel`.
-- Автоматическая/ручная инициализация.
-- Сортировка загруженных файлов с сохранением порядка на сервере.
-- Удаление одного файла и очистка всего списка.
-
-## Инициализация
-
-```js
-const files = new VGFiles(document.querySelector('.vg-files'), {
-  ajax: true,
-  smartdrop: true,
-  rename: true,
-  replace: true,
-  uploads: {
-    route: '/api/upload',
-    mode: 'sequential'
-  },
-  limits: {
-    count: 10,
-    sizes: 5,
-    total: 50
-  }
-});
-```
-
-## Ключевые параметры
-
-- `allowed` — разрешить drag-drop режим и особенности drop-зоны.
-- `ajax` — включить серверную загрузку.
-- `replace` (`default: true`) — замена файла в single-mode.
-- `rename` (`default: false`) — переименование файлов до добавления в список.
-- `smartdrop` (`default: false`) — глобальная логика подсказки drop-зоны.
-- `prepend` (`default: true`) — добавление новых файлов в начало.
-- `uploads.mode` — `'sequential' | 'parallel'`.
-- `uploads.maxParallel`, `uploads.maxConcurrent`, `uploads.retryAttempts`, `uploads.retryDelay`.
-- `removes.single.confirm`, `removes.all.confirm` — кастомные confirm-обработчики.
-- `sortable.enabled`, `sortable.route`, `sortable.handle`, `sortable.lists`.
-
-## Внешние (уже загруженные) файлы
-
-Модуль может стартовать с предзаполненным списком через `data-file` в `<li>`.
-
-Поддерживаемые поля объекта:
-
-- `id`, `name`, `size`, `type`, `src` (обязательный набор для валидного внешнего файла)
-- `image` (опционально)
-- `lastModified` / `last-modified` (опционально)
-- любые дополнительные поля -> попадают в `customData`
-
-`customData` дальше пробрасывается в `data-*` атрибуты элементов файла и может использоваться в шаблонах/интеграциях.
-
-## AJAX-события и callbacks
-
-DOM-события:
-
-- `vg.files.change`
-- `vg.files.upload.start`
-- `vg.files.upload.progress`
-- `vg.files.upload.complete`
-- `vg.files.upload.error`
-- `vg.files.upload.allComplete`
-- `vg.files.remove`
-- `vg.files.reload`
-
-Callbacks (`params.callbacks`):
-
-- `onInit`
-- `onChange` (`{ files, input, inputFiles }`)
-- `onUploadStart`
-- `onUploadProgress`
-- `onUploadComplete`
-- `onUploadError`
-- `onUploadAllComplete`
-- `onRemoveFile`
-- `onClear`
-- `onReload`
-
-## Удаление с кастомным confirm
-
-Если передан `removes.single.confirm` или `removes.all.confirm`, модуль вызывает вашу функцию вместо стандартного `VGAlert`.
-
-Контракт результата:
-
-- `true` или `{ accepted: true }` — подтвердить.
-- `false` или `{ accepted: false }` — отменить.
-- `{ accepted: true, data }` — подтвердить и использовать готовый ответ удаления (без дополнительного AJAX-запроса).
-
-## Статусы файлов
-
-- `pending` — ожидает загрузки.
-- `loading` — идет загрузка.
-- `completed` — успешно загружен.
-- `failing` — ошибка загрузки (доступен reload).
-
-## Методы API
-
-- `upload(file)`
-- `uploadAll(files)`
-- `reload(button)`
-- `removeFile(button)`
-- `clear(resetInput, uiOnly)`
-- `dispose()`
-
+# VGFiles
+
+`VGFiles` — модуль загрузки и управления файлами с поддержкой локального режима и AJAX.
+
+## Новые фичи
+
+- Поддержка `replace` для single-mode (`limits.count = 1`): новый файл заменяет предыдущий без накопления.
+- Переименование входящих файлов через `rename: true | (file, index) => string`.
+- `smartdrop`: глобальная подсветка dropzone, если на экране только одна видимая зона дропа.
+- Расширенный lifecycle для внешних файлов из `data-file`: парсинг `customData`, `src/image`, бинарных метаданных.
+- Интеграция с `VGFilePreview` в info-списке (`ui.nameOnly: true`) для inline-аудио, скачивания и предпросмотра по клику.
+- Авто-обогащение аудиофайлов метаданными (title/cover) через `extractAudioMetadata`.
+- Гибкие confirm-хуки для удаления (`removes.single.confirm`, `removes.all.confirm`) с контрактом `accepted/data`.
+- Повторная загрузка упавших файлов через `data-vg-reload="file"` и кнопки retry.
+- Проброс `customData` файла в `data-*` атрибуты элементов списка.
+
+## Базовые возможности
+
+- Выбор файлов через `<input type="file">` и drag&drop.
+- Лимиты: количество, размер файла, общий размер, MIME-типы.
+- Режимы загрузки: `sequential` и `parallel`.
+- Автоматическая/ручная инициализация.
+- Сортировка загруженных файлов с сохранением порядка на сервере.
+- Удаление одного файла и очистка всего списка.
+
+## Инициализация
+
+```js
+const files = new VGFiles(document.querySelector('.vg-files'), {
+  ajax: true,
+  smartdrop: true,
+  rename: true,
+  replace: true,
+  uploads: {
+    route: '/api/upload',
+    mode: 'sequential'
+  },
+  limits: {
+    count: 10,
+    sizes: 5,
+    total: 50
+  }
+});
+```
+
+## Ключевые параметры
+
+- `allowed` — разрешить drag-drop режим и особенности drop-зоны.
+- `ajax` — включить серверную загрузку.
+- `replace` (`default: true`) — замена файла в single-mode.
+- `rename` (`default: false`) — переименование файлов до добавления в список.
+- `smartdrop` (`default: false`) — глобальная логика подсказки drop-зоны.
+- `prepend` (`default: true`) — добавление новых файлов в начало.
+- `uploads.mode` — `'sequential' | 'parallel'`.
+- `uploads.maxParallel`, `uploads.maxConcurrent`, `uploads.retryAttempts`, `uploads.retryDelay`.
+- `removes.single.confirm`, `removes.all.confirm` — кастомные confirm-обработчики.
+- `sortable.enabled`, `sortable.route`, `sortable.handle`, `sortable.lists`.
+
+## Внешние (уже загруженные) файлы
+
+Модуль может стартовать с предзаполненным списком через `data-file` в `<li>`.
+
+Поддерживаемые поля объекта:
+
+- `id`, `name`, `size`, `type`, `src` (обязательный набор для валидного внешнего файла)
+- `image` (опционально)
+- `lastModified` / `last-modified` (опционально)
+- любые дополнительные поля -> попадают в `customData`
+
+`customData` дальше пробрасывается в `data-*` атрибуты элементов файла и может использоваться в шаблонах/интеграциях.
+
+## AJAX-события и callbacks
+
+DOM-события:
+
+- `vg.files.change`
+- `vg.files.upload.start`
+- `vg.files.upload.progress`
+- `vg.files.upload.complete`
+- `vg.files.upload.error`
+- `vg.files.upload.allComplete`
+- `vg.files.remove`
+- `vg.files.reload`
+
+Callbacks (`params.callbacks`):
+
+- `onInit`
+- `onChange` (`{ files, input, inputFiles }`)
+- `onUploadStart`
+- `onUploadProgress`
+- `onUploadComplete`
+- `onUploadError`
+- `onUploadAllComplete`
+- `onRemoveFile`
+- `onClear`
+- `onReload`
+
+## Удаление с кастомным confirm
+
+Если передан `removes.single.confirm` или `removes.all.confirm`, модуль вызывает вашу функцию вместо стандартного `VGAlert`.
+
+Контракт результата:
+
+- `true` или `{ accepted: true }` — подтвердить.
+- `false` или `{ accepted: false }` — отменить.
+- `{ accepted: true, data }` — подтвердить и использовать готовый ответ удаления (без дополнительного AJAX-запроса).
+
+## Статусы файлов
+
+- `pending` — ожидает загрузки.
+- `loading` — идет загрузка.
+- `completed` — успешно загружен.
+- `failing` — ошибка загрузки (доступен reload).
+
+## Методы API
+
+- `upload(file)`
+- `uploadAll(files)`
+- `reload(button)`
+- `removeFile(button)`
+- `clear(resetInput, uiOnly)`
+- `dispose()`
+

package/app/modules/vgfiles/scss/_mixins.scss

@@ -23,19 +23,19 @@
 	}
 }
 
-@mixin vgfiles-state() {
-	&.hide-custom-buttons-on-upload-state {
-		&.pending,
-		&.loading,
-		&.failing {
-			.file-actions,
-			.file-custom > :not(.file-remove):not(.file-info) {
-				display: none;
-			}
-		}
-	}
-
-	&.pending {
+@mixin vgfiles-state() {
+	&.hide-custom-buttons-on-upload-state {
+		&.pending,
+		&.loading,
+		&.failing {
+			.file-actions,
+			.file-custom > :not(.file-remove):not(.file-info) {
+				display: none;
+			}
+		}
+	}
+
+	&.pending {
 		> * {
 			opacity: .32;
 			pointer-events: none;

package/app/modules/vgfiles/scss/_variables.scss

@@ -9,16 +9,16 @@ $files-map: (
 	label-padding: 8px 24px,
 	label-padding-icon: 8px 16px,
 
-	// errors
-	errors-padding-y: 10px,
-	errors-padding-x: 12px,
-	errors-font-size: 16px,
-	errors-gap: 4px,
-	errors-margin-bottom: 8px,
-	errors-bg: var(--vg-danger-subtle-bg, rgba(255, 42, 44, .06)),
-	errors-border-color: var(--vg-danger-color, var(--vg-danger, #ff2a2c)),
-	errors-border-width: 3px,
-	errors-border-radius: 6px,
+	// errors
+	errors-padding-y: 10px,
+	errors-padding-x: 12px,
+	errors-font-size: 16px,
+	errors-gap: 4px,
+	errors-margin-bottom: 8px,
+	errors-bg: var(--vg-danger-subtle-bg, rgba(255, 42, 44, .06)),
+	errors-border-color: var(--vg-danger-color, var(--vg-danger, #ff2a2c)),
+	errors-border-width: 3px,
+	errors-border-radius: 6px,
 
 	// drop zone
 	drop-bg: var(--vg-secondary-bg, #{vg.$surface-muted-bg}),

package/app/modules/vgfiles/scss/vgfiles.scss

@@ -61,18 +61,18 @@
 		}
 	}
 
-	&-errors {
-		display: grid;
-		gap: var(--vg-files-errors-gap);
-		padding: var(--vg-files-errors-padding-y) var(--vg-files-errors-padding-x);
-		margin-bottom: var(--vg-files-errors-margin-bottom);
-		border-left: var(--vg-files-errors-border-width) solid var(--vg-files-errors-border-color);
-		border-radius: var(--vg-files-errors-border-radius);
-		background: var(--vg-files-errors-bg);
-
-		span {
-			font-size: var(--vg-files-errors-font-size);
-			color: var(--vg-danger-color, var(--vg-danger, #ff2a2c));
+	&-errors {
+		display: grid;
+		gap: var(--vg-files-errors-gap);
+		padding: var(--vg-files-errors-padding-y) var(--vg-files-errors-padding-x);
+		margin-bottom: var(--vg-files-errors-margin-bottom);
+		border-left: var(--vg-files-errors-border-width) solid var(--vg-files-errors-border-color);
+		border-radius: var(--vg-files-errors-border-radius);
+		background: var(--vg-files-errors-bg);
+
+		span {
+			font-size: var(--vg-files-errors-font-size);
+			color: var(--vg-danger-color, var(--vg-danger, #ff2a2c));
 			display: block;
 			overflow: hidden;
 			text-overflow: ellipsis;
@@ -523,18 +523,18 @@
 		}
 	}
 
-	.file-failing-actions {
+	.file-failing-actions {
 		display: inline-flex;
 		align-items: center;
 		gap: var(--vg-files-info-failing-actions-gap);
-	}
-
-	&-info--list {
-		.file.validation-error {
-			box-shadow: inset 0 0 0 2px var(--vg-danger-color, var(--vg-danger, #ff2a2c));
-		}
-
-		.file.failing {
+	}
+
+	&-info--list {
+		.file.validation-error {
+			box-shadow: inset 0 0 0 2px var(--vg-danger-color, var(--vg-danger, #ff2a2c));
+		}
+
+		.file.failing {
 			.file-remove {
 				margin-left: var(--vg-files-info-failing-actions-margin-start);
 			}
@@ -644,7 +644,7 @@
 			}
 		}
 
-		&--list {
+		&--list {
 			display: flex;
 			align-items: center;
 			gap: var(--vg-files-drop-list-gap);
@@ -656,7 +656,7 @@
 			border-radius: var(--vg-files-drop-radius);
 			overflow: hidden;
 
-			.file {
+			.file {
 				--vg-button-color: var(--vg-text-color, var(--vg-body-color, #000000));
 				border-radius: var(--vg-files-drop-file-radius);
 				position: relative;
@@ -665,11 +665,11 @@
 				height: var(--vg-files-drop-file-height);
 
 				@include files.vgfiles-sortable();
-				@include files.vgfiles-state();
-
-				&.validation-error {
-					box-shadow: inset 0 0 0 2px var(--vg-danger-color, var(--vg-danger, #ff2a2c));
-				}
+				@include files.vgfiles-state();
+
+				&.validation-error {
+					box-shadow: inset 0 0 0 2px var(--vg-danger-color, var(--vg-danger, #ff2a2c));
+				}
 
 				.file-image {
 					width: 100%;

package/app/modules/vgformsender/js/hideshowpass.js

@@ -12,18 +12,18 @@ const NAME = 'hideshowpass';
 const NAME_KEY = 'vg.hideshowpass';
 const SELECTOR_DATA_TOGGLE= '[data-vg-toggle="pass"]';
 
-const CLASS_NAME_SHOW = 'show';
-const CLASS_NAME_FOCUS_OFFSET = 'vg-form-sender--content-pass-focus-offset';
+const CLASS_NAME_SHOW = 'show';
+const CLASS_NAME_FOCUS_OFFSET = 'vg-form-sender--content-pass-focus-offset';
 
 const EVENT_KEY_CLICK_DATA_API = `click.${NAME_KEY}.data.api`;
 
 class VGHideShowPass extends BaseModule{
-	constructor(el, params = {}) {
-		super(el, params);
-
-		this._params = this._getParams(el, mergeDeepObject({
-			parentClass: 'vg-form-sender--content-pass'
-		}, params));
+	constructor(el, params = {}) {
+		super(el, params);
+
+		this._params = this._getParams(el, mergeDeepObject({
+			parentClass: 'vg-form-sender--content-pass'
+		}, params));
 	}
 
 	static get NAME() {
@@ -63,19 +63,19 @@ class VGHideShowPass extends BaseModule{
 		instance.build(false);
 	}
 
-	build(isShow = false) {
-		let classes = this._params.classes.join(' '), elm = '';
-		const HTML = Html('string');
-		if (this._element.parentElement && this._params.parentClass) {
-			this._element.parentElement.classList.add(this._params.parentClass);
-			this._element.parentElement.classList.toggle(
-				CLASS_NAME_FOCUS_OFFSET,
-				this._params.focus === true
-			);
-		}
-
-		if (!isShow) {
-			elm = HTML.component('eye', {class: classes});
+	build(isShow = false) {
+		let classes = this._params.classes.join(' '), elm = '';
+		const HTML = Html('string');
+		if (this._element.parentElement && this._params.parentClass) {
+			this._element.parentElement.classList.add(this._params.parentClass);
+			this._element.parentElement.classList.toggle(
+				CLASS_NAME_FOCUS_OFFSET,
+				this._params.focus === true
+			);
+		}
+
+		if (!isShow) {
+			elm = HTML.component('eye', {class: classes});
 		} else {
 			elm = HTML.component('eye', {class: classes, type: 'hide'});
 		}
@@ -105,4 +105,4 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, functi
 	instance.toggle(this);
 });
 
-export default VGHideShowPass
+export default VGHideShowPass

package/app/modules/vgformsender/readme.md

@@ -78,7 +78,7 @@ VGFormSender.init(document.getElementById('contactForm'), {
 | `response.enabled`        | `boolean`               | `false`                            | Нативная обработка ответа (без AJAX)                                 |
 | `submit`                  | `boolean`               | `false`                            | Отправлять нативно (без AJAX)                                        |
 | `fields`                  | `Array`                 | `[]`                               | Доп. данные для отправки                                             |
-| `pass.focus`              | `boolean`               | `false`                            | Увеличивать правый отступ поля и сдвигать иконку глаза при фокусе     |
+| `pass.focus`              | `boolean`               | `false`                            | Увеличивать правый отступ поля и сдвигать иконку глаза при фокусе     |
 | `alert.enabled`           | `boolean`               | `true`                             | Показывать уведомления                                               |
 | `alert.type`              | `'modal' \| 'collapse'` | `'modal'`                          | Тип уведомления                                                      |
 | `alert.errors`            | `boolean`               | `true`                             | Показывать детали ошибок                                             |

package/app/modules/vgformsender/scss/_variables.scss

@@ -1,5 +1,5 @@
-@use "../../../utils/scss" as vg;
-
-$form-sender-map: (
-		'eye-color': var(--vg-text-color, #{vg.$color})
-) !default;
+@use "../../../utils/scss" as vg;
+
+$form-sender-map: (
+		'eye-color': var(--vg-text-color, #{vg.$color})
+) !default;

package/app/modules/vgformsender/scss/vgformsender.scss

@@ -6,12 +6,12 @@
 *--------------------------------------------------------------------------
 **/
 
-@forward "variables";
-@use "../../../utils/scss" as vg;
-@use "variables" as vars;
+@forward "variables";
+@use "../../../utils/scss" as vg;
+@use "variables" as vars;
 
 .vg-form-sender {
-	@include vg.mix-vars('form-sender', vars.$form-sender-map);
+	@include vg.mix-vars('form-sender', vars.$form-sender-map);
 
 	&-modal {
 		.vg-modal-content {
@@ -19,21 +19,21 @@
 		}
 	}
 
-	&--content {
-		position: relative;
-
-		&-pass-focus-offset {
-			&:focus-within {
-				input {
-					padding-right: 5rem;
-				}
-
-				.vg-form-sender--hide-show-pass {
-					right: 44px;
-				}
-			}
-		}
-	}
+	&--content {
+		position: relative;
+
+		&-pass-focus-offset {
+			&:focus-within {
+				input {
+					padding-right: 5rem;
+				}
+
+				.vg-form-sender--hide-show-pass {
+					right: 44px;
+				}
+			}
+		}
+	}
 
 	&--hide-show-pass {
 		position: absolute;
@@ -42,7 +42,7 @@
 		width: 22px;
 		height: 22px;
 		cursor: pointer;
-		transition: vg.$transition-base;
+		transition: vg.$transition-base;
 
 		svg {
 			path {
@@ -51,35 +51,35 @@
 		}
 	}
 
-	&.was-validated {
-		.vg-form-sender--hide-show-pass {
-			right: 34px;
-		}
-
-		.vg-form-sender--content-pass-focus-offset {
-			&:focus-within {
-				input {
-					padding-right: 6.25rem;
-				}
-
-				.vg-form-sender--hide-show-pass {
-					right: 64px;
-				}
-			}
-		}
-	}
-}
+	&.was-validated {
+		.vg-form-sender--hide-show-pass {
+			right: 34px;
+		}
+
+		.vg-form-sender--content-pass-focus-offset {
+			&:focus-within {
+				input {
+					padding-right: 6.25rem;
+				}
+
+				.vg-form-sender--hide-show-pass {
+					right: 64px;
+				}
+			}
+		}
+	}
+}
 
 .vg-form-sender-alert {
-	@include vg.mix-alert-color-mode($class: vg-form-sender-alert);
+	@include vg.mix-alert-color-mode($class: vg-form-sender-alert);
 	background-color: var(--vg-form-sender-alert-background-color);
 	border: 1px solid var(--vg-form-sender-alert-border-color) ;
-	border-radius: var(--vg-border-radius, #{vg.$border-radius});
+	border-radius: var(--vg-border-radius, #{vg.$border-radius});
 
 	.vg-btn-close {
 		svg {
 			path {
-				fill: var(--vg-form-sender-alert-close);
+				fill: var(--vg-form-sender-alert-close);
 			}
 		}
 	}
@@ -125,4 +125,4 @@
 .vg-form-sender-alert-content--text {
 	font-size: 1.25rem;
 	color: var(--vg-form-sender-alert-color);
-}
+}

package/app/modules/vglawcookie/js/vglawcookie.js

@@ -146,15 +146,15 @@ class VGLawCookie extends BaseModule {
 	}
 
 	/**
-	 * Сбрасывает согласие, не затрагивая остальные данные хранилища
-	 */
-	static reset() {
-		const { name } = VGLawCookie.getDefaultParams().cookie;
-
-		Cookies.remove(name);
-		localStorage.removeItem(name);
-		location.reload();
-	}
+	 * Сбрасывает согласие, не затрагивая остальные данные хранилища
+	 */
+	static reset() {
+		const { name } = VGLawCookie.getDefaultParams().cookie;
+
+		Cookies.remove(name);
+		localStorage.removeItem(name);
+		location.reload();
+	}
 
 	/**
 	 * Возвращает дефолтные параметры (для доступа без инстанса)
@@ -165,13 +165,13 @@ class VGLawCookie extends BaseModule {
 		}, {});
 	}
 
-	dispose() {
-		const { name } = this._params.cookie;
-
-		Cookies.remove(name);
-		localStorage.removeItem(name);
-		super.dispose();
-	}
+	dispose() {
+		const { name } = this._params.cookie;
+
+		Cookies.remove(name);
+		localStorage.removeItem(name);
+		super.dispose();
+	}
 
 	/**
 	 * Инициализация модуля
@@ -216,7 +216,7 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE_CLEAR,
 
 	const instance = VGLawCookie.getOrCreateInstance(element);
 	instance.dispose();
-	VGLawCookie.reset(); // Сброс согласия
-});
+	VGLawCookie.reset(); // Сброс согласия
+});
 
-export default VGLawCookie;
+export default VGLawCookie;