mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2024-11-10 19:57:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

release: 7.3.2

Browse Source
This commit is contained in:
k.pienkowska 2024-06-17 09:17:01 +02:00
parent 6e36747893
commit 4b70601400
13 changed files with 395 additions and 295 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.txt
View File

@ -1,5 +1,5 @@
MDB5
Version: FREE 7.3.1
Version: FREE 7.3.2
Documentation:
https://mdbootstrap.com/docs/standard/

2
css/mdb.dark.min.css vendored
View File

@ -1,6 +1,6 @@
/*!
* MDB5
* Version: FREE 7.3.1
* Version: FREE 7.3.2
*
*
* Copyright: Material Design for Bootstrap

2
css/mdb.dark.min.css.map
View File

File diff suppressed because one or more lines are too long

2
css/mdb.dark.rtl.min.css vendored
View File

@ -1,6 +1,6 @@
/*!
* MDB5
* Version: FREE 7.3.1
* Version: FREE 7.3.2
*
*
* Copyright: Material Design for Bootstrap

2
css/mdb.min.css vendored
View File

@ -1,6 +1,6 @@
/*!
* MDB5
* Version: FREE 7.3.1
* Version: FREE 7.3.2
*
*
* Copyright: Material Design for Bootstrap

2
css/mdb.min.css.map
View File

File diff suppressed because one or more lines are too long

2
css/mdb.rtl.min.css vendored
View File

@ -1,6 +1,6 @@
/*!
* MDB5
* Version: FREE 7.3.1
* Version: FREE 7.3.2
*
*
* Copyright: Material Design for Bootstrap

309
js/mdb.es.min.js vendored
View File

@ -7340,9 +7340,13 @@ class Range extends BaseComponent2 {
});
}
}
const callbackInitState = /* @__PURE__ */ new Map();
const alertCallback = (component, initSelector) => {
const Alert3 = component;
enableDismissTrigger(Alert3, "close");
if (!callbackInitState.has(component.name)) {
enableDismissTrigger(Alert3);
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(initSelector).forEach((element2) => {
return Alert3.getOrCreateInstance(element2);
});
@ -7350,17 +7354,23 @@ const alertCallback = (component, initSelector) => {
const buttonCallback = (component, initSelector) => {
const Button3 = component;
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, (event) => {
event.preventDefault();
const button = event.target.closest(initSelector);
const data = Button3.getOrCreateInstance(button);
data.toggle();
});
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, (event) => {
event.preventDefault();
const button = event.target.closest(initSelector);
const data = Button3.getOrCreateInstance(button);
data.toggle();
});
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(initSelector).forEach((element2) => {
return Button3.getOrCreateInstance(element2);
});
};
const carouselCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
const SELECTOR_DATA_SLIDE = "[data-mdb-slide], [data-mdb-slide-to]";
const CLASS_NAME_CAROUSEL2 = "carousel";
@ -7394,21 +7404,25 @@ const carouselCallback = (component, initSelector) => {
Carousel3.getOrCreateInstance(carousel);
});
});
callbackInitState.set(component.name, true);
};
const collapseCallback = (component, initSelector) => {
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
const SELECTOR_DATA_TOGGLE2 = initSelector;
const Collapse3 = component;
EventHandler$1.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE2, function(event) {
if (event.target.tagName === "A" || event.delegateTarget && event.delegateTarget.tagName === "A") {
event.preventDefault();
}
const selector = getSelectorFromElement(this);
const selectorElements = SelectorEngine$1.find(selector);
selectorElements.forEach((element2) => {
Collapse3.getOrCreateInstance(element2, { toggle: false }).toggle();
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE2, function(event) {
if (event.target.tagName === "A" || event.delegateTarget && event.delegateTarget.tagName === "A") {
event.preventDefault();
}
const selector = getSelectorFromElement(this);
const selectorElements = SelectorEngine$1.find(selector);
selectorElements.forEach((element2) => {
Collapse3.getOrCreateInstance(element2, { toggle: false }).toggle();
});
});
});
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(SELECTOR_DATA_TOGGLE2).forEach((el) => {
const selector = getSelectorFromElement(el);
const selectorElements = SelectorEngine$1.find(selector);
@ -7424,19 +7438,27 @@ const dropdownCallback = (component, initSelector) => {
const SELECTOR_MENU2 = ".dropdown-menu";
const SELECTOR_DATA_TOGGLE2 = `[data-mdb-${component.NAME}-initialized]`;
const Dropdown3 = component;
EventHandler$1.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_DATA_TOGGLE2,
Dropdown3.dataApiKeydownHandler
);
EventHandler$1.on(document, EVENT_KEYDOWN_DATA_API, SELECTOR_MENU2, Dropdown3.dataApiKeydownHandler);
EventHandler$1.on(document, EVENT_CLICK_DATA_API, Dropdown3.clearMenus);
EventHandler$1.on(document, EVENT_KEYUP_DATA_API, Dropdown3.clearMenus);
EventHandler$1.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE2, function(event) {
event.preventDefault();
Dropdown3.getOrCreateInstance(this).toggle();
});
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_DATA_TOGGLE2,
Dropdown3.dataApiKeydownHandler
);
EventHandler$1.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_MENU2,
Dropdown3.dataApiKeydownHandler
);
EventHandler$1.on(document, EVENT_CLICK_DATA_API, Dropdown3.clearMenus);
EventHandler$1.on(document, EVENT_KEYUP_DATA_API, Dropdown3.clearMenus);
EventHandler$1.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE2, function(event) {
event.preventDefault();
Dropdown3.getOrCreateInstance(this).toggle();
});
}
callbackInitState.set(component.name, true);
SelectorEngine$1.find(initSelector).forEach((el) => {
Dropdown3.getOrCreateInstance(el);
});
@ -7446,31 +7468,56 @@ const inputCallback = (component, initSelector) => {
const SELECTOR_OUTLINE_INPUT = `${SELECTOR_DATA_INIT} input`;
const SELECTOR_OUTLINE_TEXTAREA = `${SELECTOR_DATA_INIT} textarea`;
const Input2 = component;
EventHandler$1.on(document, "focus", SELECTOR_OUTLINE_INPUT, Input2.activate(new Input2()));
EventHandler$1.on(document, "input", SELECTOR_OUTLINE_INPUT, Input2.activate(new Input2()));
EventHandler$1.on(document, "blur", SELECTOR_OUTLINE_INPUT, Input2.deactivate(new Input2()));
EventHandler$1.on(document, "focus", SELECTOR_OUTLINE_TEXTAREA, Input2.activate(new Input2()));
EventHandler$1.on(document, "input", SELECTOR_OUTLINE_TEXTAREA, Input2.activate(new Input2()));
EventHandler$1.on(document, "blur", SELECTOR_OUTLINE_TEXTAREA, Input2.deactivate(new Input2()));
EventHandler$1.on(window, "shown.bs.modal", (e) => {
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(document, "focus", SELECTOR_OUTLINE_INPUT, Input2.activate(new Input2()));
EventHandler$1.on(document, "input", SELECTOR_OUTLINE_INPUT, Input2.activate(new Input2()));
EventHandler$1.on(document, "blur", SELECTOR_OUTLINE_INPUT, Input2.deactivate(new Input2()));
EventHandler$1.on(document, "focus", SELECTOR_OUTLINE_TEXTAREA, Input2.activate(new Input2()));
EventHandler$1.on(document, "input", SELECTOR_OUTLINE_TEXTAREA, Input2.activate(new Input2()));
EventHandler$1.on(document, "blur", SELECTOR_OUTLINE_TEXTAREA, Input2.deactivate(new Input2()));
EventHandler$1.on(window, "shown.bs.modal", (e) => {
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
});
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
EventHandler$1.on(window, "shown.bs.dropdown", (e) => {
const target = e.target.parentNode.querySelector(".dropdown-menu");
if (target) {
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
});
}
instance.update();
});
});
EventHandler$1.on(window, "shown.bs.dropdown", (e) => {
const target = e.target.parentNode.querySelector(".dropdown-menu");
if (target) {
EventHandler$1.on(window, "shown.bs.tab", (e) => {
let targetId;
if (e.target.href) {
targetId = e.target.href.split("#")[1];
} else {
targetId = Manipulator$1.getDataAttribute(e.target, "target").split("#")[1];
}
const target = SelectorEngine$1.findOne(`#${targetId}`);
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
@ -7485,55 +7532,33 @@ const inputCallback = (component, initSelector) => {
}
instance.update();
});
}
});
EventHandler$1.on(window, "shown.bs.tab", (e) => {
let targetId;
if (e.target.href) {
targetId = e.target.href.split("#")[1];
} else {
targetId = Manipulator$1.getDataAttribute(e.target, "target").split("#")[1];
}
const target = SelectorEngine$1.findOne(`#${targetId}`);
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
});
EventHandler$1.on(window, "reset", (e) => {
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
});
EventHandler$1.on(window, "onautocomplete", (e) => {
const instance = Input2.getInstance(e.target.parentNode);
if (!instance || !e.cancelable) {
return;
}
instance.update();
instance.forceActive();
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.update();
});
});
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(SELECTOR_DATA_INIT).map((element2) => Input2.getOrCreateInstance(element2));
EventHandler$1.on(window, "reset", (e) => {
SelectorEngine$1.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
SelectorEngine$1.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element2) => {
const instance = Input2.getInstance(element2.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
});
EventHandler$1.on(window, "onautocomplete", (e) => {
const instance = Input2.getInstance(e.target.parentNode);
if (!instance || !e.cancelable) {
return;
}
instance.forceActive();
});
};
const modalCallback = (component, initSelector) => {
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
@ -7541,31 +7566,34 @@ const modalCallback = (component, initSelector) => {
const Modal3 = component;
const EVENT_SHOW2 = `show.bs.${component.name}`;
const EVENT_HIDDEN2 = `hidden.bs.${component.name}`;
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, function(event) {
const target = getElementFromSelector(this);
if (["A", "AREA"].includes(this.tagName)) {
event.preventDefault();
}
EventHandler$1.one(target, EVENT_SHOW2, (showEvent) => {
if (showEvent.defaultPrevented) {
return;
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, function(event) {
const target = getElementFromSelector(this);
if (["A", "AREA"].includes(this.tagName)) {
event.preventDefault();
}
EventHandler$1.one(target, EVENT_HIDDEN2, () => {
if (isVisible$1(this)) {
this.focus();
EventHandler$1.one(target, EVENT_SHOW2, (showEvent) => {
if (showEvent.defaultPrevented) {
return;
}
EventHandler$1.one(target, EVENT_HIDDEN2, () => {
if (isVisible$1(this)) {
this.focus();
}
});
});
const alreadyOpenedModals = SelectorEngine$1.find(OPEN_SELECTOR);
alreadyOpenedModals.forEach((modal) => {
if (!modal.classList.contains("modal-non-invasive-show")) {
Modal3.getInstance(modal).hide();
}
});
const data = Modal3.getOrCreateInstance(target);
data.toggle(this);
});
const alreadyOpenedModals = SelectorEngine$1.find(OPEN_SELECTOR);
alreadyOpenedModals.forEach((modal) => {
if (!modal.classList.contains("modal-non-invasive-show")) {
Modal3.getInstance(modal).hide();
}
});
const data = Modal3.getOrCreateInstance(target);
data.toggle(this);
});
enableDismissTrigger(Modal3);
enableDismissTrigger(Modal3);
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(initSelector).forEach((el) => {
const selector = getSelectorFromElement(el);
const selectorElement = SelectorEngine$1.findOne(selector);
@ -7573,6 +7601,9 @@ const modalCallback = (component, initSelector) => {
});
};
const offcanvasCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
const OPEN_SELECTOR = ".offcanvas.show";
const Offcanvas2 = component;
@ -7612,8 +7643,12 @@ const offcanvasCallback = (component, initSelector) => {
});
});
enableDismissTrigger(Offcanvas2);
callbackInitState.set(component.name, true);
};
const scrollspyCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_LOAD_DATA_API = `load.bs.${component.name}.data-api`;
const ScrollSpy3 = component;
EventHandler$1.on(window, EVENT_LOAD_DATA_API, () => {
@ -7621,6 +7656,7 @@ const scrollspyCallback = (component, initSelector) => {
ScrollSpy3.getOrCreateInstance(el);
});
});
callbackInitState.set(component.name, true);
};
const tabCallback = (component, initSelector) => {
const EVENT_LOAD_DATA_API = `load.bs.${component.name}.data-api`;
@ -7628,31 +7664,40 @@ const tabCallback = (component, initSelector) => {
const CLASS_NAME_ACTIVE2 = "active";
const SELECTOR_DATA_TOGGLE_ACTIVE = `.${CLASS_NAME_ACTIVE2}[data-mdb-tab-init], .${CLASS_NAME_ACTIVE2}[data-mdb-pill-init], .${CLASS_NAME_ACTIVE2}[data-mdb-toggle="list"]`;
const Tab3 = component;
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, function(event) {
if (["A", "AREA"].includes(this.tagName)) {
event.preventDefault();
}
if (isDisabled$1(this)) {
return;
}
Tab3.getOrCreateInstance(this).show();
});
EventHandler$1.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine$1.find(SELECTOR_DATA_TOGGLE_ACTIVE).forEach((element2) => {
Tab3.getOrCreateInstance(element2);
if (!callbackInitState.has(component.name)) {
EventHandler$1.on(document, EVENT_CLICK_DATA_API, initSelector, function(event) {
if (["A", "AREA"].includes(this.tagName)) {
event.preventDefault();
}
if (isDisabled$1(this)) {
return;
}
Tab3.getOrCreateInstance(this).show();
});
});
EventHandler$1.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine$1.find(SELECTOR_DATA_TOGGLE_ACTIVE).forEach((element2) => {
Tab3.getOrCreateInstance(element2);
});
});
callbackInitState.set(component.name, true);
}
};
const toastCallback = (component, initSelector) => {
const Toast3 = component;
enableDismissTrigger(Toast3);
if (!callbackInitState.has(component.name)) {
enableDismissTrigger(Toast3);
callbackInitState.set(component.name, true);
}
SelectorEngine$1.find(initSelector).forEach((element2) => {
return Toast3.getOrCreateInstance(element2);
});
};
const rippleCallback = (component, initSelector) => {
const Ripple2 = component;
EventHandler$1.one(document, "mousedown", initSelector, Ripple2.autoInitial(new Ripple2()));
if (!callbackInitState.has(component.name)) {
EventHandler$1.one(document, "mousedown", initSelector, Ripple2.autoInitial(new Ripple2()));
callbackInitState.set(component.name, true);
}
};
const defaultInitSelectors = {
// Bootstrap Components

2
js/mdb.es.min.js.map
View File

File diff suppressed because one or more lines are too long

4
js/mdb.umd.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
js/mdb.umd.min.js.map
View File

File diff suppressed because one or more lines are too long

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "mdb-ui-kit",
"version": "7.3.1",
"version": "7.3.2",
"type": "module",
"main": "./js/mdb.umd.min.js",
"module": "./js/mdb.es.min.js",

357
src/js/autoinit/callbacks/free.js
View File

@ -9,10 +9,15 @@ import {
} from '../../mdb/util';
import { enableDismissTrigger } from '../../bootstrap/mdb-prefix/util/component-functions';
const callbackInitState = new Map();
const alertCallback = (component, initSelector) => {
const Alert = component;
enableDismissTrigger(Alert, 'close');
if (!callbackInitState.has(component.name)) {
enableDismissTrigger(Alert);
callbackInitState.set(component.name, true);
}
// MDB init
SelectorEngine.find(initSelector).forEach((element) => {
@ -24,15 +29,18 @@ const buttonCallback = (component, initSelector) => {
const Button = component;
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
// BS init
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, (event) => {
event.preventDefault();
if (!callbackInitState.has(component.name)) {
// BS init
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, (event) => {
event.preventDefault();
const button = event.target.closest(initSelector);
const data = Button.getOrCreateInstance(button);
const button = event.target.closest(initSelector);
const data = Button.getOrCreateInstance(button);
data.toggle();
});
data.toggle();
});
callbackInitState.set(component.name, true);
}
// MDB init
SelectorEngine.find(initSelector).forEach((element) => {
@ -41,6 +49,10 @@ const buttonCallback = (component, initSelector) => {
};
const carouselCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
const SELECTOR_DATA_SLIDE = '[data-mdb-slide], [data-mdb-slide-to]';
const CLASS_NAME_CAROUSEL = 'carousel';
@ -83,6 +95,8 @@ const carouselCallback = (component, initSelector) => {
Carousel.getOrCreateInstance(carousel);
});
});
callbackInitState.set(component.name, true);
};
const collapseCallback = (component, initSelector) => {
@ -90,22 +104,26 @@ const collapseCallback = (component, initSelector) => {
const SELECTOR_DATA_TOGGLE = initSelector;
const Collapse = component;
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (
event.target.tagName === 'A' ||
(event.delegateTarget && event.delegateTarget.tagName === 'A')
) {
event.preventDefault();
}
if (!callbackInitState.has(component.name)) {
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (
event.target.tagName === 'A' ||
(event.delegateTarget && event.delegateTarget.tagName === 'A')
) {
event.preventDefault();
}
const selector = getSelectorFromElement(this);
const selectorElements = SelectorEngine.find(selector);
const selector = getSelectorFromElement(this);
const selectorElements = SelectorEngine.find(selector);
selectorElements.forEach((element) => {
Collapse.getOrCreateInstance(element, { toggle: false }).toggle();
selectorElements.forEach((element) => {
Collapse.getOrCreateInstance(element, { toggle: false }).toggle();
});
});
});
callbackInitState.set(component.name, true);
}
SelectorEngine.find(SELECTOR_DATA_TOGGLE).forEach((el) => {
const selector = getSelectorFromElement(el);
@ -125,19 +143,28 @@ const dropdownCallback = (component, initSelector) => {
const SELECTOR_DATA_TOGGLE = `[data-mdb-${component.NAME}-initialized]`;
const Dropdown = component;
EventHandler.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_DATA_TOGGLE,
Dropdown.dataApiKeydownHandler
);
EventHandler.on(document, EVENT_KEYDOWN_DATA_API, SELECTOR_MENU, Dropdown.dataApiKeydownHandler);
EventHandler.on(document, EVENT_CLICK_DATA_API, Dropdown.clearMenus);
EventHandler.on(document, EVENT_KEYUP_DATA_API, Dropdown.clearMenus);
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
event.preventDefault();
Dropdown.getOrCreateInstance(this).toggle();
});
if (!callbackInitState.has(component.name)) {
EventHandler.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_DATA_TOGGLE,
Dropdown.dataApiKeydownHandler
);
EventHandler.on(
document,
EVENT_KEYDOWN_DATA_API,
SELECTOR_MENU,
Dropdown.dataApiKeydownHandler
);
EventHandler.on(document, EVENT_CLICK_DATA_API, Dropdown.clearMenus);
EventHandler.on(document, EVENT_KEYUP_DATA_API, Dropdown.clearMenus);
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
event.preventDefault();
Dropdown.getOrCreateInstance(this).toggle();
});
}
callbackInitState.set(component.name, true);
SelectorEngine.find(initSelector).forEach((el) => {
Dropdown.getOrCreateInstance(el);
@ -150,34 +177,62 @@ const inputCallback = (component, initSelector) => {
const SELECTOR_OUTLINE_TEXTAREA = `${SELECTOR_DATA_INIT} textarea`;
const Input = component;
EventHandler.on(document, 'focus', SELECTOR_OUTLINE_INPUT, Input.activate(new Input()));
EventHandler.on(document, 'input', SELECTOR_OUTLINE_INPUT, Input.activate(new Input()));
EventHandler.on(document, 'blur', SELECTOR_OUTLINE_INPUT, Input.deactivate(new Input()));
if (!callbackInitState.has(component.name)) {
EventHandler.on(document, 'focus', SELECTOR_OUTLINE_INPUT, Input.activate(new Input()));
EventHandler.on(document, 'input', SELECTOR_OUTLINE_INPUT, Input.activate(new Input()));
EventHandler.on(document, 'blur', SELECTOR_OUTLINE_INPUT, Input.deactivate(new Input()));
EventHandler.on(document, 'focus', SELECTOR_OUTLINE_TEXTAREA, Input.activate(new Input()));
EventHandler.on(document, 'input', SELECTOR_OUTLINE_TEXTAREA, Input.activate(new Input()));
EventHandler.on(document, 'blur', SELECTOR_OUTLINE_TEXTAREA, Input.deactivate(new Input()));
EventHandler.on(document, 'focus', SELECTOR_OUTLINE_TEXTAREA, Input.activate(new Input()));
EventHandler.on(document, 'input', SELECTOR_OUTLINE_TEXTAREA, Input.activate(new Input()));
EventHandler.on(document, 'blur', SELECTOR_OUTLINE_TEXTAREA, Input.deactivate(new Input()));
EventHandler.on(window, 'shown.bs.modal', (e) => {
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
EventHandler.on(window, 'shown.bs.modal', (e) => {
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
});
EventHandler.on(window, 'shown.bs.dropdown', (e) => {
const target = e.target.parentNode.querySelector('.dropdown-menu');
if (target) {
EventHandler.on(window, 'shown.bs.dropdown', (e) => {
const target = e.target.parentNode.querySelector('.dropdown-menu');
if (target) {
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
}
});
EventHandler.on(window, 'shown.bs.tab', (e) => {
let targetId;
if (e.target.href) {
targetId = e.target.href.split('#')[1];
} else {
targetId = Manipulator.getDataAttribute(e.target, 'target').split('#')[1];
}
const target = SelectorEngine.findOne(`#${targetId}`);
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
@ -192,64 +247,40 @@ const inputCallback = (component, initSelector) => {
}
instance.update();
});
}
});
});
EventHandler.on(window, 'shown.bs.tab', (e) => {
let targetId;
// form reset handler
EventHandler.on(window, 'reset', (e) => {
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
});
if (e.target.href) {
targetId = e.target.href.split('#')[1];
} else {
targetId = Manipulator.getDataAttribute(e.target, 'target').split('#')[1];
}
const target = SelectorEngine.findOne(`#${targetId}`);
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
// auto-fill
EventHandler.on(window, 'onautocomplete', (e) => {
const instance = Input.getInstance(e.target.parentNode);
if (!instance || !e.cancelable) {
return;
}
instance.update();
instance.forceActive();
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.update();
});
});
callbackInitState.set(component.name, true);
}
// auto-init
SelectorEngine.find(SELECTOR_DATA_INIT).map((element) => Input.getOrCreateInstance(element));
// form reset handler
EventHandler.on(window, 'reset', (e) => {
SelectorEngine.find(SELECTOR_OUTLINE_INPUT, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
SelectorEngine.find(SELECTOR_OUTLINE_TEXTAREA, e.target).forEach((element) => {
const instance = Input.getInstance(element.parentNode);
if (!instance) {
return;
}
instance.forceInactive();
});
});
// auto-fill
EventHandler.on(window, 'onautocomplete', (e) => {
const instance = Input.getInstance(e.target.parentNode);
if (!instance || !e.cancelable) {
return;
}
instance.forceActive();
});
};
const modalCallback = (component, initSelector) => {
@ -259,40 +290,43 @@ const modalCallback = (component, initSelector) => {
const EVENT_SHOW = `show.bs.${component.name}`;
const EVENT_HIDDEN = `hidden.bs.${component.name}`;
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, function (event) {
const target = getElementFromSelector(this);
if (!callbackInitState.has(component.name)) {
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, function (event) {
const target = getElementFromSelector(this);
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault();
}
EventHandler.one(target, EVENT_SHOW, (showEvent) => {
if (showEvent.defaultPrevented) {
// only register focus restorer if modal will actually get shown
return;
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault();
}
EventHandler.one(target, EVENT_HIDDEN, () => {
if (isVisible(this)) {
this.focus();
EventHandler.one(target, EVENT_SHOW, (showEvent) => {
if (showEvent.defaultPrevented) {
// only register focus restorer if modal will actually get shown
return;
}
EventHandler.one(target, EVENT_HIDDEN, () => {
if (isVisible(this)) {
this.focus();
}
});
});
// avoid conflict when clicking modal toggler while another one is open
const alreadyOpenedModals = SelectorEngine.find(OPEN_SELECTOR);
alreadyOpenedModals.forEach((modal) => {
if (!modal.classList.contains('modal-non-invasive-show')) {
Modal.getInstance(modal).hide();
}
});
const data = Modal.getOrCreateInstance(target);
data.toggle(this);
});
// avoid conflict when clicking modal toggler while another one is open
const alreadyOpenedModals = SelectorEngine.find(OPEN_SELECTOR);
alreadyOpenedModals.forEach((modal) => {
if (!modal.classList.contains('modal-non-invasive-show')) {
Modal.getInstance(modal).hide();
}
});
const data = Modal.getOrCreateInstance(target);
data.toggle(this);
});
enableDismissTrigger(Modal);
enableDismissTrigger(Modal);
callbackInitState.set(component.name, true);
}
SelectorEngine.find(initSelector).forEach((el) => {
const selector = getSelectorFromElement(el);
@ -312,6 +346,10 @@ const popoverCallback = (component, initSelector) => {
};
const offcanvasCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_CLICK_DATA_API = `click.bs.${component.name}.data-api`;
const OPEN_SELECTOR = '.offcanvas.show';
const Offcanvas = component;
@ -362,9 +400,14 @@ const offcanvasCallback = (component, initSelector) => {
});
enableDismissTrigger(Offcanvas);
callbackInitState.set(component.name, true);
};
const scrollspyCallback = (component, initSelector) => {
if (callbackInitState.has(component.name)) {
return;
}
const EVENT_LOAD_DATA_API = `load.bs.${component.name}.data-api`;
const ScrollSpy = component;
@ -373,6 +416,8 @@ const scrollspyCallback = (component, initSelector) => {
ScrollSpy.getOrCreateInstance(el);
});
});
callbackInitState.set(component.name, true);
};
const tabCallback = (component, initSelector) => {
@ -382,29 +427,36 @@ const tabCallback = (component, initSelector) => {
const SELECTOR_DATA_TOGGLE_ACTIVE = `.${CLASS_NAME_ACTIVE}[data-mdb-tab-init], .${CLASS_NAME_ACTIVE}[data-mdb-pill-init], .${CLASS_NAME_ACTIVE}[data-mdb-toggle="list"]`;
const Tab = component;
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, function (event) {
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault();
}
if (!callbackInitState.has(component.name)) {
EventHandler.on(document, EVENT_CLICK_DATA_API, initSelector, function (event) {
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault();
}
if (isDisabled(this)) {
return;
}
if (isDisabled(this)) {
return;
}
Tab.getOrCreateInstance(this).show();
});
EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine.find(SELECTOR_DATA_TOGGLE_ACTIVE).forEach((element) => {
Tab.getOrCreateInstance(element);
Tab.getOrCreateInstance(this).show();
});
});
EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine.find(SELECTOR_DATA_TOGGLE_ACTIVE).forEach((element) => {
Tab.getOrCreateInstance(element);
});
});
callbackInitState.set(component.name, true);
}
};
const toastCallback = (component, initSelector) => {
const Toast = component;
enableDismissTrigger(Toast);
if (!callbackInitState.has(component.name)) {
enableDismissTrigger(Toast);
callbackInitState.set(component.name, true);
}
// MDB init
SelectorEngine.find(initSelector).forEach((element) => {
@ -415,7 +467,10 @@ const toastCallback = (component, initSelector) => {
const rippleCallback = (component, initSelector) => {
const Ripple = component;
EventHandler.one(document, 'mousedown', initSelector, Ripple.autoInitial(new Ripple()));
if (!callbackInitState.has(component.name)) {
EventHandler.one(document, 'mousedown', initSelector, Ripple.autoInitial(new Ripple()));
callbackInitState.set(component.name, true);
}
};
export {