release: 3.9.0

This commit is contained in:
Dawid Wajszczuk 2021-07-12 09:22:03 +02:00
parent 9640f31de2
commit 835b9260ef
16 changed files with 101 additions and 26 deletions

View File

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

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

4
css/mdb.min.css vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

2
css/mdb.rtl.min.css vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

4
js/mdb.min.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{
"name": "mdb-ui-kit",
"version": "3.8.1",
"version": "3.9.0",
"main": "js/mdb.min.js",
"homepage": "https://mdbootstrap.com/docs/standard/",
"repository": "https://github.com/mdbootstrap/mdb-ui-kit.git",

View File

@ -184,7 +184,6 @@ class Collapse extends BaseComponent {
}
this.setTransitioning(true);
const complete = () => {
this._element.classList.remove(CLASS_NAME_COLLAPSING);
this._element.classList.add(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW);

View File

@ -244,10 +244,9 @@ class ScrollSpy extends BaseComponent {
SelectorEngine.parents(link, SELECTOR_NAV_LIST_GROUP).forEach((listGroup) => {
// Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
SelectorEngine.prev(
listGroup,
`${SELECTOR_NAV_LINKS}, ${SELECTOR_LIST_ITEMS}`
).forEach((item) => item.classList.add(CLASS_NAME_ACTIVE));
SelectorEngine.prev(listGroup, `${SELECTOR_NAV_LINKS}, ${SELECTOR_LIST_ITEMS}`).forEach(
(item) => item.classList.add(CLASS_NAME_ACTIVE)
);
// Handle special case when .nav-link is inside .nav-item
SelectorEngine.prev(listGroup, SELECTOR_NAV_ITEMS).forEach((navItem) => {
@ -296,9 +295,9 @@ class ScrollSpy extends BaseComponent {
* ------------------------------------------------------------------------
*/
EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine.find(SELECTOR_DATA_SPY).forEach((spy) => new ScrollSpy(spy));
});
// EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
// SelectorEngine.find(SELECTOR_DATA_SPY).forEach((spy) => new ScrollSpy(spy));
// });
/**
* ------------------------------------------------------------------------

View File

@ -16,18 +16,23 @@ const EVENT_KEY = `.${DATA_KEY}`;
const DATA_API_KEY = '.data-api';
const EVENT_ACTIVATE_BS = 'activate.bs.scrollspy';
const EVENT_ACTIVATE = `activate${EVENT_KEY}`;
const SELECTOR_DATA_SPY = '[data-mdb-spy="scroll"]';
const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}`;
const CLASS_COLLAPSIBLE = 'collapsible-scrollspy';
const CLASS_ACTIVE = 'active';
const SELECTOR_LIST = 'ul';
const SELECTOR_DATA_SPY = '[data-mdb-spy="scroll"]';
const SELECTOR_ACTIVE = `.${CLASS_ACTIVE}`;
const SELECTOR_COLLAPSIBLE_SCROLLSPY = `.${CLASS_COLLAPSIBLE}`;
class ScrollSpy extends BSScrollSpy {
constructor(element, data) {
super(element, data);
this._scrollElement = element.tagName === 'BODY' ? window : element;
this._collapsibles = [];
this._init();
}
@ -46,10 +51,77 @@ class ScrollSpy extends BSScrollSpy {
// Private
_init() {
this._bindActivateEvent();
this._getCollapsibles();
if (this._collapsibles.length === 0) {
return;
}
this._showSubsection();
this._hideSubsection();
}
_getHeight(element) {
return element.offsetHeight;
}
_hide(target) {
const itemsToHide = SelectorEngine.findOne(SELECTOR_LIST, target.parentNode);
itemsToHide.style.overflow = 'hidden';
itemsToHide.style.height = `${0}px`;
}
_show(target, destinedHeight) {
target.style.height = destinedHeight;
}
_getCollapsibles() {
const collapsibleElements = SelectorEngine.find(SELECTOR_COLLAPSIBLE_SCROLLSPY);
if (!collapsibleElements) {
return;
}
collapsibleElements.forEach((collapsibleElement) => {
const listParent = collapsibleElement.parentNode;
const list = SelectorEngine.findOne(SELECTOR_LIST, listParent);
const listHeight = list.offsetHeight;
this._collapsibles.push({
element: list,
relatedTarget: collapsibleElement.getAttribute('href'),
height: `${listHeight}px`,
});
});
}
_showSubsection() {
const activeElements = SelectorEngine.find(SELECTOR_ACTIVE);
const actives = activeElements.filter((active) => {
return Manipulator.hasClass(active, CLASS_COLLAPSIBLE);
});
actives.forEach((active) => {
const list = SelectorEngine.findOne(SELECTOR_LIST, active.parentNode);
const height = this._collapsibles.find((collapsible) => {
return (collapsible.relatedTarget = active.getAttribute('href'));
}).height;
this._show(list, height);
});
}
_hideSubsection() {
const unactives = SelectorEngine.find(SELECTOR_COLLAPSIBLE_SCROLLSPY).filter((collapsible) => {
return Manipulator.hasClass(collapsible, 'active') === false;
});
unactives.forEach((unactive) => {
this._hide(unactive);
});
}
_bindActivateEvent() {
EventHandler.on(this._scrollElement, EVENT_ACTIVATE_BS, (e) => {
this._showSubsection();
this._hideSubsection();
EventHandler.trigger(this._scrollElement, EVENT_ACTIVATE, {
relatedTarget: e.relatedTarget,
});

View File

@ -25,5 +25,10 @@
$scrollspy-menu-sidebar-active-border-color;
border-radius: 0;
}
.collapsible-scrollspy ~ .nav {
transition: height 0.5s ease;
flex-wrap: nowrap;
}
}
}