vgapp 0.7.2 → 0.7.3

package/build/vgapp.js

@@ -1,2 +1,30 @@
-var vg;(()=>{"use strict";var e={};(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),vg=e})();
-//# sourceMappingURL=vgapp.js.map
+var vg;
+/******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	// The require scope
+/******/ 	var __webpack_require__ = {};
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+/*!********************!*\
+  !*** ./index.scss ***!
+  \********************/
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+vg = __webpack_exports__;
+/******/ })()
+;
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmdhcHAuanMiLCJtYXBwaW5ncyI6Ijs7O0FBQUE7QUFDQTtBQUNBOzs7O0FDRkE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7Ozs7Ozs7OztBQ05BIiwic291cmNlcyI6WyJ3ZWJwYWNrOi8vdmcvd2VicGFjay9ib290c3RyYXAiLCJ3ZWJwYWNrOi8vdmcvd2VicGFjay9ydW50aW1lL21ha2UgbmFtZXNwYWNlIG9iamVjdCIsIndlYnBhY2s6Ly92Zy8uL2luZGV4LnNjc3M/ZjRiNSJdLCJzb3VyY2VzQ29udGVudCI6WyIvLyBUaGUgcmVxdWlyZSBzY29wZVxudmFyIF9fd2VicGFja19yZXF1aXJlX18gPSB7fTtcblxuIiwiLy8gZGVmaW5lIF9fZXNNb2R1bGUgb24gZXhwb3J0c1xuX193ZWJwYWNrX3JlcXVpcmVfXy5yID0gKGV4cG9ydHMpID0+IHtcblx0aWYodHlwZW9mIFN5bWJvbCAhPT0gJ3VuZGVmaW5lZCcgJiYgU3ltYm9sLnRvU3RyaW5nVGFnKSB7XG5cdFx0T2JqZWN0LmRlZmluZVByb3BlcnR5KGV4cG9ydHMsIFN5bWJvbC50b1N0cmluZ1RhZywgeyB2YWx1ZTogJ01vZHVsZScgfSk7XG5cdH1cblx0T2JqZWN0LmRlZmluZVByb3BlcnR5KGV4cG9ydHMsICdfX2VzTW9kdWxlJywgeyB2YWx1ZTogdHJ1ZSB9KTtcbn07IiwiLy8gZXh0cmFjdGVkIGJ5IG1pbmktY3NzLWV4dHJhY3QtcGx1Z2luXG5leHBvcnQge307Il0sIm5hbWVzIjpbXSwic291cmNlUm9vdCI6IiJ9

package/index.js

@@ -1,4 +1,4 @@
-export { default as VGAlert } from './app/modules/vgalert';
+/*export { default as VGAlert } from './app/modules/vgalert';*/
 export { default as VGCollapse } from './app/modules/vgcollapse';
 export { default as VGDropdown } from './app/modules/vgdropdown';
 export { default as VGFiles } from './app/modules/vgfiles';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vgapp",
-	"version": "0.7.2",
+	"version": "0.7.3",
 	"description": "",
 	"author": {
 		"name": "Vegas Studio",

package/app/modules/vgalert/index.js

@@ -1,3 +0,0 @@
-import VGAlert from "./js/vgalert";
-
-export default VGAlert;

package/app/modules/vgalert/js/!old/!vgalert.js

@@ -1,153 +0,0 @@
-import BaseModule from "../../base-module";
-import EventHandler from "../../../utils/js/dom/event";
-import {isDisabled, makeRandomString, mergeDeepObject} from "../../../utils/js/functions";
-import Selectors from "../../../utils/js/dom/selectors";
-import VGModal from "../../vgmodal/js/vgmodal";
-
-/**
- * Constants
- */
-const NAME = 'alert';
-const NAME_KEY = 'vg.alert';
-const SELECTOR_DATA_TOGGLE= '[data-vg-toggle="alert"]';
-const EVENT_KEY_CLICK_DATA_API = `click.${NAME_KEY}.data.api`;
-
-let IS_PROMISE = false;
-
-class VGAlert extends BaseModule {
-	constructor(element, params = {}) {
-		super(element, params);
-
-		this._params = this._getParams(element, mergeDeepObject({
-			modal: {
-				centered: false,
-				backdrop: true,
-				overflow: true,
-				keyboard: true,
-				animation: {
-					enable: false,
-					in: 'animate__rollIn',
-					out: 'animate__rollOut',
-					delay: 0,
-				},
-			},
-			toast: {
-
-			},
-			elements: {
-				button: ''
-			},
-			dialog: 'modal',
-			mode: 'alert',
-		}, params));
-	}
-
-	static get NAME() {
-		return NAME;
-	}
-
-	static get NAME_KEY() {
-		return NAME_KEY
-	}
-
-	static run(message, element = null, params = {}, event = null) {
-		if (!element) {
-			let a = document.createElement('a');
-			a.classList.add('btn-alert-fake');
-			document.body.append(a);
-			element = a;
-		}
-
-		const instance = VGAlert.getOrCreateInstance(element, mergeDeepObject({
-			message: message
-		}, params));
-
-		return instance.promise(event);
-	}
-
-	toggle(event) {
-		const promise = this.promise(event);
-		promise.then(resolve => {
-			IS_PROMISE = true;
-			this._element.click();
-		}).catch(reject => {
-
-		});
-	}
-
-	promise(event) {
-		let dialog = this._build();
-		dialog.toggle();
-
-		return new Promise((resolve) => {
-			if (this._params.mode === 'alert') {
-				dialog._element.addEventListener('vg.'+ this._params.dialog +'.hidden', () => {
-					setTimeout(() => {
-						IS_PROMISE = false;
-						let fakeBtn = document.querySelector('.btn-alert-fake');
-						if (fakeBtn) fakeBtn.remove();
-					}, 100)
-				});
-			}
-		});
-	}
-
-	_build() {
-		if (this._params.dialog === 'modal') {
-			return this._buildModal();
-		}
-		if (this._params.dialog === 'toast') {
-			return this._buildToast();
-		}
-	}
-
-	_buildModal() {
-		let id = 'vg-alert-' + makeRandomString(),
-			$modal = Selectors.find('.vg-alert-modal');
-
-		if ($modal) $modal.remove();
-
-		return VGModal.build(id, this._params.modal, (self) => {
-			let element = self._element;
-			element.classList.add('vg-alert-modal');
-
-			let $body = Selectors.find('.vg-modal-body', element);
-			if ($body) {
-				let html = '<div class="message">' + this._params.message + '</div>';
-
-				html += '<div class="buttons">';
-				if (this._params.elements.button) {
-					html += '<a href="#" data-vg-dismiss="modal" class="btn btn-primary">'+ this._params.elements.button +'</a>';
-				}
-				html += '</div>';
-
-				$body.innerHTML = html;
-			}
-		});
-	}
-
-	_buildToast() {
-
-	}
-}
-
-/**
- * Data API implementation
- */
-EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
-	if (!IS_PROMISE) {
-		let target = this;
-		event.preventDefault();
-
-		if (isDisabled(target)) return;
-
-		const data = VGAlert.getOrCreateInstance(target)
-		data.toggle(event);
-	}
-});
-
-window.alert = (message) => {
-	VGAlert.run(message);
-}
-
-export default VGAlert;

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

@@ -1,115 +0,0 @@
-import BaseModule from "../../base-module";
-import EventHandler from "../../../utils/js/dom/event";
-import {isDisabled, makeRandomString, mergeDeepObject} from "../../../utils/js/functions";
-import Selectors from "../../../utils/js/dom/selectors";
-import VGModal from "../../vgmodal/js/vgmodal";
-
-/**
- * Constants
- */
-const NAME = 'alert';
-const NAME_KEY = 'vg.alert';
-const SELECTOR_DATA_TOGGLE= '[data-vg-toggle="alert"]';
-const EVENT_KEY_CLICK_DATA_API = `click.${NAME_KEY}.data.api`;
-
-let IS_PROMISE = false;
-
-class VGAlert extends BaseModule {
-	constructor(element, params = {}) {
-		super(element, params);
-
-		this._params = this._getParams(element, mergeDeepObject({
-			modal: {
-				centered: false,
-				backdrop: true,
-				overflow: true,
-				keyboard: true,
-				animation: {
-					enable: false,
-					in: 'animate__rollIn',
-					out: 'animate__rollOut',
-					delay: 0,
-				},
-			},
-			toast: {
-
-			},
-			elements: {
-				button: ''
-			},
-			dialog: 'modal',
-			mode: 'alert',
-		}, params));
-	}
-
-	static get NAME() {
-		return NAME;
-	}
-
-	static get NAME_KEY() {
-		return NAME_KEY
-	}
-
-	static run(... args) {
-
-	}
-
-	toggle(event) {
-
-	}
-
-	promise(event) {
-
-	}
-
-	_build() {
-		if (this._params.dialog === 'modal') {
-			return this._buildModal();
-		}
-		if (this._params.dialog === 'toast') {
-			return this._buildToast();
-		}
-	}
-
-	_buildModal() {
-		let id = 'vg-alert-' + makeRandomString(),
-			$modal = Selectors.find('.vg-alert-modal');
-
-		if ($modal) $modal.remove();
-
-		return VGModal.build(id, this._params.modal, (self) => {
-			let element = self._element;
-			element.classList.add('vg-alert-modal');
-
-			let $body = Selectors.find('.vg-modal-body', element);
-			if ($body) {
-				let html = '<div class="message">' + this._params.message + '</div>';
-
-				html += '<div class="buttons">';
-				if (this._params.elements.button) {
-					html += '<a href="#" data-vg-dismiss="modal" class="btn btn-primary">'+ this._params.elements.button +'</a>';
-				}
-				html += '</div>';
-
-				$body.innerHTML = html;
-			}
-		});
-	}
-
-	_buildToast() {
-
-	}
-}
-
-/**
- * Data API implementation
- */
-EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
-
-});
-
-/*window.alert = (message) => {
-	VGAlert.run(message);
-}*/
-
-export default VGAlert;

package/app/modules/vgalert/scss/_variables.scss

@@ -1,32 +0,0 @@
-$alert-map: (
-		padding: 2rem,
-		margin: 0 0 2rem,
-		border-width: $border-width,
-		border-style: $border-style,
-		border-color: transparent,
-		border-radius: $border-radius,
-		gap: 1.5rem,
-		icon-width: 80px,
-		icon-height: 80px,
-		content-width: 100%,
-		content-align: center,
-		content-justify: flex-start
-);
-$alert-success-map: (
-		color: darken(#A5DC86, 10%),
-		border-color: #A5DC86,
-		background-color: rgba(lighten(#A5DC86, 10%), .15),
-		stroke: rgba(117, 183, 152, 0.4)
-);
-
-$alert-error-map: (
-		color: darken(#F74444, 10%),
-		border-color: #F74444,
-		background-color: rgba(lighten(#F74444, 25%), .075)
-);
-
-$alert-waiting-map: (
-		color: darken(#ffda6a, 10%),
-		border-color: #ffda6a,
-		background-color: rgba(lighten(#ffda6a, 15%), .1)
-);

package/app/modules/vgalert/scss/vgalert.scss

@@ -1,79 +0,0 @@
-/**
-*--------------------------------------------------------------------------
-* Модуль: VGAlert
-* Автор: Vegas DEV
-* Лицензия: смотри LICENSE
-*--------------------------------------------------------------------------
-**/
-
-@import "../../../utils/scss/functions";
-@import "../../../utils/scss/mixin";
-@import "../../../utils/scss/variables";
-@import "variables";
-
-.vg-alert {
-	@include mix-vars('alert', $alert-map);
-	@include mix-vars('alert-success', $alert-success-map);
-	@include mix-vars('alert-error', $alert-error-map);
-	@include mix-vars('alert-waiting', $alert-waiting-map);
-	padding: var(--vg-alert-padding);
-	margin: var(--vg-alert-margin);
-	border: var(--vg-alert-border-width) var(--vg-alert-border-style) var(--vg-alert-border-color);
-	border-radius: var(--vg-alert-border-radius);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-
-	&-success {
-		color: var(--vg-alert-success-color);
-		border-color: var(--vg-alert-success-border-color);
-		background-color: var(--vg-alert-success-background-color);
-	}
-
-	&-error {
-		color: var(--vg-alert-error-color);
-		border-color: var(--vg-alert-error-border-color);
-		background-color: var(--vg-alert-error-background-color);
-	}
-
-	&-content {
-		display: flex;
-		align-items: var(--vg-alert-content-align);
-		justify-content: var(--vg-alert-content-justify);
-		gap: var(--vg-alert-gap);
-		width: var(--vg-alert-content-width);
-
-		&--icon {
-			width: var(--vg-alert-icon-width);
-			height: var(--vg-alert-icon-height);
-
-			svg {
-				width: 100%;
-				height: 100%;
-			}
-
-			.ui-success {
-				&-circle {
-					stroke: var(--vg-alert-success-stroke);
-				}
-
-				&-path {
-					stroke: var(--vg-alert-success-color);
-				}
-			}
-		}
-	}
-
-	&-modal {
-		--vg-alert-icon-width: 150px;
-		--vg-alert-icon-height: 150px;
-		--vg-alert-padding: 5rem 2rem;
-		--vg-alert-border-width: 0;
-		margin: 0;
-
-		.vg-alert-content {
-			flex-direction: column;
-			text-align: center;
-		}
-	}
-}