diff --git a/CHANGELOG.md b/CHANGELOG.md index e3700bd5..1f227ff6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,56 @@ +## Version 1.0.0-beta.6 (2021-04-20) + +### Features and improvements + +* [[`98b33ea7`](https://github.com/ckotzbauer/simple-tree-component/commit/98b33ea7)] - **feat**: add clear-button for current selection +* [[`74b7c02c`](https://github.com/ckotzbauer/simple-tree-component/commit/74b7c02c)] - **feat**: add enter handling + +### Bug fixes + +* [[`cde09658`](https://github.com/ckotzbauer/simple-tree-component/commit/cde09658)] - **fix**: scrollbar should always be sticky on top +* [[`7c93b385`](https://github.com/ckotzbauer/simple-tree-component/commit/7c93b385)] - **fix**: toggle dropdown-css class on visibility change +* [[`a1a0dfbd`](https://github.com/ckotzbauer/simple-tree-component/commit/a1a0dfbd)] - **fix**: also use NumpadEnter +* [[`1eb33e41`](https://github.com/ckotzbauer/simple-tree-component/commit/1eb33e41)] - **fix**: allow null for setSelected of tree-view too +* [[`8826c4f2`](https://github.com/ckotzbauer/simple-tree-component/commit/8826c4f2)] - **fix**: do not open dropdown, if a pillbox is removed +* [[`9b392022`](https://github.com/ckotzbauer/simple-tree-component/commit/9b392022)] - **fix**: accept null for setSelected +* [[`a989bbc1`](https://github.com/ckotzbauer/simple-tree-component/commit/a989bbc1)] - **fix**: fixed height of multi-select-container +* [[`7ea4730f`](https://github.com/ckotzbauer/simple-tree-component/commit/7ea4730f)] - **fix**: avoid pillboxes to break the layout +* [[`2a2812a2`](https://github.com/ckotzbauer/simple-tree-component/commit/2a2812a2)] - **fix**: label should fit into select-box + +### Dependency updates + +* [[`7cf34ca9`](https://github.com/ckotzbauer/simple-tree-component/commit/7cf34ca9)] - **deps**: bump ssri from 6.0.1 to 6.0.2 in /demo +* [[`c6857769`](https://github.com/ckotzbauer/simple-tree-component/commit/c6857769)] - **deps**: update dependency typedoc-plugin-markdown to v3.7.1 (#597) +* [[`10c24dd5`](https://github.com/ckotzbauer/simple-tree-component/commit/10c24dd5)] - **deps**: update dependency typedoc-plugin-markdown to v3.7.0 (#596) +* [[`4280b875`](https://github.com/ckotzbauer/simple-tree-component/commit/4280b875)] - **deps**: update dependency sass to v1.32.10 (#595) +* [[`e42df6ca`](https://github.com/ckotzbauer/simple-tree-component/commit/e42df6ca)] - **deps**: update dependency rollup to v2.45.2 (#590) +* [[`3b8d2c2b`](https://github.com/ckotzbauer/simple-tree-component/commit/3b8d2c2b)] - **deps**: update dependency eslint-config-prettier to v8.2.0 (#588) +* [[`5f2fec85`](https://github.com/ckotzbauer/simple-tree-component/commit/5f2fec85)] - **deps**: update dependency @types/node to v13.13.50 (#587) +* [[`5c280ae2`](https://github.com/ckotzbauer/simple-tree-component/commit/5c280ae2)] - **deps**: update dependency eslint-plugin-prettier to v3.4.0 (#589) +* [[`20cbdcda`](https://github.com/ckotzbauer/simple-tree-component/commit/20cbdcda)] - **deps**: update dependency sass to v1.32.9 (#591) +* [[`1ed84e3b`](https://github.com/ckotzbauer/simple-tree-component/commit/1ed84e3b)] - **deps**: update dependency ts-jest to v26.5.5 (#592) +* [[`a667644c`](https://github.com/ckotzbauer/simple-tree-component/commit/a667644c)] - **deps**: update typescript-eslint monorepo to v4.22.0 (#593) +* [[`bc628d87`](https://github.com/ckotzbauer/simple-tree-component/commit/bc628d87)] - **deps**: update dependency postcss to v8.2.10 (#586) +* [[`3a8b414f`](https://github.com/ckotzbauer/simple-tree-component/commit/3a8b414f)] - **deps**: update dependency rollup to v2.45.1 (#585) +* [[`01c37264`](https://github.com/ckotzbauer/simple-tree-component/commit/01c37264)] - **deps**: update dependency typedoc-plugin-markdown to v3.6.1 (#582) +* [[`df741018`](https://github.com/ckotzbauer/simple-tree-component/commit/df741018)] - **deps**: update dependency eslint to v7.24.0 (#579) +* [[`57acbfae`](https://github.com/ckotzbauer/simple-tree-component/commit/57acbfae)] - **deps**: update dependency rollup to v2.45.0 (#580) +* [[`13b4491d`](https://github.com/ckotzbauer/simple-tree-component/commit/13b4491d)] - **deps**: update dependency tslib to v2.2.0 (#581) +* [[`f5c78c1f`](https://github.com/ckotzbauer/simple-tree-component/commit/f5c78c1f)] - **deps**: update dependency typescript to v4.2.4 (#583) +* [[`46b64bb9`](https://github.com/ckotzbauer/simple-tree-component/commit/46b64bb9)] - **deps**: update typescript-eslint monorepo to v4.21.0 (#584) +* [[`abe07e38`](https://github.com/ckotzbauer/simple-tree-component/commit/abe07e38)] - **deps**: bump webfactory/ssh-agent from v0.5.1 to v0.5.2 (#578) +* [[`94d7dd29`](https://github.com/ckotzbauer/simple-tree-component/commit/94d7dd29)] - **deps**: bump y18n from 3.2.1 to 3.2.2 in /demo (#573) + +### Common changes + +* [[`a13989b0`](https://github.com/ckotzbauer/simple-tree-component/commit/a13989b0)] - **chore**: update jamesives/github-pages-deploy-action action to v4.1.1 (#577) +* [[`ee15b54d`](https://github.com/ckotzbauer/simple-tree-component/commit/ee15b54d)] - **chore**: update dependency typedoc to v0.20.35 (#452) +* [[`6c68c792`](https://github.com/ckotzbauer/simple-tree-component/commit/6c68c792)] - **chore**: update dependency rollup to v2.44.0 (#575) +* [[`3e8ec490`](https://github.com/ckotzbauer/simple-tree-component/commit/3e8ec490)] - **chore**: update dependency postcss to v8.2.9 (#574) +* [[`4344ee7f`](https://github.com/ckotzbauer/simple-tree-component/commit/4344ee7f)] - **chore**: update typescript-eslint monorepo to v4.20.0 (#576) +* [[`ed4d2d98`](https://github.com/ckotzbauer/simple-tree-component/commit/ed4d2d98)] - **chore**: add quotes + + ## Version 1.0.0-beta.5 (2021-03-29) * [[`f629bcb1`](https://github.com/ckotzbauer/simple-tree-component/commit/f629bcb1)] - **chore**: add more test-items diff --git a/dist/simple-tree-component.js b/dist/simple-tree-component.js index b7ea1285..ec955dad 100644 --- a/dist/simple-tree-component.js +++ b/dist/simple-tree-component.js @@ -1,4 +1,4 @@ -/* simple-tree-component v1.0.0-beta.5, @license MIT */ +/* simple-tree-component v1.0.0-beta.6, @license MIT */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : diff --git a/dist/simple-tree-component.min.js b/dist/simple-tree-component.min.js index 2b35eb52..88a6a4aa 100644 --- a/dist/simple-tree-component.min.js +++ b/dist/simple-tree-component.min.js @@ -1,2 +1,2 @@ -/* simple-tree-component v1.0.0-beta.5,, @license MIT */ +/* simple-tree-component v1.0.0-beta.6,, @license MIT */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self)["simple-tree-component"]=t()}(this,(function(){"use strict";const e={nodes:[],searchBar:!0,searchBarFocus:!1,watermark:"Please select a value...",noNodesMessage:"No items found.",css:{dropdownHolder:""},templateSelectedText:e=>e.label,checkboxes:{active:!1,recursive:!1},clearButton:!1};var t={SimpleTree:"simple-tree",SimpleTreeReadOnly:"simple-tree-readonly",SimpleTreeViewOnly:"simple-tree-view-only",SimpleTreeDropdownHolder:"simple-tree-dropdown-holder",SimpleTreeSingleSelectBox:"simple-tree-single-selectbox",SimpleTreeMultiSelectBox:"simple-tree-multi-selectbox",SimpleTreeInputContainer:"simple-tree-input-container",SimpleTreePillboxHolder:"simple-tree-pillbox-holder",SimpleTreePillboxCross:"simple-tree-pillbox-cross",SimpleTreeCross:"simple-tree-cross",SimpleTreeClearable:"simple-tree-clearable",SimpleTreeSelectedLabel:"simple-tree-selected-label",SimpleTreeSelectedLabelWatermark:"simple-tree-selected-label-watermark",SimpleTreeChevronUp:"simple-tree-chevron-up",SimpleTreeChevronDown:"simple-tree-chevron-down",SimpleTreeEmphasize:"simple-tree-emphasize-icon",SimpleTreeEmphasized:"simple-tree-emphasized",SimpleTreeNodeContainer:"simple-tree-node-container",SimpleTreeNodeContainerRoot:"simple-tree-node-container-root",SimpleTreeNodeText:"simple-tree-node-text",SimpleTreeNodeSelected:"simple-tree-node-selected",SimpleTreeNodeSelectable:"simple-tree-node-selectable",SimpleTreeNodeHovered:"simple-tree-node-hovered",SimpleTreeNodeArrow:"simple-tree-node-arrow",SimpleTreeNodeWrapper:"simple-tree-node-wrapper",SimpleTreeNodeChevronContainer:"simple-tree-node-chevron-container",SimpleTreeNodeChevronClickable:"simple-tree-node-chevron-clickable",SimpleTreeNodeChevronDown:"simple-tree-node-chevron-down",SimpleTreeNodeChevronRight:"simple-tree-node-chevron-right",SimpleTreeNodeCheckbox:"simple-tree-node-checkbox",SimpleTreeNodeCheckboxDisabled:"simple-tree-node-checkbox-disabled",SimpleTreeNodeCheckboxSelected:"simple-tree-node-checkbox-selected"},s={SelectionChanged:"selectionChanged",NodeSelected:"nodeSelected",EscapePressed:"escapePressed",HoverChanged:"hoverChanged",FilterChanged:"filterChanged"};class i{constructor(e,t){this.eventManager=e,this.dataService=t,this.hoveredNodeValue=null,this.boundKeyUp=this.handleKeyUp.bind(this)}initialize(){window.addEventListener("keyup",this.boundKeyUp)}destroy(){window.removeEventListener("keyup",this.boundKeyUp)}setHoveredNodeValue(e){this.hoveredNodeValue=e}handleKeyUp(e){if("Escape"===e.code)return void this.eventManager.publish(s.EscapePressed);const t=this.dataService.getFlattedClickableNodeValues(),i=null===this.hoveredNodeValue?-1:t.indexOf(this.hoveredNodeValue);let l=i;if("ArrowUp"===e.code)l=i>0?i-1:t.length-1;else if("ArrowDown"===e.code)l=-1!==i&&ithis.hoverNode(e)))}destroy(){this.deactivateKeyListener()}activateKeyListener(){this.keyEventHandler.initialize()}deactivateKeyListener(){this.keyEventHandler.destroy()}setNodeUiState(e,s,i){var l,o,d;return null===(l=this.element.querySelector(`.${t.SimpleTreeNodeWrapper}.${i}`))||void 0===l||l.classList.remove(i),null!==e&&s!==e.value?(null===(d=null===(o=document.getElementById(e.uid))||void 0===o?void 0:o.querySelector(`.${t.SimpleTreeNodeWrapper}`))||void 0===d||d.classList.add(i),e.value):null}highlightNode(e){this.highlightedNode=this.setNodeUiState(e,this.highlightedNode,t.SimpleTreeNodeSelected)}hoverNode(e){this.hoveredNode=this.setNodeUiState(e,this.hoveredNode,t.SimpleTreeNodeHovered),this.keyEventHandler.setHoveredNodeValue(this.hoveredNode)}renderContent(){this.element.innerHTML="",this.createBasicHtml(),this.dataService.filter(""),this.renderTree()}createBasicHtml(){if(this.config.searchBar){const e=document.createElement("div");e.classList.add(t.SimpleTreeInputContainer),this.searchTextInput=document.createElement("input"),this.searchTextInput.type="text",this.config.searchBarFocus&&setTimeout((()=>{var e;return null===(e=this.searchTextInput)||void 0===e?void 0:e.focus()}),0),this.searchTextInput.addEventListener("input",(e=>{this.dataService.filter(e.target.value),this.renderTree(),this.eventManager.publish(s.FilterChanged)})),e.appendChild(this.searchTextInput),this.element.appendChild(e)}const e=document.createElement("div");e.classList.add(t.SimpleTreeNodeContainer),this.element.appendChild(e)}getNodeContainer(){const e=this.element.querySelector(`div.${t.SimpleTreeNodeContainer}`);return e||console.error("node container not found!"),e}renderTree(){const e=this.getNodeContainer();e&&(e.innerHTML="",e.appendChild(this.renderUnorderedList(this.dataService.displayedNodes)))}renderUnorderedList(e){const s=document.createElement("ul");if(s.classList.add(t.SimpleTreeNodeContainerRoot),e.forEach((e=>{var i;const l=(null===(i=e.children)||void 0===i?void 0:i.length)>0,o=document.createElement("li");o.id=e.uid;const d=document.createElement("div");d.classList.add(t.SimpleTreeNodeWrapper),d.addEventListener("mouseover",(()=>this.hoverNode(e))),d.addEventListener("mouseout",(()=>this.hoverNode(null)));const n=document.createElement("div");if(n.classList.add(t.SimpleTreeNodeText),this.addChevronDiv(d,e,l),this.config.checkboxes.active){const s=document.createElement("div");s.classList.add(t.SimpleTreeNodeCheckbox),this.readOnly||!this.config.checkboxes.recursive&&!e.selectable?s.classList.add(t.SimpleTreeNodeCheckboxDisabled):s.addEventListener("click",(()=>this.toggleCheckboxSelected(e))),e.selected&&s.classList.add(t.SimpleTreeNodeCheckboxSelected),d.appendChild(s)}else e.selected&&d.classList.add(t.SimpleTreeNodeSelected);n.textContent=e.label,this.config.checkboxes.active||!e.selectable||this.readOnly||(d.addEventListener("click",(()=>this.toggleNodeSelected(e))),d.classList.add(t.SimpleTreeNodeSelectable)),d.appendChild(n),o.appendChild(d),s.appendChild(o),!e.collapsed&&l&&o.appendChild(this.renderUnorderedList(e.children))})),0===e.length){const e=document.createElement("li"),i=document.createElement("div");i.classList.add(t.SimpleTreeNodeWrapper);const l=document.createElement("div");l.classList.add(t.SimpleTreeNodeText),l.textContent=this.config.noNodesMessage,i.appendChild(l),e.appendChild(i),s.appendChild(e)}return s}toggleNodeSelected(e){const t=this.dataService.toggleNodeSelected(e.value);this.eventManager.publish(s.NodeSelected,t)}toggleCheckboxSelected(e){const t=this.dataService.toggleCheckboxSelected(e.value);this.eventManager.publish(s.NodeSelected,t)}addChevronDiv(e,s,i){const l=document.createElement("div");if(l.classList.add(t.SimpleTreeNodeChevronContainer),i){const e=document.createElement("div");s.collapsed?e.classList.add(t.SimpleTreeNodeChevronRight):e.classList.add(t.SimpleTreeNodeChevronDown),l.appendChild(e),l.addEventListener("click",(e=>{e.stopPropagation();const t=!s.collapsed;s.collapsed=t,this.collapseNode(s,t),this.renderTree()})),l.classList.add(t.SimpleTreeNodeChevronClickable)}e.appendChild(l)}collapseNode(e,t){e.children.forEach((e=>{e.hidden=t,e.children.forEach((e=>this.collapseNode(e,t)))}))}setReadOnly(e){this.readOnly=e,this.searchTextInput&&(this.searchTextInput.disabled=e)}}function o(e,t,...s){const i=document.createElement(t);return i.classList.add(...s.filter((e=>e))),e.appendChild(i),i}function d(e,...t){return o(e,"div",...t)}function n(){const e=t.SimpleTreeDropdownHolder;let s=document.body.querySelector(`.${e}`);return s||(s=d(document.body,e),s.style.display="none"),s}class r{constructor(){this.eventLookup={}}publish(e,t){let s,i;if(!e)throw new Error("Event was invalid.");if(s=this.eventLookup[e],s)for(s=s.slice(),i=s.length;i--;)try{s[i](t,e)}catch(e){console.error(e)}}subscribe(e,t){const s=t;let i=[];if(!e)throw new Error("Event channel/type was invalid.");return i=this.eventLookup[e]||(this.eventLookup[e]=[]),i.push(s),{dispose(){const e=i.indexOf(s);-1!==e&&i.splice(e,1)}}}subscribeOnce(e,t){const s=this.subscribe(e,((e,i)=>(s.dispose(),t(e,i))));return s}}const c={label:"",value:"",selected:!1,selectable:!0,children:[],collapsed:!1,hidden:!1,uid:""};function h(e,t){let s=!1;for(const i of e){if(i.value===t){s=!0;break}if(i.children&&i.children.length>0){if(h(i.children,t)){s=!0;break}}}return s}class a{constructor(e=[],t=!1,s=!1){this.displayedNodes=e,this.checkboxesActive=t,this.checkboxesRecursive=s,this.allNodes=[],this.treeInstanceId=Math.floor(1e3+9e3*Math.random()),this.displayedNodes=this.normalizeNodes(e),this.allNodes=this.displayedNodes}normalizeNodes(e){return e.map((e=>{const t=this.copyNode(e);return t.uid=this.generateUid(e.value),t.children=this.normalizeNodes(t.children||[]),t}))}copyNode(e){return Object.assign(Object.assign({},c),e)}clear(){this.allNodes=[],this.displayedNodes=[]}getAllNodes(){return this.allNodes}getNode(e){const t=this.getNodeInternal(this.allNodes,e);return t?this.copyNode(t):null}getNodeInternal(e,t){for(const s of e){if(s.value===t)return s;if(s.children&&s.children.length>0){const e=this.getNodeInternal(s.children,t);if(e)return e}}return null}addNode(e,t=null){if(!(s=e)||!s.value||h(this.allNodes,e.value))throw new Error("node value is invalid or node with value already exists!");var s;if(t&&this.isTreeNode(t))t.children.push(e);else if("string"==typeof t){const s=this.getNodeInternal(this.allNodes,t);this.isTreeNode(s)&&s.children.push(e)}else this.allNodes.push(e)}moveNode(e,t){var s;if(!e)return;const i=this.isTreeNode(e)?e.value:e,l=this.allNodes.some((e=>e.value===i))?this.allNodes:(null===(s=this.getParentForNode(this.allNodes,i))||void 0===s?void 0:s.children)||this.allNodes,o=l.findIndex((e=>e.value===i));if("up"===t&&o>0){const e=l[o];l[o]=l[o-1],l[o-1]=e}else if("down"===t&&ot.value===e));if(t)this.allNodes.splice(this.allNodes.indexOf(t),1);else{const t=this.getParentForNode(this.allNodes,e);if(t){const s=t.children.find((t=>t.value===e));t.children.splice(t.children.indexOf(s),1)}}}updateNodeLabel(e,t){const s=this.getNodeInternal(this.allNodes,e);s&&(s.label=t)}getParentForNode(e,t){for(const s of e){if(s.children&&s.children.some((e=>e.value===t)))return s;let e=null;if(s.children&&(e=this.getParentForNode(s.children,t)),e)return e}return null}getFlattedClickableNodeValues(){return this.flatten(this.displayedNodes).filter((e=>e.selectable&&!e.hidden)).map((e=>e.value))}flatten(e){return e.reduce(((e,t)=>t.children.length>0?(e.push(t),e.concat(this.flatten(t.children))):e.concat(t)),[])}filter(e){this.displayedNodes=e?this.filterNodes(this.allNodes,e.toLowerCase()):this.normalizeNodes(this.allNodes)}filterNodes(e,t){const s=[];return e.forEach((e=>{const i=this.filterNodes(e.children,t);if(e.label.toLowerCase().includes(t)||i.length>0){const t=this.copyNode(e);t.children=i,s.push(t)}})),s}setSelected(...e){const t=e.map((e=>e.value));this.setSelectedNodes(this.allNodes,t),this.checkboxesActive&&this.checkboxesRecursive&&this.cleanRecursiveSelection(this.allNodes)}updateCheckboxState(e){var s;if(!this.checkboxesActive)return;const i=null===(s=document.getElementById(e.uid))||void 0===s?void 0:s.querySelector(`.${t.SimpleTreeNodeCheckbox}`);i?i&&(e.selected&&!i.classList.contains(t.SimpleTreeNodeCheckboxSelected)?i.classList.add(t.SimpleTreeNodeCheckboxSelected):!e.selected&&i.classList.contains(t.SimpleTreeNodeCheckboxSelected)&&i.classList.remove(t.SimpleTreeNodeCheckboxSelected)):console.error("checkbox div not found for node!",e)}setSelectedNodes(e,t){e.forEach((e=>{(this.checkboxesRecursive||e.selectable)&&(e.selected=t.includes(e.value),this.updateCheckboxState(e)),e.children&&e.children.length>0&&this.setSelectedNodes(e.children,t)}))}cleanRecursiveSelection(e){let t=!0;return e.forEach((e=>{e.children&&e.children.length>0&&(e.selected?this.checkRecursiveChilds(e.children):(e.selected=this.cleanRecursiveSelection(e.children),this.updateCheckboxState(e))),t=t&&e.selected})),t}checkRecursiveChilds(e){e.forEach((e=>{e.selected=!0,this.updateCheckboxState(e),e.children&&e.children.length>0&&this.checkRecursiveChilds(e.children)}))}getSelected(){return this.getSelectedInternal(this.allNodes).map(this.copyNode)}getSelectedInternal(e,t=[]){return e.forEach((e=>{e.selected&&t.push(e),e.children&&e.children.length>0&&(t=this.getSelectedInternal(e.children,t))})),t}toggleNodeSelected(e){const t=this.getNodeInternal(this.allNodes,e);return t?(t.selected=!t.selected,this.copyNode(t)):(console.error(`node '${e}' to toggle not found!`),null)}toggleCheckboxSelected(e){let t=this.getNodeInternal(this.allNodes,e);if(!t)return console.error(`checkbox node '${e}' to toggle not found!`),null;const s=!t.selected;return t=this.toggleCheckboxNode(t,s),this.checkboxesRecursive&&this.toggleCheckboxParent(t),this.copyNode(t)}toggleCheckboxNode(e,s,i=!0){var l,o;const d=null===(l=document.getElementById(e.uid))||void 0===l?void 0:l.querySelector(`.${t.SimpleTreeNodeCheckbox}`);return d?(e.selected=s,e.selected&&!d.classList.contains(t.SimpleTreeNodeCheckboxSelected)?d.classList.add(t.SimpleTreeNodeCheckboxSelected):!e.selected&&d.classList.contains(t.SimpleTreeNodeCheckboxSelected)&&d.classList.remove(t.SimpleTreeNodeCheckboxSelected),this.checkboxesRecursive&&i&&(null===(o=e.children)||void 0===o?void 0:o.length)>0&&e.children.forEach((e=>this.toggleCheckboxNode(e,s))),e):(console.error("checkbox div not found!"),e)}toggleCheckboxParent(e){var t;const s=this.getParentForNode(this.allNodes,e.value);if(s&&(null===(t=s.children)||void 0===t?void 0:t.length)>0){const e=s.children.every((e=>!0===e.selected));this.toggleCheckboxNode(s,e,!1),this.toggleCheckboxParent(s)}}generateUid(e){let t=0;for(let s=0;sthis.element.removeChild(e))),this.dataService.clear()}showEmphasizeIcon(e){throw new Error("Feature not supported in this mode!")}hideEmphasizeIcon(){throw new Error("Feature not supported in this mode!")}moveNode(e,t){throw new Error("Feature not supported in this mode!")}setSelected(e){this.selected=e}getSelected(){return this.selected}getNode(e){return this.dataService.getNode(e)}addNode(e,t=null){this.dataService.addNode(e,t)}deleteNode(e){this.dataService.deleteNode(e.value)}updateNodeLabel(e,t){this.dataService.updateNodeLabel(e.value,t)}setReadOnly(e){this.readOnly!==e&&(this.readOnly=e,this.tree.setReadOnly(e),this.rootContainer.classList.toggle(t.SimpleTreeReadOnly,e),this.tree.renderContent())}subscribe(e,t){return this.eventManager.subscribe(e,t)}subscribeOnce(e,t){return this.eventManager.subscribeOnce(e,t)}}function u(e,t,s,i=300){const{top:l,left:o}=t.getBoundingClientRect(),d=window.scrollX,n=function(e,t,s,i=0,l=300){let o=e.top+e.height+i,d=s>l?l:s;return o-window.scrollY+d+10>t&&(o=e.top-d-i),o<0&&(o=e.top+e.height+i,d=t-o-10),{top:o,left:e.left-i,width:e.width-i,height:d}}({top:l+window.scrollY,height:t.offsetHeight,left:o+d,width:t.offsetWidth},window.innerHeight,s,parseInt(getComputedStyle(e).borderLeftWidth.replace("px",""),10),i);e.style.top=`${n.top}px`,e.style.left=`${n.left}px`,e.style.width=`${n.width}px`,e.style.height=`${n.height}px`}class m extends p{constructor(e,t){super(e,t),this.dropdownOpen=!1,this.eventManager.subscribe(s.EscapePressed,(()=>this.closeDropdown())),this.boundClick=this.onClick.bind(this)}toggleDropdown(){this.dropdownOpen?this.closeDropdown():this.openDropdown()}onClick(e){const t=e.target;this.dropdownHolder.contains(t)||this.selectContainer.contains(t)||this.closeDropdown()}openDropdown(){this.readOnly||(this.tree.renderContent(),this.tree.activateKeyListener(),this.filterChangedSubscription=this.eventManager.subscribe(s.FilterChanged,(()=>this.calculateDropdownPosition())),this.options.css.dropdownHolder&&this.dropdownHolder.classList.add(this.options.css.dropdownHolder),this.dropdownHolder.style.top="-9999px",this.dropdownHolder.style.left="-9999px",this.dropdownHolder.style.display="inherit",this.calculateDropdownPosition(),this.arrowElement.classList.remove(t.SimpleTreeChevronDown),this.arrowElement.classList.add(t.SimpleTreeChevronUp),this.dropdownOpen=!0,window.addEventListener("mouseup",this.boundClick))}closeDropdown(){this.dropdownOpen&&(this.filterChangedSubscription&&(this.filterChangedSubscription.dispose(),this.filterChangedSubscription=null),this.options.css.dropdownHolder&&this.dropdownHolder.classList.remove(this.options.css.dropdownHolder),this.dropdownHolder.style.display="none",this.dropdownHolder.style.top="",this.dropdownHolder.style.left="",this.dropdownHolder.style.width="",this.dropdownHolder.style.height="",this.arrowElement.classList.remove(t.SimpleTreeChevronUp),this.arrowElement.classList.add(t.SimpleTreeChevronDown),this.dropdownOpen=!1,window.removeEventListener("mouseup",this.boundClick),this.tree.deactivateKeyListener())}calculateDropdownPosition(){let e=0;this.options.searchBar?(e+=this.dropdownHolder.children[0].clientHeight,e+=this.dropdownHolder.children[1].scrollHeight):e+=this.dropdownHolder.children[0].scrollHeight,u(this.dropdownHolder,this.selectContainer.parentElement,e)}}class v extends m{constructor(e,i){super(e,i),this.rootContainer=d(e,t.SimpleTree),this.selected=this.dataService.getSelected()[0]||null,this.dropdownHolder=n(),this.tree=new l(this.dropdownHolder,i,this.dataService,this.eventManager,this.readOnly),this.subscribe(s.NodeSelected,(e=>this.nodeSelected(e))),this.renderSelectField(this.rootContainer)}setSelected(e){e?this.dataService.setSelected(e):this.dataService.setSelected(),super.setSelected(this.dataService.getSelected()[0]||null),this.updateUiOnSelection(),this.tree.highlightNode(e)}setReadOnly(e){super.setReadOnly(e),e&&this.dropdownOpen&&this.closeDropdown()}showEmphasizeIcon(e){this.emphasisCssClass=e,this.selected&&this.emphasisCssClass&&!this.emphasizeElement&&(this.selectContainer.classList.add(t.SimpleTreeEmphasized),this.emphasizeElement=document.createElement("i"),this.emphasizeElement.classList.add(t.SimpleTreeEmphasize,e),this.selectContainer.appendChild(this.emphasizeElement))}hideEmphasizeIcon(){this.emphasisCssClass=null,this.emphasizeElement&&(this.selectContainer.classList.remove(t.SimpleTreeEmphasized),this.selectContainer.removeChild(this.emphasizeElement),this.emphasizeElement=null)}nodeSelected(e){this.dataService.setSelected(e),this.selected=this.dataService.getSelected()[0]||null,this.tree.highlightNode(e),this.updateUiOnSelection(),this.closeDropdown(),this.eventManager.publish(s.SelectionChanged,this.selected)}renderSelectField(e){this.selectContainer=d(e,t.SimpleTreeSingleSelectBox),this.selectContainer.onclick=()=>!this.readOnly&&this.toggleDropdown(),this.selectedLabel=document.createElement("span"),this.selectedLabel.classList.add(t.SimpleTreeSelectedLabel),this.selectContainer.appendChild(this.selectedLabel),this.updateUiOnSelection(),this.arrowElement=document.createElement("i"),this.arrowElement.classList.add(t.SimpleTreeChevronDown),this.selectContainer.appendChild(this.arrowElement)}updateUiOnSelection(){if(this.selectedLabel.innerText=this.selected?this.options.templateSelectedText(this.selected):this.options.watermark,this.selectedLabel.classList.toggle(t.SimpleTreeSelectedLabelWatermark,!this.selected),this.emphasisCssClass&&this.selected)this.showEmphasizeIcon(this.emphasisCssClass);else if(!this.selected){const e=this.emphasisCssClass;this.hideEmphasizeIcon(),this.emphasisCssClass=e}this.options.clearButton&&this.selected&&!this.clearElement?(this.clearElement=document.createElement("i"),this.clearElement.classList.add(t.SimpleTreeCross),this.clearElement.onclick=e=>{this.readOnly||(this.setSelected(null),this.eventManager.publish(s.SelectionChanged,[])),e.stopPropagation()},this.selectContainer.appendChild(this.clearElement),this.selectContainer.classList.add(t.SimpleTreeClearable)):!this.selected&&this.clearElement&&(this.clearElement.remove(),this.clearElement=null)}}class S extends m{constructor(e,i){super(e,i),this.rootContainer=d(e,t.SimpleTree),this.selected=this.dataService.getSelected(),this.dropdownHolder=n(),this.tree=new l(this.dropdownHolder,i,this.dataService,this.eventManager,this.readOnly),this.subscribe(s.NodeSelected,(e=>this.nodeSelected(e))),this.renderSelectField(this.rootContainer)}setSelected(e){this.dataService.setSelected(...e||[]),super.setSelected(this.dataService.getSelected()),this.renderPillboxes()}setReadOnly(e){super.setReadOnly(e),e&&this.dropdownOpen&&this.closeDropdown()}nodeSelected(e){const t=this.selected.findIndex((t=>t.value===e.value));-1!==t?(e.selected=!1,this.selected.splice(t,1)):(e.selected=!0,this.selected.push(e)),this.dataService.setSelected(...this.selected),this.selected=this.dataService.getSelected(),this.renderPillboxes(),this.closeDropdown(),this.eventManager.publish(s.SelectionChanged,this.selected)}renderSelectField(e){this.selectContainer=d(e,t.SimpleTreeMultiSelectBox),this.selectContainer.onclick=()=>!this.readOnly&&this.toggleDropdown(),this.pillboxContainer=function(e,...t){return o(e,"ul",...t)}(this.selectContainer,t.SimpleTreePillboxHolder),this.renderPillboxes(),this.arrowElement=document.createElement("i"),this.arrowElement.classList.add(t.SimpleTreeChevronDown),this.selectContainer.appendChild(this.arrowElement)}renderPillboxes(){this.pillboxContainer.innerHTML="",this.selected.forEach((e=>{const s=function(e,...t){return o(e,"li",...t)}(this.pillboxContainer,"");s.innerText=this.options.templateSelectedText(e);d(s,t.SimpleTreePillboxCross).addEventListener("click",(t=>{this.readOnly||this.nodeSelected(e),t.stopPropagation()}))})),this.options.clearButton&&this.selected.length>0&&!this.clearElement?(this.clearElement=document.createElement("i"),this.clearElement.classList.add(t.SimpleTreeCross),this.clearElement.onclick=e=>{this.readOnly||(this.setSelected([]),this.eventManager.publish(s.SelectionChanged,[])),e.stopPropagation()},this.selectContainer.appendChild(this.clearElement),this.selectContainer.classList.add(t.SimpleTreeClearable)):0===this.selected.length&&this.clearElement&&(this.clearElement.remove(),this.clearElement=null)}}class g extends p{constructor(e,i){super(e,i),this.rootContainer=d(e,t.SimpleTree,t.SimpleTreeViewOnly),i.checkboxes.active?this.selected=this.dataService.getSelected():this.selected=this.dataService.getSelected()[0]||null,this.tree=new l(this.rootContainer,i,this.dataService,this.eventManager,this.readOnly),this.subscribe(s.NodeSelected,(e=>this.nodeSelected(e))),this.tree.renderContent(),this.tree.activateKeyListener()}setSelected(e){this.options.checkboxes.active?(this.dataService.setSelected(...e||[]),super.setSelected(this.dataService.getSelected())):(this.dataService.setSelected(e||[]),super.setSelected(this.dataService.getSelected()[0]||[]))}moveNode(e,t){this.dataService.moveNode(e,t),this.tree.renderContent()}nodeSelected(e){var t;this.options.checkboxes.active?this.selected=this.dataService.getSelected():(null==e?void 0:e.value)===(null===(t=this.selected)||void 0===t?void 0:t.value)?(this.dataService.setSelected(),this.selected=null,this.tree.highlightNode(null)):(this.dataService.setSelected(e),this.selected=this.dataService.getSelected()[0]||null,this.tree.highlightNode(e)),this.eventManager.publish(s.SelectionChanged,this.selected)}}function N(t,s,i){const l=Object.assign(Object.assign({},e),i);return"singleSelectDropdown"===s?new v(t,l):"multiSelectDropdown"===s?new S(t,l):new g(t,l)}function C(e,t,s){const i=Array.prototype.slice.call(e).filter((e=>e instanceof HTMLElement)),l=[];for(let e=0;e