This commit is contained in:
sasha-astiadi
2024-05-03 06:39:20 +02:00
parent 6bf49421d6
commit 324d5960af
1737 changed files with 254531 additions and 0 deletions

View File

@@ -0,0 +1,26 @@
import type { ModalOptions } from './types';
import { ModalInterface } from './interface';
declare class Modal implements ModalInterface {
_targetEl: HTMLElement | null;
_options: ModalOptions;
_isHidden: boolean;
_backdropEl: HTMLElement | null;
_clickOutsideEventListener: EventListenerOrEventListenerObject;
_keydownEventListener: EventListenerOrEventListenerObject;
constructor(targetEl?: HTMLElement | null, options?: ModalOptions);
_init(): void;
_createBackdrop(): void;
_destroyBackdropEl(): void;
_setupModalCloseEventListeners(): void;
_removeModalCloseEventListeners(): void;
_handleOutsideClick(target: EventTarget): void;
_getPlacementClasses(): string[];
toggle(): void;
show(): void;
hide(): void;
isVisible(): boolean;
isHidden(): boolean;
}
export declare function initModals(): void;
export default Modal;
//# sourceMappingURL=index.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,YAAY,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAa7C,cAAM,KAAM,YAAW,cAAc;IACjC,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;IAC9B,QAAQ,EAAE,YAAY,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAChC,0BAA0B,EAAE,kCAAkC,CAAC;IAC/D,qBAAqB,EAAE,kCAAkC,CAAC;gBAGtD,QAAQ,GAAE,WAAW,GAAG,IAAW,EACnC,OAAO,GAAE,YAAsB;IASnC,KAAK;IAQL,eAAe;IAYf,kBAAkB;IAMlB,8BAA8B;IAwB9B,+BAA+B;IAe/B,mBAAmB,CAAC,MAAM,EAAE,WAAW;IASvC,oBAAoB;IA+BpB,MAAM;IAWN,IAAI;IAuBJ,IAAI;IAsBJ,SAAS;IAIT,QAAQ;CAGX;AASD,wBAAgB,UAAU,SAgIzB;AAOD,eAAe,KAAK,CAAC"}

270
node_modules/flowbite/lib/esm/components/modal/index.js generated vendored Normal file
View File

@@ -0,0 +1,270 @@
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var Default = {
placement: 'center',
backdropClasses: 'bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40',
backdrop: 'dynamic',
closable: true,
onHide: function () { },
onShow: function () { },
onToggle: function () { },
};
var Modal = /** @class */ (function () {
function Modal(targetEl, options) {
if (targetEl === void 0) { targetEl = null; }
if (options === void 0) { options = Default; }
this._targetEl = targetEl;
this._options = __assign(__assign({}, Default), options);
this._isHidden = true;
this._backdropEl = null;
this._init();
}
Modal.prototype._init = function () {
var _this = this;
if (this._targetEl) {
this._getPlacementClasses().map(function (c) {
_this._targetEl.classList.add(c);
});
}
};
Modal.prototype._createBackdrop = function () {
var _a;
if (this._isHidden) {
var backdropEl = document.createElement('div');
backdropEl.setAttribute('modal-backdrop', '');
(_a = backdropEl.classList).add.apply(_a, this._options.backdropClasses.split(' '));
document.querySelector('body').append(backdropEl);
this._backdropEl = backdropEl;
}
};
Modal.prototype._destroyBackdropEl = function () {
if (!this._isHidden) {
document.querySelector('[modal-backdrop]').remove();
}
};
Modal.prototype._setupModalCloseEventListeners = function () {
var _this = this;
if (this._options.backdrop === 'dynamic') {
this._clickOutsideEventListener = function (ev) {
_this._handleOutsideClick(ev.target);
};
this._targetEl.addEventListener('click', this._clickOutsideEventListener, true);
}
this._keydownEventListener = function (ev) {
if (ev.key === 'Escape') {
_this.hide();
}
};
document.body.addEventListener('keydown', this._keydownEventListener, true);
};
Modal.prototype._removeModalCloseEventListeners = function () {
if (this._options.backdrop === 'dynamic') {
this._targetEl.removeEventListener('click', this._clickOutsideEventListener, true);
}
document.body.removeEventListener('keydown', this._keydownEventListener, true);
};
Modal.prototype._handleOutsideClick = function (target) {
if (target === this._targetEl ||
(target === this._backdropEl && this.isVisible())) {
this.hide();
}
};
Modal.prototype._getPlacementClasses = function () {
switch (this._options.placement) {
// top
case 'top-left':
return ['justify-start', 'items-start'];
case 'top-center':
return ['justify-center', 'items-start'];
case 'top-right':
return ['justify-end', 'items-start'];
// center
case 'center-left':
return ['justify-start', 'items-center'];
case 'center':
return ['justify-center', 'items-center'];
case 'center-right':
return ['justify-end', 'items-center'];
// bottom
case 'bottom-left':
return ['justify-start', 'items-end'];
case 'bottom-center':
return ['justify-center', 'items-end'];
case 'bottom-right':
return ['justify-end', 'items-end'];
default:
return ['justify-center', 'items-center'];
}
};
Modal.prototype.toggle = function () {
if (this._isHidden) {
this.show();
}
else {
this.hide();
}
// callback function
this._options.onToggle(this);
};
Modal.prototype.show = function () {
if (this.isHidden) {
this._targetEl.classList.add('flex');
this._targetEl.classList.remove('hidden');
this._targetEl.setAttribute('aria-modal', 'true');
this._targetEl.setAttribute('role', 'dialog');
this._targetEl.removeAttribute('aria-hidden');
this._createBackdrop();
this._isHidden = false;
// prevent body scroll
document.body.classList.add('overflow-hidden');
// Add keyboard event listener to the document
if (this._options.closable) {
this._setupModalCloseEventListeners();
}
// callback function
this._options.onShow(this);
}
};
Modal.prototype.hide = function () {
if (this.isVisible) {
this._targetEl.classList.add('hidden');
this._targetEl.classList.remove('flex');
this._targetEl.setAttribute('aria-hidden', 'true');
this._targetEl.removeAttribute('aria-modal');
this._targetEl.removeAttribute('role');
this._destroyBackdropEl();
this._isHidden = true;
// re-apply body scroll
document.body.classList.remove('overflow-hidden');
if (this._options.closable) {
this._removeModalCloseEventListeners();
}
// callback function
this._options.onHide(this);
}
};
Modal.prototype.isVisible = function () {
return !this._isHidden;
};
Modal.prototype.isHidden = function () {
return this._isHidden;
};
return Modal;
}());
var getModalInstance = function (id, instances) {
if (instances.some(function (modalInstance) { return modalInstance.id === id; })) {
return instances.find(function (modalInstance) { return modalInstance.id === id; });
}
return null;
};
export function initModals() {
var modalInstances = [];
// initiate modal based on data-modal-target
document.querySelectorAll('[data-modal-target]').forEach(function ($triggerEl) {
var modalId = $triggerEl.getAttribute('data-modal-target');
var $modalEl = document.getElementById(modalId);
if ($modalEl) {
var placement = $modalEl.getAttribute('data-modal-placement');
var backdrop = $modalEl.getAttribute('data-modal-backdrop');
if (!getModalInstance(modalId, modalInstances)) {
modalInstances.push({
id: modalId,
object: new Modal($modalEl, {
placement: placement
? placement
: Default.placement,
backdrop: backdrop ? backdrop : Default.backdrop,
}),
});
}
}
else {
console.error("Modal with id ".concat(modalId, " does not exist. Are you sure that the data-modal-target attribute points to the correct modal id?."));
}
});
// support pre v1.6.0 data-modal-toggle initialization
document.querySelectorAll('[data-modal-toggle]').forEach(function ($triggerEl) {
var modalId = $triggerEl.getAttribute('data-modal-toggle');
var $modalEl = document.getElementById(modalId);
if ($modalEl) {
var placement = $modalEl.getAttribute('data-modal-placement');
var backdrop = $modalEl.getAttribute('data-modal-backdrop');
var modal_1 = getModalInstance(modalId, modalInstances);
if (!modal_1) {
modal_1 = {
id: modalId,
object: new Modal($modalEl, {
placement: placement
? placement
: Default.placement,
backdrop: backdrop ? backdrop : Default.backdrop,
}),
};
modalInstances.push(modal_1);
}
$triggerEl.addEventListener('click', function () {
modal_1.object.toggle();
});
}
else {
console.error("Modal with id ".concat(modalId, " does not exist. Are you sure that the data-modal-toggle attribute points to the correct modal id?"));
}
});
// show modal on click if exists based on id
document.querySelectorAll('[data-modal-show]').forEach(function ($triggerEl) {
var modalId = $triggerEl.getAttribute('data-modal-show');
var $modalEl = document.getElementById(modalId);
if ($modalEl) {
var modal_2 = getModalInstance(modalId, modalInstances);
if (modal_2) {
$triggerEl.addEventListener('click', function () {
if (modal_2.object.isHidden) {
modal_2.object.show();
}
});
}
else {
console.error("Modal with id ".concat(modalId, " has not been initialized. Please initialize it using the data-modal-target attribute."));
}
}
else {
console.error("Modal with id ".concat(modalId, " does not exist. Are you sure that the data-modal-show attribute points to the correct modal id?"));
}
});
// hide modal on click if exists based on id
document.querySelectorAll('[data-modal-hide]').forEach(function ($triggerEl) {
var modalId = $triggerEl.getAttribute('data-modal-hide');
var $modalEl = document.getElementById(modalId);
if ($modalEl) {
var modal_3 = getModalInstance(modalId, modalInstances);
if (modal_3) {
$triggerEl.addEventListener('click', function () {
if (modal_3.object.isVisible) {
modal_3.object.hide();
}
});
}
else {
console.error("Modal with id ".concat(modalId, " has not been initialized. Please initialize it using the data-modal-target attribute."));
}
}
else {
console.error("Modal with id ".concat(modalId, " does not exist. Are you sure that the data-modal-hide attribute points to the correct modal id?"));
}
});
}
if (typeof window !== 'undefined') {
window.Modal = Modal;
window.initModals = initModals;
}
export default Modal;
//# sourceMappingURL=index.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,21 @@
import { ModalOptions } from './types';
export declare interface ModalInterface {
_targetEl: HTMLElement | null;
_options: ModalOptions;
_isHidden: boolean;
_backdropEl: HTMLElement | null;
_clickOutsideEventListener: EventListenerOrEventListenerObject;
_keydownEventListener: EventListenerOrEventListenerObject;
_init(): void;
_createBackdrop(): void;
_destroyBackdropEl(): void;
_setupModalCloseEventListeners(): void;
_handleOutsideClick(target: EventTarget): void;
_getPlacementClasses(): string[];
toggle(): void;
show(): void;
hide(): void;
isHidden(): boolean;
isVisible(): boolean;
}
//# sourceMappingURL=interface.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"interface.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,MAAM,CAAC,OAAO,WAAW,cAAc;IAEnC,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;IAG9B,QAAQ,EAAE,YAAY,CAAC;IAGvB,SAAS,EAAE,OAAO,CAAC;IAGnB,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAEhC,0BAA0B,EAAE,kCAAkC,CAAC;IAE/D,qBAAqB,EAAE,kCAAkC,CAAC;IAG1D,KAAK,IAAI,IAAI,CAAC;IAGd,eAAe,IAAI,IAAI,CAAC;IAGxB,kBAAkB,IAAI,IAAI,CAAC;IAG3B,8BAA8B,IAAI,IAAI,CAAC;IAGvC,mBAAmB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAG/C,oBAAoB,IAAI,MAAM,EAAE,CAAC;IAGjC,MAAM,IAAI,IAAI,CAAC;IAGf,IAAI,IAAI,IAAI,CAAC;IAGb,IAAI,IAAI,IAAI,CAAC;IAGb,QAAQ,IAAI,OAAO,CAAC;IAGpB,SAAS,IAAI,OAAO,CAAC;CACxB"}

View File

@@ -0,0 +1,2 @@
export {};
//# sourceMappingURL=interface.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"interface.js","sourceRoot":"","sources":["../../../../src/components/modal/interface.ts"],"names":[],"mappings":""}

View File

@@ -0,0 +1,17 @@
import { ModalInterface } from './interface';
export declare type modalBackdrop = 'static' | 'dynamic';
export declare type modalPlacement = 'top-left' | 'top-center' | 'top-right' | 'center-left' | 'center' | 'center-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
export declare type ModalOptions = {
placement?: modalPlacement;
backdropClasses?: string;
backdrop?: modalBackdrop;
closable?: boolean;
onShow?: (modal: ModalInterface) => void;
onHide?: (modal: ModalInterface) => void;
onToggle?: (modal: ModalInterface) => void;
};
export declare type ModalInstance = {
id: string;
object: ModalInterface;
};
//# sourceMappingURL=types.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE7C,MAAM,CAAC,OAAO,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC;AACzD,MAAM,CAAC,OAAO,MAAM,cAAc,GAC5B,UAAU,GACV,YAAY,GACZ,WAAW,GACX,aAAa,GACb,QAAQ,GACR,cAAc,GACd,aAAa,GACb,eAAe,GACf,cAAc,CAAC;AAErB,MAAM,CAAC,OAAO,MAAM,YAAY,GAAG;IAC/B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACzC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;CAC9C,CAAC;AAEF,MAAM,CAAC,OAAO,MAAM,aAAa,GAAG;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,cAAc,CAAC;CAC1B,CAAC"}

View File

@@ -0,0 +1,2 @@
export {};
//# sourceMappingURL=types.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/modal/types.ts"],"names":[],"mappings":""}