You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

139 lines
4.0 KiB

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