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:
116
Server/wwwroot/package/dist/collection/components/chips/chip.js
vendored
Normal file
116
Server/wwwroot/package/dist/collection/components/chips/chip.js
vendored
Normal file
@ -0,0 +1,116 @@
|
||||
import { h } from "@stencil/core";
|
||||
export class Chip {
|
||||
constructor() {
|
||||
this.placeholder = undefined;
|
||||
this.selectedValue = "";
|
||||
}
|
||||
handleOutsideClick(event) {
|
||||
const path = event.composedPath();
|
||||
if (!path.includes(this.el)) {
|
||||
this.closedMenu();
|
||||
}
|
||||
}
|
||||
handleDropdownItemValueEmission(event) {
|
||||
this.selectedValue = event.detail;
|
||||
this.ifxDropdownMenu.emit(event.detail);
|
||||
this.toggleMenu();
|
||||
}
|
||||
getDropdownMenu() {
|
||||
let dropdownMenuComponent = this.el.querySelector('ifx-dropdown-menu');
|
||||
return dropdownMenuComponent;
|
||||
}
|
||||
closedMenu() {
|
||||
let dropdownMenuComponent = this.getDropdownMenu();
|
||||
dropdownMenuComponent.isOpen = false;
|
||||
}
|
||||
toggleMenu() {
|
||||
let dropdownMenuComponent = this.getDropdownMenu();
|
||||
dropdownMenuComponent.isOpen = !dropdownMenuComponent.isOpen;
|
||||
this.toggleCloseIcon();
|
||||
}
|
||||
toggleCloseIcon() {
|
||||
const closeIconWrapper = this.el.shadowRoot.querySelector('.wrapper-close-button');
|
||||
closeIconWrapper.classList.toggle('show');
|
||||
}
|
||||
render() {
|
||||
return (h("div", { "aria-value": this.selectedValue, "aria-label": 'chip with a dropdown menu', class: "dropdown container" }, h("div", { class: "wrapper", onClick: () => this.toggleMenu() }, h("div", { class: "wrapper-label" }, this.selectedValue ? this.selectedValue : this.placeholder), h("div", { class: "wrapper-close-button" }, h("ifx-icon", { icon: "chevrondown12" }))), h("slot", { name: "menu" })));
|
||||
}
|
||||
static get is() { return "ifx-chip"; }
|
||||
static get encapsulation() { return "shadow"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["chip.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["chip.css"]
|
||||
};
|
||||
}
|
||||
static get properties() {
|
||||
return {
|
||||
"placeholder": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "placeholder",
|
||||
"reflect": false
|
||||
}
|
||||
};
|
||||
}
|
||||
static get states() {
|
||||
return {
|
||||
"selectedValue": {}
|
||||
};
|
||||
}
|
||||
static get events() {
|
||||
return [{
|
||||
"method": "ifxDropdownMenu",
|
||||
"name": "ifxDropdownMenu",
|
||||
"bubbles": true,
|
||||
"cancelable": true,
|
||||
"composed": true,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"complexType": {
|
||||
"original": "CustomEvent",
|
||||
"resolved": "CustomEvent<any>",
|
||||
"references": {
|
||||
"CustomEvent": {
|
||||
"location": "global",
|
||||
"id": "global::CustomEvent"
|
||||
}
|
||||
}
|
||||
}
|
||||
}];
|
||||
}
|
||||
static get elementRef() { return "el"; }
|
||||
static get listeners() {
|
||||
return [{
|
||||
"name": "mousedown",
|
||||
"method": "handleOutsideClick",
|
||||
"target": "document",
|
||||
"capture": false,
|
||||
"passive": true
|
||||
}, {
|
||||
"name": "ifxDropdownItem",
|
||||
"method": "handleDropdownItemValueEmission",
|
||||
"target": undefined,
|
||||
"capture": false,
|
||||
"passive": false
|
||||
}];
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=chip.js.map
|
Reference in New Issue
Block a user