Remove with Text
Remove GetEngineeringSpcReview Better error message EnforceCodeStyleInBuild NginxFileSystem Remove Reactors and Working Directory AppSettings Delete self contained Thunder Tests Back to .net8.0 api/v4/InfinityQS ApiExplorerSettings Wafer Counter
This commit is contained in:
98
Server/wwwroot/package/dist/collection/components/breadcrumb/breadcrumb-item.js
vendored
Normal file
98
Server/wwwroot/package/dist/collection/components/breadcrumb/breadcrumb-item.js
vendored
Normal file
@ -0,0 +1,98 @@
|
||||
import { h } from "@stencil/core";
|
||||
export class BreadcrumbItem {
|
||||
constructor() {
|
||||
this.isLastItem = false;
|
||||
}
|
||||
handleOutsideClick(event) {
|
||||
const path = event.composedPath();
|
||||
if (!path.includes(this.el)) {
|
||||
this.closeDropdownMenu();
|
||||
}
|
||||
}
|
||||
getDropdownMenu() {
|
||||
const dropdownMenu = this.el.shadowRoot.querySelector('.dropdown-menu');
|
||||
return dropdownMenu;
|
||||
}
|
||||
menuWrapperEventReEmitter(event) {
|
||||
this.emittedElement = event.detail;
|
||||
}
|
||||
getMenuIconWrapper() {
|
||||
return this.emittedElement;
|
||||
}
|
||||
handleClassList(el, type, className) {
|
||||
el.classList[type](className);
|
||||
}
|
||||
closeDropdownMenu() {
|
||||
const dropdownMenu = this.getDropdownMenu();
|
||||
const menuWrapper = this.getMenuIconWrapper();
|
||||
this.handleClassList(dropdownMenu, 'remove', 'open');
|
||||
this.handleClassList(menuWrapper, 'remove', 'show');
|
||||
}
|
||||
toggleDropdownMenu() {
|
||||
const dropdownMenu = this.getDropdownMenu();
|
||||
const menuWrapper = this.getMenuIconWrapper();
|
||||
this.handleClassList(dropdownMenu, 'toggle', 'open');
|
||||
this.handleClassList(menuWrapper, 'toggle', 'show');
|
||||
}
|
||||
handleLastItem() {
|
||||
const breadcrumbItems = this.el.closest('ifx-breadcrumb').querySelectorAll('ifx-breadcrumb-item');
|
||||
if (this.el === breadcrumbItems[breadcrumbItems.length - 1]) {
|
||||
this.isLastItem = true;
|
||||
}
|
||||
else
|
||||
this.isLastItem = false;
|
||||
}
|
||||
componentWillLoad() {
|
||||
this.handleLastItem();
|
||||
}
|
||||
componentDidUpdate() {
|
||||
this.handleLastItem();
|
||||
}
|
||||
componentDidLoad() {
|
||||
const dropdownMenu = this.el.querySelector('ifx-dropdown-menu');
|
||||
if (!dropdownMenu) {
|
||||
const iconMenuWrapper = this.getMenuIconWrapper();
|
||||
this.handleClassList(iconMenuWrapper, 'toggle', 'hide');
|
||||
}
|
||||
else {
|
||||
dropdownMenu.isOpen = true;
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (h("li", { class: 'breadcrumb-parent', "aria-current": `${this.isLastItem ? 'page' : ""}`, onClick: () => this.toggleDropdownMenu() }, h("li", { class: "breadcrumb-wrapper" }, h("slot", { name: 'label' }), h("div", { class: "dropdown-menu" }, h("slot", null))), !this.isLastItem && h("span", { class: "breadcrumb-divider" }, "/")));
|
||||
}
|
||||
static get is() { return "ifx-breadcrumb-item"; }
|
||||
static get encapsulation() { return "shadow"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["breadcrumb-item.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["breadcrumb-item.css"]
|
||||
};
|
||||
}
|
||||
static get states() {
|
||||
return {
|
||||
"isLastItem": {}
|
||||
};
|
||||
}
|
||||
static get elementRef() { return "el"; }
|
||||
static get listeners() {
|
||||
return [{
|
||||
"name": "mousedown",
|
||||
"method": "handleOutsideClick",
|
||||
"target": "document",
|
||||
"capture": false,
|
||||
"passive": true
|
||||
}, {
|
||||
"name": "breadcrumbMenuIconWrapper",
|
||||
"method": "menuWrapperEventReEmitter",
|
||||
"target": undefined,
|
||||
"capture": false,
|
||||
"passive": false
|
||||
}];
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=breadcrumb-item.js.map
|
Reference in New Issue
Block a user