vgapp 1.3.0 → 1.3.2

package/app/modules/base-module.js

@@ -15,8 +15,8 @@ import Animation from "../utils/js/components/animation";
 import Ajax from "../utils/js/components/ajax";
 import Html from "../utils/js/components/templater";
 
-class BaseModule {
-	constructor(element) {
+class BaseModule {
+	constructor(element) {
 		if (!element) return
 
 		this._element = Selectors.find(element);
@@ -54,13 +54,13 @@ class BaseModule {
 	 * - timeout = задержка перед отправкой, по умолчанию 0
 	 * @param callback
 	 */
-	_route(callback) {
-		if (typeof callback !== 'function') {
-			return this._requestRoute(callback);
-		}
-
-		let $content = null,
-			timeout = this._params.ajax.timeout || 0;
+	_route(callback) {
+		if (typeof callback !== 'function') {
+			return this._requestRoute(callback);
+		}
+
+		let $content = null,
+			timeout = this._params.ajax.timeout || 0;
 
 		if (this._isLoaded) return;
 
@@ -137,83 +137,83 @@ class BaseModule {
 			if (this._params.ajax.method.toLowerCase() === 'delete') {
 				ajax.delete(this._params.ajax.route, ajaxData);
 			}
-		}, timeout);
-	}
-
-	_requestRoute(options = {}) {
-		const config = this._normalizeRouteRequestOptions(options);
-		return Ajax.requestRoute(config);
-	}
-
-	_buildRouteUrl(params = {}, endpoint = '', options = {}) {
-		const config = this._normalizeRouteRequestOptions(Object.assign({}, options, {
-			params,
-			route: endpoint || options.route || '',
-		}));
-		return Ajax.buildRouteUrl(config.route, {
-			params: config.params,
-			baseParams: config.baseParams,
-		});
-	}
-
-	_normalizeRouteRequestOptions(options = {}) {
-		const requestOptions = this._params && isObject(this._params.request)
-			? this._params.request
-			: {};
-		const ajaxOptions = this._params && isObject(this._params.ajax)
-			? this._params.ajax
-			: {};
-		const source = isObject(options) ? options : {};
-		const route = String(
-			source.route
-			|| source.endpoint
-			|| requestOptions.route
-			|| ajaxOptions.route
-			|| ''
-		).trim();
-		const method = String(
-			source.method
-			|| requestOptions.method
-			|| ajaxOptions.method
-			|| 'GET'
-		).toUpperCase().trim() || 'GET';
-		const credentials = String(
-			source.credentials
-			|| requestOptions.credentials
-			|| 'same-origin'
-		).trim() || 'same-origin';
-		const headers = mergeDeepObject(
-			{
-				'Accept': 'application/json',
-				'X-Requested-With': 'XMLHttpRequest',
-			},
-			isObject(requestOptions.headers) ? requestOptions.headers : {},
-			isObject(source.headers) ? source.headers : {}
-		);
-		const baseParams = mergeDeepObject(
-			{},
-			isObject(requestOptions.params) ? requestOptions.params : {},
-			isObject(source.baseParams) ? source.baseParams : {},
-			isObject(source.paramsBase) ? source.paramsBase : {}
-		);
-		const params = isObject(source.params) ? source.params : {};
-		const body = source.body !== undefined
-			? source.body
-			: (source.data !== undefined ? source.data : null);
-		return {
-			route,
-			method,
-			credentials,
-			headers,
-			baseParams,
-			params,
-			body,
-			signal: source.signal || null,
-			responseType: String(source.responseType || source.parse || 'auto').toLowerCase().trim() || 'auto',
-		};
-	}
-
-	_dismissElement() {
+		}, timeout);
+	}
+
+	_requestRoute(options = {}) {
+		const config = this._normalizeRouteRequestOptions(options);
+		return Ajax.requestRoute(config);
+	}
+
+	_buildRouteUrl(params = {}, endpoint = '', options = {}) {
+		const config = this._normalizeRouteRequestOptions(Object.assign({}, options, {
+			params,
+			route: endpoint || options.route || '',
+		}));
+		return Ajax.buildRouteUrl(config.route, {
+			params: config.params,
+			baseParams: config.baseParams,
+		});
+	}
+
+	_normalizeRouteRequestOptions(options = {}) {
+		const requestOptions = this._params && isObject(this._params.request)
+			? this._params.request
+			: {};
+		const ajaxOptions = this._params && isObject(this._params.ajax)
+			? this._params.ajax
+			: {};
+		const source = isObject(options) ? options : {};
+		const route = String(
+			source.route
+			|| source.endpoint
+			|| requestOptions.route
+			|| ajaxOptions.route
+			|| ''
+		).trim();
+		const method = String(
+			source.method
+			|| requestOptions.method
+			|| ajaxOptions.method
+			|| 'GET'
+		).toUpperCase().trim() || 'GET';
+		const credentials = String(
+			source.credentials
+			|| requestOptions.credentials
+			|| 'same-origin'
+		).trim() || 'same-origin';
+		const headers = mergeDeepObject(
+			{
+				'Accept': 'application/json',
+				'X-Requested-With': 'XMLHttpRequest',
+			},
+			isObject(requestOptions.headers) ? requestOptions.headers : {},
+			isObject(source.headers) ? source.headers : {}
+		);
+		const baseParams = mergeDeepObject(
+			{},
+			isObject(requestOptions.params) ? requestOptions.params : {},
+			isObject(source.baseParams) ? source.baseParams : {},
+			isObject(source.paramsBase) ? source.paramsBase : {}
+		);
+		const params = isObject(source.params) ? source.params : {};
+		const body = source.body !== undefined
+			? source.body
+			: (source.data !== undefined ? source.data : null);
+		return {
+			route,
+			method,
+			credentials,
+			headers,
+			baseParams,
+			params,
+			body,
+			signal: source.signal || null,
+			responseType: String(source.responseType || source.parse || 'auto').toLowerCase().trim() || 'auto',
+		};
+	}
+
+	_dismissElement() {
 		let cross = getSVG('cross'),
 			button = this._element.querySelector('.vg-btn-close');
 
@@ -235,34 +235,34 @@ class BaseModule {
 		return Data.get(Selectors.find(element), this.NAME_KEY)
 	}
 
-	static getOrCreateInstance(element, params = {}) {
-		return this.getInstance(element) || new this(element, !isEmptyObj(params) ? params : {})
-	}
-
-	static boot(params = {}) {
-		if (typeof this.initAll === 'function') {
-			return this.initAll(params);
-		}
-
-		if (typeof this.init !== 'function') {
-			return null;
-		}
-
-		if (params && Object.prototype.hasOwnProperty.call(params, 'element')) {
-			const { element, ...options } = params;
-			return this.init(element, options);
-		}
-
-		return null;
-	}
-
-	static get DATA_KEY() {
-		return `vg.${this.NAME}`
-	}
+	static getOrCreateInstance(element, params = {}) {
+		return this.getInstance(element) || new this(element, !isEmptyObj(params) ? params : {})
+	}
+
+	static boot(params = {}) {
+		if (typeof this.initAll === 'function') {
+			return this.initAll(params);
+		}
+
+		if (typeof this.init !== 'function') {
+			return null;
+		}
+
+		if (params && Object.prototype.hasOwnProperty.call(params, 'element')) {
+			const { element, ...options } = params;
+			return this.init(element, options);
+		}
+
+		return null;
+	}
+
+	static get DATA_KEY() {
+		return `vg.${this.NAME}`
+	}
 
 	static get EVENT_KEY() {
 		return `.${this.DATA_KEY}`
 	}
 }
 
-export default BaseModule;
+export default BaseModule;

package/app/modules/vgalert/js/vgalert.js

@@ -23,8 +23,8 @@ const NAME_KEY = "vg.alert";
 // Глобальная блокировка: предотвращаем открытие нескольких алертов
 let isAlertOpen = false;
 
-class VGAlert {
-	constructor(params = {}, lang = 'ru') {
+class VGAlert {
+	constructor(params = {}, lang = 'ru') {
 		this.lang = lang;
 		this._defaultParams = {
 			render: {
@@ -90,10 +90,23 @@ class VGAlert {
 				info: getSVG("info"),
 			},
 		};
-		this._params = this._setParams(params);
-	}
-
-	static call(options = {}, lang = 'ru') {
+		this._params = this._setParams(params);
+	}
+
+	static get NAME() {
+		return NAME;
+	}
+
+	static get NAME_KEY() {
+		return NAME_KEY;
+	}
+
+	static boot() {
+		this._bindDataApi();
+		return null;
+	}
+
+	static call(options = {}, lang = 'ru') {
 		const context = new VGAlert(options, lang);
 
 		if (isAlertOpen) return Promise.reject({ accepted: false, reason: lang_messages(context.lang, NAME_KEY).reason });
@@ -205,7 +218,7 @@ class VGAlert {
 		});
 	}
 
-	static confirm(elem, options = {}) {
+	static confirm(elem, options = {}) {
 		let lang = 'ru';
 
 		if ('lang' in options) {
@@ -215,9 +228,35 @@ class VGAlert {
 		const context = new VGAlert(options, lang);
 		if (context._params.mode !== "confirm") return;
 
-		const instance = VGAlertConfirm.getOrCreateInstance(elem, context._params);
-		instance.run(VGAlert);
-	}
+		const instance = VGAlertConfirm.getOrCreateInstance(elem, context._params);
+		instance.run(VGAlert);
+	}
+
+	static _bindDataApi() {
+		if (this._isDataApiBound) {
+			return;
+		}
+
+		this._isDataApiBound = true;
+
+		EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
+			event.preventDefault();
+			const target = event.target;
+
+			if (!isVisible(target) || !isElement(target)) return;
+
+			VGAlert.confirm(target, {
+				buttons: {
+					agree: {
+						class: ["btn-primary"],
+					},
+					cancel: {
+						class: ["btn-outline-primary"],
+					},
+				},
+			});
+		});
+	}
 
 	_setParams(params) {
 		const merged = mergeDeepObject(this._defaultParams, params);
@@ -395,22 +434,6 @@ class VGAlertConfirm extends BaseModule {
 }
 
 // Делегирование кликов по data-атрибутам
-EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
-	event.preventDefault();
-	const target = event.target;
-
-	if (!isVisible(target) || !isElement(target)) return;
-
-	VGAlert.confirm(target, {
-		buttons: {
-			agree: {
-				class: ["btn-primary"],
-			},
-			cancel: {
-				class: ["btn-outline-primary"],
-			},
-		},
-	});
-});
-
-export default VGAlert;
+VGAlert._isDataApiBound = false;
+
+export default VGAlert;

package/app/modules/vgalert/readme.md

@@ -11,12 +11,12 @@
 - Полная **локализация** (настройка языка)
 - Гибкая **настройка кнопок** и сообщений
 - Поддержка **SVG-иконок** и тем стилей (`danger`, `warning`, `success`, `info`)
-- Работа как через **API**, так и через **`data`-атрибуты**
-- Интеграция с промисами (`Promise`)
-- Защита от **множественных одновременных вызовов**
-- Поддержка **клавиатурных сокращений** (Enter, Escape)
-- Два режима рендера: обычный **`modal`** и вложенный **`overlay`**
-- Возможность закрывать родительскую модалку/сайдбар через `render.dismiss`
+- Работа как через **API**, так и через **`data`-атрибуты**
+- Интеграция с промисами (`Promise`)
+- Защита от **множественных одновременных вызовов**
+- Поддержка **клавиатурных сокращений** (Enter, Escape)
+- Два режима рендера: обычный **`modal`** и вложенный **`overlay`**
+- Возможность закрывать родительскую модалку/сайдбар через `render.dismiss`
 
 ---
 
@@ -29,45 +29,45 @@ import VGAlert from "./app/modules/vgalert/js/vgalert.js";
 
 ---
 
-## 🧩 Режимы работы
+## 🧩 Режимы работы
 
 ### 1. `confirm` — Подтверждение действия
 Показывает два действия: **Подтвердить** и **Отмена**.
 
-### 2. `info` — Информационное сообщение
-Показывает только кнопку **ОК** (или "Продолжить").
-
----
-
-## 🖼 Рендер (`render`)
-
-`VGAlert` поддерживает два варианта отображения:
-
-| Параметр | Значение | Описание |
-|--------|--------|----------|
-| `render.type` | `modal` | Обычный alert в отдельной модалке |
-| `render.type` | `overlay` | Alert-оверлей внутри текущей `.vg-modal` или `.vg-sidebar` |
-| `render.dismiss` | `true` / `false` | Для `overlay`: после закрытия alert дополнительно закрывает родительский контейнер |
-
-### Пример: alert поверх открытой модалки
-
-```js
-VGAlert.call({
-    render: {
-        type: "overlay",
-        dismiss: true
-    },
-    relatedTarget: button,
-    message: {
-        title: "Удалить запись",
-        description: "Действие будет выполнено в текущем окне."
-    }
-});
-```
-
-`relatedTarget` нужен для `overlay`, чтобы модуль нашёл ближайшую `.vg-modal` или `.vg-sidebar`, куда надо встроить alert.
-
----
+### 2. `info` — Информационное сообщение
+Показывает только кнопку **ОК** (или "Продолжить").
+
+---
+
+## 🖼 Рендер (`render`)
+
+`VGAlert` поддерживает два варианта отображения:
+
+| Параметр | Значение | Описание |
+|--------|--------|----------|
+| `render.type` | `modal` | Обычный alert в отдельной модалке |
+| `render.type` | `overlay` | Alert-оверлей внутри текущей `.vg-modal` или `.vg-sidebar` |
+| `render.dismiss` | `true` / `false` | Для `overlay`: после закрытия alert дополнительно закрывает родительский контейнер |
+
+### Пример: alert поверх открытой модалки
+
+```js
+VGAlert.call({
+    render: {
+        type: "overlay",
+        dismiss: true
+    },
+    relatedTarget: button,
+    message: {
+        title: "Удалить запись",
+        description: "Действие будет выполнено в текущем окне."
+    }
+});
+```
+
+`relatedTarget` нужен для `overlay`, чтобы модуль нашёл ближайшую `.vg-modal` или `.vg-sidebar`, куда надо встроить alert.
+
+---
 
 ## 🎨 Темы (`theme`)
 | Значение | Иконка | Назначение |
@@ -108,9 +108,9 @@ VGAlert.call({
 });
 ```
 
-### Пример 2: Информационное сообщение
-```js
-VGAlert.call({ 
+### Пример 2: Информационное сообщение
+```js
+VGAlert.call({ 
     mode: "info",
     theme: "success",
     message: {
@@ -123,26 +123,26 @@ VGAlert.call({
             class: ["btn-success"] 
         } 
     } 
-});
-```
-
-### Пример 3: Обработка результата через `Promise`
-```js
-VGAlert.call({
-    message: {
-        title: "Подтвердите действие",
-        description: "Продолжить?"
-    }
-}).then((result) => {
-    console.log(result.accepted); // true
-    console.log(result.timestamp);
-}).catch((error) => {
-    console.log(error.accepted); // false
-    console.log(error.timestamp);
-});
-```
-
----
+});
+```
+
+### Пример 3: Обработка результата через `Promise`
+```js
+VGAlert.call({
+    message: {
+        title: "Подтвердите действие",
+        description: "Продолжить?"
+    }
+}).then((result) => {
+    console.log(result.accepted); // true
+    console.log(result.timestamp);
+}).catch((error) => {
+    console.log(error.accepted); // false
+    console.log(error.timestamp);
+});
+```
+
+---
 
 ## 🔌 Работа с AJAX
 
@@ -169,30 +169,30 @@ VGAlert.confirm(element, {
 
 ---
 
-## 🔔 События
-
-Модуль генерирует события на элементе-триггере, у которого есть `[data-vg-toggle="alert"]`:
-
-| Событие | Описание |
-|--------|--------|
-| `vg.alert.accept` | Пользователь подтвердил действие |
+## 🔔 События
+
+Модуль генерирует события на элементе-триггере, у которого есть `[data-vg-toggle="alert"]`:
+
+| Событие | Описание |
+|--------|--------|
+| `vg.alert.accept` | Пользователь подтвердил действие |
 | `vg.alert.reject` | Пользователь отменил действие |
-| `vg.alert.finally` | Действие завершено (в любом случае) |
-| `vg.alert.loaded` | Получен ответ от сервера (если был AJAX) |
-
-```js 
-const buttons = document.querySelectorAll('[data-vg-toggle="alert"]');
-
-buttons.forEach((button) => {
-    button.addEventListener('vg.alert.accept', function (e) {
-        console.log('Подтверждено:', e.vgalert);
-    });
-});
-```
-
-Если нужен общий глобальный обработчик, событие можно слушать и на `document`, так как оно всплывает.
-
----
+| `vg.alert.finally` | Действие завершено (в любом случае) |
+| `vg.alert.loaded` | Получен ответ от сервера (если был AJAX) |
+
+```js 
+const buttons = document.querySelectorAll('[data-vg-toggle="alert"]');
+
+buttons.forEach((button) => {
+    button.addEventListener('vg.alert.accept', function (e) {
+        console.log('Подтверждено:', e.vgalert);
+    });
+});
+```
+
+Если нужен общий глобальный обработчик, событие можно слушать и на `document`, так как оно всплывает.
+
+---
 
 ## ⌨️ Клавиатурные комбинации
 
@@ -203,16 +203,16 @@ buttons.forEach((button) => {
 
 ## 🛠️ Конфигурация по умолчанию
 ```js
-{ 
-    mode: "confirm", 
-    theme: "danger", 
-    render: {
-        type: "modal",
-        dismiss: false
-    },
-    modal: { 
-        centered: false,
-        backdrop: true, 
+{ 
+    mode: "confirm", 
+    theme: "danger", 
+    render: {
+        type: "modal",
+        dismiss: false
+    },
+    modal: { 
+        centered: false,
+        backdrop: true, 
         keyboard: true,
         dismiss: true 
     }, 
@@ -249,13 +249,13 @@ VGAlert.call(params, 'en');
 
 ## 🧩 Кастомизация кнопок
 
-Поддерживает:
-- `tag: 'button' | 'a'`
-- `type` (для `<button>`)
-- `class` — массив CSS-классов
-- `attr` — любые дополнительные атрибуты
-- `element` — готовый HTML-код кнопки
-- `toggle` — служебный атрибут кнопки (`data-vg-alert-agree` / `data-vg-alert-cancel`), обычно задаётся модулем автоматически
+Поддерживает:
+- `tag: 'button' | 'a'`
+- `type` (для `<button>`)
+- `class` — массив CSS-классов
+- `attr` — любые дополнительные атрибуты
+- `element` — готовый HTML-код кнопки
+- `toggle` — служебный атрибут кнопки (`data-vg-alert-agree` / `data-vg-alert-cancel`), обычно задаётся модулем автоматически
 
 ### Пример: кнопка-ссылка
 ```js
@@ -298,4 +298,4 @@ MIT — свободно используйте и модифицируйте.
 ---
 
 > 🚀 Автор: VEGAS STUDIO (vegas-dev.com)
-> 📍 Поддерживается в проектах VEGAS
+> 📍 Поддерживается в проектах VEGAS

package/app/modules/vgdynamictable/index.js

@@ -1,5 +1,5 @@
-import VGDynamicTable from "./js/vgdynamictable";
-import Editable from "./js/editable";
-
-export {Editable, VGDynamicTable};
-export default VGDynamicTable;
+import VGDynamicTable from "./js/vgdynamictable";
+import Editable from "./js/editable";
+
+export {Editable, VGDynamicTable};
+export default VGDynamicTable;