let register = Toolkit => Toolkit.MenuBar = // Application menu bar class MenuBar extends Toolkit.Menu { ///////////////////////// Initialization Methods ////////////////////////// constructor(app, options = {}) { super(app, Object.assign({ class : "tk menu-bar", role : "menubar", visibility: false, visible : true }, options, { style: Object.assign({ display : "flex", flexDirection: "row", minWidth : "0", position : "inline" }, options.style || {}) })); // Configure event handlers this.addEventListener("focusout", e=>this.onBlur (e)); this.addEventListener("focusin" , e=>this.onFocus(e)); } ///////////////////////////// Event Handlers ////////////////////////////// // Child blur onBlur(e) { if ( this.contains(e.relatedTarget) || !this.children || this.children.length == 0 ) return; this.children.forEach(i=>i.expanded = false); this.children[0].element.setAttribute("tabindex", "0"); } // Child focus onFocus(e) { if (!this.children || this.children.length == 0) return; this.children[0].element.setAttribute("tabindex", "-1"); } ///////////////////////////// Public Methods ////////////////////////////// // Add a menu item add(item) { super.add(item); if (item.menu) this.element.append(item.menu.element); this.children[0].element.setAttribute("tabindex", "0"); } // Move focus into the component focus() { if (this.children.length != 0) this.children[0].focus(); } // Remove a menu item remove(item) { // Remove the menu item if (item.parent == this && item.menu) item.menu.remove(); super.remove(item); // Configure focusability if (this.children && !this.contains(document.activeElement)) { for (let x = 0; x < this.children.length; x++) { this.children[x].element .setAttribute("tabindex", x == 0 ? "0" : "-1"); } } } ///////////////////////////// Package Methods ///////////////////////////// // Return focus to the application blur() { if (this.children) { for (let item of this.children) { item.expanded = false; item.element.blur(); } } if (!this.parent || !this.parent.restoreFocus()) this.focus(); } // Update localization strings localize() { this.localizeLabel(this.element); } } export { register };