https://www.sabanciuniv.edu/libraries/twbs/js/dist/util/backdrop.js

1/*!
2  * Bootstrap backdrop.js v5.3.8 (https://getbootstrap.com/)
3  * Copyright 2011-2025 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
4  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5  */
6(function (global, factory) {
7  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('../dom/event-handler.js'), require('./config.js'), require('./index.js')) :
8  typeof define === 'function' && define.amd ? define(['../dom/event-handler', './config', './index'], factory) :
9  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Backdrop = factory(global.EventHandler, global.Config, global.Index));
10})(this, (function (EventHandler, Config, index_js) { 'use strict';
11
12  /**
13   * --------------------------------------------------------------------------
14   * Bootstrap util/backdrop.js
15   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
16   * --------------------------------------------------------------------------
17   */
18
19
20  /**
21   * Constants
22   */
23
24  const NAME = 'backdrop';
25  const CLASS_NAME_FADE = 'fade';
26  const CLASS_NAME_SHOW = 'show';
27  const EVENT_MOUSEDOWN = `mousedown.bs.${NAME}`;
28  const Default = {
29    className: 'modal-backdrop',
30    clickCallback: null,
31    isAnimated: false,
32    isVisible: true,
33    // if false, we use the backdrop helper without adding any element to the dom
34    rootElement: 'body' // give the choice to place backdrop under different elements
35  };
36  const DefaultType = {
37    className: 'string',
38    clickCallback: '(function|null)',
39    isAnimated: 'boolean',
40    isVisible: 'boolean',
41    rootElement: '(element|string)'
42  };
43
44  /**
45   * Class definition
46   */
47
48  class Backdrop extends Config {
49    constructor(config) {
50      super();
51      this._config = this._getConfig(config);
52      this._isAppended = false;
53      this._element = null;
54    }
55
56    // Getters
57    static get Default() {
58      return Default;
59    }
60    static get DefaultType() {
61      return DefaultType;
62    }
63    static get NAME() {
64      return NAME;
65    }
66
67    // Public
68    show(callback) {
69      if (!this._config.isVisible) {
70        index_js.execute(callback);
71        return;
72      }
73      this._append();
74      const element = this._getElement();
75      if (this._config.isAnimated) {
76        index_js.reflow(element);
77      }
78      element.classList.add(CLASS_NAME_SHOW);
79      this._emulateAnimation(() => {
80        index_js.execute(callback);
81      });
82    }
83    hide(callback) {
84      if (!this._config.isVisible) {
85        index_js.execute(callback);
86        return;
87      }
88      this._getElement().classList.remove(CLASS_NAME_SHOW);
89      this._emulateAnimation(() => {
90        this.dispose();
91        index_js.execute(callback);
92      });
93    }
94    dispose() {
95      if (!this._isAppended) {
96        return;
97      }
98      EventHandler.off(this._element, EVENT_MOUSEDOWN);
99      this._element.remove();
100      this._isAppended = false;
101    }
102
103    // Private
104    _getElement() {
105      if (!this._element) {
106        const backdrop = document.createElement('div');
107        backdrop.className = this._config.className;
108        if (this._config.isAnimated) {
109          backdrop.classList.add(CLASS_NAME_FADE);
110        }
111        this._element = backdrop;
112      }
113      return this._element;
114    }
115    _configAfterMerge(config) {
116      // use getElement() with the default "body" to get a fresh Element on each instantiation
117      config.rootElement = index_js.getElement(config.rootElement);
118      return config;
119    }
120    _append() {
121      if (this._isAppended) {
122        return;
123      }
124      const element = this._getElement();
125      this._config.rootElement.append(element);
126      EventHandler.on(element, EVENT_MOUSEDOWN, () => {
127        index_js.execute(this._config.clickCallback);
128      });
129      this._isAppended = true;
130    }
131    _emulateAnimation(callback) {
132      index_js.executeAfterTransition(callback, this._getElement(), this._config.isAnimated);
133    }
134  }
135
136  return Backdrop;
137
138}));
139//# sourceMappingURL=backdrop.js.map