Release 1.0.0

This commit is contained in:
unknown 2020-12-30 15:32:25 +01:00
parent fb899c03d1
commit 06f54f51de
10 changed files with 11 additions and 200 deletions

View File

@ -2,7 +2,7 @@
![MDB Logo](https://mdbootstrap.com/img/Marketing/general/logo/medium/mdb-r.png) ![MDB Logo](https://mdbootstrap.com/img/Marketing/general/logo/medium/mdb-r.png)
# MDB 5 Beta # MDB 5
### Bootstrap 5 & Material Design 2.0 UI KIT ### Bootstrap 5 & Material Design 2.0 UI KIT

View File

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

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

6
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", "name": "mdb-ui-kit",
"version": "1.0.0-beta2", "version": "1.0.0",
"main": "js/mdb.min.js", "main": "js/mdb.min.js",
"repository": "https://github.com/mdbootstrap/mdb-ui-kit.git", "repository": "https://github.com/mdbootstrap/mdb-ui-kit.git",
"author": "MDBootstrap", "author": "MDBootstrap",

View File

@ -1,187 +0,0 @@
import { element, getjQuery } from '../mdb/util/index';
import Data from '../mdb/dom/data';
import EventHandler from '../bootstrap/src/dom/event-handler';
import Manipulator from '../mdb/dom/manipulator';
import SelectorEngine from '../mdb/dom/selector-engine';
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
const NAME = 'treeview';
const DATA_KEY = 'mdb.treeview';
const CLASSNAME_TREEVIEW = 'treeview';
const SELECTOR_EXPAND = '[data-toggle="treeview"]';
/**
* ------------------------------------------------------------------------
* Class Definition
* ------------------------------------------------------------------------
*/
class Treeview {
constructor(element, data) {
this._element = element;
if (this._element) {
this._data = data ? this._createHTMLNodes(data, element) : this._setData(element);
Data.setData(element, DATA_KEY, this);
Manipulator.addClass(this._element, CLASSNAME_TREEVIEW);
this._constructTreeview(this._data);
}
}
// Getters
static get NAME() {
return NAME;
}
// Public
collapse() {
const [, ...innerLists] = SelectorEngine.find('ul', this._element);
innerLists.forEach((node) => (node.style.display = 'none'));
}
dispose() {
Data.removeData(this._element, DATA_KEY);
this._element = null;
}
// Private
_toggleSubmenu(e) {
e.stopPropagation();
const li = e.target.nodeName === 'I' ? e.target.parentNode : e.target;
const [ul] =
li.nodeName === 'I'
? SelectorEngine.children(li.parentNode, 'ul')
: SelectorEngine.children(li, 'ul');
if (ul) {
ul.style.display = window.getComputedStyle(ul).display === 'none' ? 'block' : 'none';
this._toggleIcon(li);
}
}
_toggleIcon(el, icon1 = 'fa-caret-down', icon2 = 'fa-caret-up') {
const [i] = SelectorEngine.children(el, 'i');
if (!i) return;
const faClasses = [icon1, icon2];
const [current, next] = i.classList.contains(icon1) ? faClasses : faClasses.reverse();
i.classList.remove(current);
i.classList.add(next);
}
_constructTreeview(data) {
data.forEach((el) => {
el.node.addEventListener('click', this._toggleSubmenu.bind(this));
if (el.children && el.children.length > 0) {
const arrow = element('i');
arrow.classList = ['fas fa-caret-down'];
el.node.appendChild(arrow);
this._constructTreeview(el.children);
}
});
}
_setData(el) {
const [list] = SelectorEngine.children(el, 'ul');
if (!list) return [];
return SelectorEngine.children(list, 'li').map((node) => {
const children = this._setData(node);
return {
name: node.innerText ? node.innerText.split('\n')[0] : '',
node,
children,
};
});
}
_createHTMLNodes(data, parent) {
const ul = element('ul');
return data.map((item) => {
const li = element('li');
li.innerText = item.name;
let children = item.children;
if (children && children.length > 0) {
children = this._createHTMLNodes(item.children, li);
}
ul.appendChild(li);
parent.appendChild(ul);
return {
...item,
children,
node: li,
};
});
}
static toggleSubmenu(instance) {
return function (event) {
instance._toggleSubmenu(event);
};
}
static jQueryInterface(options) {
return this.each(function () {
const data = Data.getData(this, DATA_KEY);
if (!data) {
return new Treeview(this, options);
}
return null;
});
}
static getInstance(element) {
return Data.getData(element, DATA_KEY);
}
}
/**
* ------------------------------------------------------------------------
* Data Api implementation - auto initialization
* ------------------------------------------------------------------------
*/
EventHandler.on(document, 'click', SELECTOR_EXPAND, Treeview.toggleSubmenu(new Treeview()));
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
* add .treeview to jQuery only if jQuery is present
*/
const $ = getjQuery();
if ($) {
const JQUERY_NO_CONFLICT = $.fn[NAME];
$.fn[NAME] = Treeview.jQueryInterface;
$.fn[NAME].Constructor = Treeview;
$.fn[NAME].noConflict = () => {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Treeview.jQueryInterface;
};
}
export default Treeview;

View File

@ -13,7 +13,6 @@ import Toast from './bootstrap/src/toast';
// MDB FREE COMPONENTS // MDB FREE COMPONENTS
import Input from './free/input'; import Input from './free/input';
import Dropdown from './free/dropdown'; import Dropdown from './free/dropdown';
import Treeview from './free/treeview';
import Ripple from './free/ripple'; import Ripple from './free/ripple';
// AUTO INIT // AUTO INIT
@ -35,5 +34,4 @@ export {
Tab, Tab,
Toast, Toast,
Tooltip, Tooltip,
Treeview,
}; };

View File

@ -2,7 +2,7 @@
.select-input { .select-input {
&.form-control { &.form-control {
&[readonly] { &[readonly]:not([disabled]) {
background-color: transparent; background-color: transparent;
} }
} }