vgapp 1.1.6 → 1.1.8

package/CHANGELOG.md

@@ -1,5 +1,14 @@
-# VEGAS-APP 1.1.6 (Апрель, 10, 2026)
-## Новые фичи
+# VEGAS-APP 1.1.7 (Апрель, 13, 2026)
+## Новые фичи
+* В VGFilePreview добавлена поддержка атрибута `data-name` для явной установки отображаемого имени файла (в приоритете над `data-vg-filepreview-display-name`).
+
+## Изменения
+* Обновлена версия пакета в `package.json`: `1.1.6` -> `1.1.7`.
+
+---
+
+# VEGAS-APP 1.1.6 (Апрель, 10, 2026)
+## Новые фичи
 * **VGToast**: добавлены встроенные модули VGToastDrag и VGToastResize с поддержкой параметров drag/resize (enable, threshold, edgeSize, minWidth/minHeight, debug).
 
 ## Изменения

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

@@ -621,7 +621,7 @@ class VGFormSender extends BaseModule {
 				response = data.response.view
 			} else if (typeof response !== 'string') {
 				if (status === 'danger') {
-					response.title = lang_titles(this._params.lang, 'errors').title;
+					response.title = ('title' in response) ? response.title : lang_titles(this._params.lang, 'errors').title;
 
 					if ('code' in data && data.code !== 200) {
 						const messages = {

package/app/modules/vgrollup/js/vgrollup.js

@@ -73,7 +73,7 @@ class VGRollup extends BaseModule {
 	constructor(element, params = {}) {
 		super(element, params);
 
-		this._params = this._getParams(element, mergeDeepObject({
+		const defaultParams = {
 			lang: document.documentElement.lang || 'ru',
 			content: 'text',
 			cnt: 0,
@@ -87,8 +87,8 @@ class VGRollup extends BaseModule {
 			more: ' еще ',
 			button: {
 				enabled: true,
-				more: "Показать",
-				less: "Свернуть",
+				more: 'Показать',
+				less: 'Свернуть',
 				classes: ''
 			},
 			callbacks: {
@@ -96,7 +96,17 @@ class VGRollup extends BaseModule {
 				expand: () => {},
 				collapse: () => {}
 			}
-		}, params));
+		};
+
+		let lang = Manipulator.get(element, 'data-lang') || ('lang' in params) ? params.lang : defaultParams.lang;
+
+		// Локализация текстов кнопок
+		defaultParams.button.more = lang_buttons(lang, NAME)['show'];
+		defaultParams.button.less = lang_buttons(lang, NAME)['less'];
+		defaultParams.more        = lang_buttons(lang, NAME)['more'];
+
+
+		this._params = this._getParams(element, mergeDeepObject(defaultParams, params));
 
 		/**
 		 * CSS-классы, используемые модулем.
@@ -141,11 +151,6 @@ class VGRollup extends BaseModule {
 		 */
 		this.isOffset = false;
 
-		// Локализация текстов кнопок
-		this._params.button.more = lang_buttons(this._params.lang, NAME)['show'];
-		this._params.button.less = lang_buttons(this._params.lang, NAME)['less'];
-		this._params.more = lang_buttons(this._params.lang, NAME)['more'];
-
 		this.build();
 	}
 

package/app/modules/vgtoast/js/vgtoast.js

@@ -1,4 +1,4 @@
-import BaseModule from "../../base-module";
+import BaseModule from "../../base-module";
 import EventHandler from "../../../utils/js/dom/event";
 import {dismissTrigger} from "../../module-fn";
 import {execute, isDisabled, makeRandomString, mergeDeepObject} from "../../../utils/js/functions";
@@ -7,36 +7,45 @@ import VGToastDrag from "./vgtoast.drag";
 import VGToastResize from "./vgtoast.resize";
 
 /**
- * @constant {string} NAME - Имя модуля.
+ * @constant {string} NAME - Имя модуля.
  */
 const NAME = 'toast';
 
 /**
- * @constant {string} NAME_KEY - Пространство имён для событий.
+ * @constant {string} NAME_KEY - Пространство имён для событий.
  */
 const NAME_KEY = 'vg.toast';
 
 /**
- * @constant {string} SELECTOR_DATA_TOGGLE - Селектор для активации через data-атрибут.
+ * @constant {string} SELECTOR_DATA_TOGGLE - Селектор для активации через data-атрибут.
  */
 const SELECTOR_DATA_TOGGLE = '[data-vg-toggle="toast"]';
 
 /**
- * @constant {string} CLASS_NAME_OPEN - Класс, добавляемый к body при открытии любого тоста.
+ * @constant {string} CLASS_NAME_OPEN - Класс, добавляемый к body при открытии любого тоста.
  */
 const CLASS_NAME_OPEN = 'vg-toast-open';
 
 /**
- * @constant {string} CLASS_NAME_SHOW - Класс, показывающий, что тост видим.
+ * @constant {string} CLASS_NAME_SHOW - Класс, показывающий, что тост видим.
  */
 const CLASS_NAME_SHOW = 'show';
 
 /**
- * @constant {string} CLASS_NAME_SHOWN - Класс, добавляемый после завершения анимации появления.
+ * @constant {string} CLASS_NAME_SHOWN - Класс, добавляемый после завершения анимации появления.
  */
 const CLASS_NAME_SHOWN = 'shown';
+const EFFECT_CLASS_PREFIX = 'vg-toast-effect-';
+const EFFECT_PRESET_MAP = {
+	none: '',
+	fade: `${EFFECT_CLASS_PREFIX}fade`,
+	zoom: `${EFFECT_CLASS_PREFIX}zoom`,
+	blur: `${EFFECT_CLASS_PREFIX}blur`,
+	'slide-up': `${EFFECT_CLASS_PREFIX}slide-up`,
+	'slide-down': `${EFFECT_CLASS_PREFIX}slide-down`,
+};
 
-// События
+// События
 const EVENT_KEY_HIDE     = `${NAME_KEY}.hide`;
 const EVENT_KEY_HIDDEN   = `${NAME_KEY}.hidden`;
 const EVENT_KEY_SHOW     = `${NAME_KEY}.show`;
@@ -51,33 +60,34 @@ const EVENT_KEY_POINTERCANCEL_INTERACTION = `pointercancel.interaction.${NAME_KE
 
 /**
  * @typedef {Object} ToastParams
- * @property {boolean} static - Сохранять ли тост в DOM после скрытия.
- * @property {string} placement - Расположение: 'top left', 'bottom center' и т.д.
- * @property {boolean} autohide - Автоматически скрывать.
- * @property {number} delay - Задержка перед авто-скрытием (мс).
- * @property {boolean} enableClickToast - Закрывать по клику на тост.
- * @property {boolean} enableButtonClose - Добавить кнопку закрытия.
- * @property {boolean} keyboard - Закрывать по Esc.
- * @property {string} theme - Тема: 'dark', 'light' и т.д.
- * @property {Object} stack - Настройки стека уведомлений.
- * @property {boolean} stack.enable - Разрешить стек.
- * @property {number} stack.max - Макс. количество тостов одновременно.
- * @property {Object} animation - Анимация.
- * @property {boolean} animation.enable - Включить анимацию.
- * @property {string} animation.in - Анимация входа (Animate.css).
- * @property {string} animation.out - Анимация выхода.
- * @property {number} animation.delay - Длительность анимации.
- * @property {Object} ajax - Настройки AJAX.
- * @property {string} ajax.route - URL для загрузки.
- * @property {string} ajax.target - Селектор контейнера.
- * @property {string} ajax.method - HTTP-метод.
- * @property {boolean} ajax.loader - Показывать лоадер.
- * @property {boolean} ajax.once - Загружать один раз.
- * @property {boolean} ajax.output - Выводить результат.
+ * @property {boolean} static - Сохранять ли тост в DOM после скрытия.
+ * @property {string} placement - Расположение: 'top left', 'bottom center' и т.д.
+ * @property {boolean} autohide - Автоматически скрывать.
+ * @property {number} delay - Задержка перед авто-скрытием (мс).
+ * @property {boolean} enableClickToast - Закрывать по клику на тост.
+ * @property {boolean} enableButtonClose - Добавить кнопку закрытия.
+ * @property {boolean} keyboard - Закрывать по Esc.
+ * @property {string} theme - Тема: 'dark', 'light' и т.д.
+ * @property {Object} stack - Настройки стека уведомлений.
+ * @property {boolean} stack.enable - Разрешить стек.
+ * @property {number} stack.max - Макс. количество тостов одновременно.
+ * @property {Object} animation - Анимация.
+ * @property {boolean} animation.enable - Включить анимацию.
+ * @property {string} animation.in - Анимация входа (Animate.css).
+ * @property {string} animation.out - Анимация выхода.
+ * @property {number} animation.delay - Длительность анимации.
+ * @property {string|string[]} animation.effect - Доп. визуальный эффект (preset или css-класс).
+ * @property {Object} ajax - Настройки AJAX.
+ * @property {string} ajax.route - URL для загрузки.
+ * @property {string} ajax.target - Селектор контейнера.
+ * @property {string} ajax.method - HTTP-метод.
+ * @property {boolean} ajax.loader - Показывать лоадер.
+ * @property {boolean} ajax.once - Загружать один раз.
+ * @property {boolean} ajax.output - Выводить результат.
  */
 
 /**
- * Параметры по умолчанию
+ * Параметры по умолчанию
  * @type {ToastParams}
  */
 const defaultParams = {
@@ -112,6 +122,7 @@ const defaultParams = {
 		in: 'animate__backInUp',
 		out: 'animate__backOutDown',
 		delay: 300,
+		effect: 'none',
 	},
 	ajax: {
 		route: '',
@@ -124,14 +135,14 @@ const defaultParams = {
 };
 
 /**
- * Класс VGToast — модуль уведомлений (тосты)
- * Поддерживает стек, анимации, авто-скрытие, AJAX-контент, горячие клавиши.
+ * Класс VGToast — модуль уведомлений (тосты)
+ * Поддерживает стек, анимации, авто-скрытие, AJAX-контент, горячие клавиши.
  */
 class VGToast extends BaseModule {
 	/**
-	 * Создаёт экземпляр VGToast
-	 * @param {Element} element - HTML-элемент тоста.
-	 * @param {Partial<ToastParams>} params - Пользовательские параметры.
+	 * Создаёт экземпляр VGToast
+	 * @param {Element} element - HTML-элемент тоста.
+	 * @param {Partial<ToastParams>} params - Пользовательские параметры.
 	 */
 	constructor(element, params = {}) {
 		super(element, params);
@@ -160,6 +171,7 @@ class VGToast extends BaseModule {
 		this._dragHandler.setOptions(this._interactionConfig.drag);
 		this._resizeHandler.setOptions(this._interactionConfig.resize);
 		this._animation(this._element, VGToast.NAME_KEY, this._params.animation);
+		this._applyAnimationEffects();
 		this._dismissElement();
 		this._addEventListeners();
 
@@ -168,7 +180,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Имя модуля
+	 * Имя модуля
 	 * @returns {string}
 	 */
 	static get NAME() {
@@ -176,7 +188,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Пространство имён событий
+	 * Пространство имён событий
 	 * @returns {string}
 	 */
 	static get NAME_KEY() {
@@ -184,10 +196,10 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Глобальный метод для быстрого создания тоста
-	 * @param {string|Array<string>} text - Текст или [заголовок, тело].
-	 * @param {Partial<ToastParams>} [params] - Параметры.
-	 * @param {Function} [callback] - Вызывается после создания.
+	 * Глобальный метод для быстрого создания тоста
+	 * @param {string|Array<string>} text - Текст или [заголовок, тело].
+	 * @param {Partial<ToastParams>} [params] - Параметры.
+	 * @param {Function} [callback] - Вызывается после создания.
 	 * @returns {VGToast}
 	 */
 	static run(text, params = {}, callback) {
@@ -195,10 +207,10 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Создаёт и показывает новый тост
-	 * @param {string|Array<string>} text - Текст уведомления.
-	 * @param {Partial<ToastParams>} [params] - Параметры.
-	 * @param {Function} [callback] - Вызывается после появления.
+	 * Создаёт и показывает новый тост
+	 * @param {string|Array<string>} text - Текст уведомления.
+	 * @param {Partial<ToastParams>} [params] - Параметры.
+	 * @param {Function} [callback] - Вызывается после появления.
 	 * @returns {VGToast}
 	 */
 	static build(text, params, callback) {
@@ -214,12 +226,12 @@ class VGToast extends BaseModule {
 		target.classList.add('vg-toast');
 		target.id = id;
 
-		// Тема
+		// Тема
 		if (params.theme) {
 			target.classList.add(`vg-toast-${params.theme}`);
 		}
 
-		// Позиция
+		// Позиция
 		if (params.placement) {
 			params.placement.split(' ').forEach(cls => target.classList.add(cls));
 		}
@@ -227,7 +239,7 @@ class VGToast extends BaseModule {
 		const wrapper = document.createElement('div');
 		wrapper.classList.add('vg-toast-wrapper');
 
-		// Иконка (если задан тип)
+		// Иконка (если задан тип)
 		if (params.type) {
 			const icon = document.createElement('div');
 			icon.classList.add('vg-toast-icon');
@@ -256,7 +268,7 @@ class VGToast extends BaseModule {
 
 		wrapper.append(content);
 
-		// Кнопка закрытия
+		// Кнопка закрытия
 		if (params.enableButtonClose) {
 			const button = document.createElement('div');
 			button.classList.add('vg-toast-button');
@@ -270,6 +282,7 @@ class VGToast extends BaseModule {
 		const instance = VGToast.getOrCreateInstance(target, params);
 		if (params.animation) {
 			instance._animation(target, VGToast.NAME_KEY, params.animation);
+			instance._applyAnimationEffects();
 		}
 
 		execute(callback, [instance]);
@@ -279,8 +292,8 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Переключает состояние (показать/скрыть)
-	 * @param {Element} [relatedTarget] - Элемент, вызвавший тост.
+	 * Переключает состояние (показать/скрыть)
+	 * @param {Element} [relatedTarget] - Элемент, вызвавший тост.
 	 * @returns {VGToast}
 	 */
 	toggle(relatedTarget) {
@@ -288,8 +301,8 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Показывает тост
-	 * @param {Element} [relatedTarget] - Элемент, инициировавший показ.
+	 * Показывает тост
+	 * @param {Element} [relatedTarget] - Элемент, инициировавший показ.
 	 * @returns {void}
 	 */
 	show(relatedTarget) {
@@ -324,7 +337,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Скрывает тост
+	 * Скрывает тост
 	 * @returns {void}
 	 */
 	hide() {
@@ -359,7 +372,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Удаляет тост из DOM и снимает обработчики
+	 * Удаляет тост из DOM и снимает обработчики
 	 * @override
 	 */
 	dispose() {
@@ -372,7 +385,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Устанавливает таймер на скрытие
+	 * Устанавливает таймер на скрытие
 	 * @private
 	 */
 	_scheduleHide() {
@@ -383,7 +396,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Проверяет, показан ли тост
+	 * Проверяет, показан ли тост
 	 * @private
 	 * @returns {boolean}
 	 */
@@ -392,17 +405,17 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Возвращает список активных тостов с вертикальными смещениями
-	 * Учитывает стек и максимальное количество
+	 * Возвращает список активных тостов с вертикальными смещениями
+	 * Учитывает стек и максимальное количество
 	 * @private
 	 * @returns {Array<{el: Element, top: number}>}
 	 */
 	_enableStack() {
 		const placement = this._params.placement;
 		const isTop = placement.includes('top');
-		const isBottom = !isTop; // по умолчанию снизу
+		const isBottom = !isTop; // по умолчанию снизу
 
-		// Фильтруем тосты с таким же направлением (top или bottom)
+		// Фильтруем тосты с таким же направлением (top или bottom)
 		const stackClass = isTop ? 'top' : 'bottom';
 		const elmsShown = Selectors.findAll(`.vg-toast.show.${stackClass}`)
 			.filter(el => {
@@ -411,20 +424,20 @@ class VGToast extends BaseModule {
 			});
 
 		if (!this._params.stack.enable) {
-			// Скрываем другие тосты, если стек выключен
+			// Скрываем другие тосты, если стек выключен
 			elmsShown
 				.filter(el => el !== this._element)
 				.forEach(el => VGToast.getInstance(el).hide());
 			return [{ el: this._element, top: 0 }];
 		}
 
-		// Ограничиваем по max
+		// Ограничиваем по max
 		if (elmsShown.length >= this._params.stack.max) {
 			const excess = elmsShown.slice(0, elmsShown.length - this._params.stack.max + 1);
 			excess.forEach(el => VGToast.getInstance(el).hide());
 		}
 
-		// Вычисляем смещение (по высоте)
+		// Вычисляем смещение (по высоте)
 		const prevEls = elmsShown.filter(el => el !== this._element);
 		const offset = prevEls.reduce((sum, el) => sum + el.clientHeight, 0);
 
@@ -437,7 +450,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Устанавливает позицию тостов с учётом стека
+	 * Устанавливает позицию тостов с учётом стека
 	 * @private
 	 */
 	_setPlacement() {
@@ -465,17 +478,17 @@ class VGToast extends BaseModule {
 			style.top = '';
 			style.bottom = '';
 			style.transform = '';
-			style.translate = ''; // <-- важно: сбрасываем translate отдельно
+			style.translate = ''; // <-- важно: сбрасываем translate отдельно
 
 			if (isCenter) {
 				style.left = '50%';
-				style.translate = '-50% 0'; // <-- вместо transform: translateX(-50%)
+				style.translate = '-50% 0'; // <-- вместо transform: translateX(-50%)
 			} else if (isLeft) {
 				style.left = '0';
 			} else if (isRight) {
 				style.right = '0';
 			} else {
-				// по умолчанию: центрирование
+				// по умолчанию: центрирование
 				style.left = '50%';
 				style.translate = '-50% 0';
 			}
@@ -491,7 +504,7 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Очищает таймер
+	 * Очищает таймер
 	 * @private
 	 */
 	_toggleInteractionHandlers() {
@@ -551,6 +564,37 @@ class VGToast extends BaseModule {
 		return {...defaults};
 	}
 
+	_applyAnimationEffects() {
+		const classList = this._element.classList;
+		const effectClasses = [...classList].filter(className => className.startsWith(EFFECT_CLASS_PREFIX));
+		effectClasses.forEach(className => classList.remove(className));
+
+		const nextClasses = this._resolveAnimationEffectClasses(this._params.animation?.effect);
+		nextClasses.forEach(className => classList.add(className));
+	}
+
+	_resolveAnimationEffectClasses(effectValue) {
+		const values = Array.isArray(effectValue) ? effectValue : [effectValue];
+		const normalized = values
+			.filter(Boolean)
+			.map(effect => this._resolveAnimationEffectClass(effect))
+			.filter(Boolean);
+
+		return Array.from(new Set(normalized));
+	}
+
+	_resolveAnimationEffectClass(effectValue) {
+		if (typeof effectValue !== 'string') return '';
+		const key = effectValue.trim().toLowerCase();
+		if (!key) return '';
+
+		if (Object.prototype.hasOwnProperty.call(EFFECT_PRESET_MAP, key)) {
+			return EFFECT_PRESET_MAP[key];
+		}
+
+		return effectValue.trim();
+	}
+
 	_clearTimeout() {
 		if (this._timeout) {
 			clearTimeout(this._timeout);
@@ -559,11 +603,11 @@ class VGToast extends BaseModule {
 	}
 
 	/**
-	 * Назначает обработчики событий
+	 * Назначает обработчики событий
 	 * @private
 	 */
 	_addEventListeners() {
-		// Закрытие по Esc
+		// Закрытие по Esc
 		if (this._params.keyboard) {
 			EventHandler.on(document, EVENT_KEY_KEYDOWN_DISMISS, event => {
 				if (event.key === 'Escape' && this._isShown()) {
@@ -572,7 +616,7 @@ class VGToast extends BaseModule {
 			});
 		}
 
-		// Закрытие по клику на тост
+		// Закрытие по клику на тост
 		if (this._params.enableClickToast) {
 			this._element.classList.add('vg-toast-pointer');
 			EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, `#${this._element.id}`, () => {
@@ -595,11 +639,11 @@ class VGToast extends BaseModule {
 	}
 }
 
-// Автоматическое закрытие по data-vg-dismiss
+// Автоматическое закрытие по data-vg-dismiss
 dismissTrigger(VGToast);
 
 /**
- * Реализация Data API
+ * Реализация Data API
  */
 EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
 	const target = Selectors.getElementFromSelector(this);
@@ -619,3 +663,4 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, functi
 
 export default VGToast;
 
+

package/app/modules/vgtoast/readme.md

@@ -67,6 +67,7 @@ VGToast.run('Ошибка подключения', {
 | `animation.in` | `string` | `'animate__backInUp'` | Анимация появления |
 | `animation.out` | `string` | `'animate__backOutDown'` | Анимация исчезновения |
 | `animation.delay` | `number` | `300` | Длительность анимации (мс) |
+| `animation.effect` | `string \| string[]` | `'none'` | Доп. CSS-эффект отображения: `none`, `fade`, `zoom`, `blur`, `slide-up`, `slide-down` или кастомный класс |
 | `ajax.route` | `string` | `''` | URL для загрузки |
 | `ajax.target` | `string` | `''` | Селектор контейнера (если используется) |
 | `ajax.method` | `string` | `'get'` | HTTP-метод |
@@ -90,6 +91,16 @@ VGToast.run('Появилось!', {
 ```
 
 ### 2. AJAX-уведомление
+### 2.1. Дополнительные эффекты отображения
+```js
+VGToast.run('Сообщение', {
+    animation: {
+        in: 'animate__fadeIn',
+        out: 'animate__fadeOut',
+        effect: ['zoom', 'blur']
+    }
+});
+```
 
 ```js
 VGToast.run('Загрузка...', { 
@@ -142,4 +153,4 @@ MIT. Свободно использовать и модифицировать.
 
 📌 *Разработано в рамках фронтенд-системы VG Modules.*
 > 🚀 Автор: VEGAS STUDIO (vegas-dev.com)
-> 📍 Поддерживается в проектах VEGAS
+> 📍 Поддерживается в проектах VEGAS

package/app/modules/vgtoast/scss/vgtoast.scss

@@ -68,6 +68,47 @@
 		cursor: pointer;
 	}
 
+	&[class*='vg-toast-effect-'] {
+		.vg-toast-wrapper {
+			transition: opacity .25s ease, transform .25s ease, filter .25s ease;
+			will-change: opacity, transform, filter;
+		}
+	}
+
+	&.vg-toast-effect-fade {
+		&:not(.shown) .vg-toast-wrapper {
+			opacity: 0;
+		}
+	}
+
+	&.vg-toast-effect-zoom {
+		&:not(.shown) .vg-toast-wrapper {
+			opacity: 0;
+			transform: scale(.92);
+		}
+	}
+
+	&.vg-toast-effect-blur {
+		&:not(.shown) .vg-toast-wrapper {
+			opacity: 0;
+			filter: blur(6px);
+		}
+	}
+
+	&.vg-toast-effect-slide-up {
+		&:not(.shown) .vg-toast-wrapper {
+			opacity: 0;
+			transform: translateY(14px);
+		}
+	}
+
+	&.vg-toast-effect-slide-down {
+		&:not(.shown) .vg-toast-wrapper {
+			opacity: 0;
+			transform: translateY(-14px);
+		}
+	}
+
 	&-button {
 		width: auto;
 		height: 100%;
@@ -95,4 +136,4 @@
 			}
 		}
 	}
-}
+}