0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-12 00:08:59 +01:00
Bootstrap/js/dist/util/backdrop.js
2022-05-13 19:44:01 +03:00

167 lines
4.3 KiB
JavaScript

/*!
* Bootstrap backdrop.js v5.2.0-beta1 (https://getbootstrap.com/)
* Copyright 2011-2022 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('../dom/event-handler'), require('./index'), require('./config')) :
typeof define === 'function' && define.amd ? define(['../dom/event-handler', './index', './config'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Backdrop = factory(global.EventHandler, global.Index, global.Config));
})(this, (function (EventHandler, index, Config) { 'use strict';
const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e };
const EventHandler__default = /*#__PURE__*/_interopDefaultLegacy(EventHandler);
const Config__default = /*#__PURE__*/_interopDefaultLegacy(Config);
/**
* --------------------------------------------------------------------------
* Bootstrap (v5.2.0-beta1): util/backdrop.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
* --------------------------------------------------------------------------
*/
/**
* Constants
*/
const NAME = 'backdrop';
const CLASS_NAME_FADE = 'fade';
const CLASS_NAME_SHOW = 'show';
const EVENT_MOUSEDOWN = `mousedown.bs.${NAME}`;
const Default = {
className: 'modal-backdrop',
isVisible: true,
// if false, we use the backdrop helper without adding any element to the dom
isAnimated: false,
rootElement: 'body',
// give the choice to place backdrop under different elements
clickCallback: null
};
const DefaultType = {
className: 'string',
isVisible: 'boolean',
isAnimated: 'boolean',
rootElement: '(element|string)',
clickCallback: '(function|null)'
};
/**
* Class definition
*/
class Backdrop extends Config__default.default {
constructor(config) {
super();
this._config = this._getConfig(config);
this._isAppended = false;
this._element = null;
} // Getters
static get Default() {
return Default;
}
static get DefaultType() {
return DefaultType;
}
static get NAME() {
return NAME;
} // Public
show(callback) {
if (!this._config.isVisible) {
index.execute(callback);
return;
}
this._append();
const element = this._getElement();
if (this._config.isAnimated) {
index.reflow(element);
}
element.classList.add(CLASS_NAME_SHOW);
this._emulateAnimation(() => {
index.execute(callback);
});
}
hide(callback) {
if (!this._config.isVisible) {
index.execute(callback);
return;
}
this._getElement().classList.remove(CLASS_NAME_SHOW);
this._emulateAnimation(() => {
this.dispose();
index.execute(callback);
});
}
dispose() {
if (!this._isAppended) {
return;
}
EventHandler__default.default.off(this._element, EVENT_MOUSEDOWN);
this._element.remove();
this._isAppended = false;
} // Private
_getElement() {
if (!this._element) {
const backdrop = document.createElement('div');
backdrop.className = this._config.className;
if (this._config.isAnimated) {
backdrop.classList.add(CLASS_NAME_FADE);
}
this._element = backdrop;
}
return this._element;
}
_configAfterMerge(config) {
// use getElement() with the default "body" to get a fresh Element on each instantiation
config.rootElement = index.getElement(config.rootElement);
return config;
}
_append() {
if (this._isAppended) {
return;
}
const element = this._getElement();
this._config.rootElement.append(element);
EventHandler__default.default.on(element, EVENT_MOUSEDOWN, () => {
index.execute(this._config.clickCallback);
});
this._isAppended = true;
}
_emulateAnimation(callback) {
index.executeAfterTransition(callback, this._getElement(), this._config.isAnimated);
}
}
return Backdrop;
}));
//# sourceMappingURL=backdrop.js.map