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:
610
Server/wwwroot/package/dist/collection/components/select/multi-select/multiselect.js
vendored
Normal file
610
Server/wwwroot/package/dist/collection/components/select/multi-select/multiselect.js
vendored
Normal file
@ -0,0 +1,610 @@
|
||||
import { h } from "@stencil/core";
|
||||
// Debounce function
|
||||
function debounce(func, wait) {
|
||||
let timeout;
|
||||
return function executedFunction(...args) {
|
||||
const later = () => {
|
||||
clearTimeout(timeout);
|
||||
func(...args);
|
||||
};
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(later, wait);
|
||||
};
|
||||
}
|
||||
;
|
||||
export class Multiselect {
|
||||
constructor() {
|
||||
this.currentIndex = 0; //needed for option selection using keyboard
|
||||
this.handleSearch = debounce((targetElement) => {
|
||||
const searchTerm = targetElement.value.toLowerCase();
|
||||
if (searchTerm === '') {
|
||||
this.filteredOptions = this.loadedOptions;
|
||||
}
|
||||
else {
|
||||
this.filteredOptions = this.loadedOptions.filter(option => option.label.toLowerCase().includes(searchTerm));
|
||||
}
|
||||
}, 300);
|
||||
this.handleDocumentClick = (event) => {
|
||||
const path = event.composedPath();
|
||||
if (!path.includes(this.dropdownElement)) {
|
||||
this.dropdownOpen = false;
|
||||
document.removeEventListener('click', this.handleDocumentClick);
|
||||
// Dispatch the ifxMultiselectIsOpen event
|
||||
this.ifxMultiselectIsOpen.emit(this.dropdownOpen);
|
||||
}
|
||||
};
|
||||
this.options = undefined;
|
||||
this.batchSize = 50;
|
||||
this.size = 'medium (40px)';
|
||||
this.disabled = false;
|
||||
this.error = false;
|
||||
this.internalError = false;
|
||||
this.errorMessage = "Error";
|
||||
this.label = "";
|
||||
this.persistentSelectedOptions = [];
|
||||
this.placeholder = "";
|
||||
this.listOfOptions = [];
|
||||
this.dropdownOpen = false;
|
||||
this.dropdownFlipped = undefined;
|
||||
this.maxItemCount = undefined;
|
||||
this.zIndex = 1;
|
||||
this.isLoading = false;
|
||||
this.loadedOptions = [];
|
||||
this.filteredOptions = [];
|
||||
this.searchEnabled = true;
|
||||
}
|
||||
async loadInitialOptions() {
|
||||
this.isLoading = true;
|
||||
this.internalError = this.error;
|
||||
// Load the first batch of options (e.g., first 20)
|
||||
this.loadedOptions = await this.fetchOptions(0, this.batchSize);
|
||||
this.isLoading = false;
|
||||
}
|
||||
async fetchMoreOptions() {
|
||||
this.isLoading = true;
|
||||
const moreOptions = await this.fetchOptions(this.loadedOptions.length, this.batchSize);
|
||||
this.loadedOptions = [...this.loadedOptions, ...moreOptions];
|
||||
this.isLoading = false;
|
||||
}
|
||||
handleScroll(event) {
|
||||
const element = event.target;
|
||||
const halfwayPoint = Math.floor((element.scrollHeight - element.clientHeight) / 2); //loading more options when the user has scrolled halfway through the current list
|
||||
if (element.scrollTop >= halfwayPoint) {
|
||||
this.fetchMoreOptions();
|
||||
}
|
||||
}
|
||||
async fetchOptions(startIndex, count) {
|
||||
let allOptions = [];
|
||||
// Parse options if it's a string, or use directly if it's an array
|
||||
if (typeof this.options === 'string') {
|
||||
try {
|
||||
allOptions = JSON.parse(this.options);
|
||||
}
|
||||
catch (err) {
|
||||
console.error('Failed to parse options:', err);
|
||||
}
|
||||
}
|
||||
else if (Array.isArray(this.options)) {
|
||||
allOptions = this.options;
|
||||
}
|
||||
else {
|
||||
console.error('Unexpected value for options:', this.options);
|
||||
}
|
||||
// Slice the options array based on startIndex and count
|
||||
const slicedOptions = allOptions.slice(startIndex, startIndex + count);
|
||||
// Update the state for initially selected options, if needed
|
||||
if (startIndex === 0) { // Assuming you want to do this only for the first batch
|
||||
const initiallySelected = slicedOptions.filter(option => option.selected);
|
||||
this.persistentSelectedOptions = [...this.persistentSelectedOptions, ...initiallySelected];
|
||||
}
|
||||
return slicedOptions;
|
||||
}
|
||||
componentDidLoad() {
|
||||
setTimeout(() => {
|
||||
this.positionDropdown();
|
||||
}, 500);
|
||||
// setInterval(this.handleScroll, 5000); // Runs every 5 seconds (5000 milliseconds)
|
||||
}
|
||||
componentWillLoad() {
|
||||
this.loadInitialOptions();
|
||||
this.filteredOptions = [...this.loadedOptions];
|
||||
}
|
||||
updateInternalError() {
|
||||
this.internalError = this.error;
|
||||
}
|
||||
loadedOptionsChanged() {
|
||||
this.filteredOptions = [...this.loadedOptions];
|
||||
}
|
||||
handleOptionClick(option) {
|
||||
this.internalError = false;
|
||||
if (this.isSelectionLimitReached(option)) {
|
||||
console.error('Max item count reached');
|
||||
this.internalError = true;
|
||||
this.errorMessage = "Please consider the maximum number of items to choose from";
|
||||
return;
|
||||
}
|
||||
this.updateSelection(option);
|
||||
this.ifxSelect.emit(this.persistentSelectedOptions);
|
||||
}
|
||||
isSelectionLimitReached(option) {
|
||||
let newOptionsLength = option.children ? option.children.length : 1;
|
||||
return this.maxItemCount && this.persistentSelectedOptions.length + newOptionsLength > this.maxItemCount &&
|
||||
!this.persistentSelectedOptions.some(selectedOption => selectedOption.value === option.value);
|
||||
}
|
||||
updateSelection(option) {
|
||||
const wasSelected = this.persistentSelectedOptions.some(selectedOption => selectedOption.value === option.value);
|
||||
if (option.children && option.children.length > 0) {
|
||||
this.handleParentOptionClick(option);
|
||||
}
|
||||
else {
|
||||
this.handleChildOptionClick(option, wasSelected);
|
||||
}
|
||||
}
|
||||
handleParentOptionClick(option) {
|
||||
const allChildrenSelected = option.children.every(child => this.persistentSelectedOptions.some(selectedOption => selectedOption.value === child.value));
|
||||
if (allChildrenSelected) {
|
||||
this.persistentSelectedOptions = [...this.persistentSelectedOptions.filter(selectedOption => !option.children.some(child => child.value === selectedOption.value))];
|
||||
}
|
||||
else {
|
||||
const newChildren = [...option.children.filter(childOption => !this.persistentSelectedOptions.some(selectedOption => selectedOption.value === childOption.value))];
|
||||
this.persistentSelectedOptions = [...this.persistentSelectedOptions, ...newChildren];
|
||||
}
|
||||
}
|
||||
handleChildOptionClick(option, wasSelected) {
|
||||
if (wasSelected) {
|
||||
this.persistentSelectedOptions = [...this.persistentSelectedOptions.filter(selectedOption => selectedOption.value !== option.value)];
|
||||
}
|
||||
else {
|
||||
this.persistentSelectedOptions = [...this.persistentSelectedOptions, option];
|
||||
}
|
||||
}
|
||||
getSizeClass() {
|
||||
return `${this.size}` === "s"
|
||||
? "small-select"
|
||||
: "medium-select";
|
||||
}
|
||||
toggleDropdown() {
|
||||
this.dropdownOpen = !this.dropdownOpen;
|
||||
setTimeout(() => {
|
||||
if (this.dropdownOpen) {
|
||||
document.addEventListener('click', this.handleDocumentClick);
|
||||
}
|
||||
// Dispatch the ifxMultiselectIsOpen event
|
||||
this.ifxMultiselectIsOpen.emit(this.dropdownOpen);
|
||||
}, 0);
|
||||
this.zIndex = Multiselect.globalZIndex++;
|
||||
}
|
||||
waitForElement(querySelectorFunc, callback, maxTries = 50) {
|
||||
let tries = 0;
|
||||
function request() {
|
||||
requestAnimationFrame(() => {
|
||||
const elements = querySelectorFunc();
|
||||
if (elements.length > 0 || tries > maxTries) {
|
||||
callback(elements);
|
||||
}
|
||||
else {
|
||||
tries++;
|
||||
request();
|
||||
}
|
||||
});
|
||||
}
|
||||
request();
|
||||
}
|
||||
handleKeyDown(event) {
|
||||
if (this.disabled)
|
||||
return; // If it's disabled, don't do anything.
|
||||
const options = this.dropdownElement.querySelectorAll('.option');
|
||||
switch (event.code) {
|
||||
case 'Enter' || 'Space':
|
||||
if (this.dropdownOpen) {
|
||||
this.selectItem(options);
|
||||
}
|
||||
else {
|
||||
this.toggleDropdown();
|
||||
// Wait a bit for the dropdown to finish rendering
|
||||
this.waitForElement(() => {
|
||||
return this.dropdownElement.querySelectorAll('.option');
|
||||
}, (options) => {
|
||||
this.updateHighlightedOption(options);
|
||||
});
|
||||
}
|
||||
break;
|
||||
case 'ArrowDown':
|
||||
this.handleArrowDown(options);
|
||||
if (this.dropdownOpen) {
|
||||
this.updateHighlightedOption(options);
|
||||
}
|
||||
break;
|
||||
case 'ArrowUp':
|
||||
this.handleArrowUp(options);
|
||||
if (this.dropdownOpen) {
|
||||
this.updateHighlightedOption(options);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
handleWrapperClick(event) {
|
||||
// This is your existing logic for positioning the dropdown
|
||||
this.positionDropdown();
|
||||
// Check if the event target is the wrapper itself and not a child element.
|
||||
if (event.currentTarget === event.target) {
|
||||
this.toggleDropdown();
|
||||
}
|
||||
}
|
||||
clearSelection() {
|
||||
this.persistentSelectedOptions = [];
|
||||
this.ifxSelect.emit(this.persistentSelectedOptions); // if you want to emit empty selection after clearing
|
||||
}
|
||||
positionDropdown() {
|
||||
var _a;
|
||||
const wrapperRect = (_a = this.el.shadowRoot.querySelector('.ifx-multiselect-wrapper')) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
|
||||
const spaceBelow = window.innerHeight - wrapperRect.bottom;
|
||||
const spaceAbove = wrapperRect.top;
|
||||
// If there's more space above than below the trigger and the dropdown doesn't fit below
|
||||
if ((spaceAbove > spaceBelow && wrapperRect.height > spaceBelow) || (wrapperRect.bottom > window.innerHeight)) {
|
||||
this.dropdownFlipped = true;
|
||||
}
|
||||
else {
|
||||
this.dropdownFlipped = false;
|
||||
}
|
||||
}
|
||||
// Helper function to update highlighted option based on currentIndex
|
||||
updateHighlightedOption(options) {
|
||||
// Clear all highlights
|
||||
options.forEach((option) => option.classList.remove('is-highlighted'));
|
||||
// Apply highlight to the current option
|
||||
if (this.currentIndex >= 0 && this.currentIndex < options.length) {
|
||||
options[this.currentIndex].classList.add('is-highlighted');
|
||||
}
|
||||
}
|
||||
// Helper function to handle arrow down navigation
|
||||
handleArrowDown(options) {
|
||||
if (this.currentIndex < options.length - 1) {
|
||||
this.currentIndex++;
|
||||
}
|
||||
else {
|
||||
this.currentIndex = 0; // Wrap to the beginning.
|
||||
}
|
||||
}
|
||||
// Helper function to handle arrow up navigation
|
||||
handleArrowUp(options) {
|
||||
if (this.currentIndex > 0) {
|
||||
this.currentIndex--;
|
||||
}
|
||||
else {
|
||||
this.currentIndex = options.length - 1; // Wrap to the end.
|
||||
}
|
||||
}
|
||||
selectItem(options) {
|
||||
// If there's a previous selection, remove its "selected" class
|
||||
const previouslySelected = this.dropdownElement.querySelector('.option.selected');
|
||||
if (previouslySelected) {
|
||||
previouslySelected.classList.remove('selected');
|
||||
}
|
||||
// Mark the current item as selected
|
||||
const currentOptionElement = options[this.currentIndex];
|
||||
currentOptionElement.classList.add('selected');
|
||||
const currentOptionValue = currentOptionElement.getAttribute('data-value');
|
||||
const currentListOfOptions = typeof this.options === 'string' //passed in string form via storybook
|
||||
? JSON.parse(this.options).map((option) => ({ value: option.value, label: option.label, children: option.children, selected: option.selected })) // added selected
|
||||
: this.options.map(option => (Object.assign({}, option)));
|
||||
const currentOption = this.findInOptions(currentListOfOptions, currentOptionValue); // get the option object based on the currently selected value and the options array
|
||||
this.handleOptionClick(currentOption);
|
||||
}
|
||||
renderOption(option, index) {
|
||||
var _a;
|
||||
const isIndeterminate = this.isOptionIndeterminate(option);
|
||||
const isSelected = option.children ? isIndeterminate || this.isOptionSelected(option) : this.persistentSelectedOptions.some(selectedOption => selectedOption.value === option.value);
|
||||
const disableCheckbox = !isSelected && this.maxItemCount && this.persistentSelectedOptions.length >= this.maxItemCount;
|
||||
const uniqueId = `checkbox-${option.value}-${index}`; // Generate a unique ID using the index
|
||||
return (h("div", null, h("div", { class: `option ${isSelected ? 'selected' : ''}
|
||||
${this.getSizeClass()}`, "data-value": option.value, onClick: () => !disableCheckbox && this.handleOptionClick(option), tabindex: "0", role: `${((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "treeitem" : "option"}` }, h("ifx-checkbox", { id: uniqueId, size: "s", value: isIndeterminate ? false : isSelected, indeterminate: isIndeterminate, disabled: disableCheckbox }), h("label", { htmlFor: uniqueId }, option.label)), option.children && option.children.map((child, childIndex) => this.renderSubOption(child, `${index}-${childIndex}`))));
|
||||
}
|
||||
isOptionSelected(option) {
|
||||
if (!option.children)
|
||||
return false;
|
||||
return option.children.every(child => this.persistentSelectedOptions.some(persistentOption => persistentOption.value === child.value));
|
||||
}
|
||||
isOptionIndeterminate(option) {
|
||||
if (!option.children)
|
||||
return false;
|
||||
const selectedChildren = option.children.filter(child => this.persistentSelectedOptions.some(persistentOption => persistentOption.value === child.value)).length;
|
||||
return selectedChildren > 0 && selectedChildren < option.children.length;
|
||||
}
|
||||
findInOptions(options, searchTerm) {
|
||||
for (const option of options) {
|
||||
if (option.value === searchTerm) {
|
||||
return option;
|
||||
}
|
||||
if (option.children) {
|
||||
const foundInChildren = this.findInOptions(option.children, searchTerm);
|
||||
if (foundInChildren) {
|
||||
return foundInChildren;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
renderSubOption(option, index) {
|
||||
var _a;
|
||||
const isSelected = this.persistentSelectedOptions.some(selectedOption => selectedOption.value === option.value);
|
||||
const disableCheckbox = !isSelected && this.maxItemCount && this.persistentSelectedOptions.length >= this.maxItemCount;
|
||||
const uniqueId = `checkbox-${option.value}-${index}`;
|
||||
return (h("div", { class: `option sub-option ${isSelected ? 'selected' : ''} ${this.getSizeClass()}`, "data-value": option.value, role: `${((_a = option.children) === null || _a === void 0 ? void 0 : _a.length) > 0 ? "option" : "treeitem"}`, onClick: () => !disableCheckbox && this.handleOptionClick(option), tabindex: "0" }, h("ifx-checkbox", { id: uniqueId, size: "s", value: isSelected, disabled: disableCheckbox }), h("label", { htmlFor: uniqueId }, option.label)));
|
||||
}
|
||||
render() {
|
||||
// Create a label for the selected options
|
||||
const selectedOptionsLabels = this.persistentSelectedOptions
|
||||
.filter(option => {
|
||||
// check if option is a child and its parent is selected
|
||||
const isChildSelectedWithParent = this.persistentSelectedOptions.some(parentOption => parentOption.children &&
|
||||
parentOption.children.some(child => child.value === option.value) &&
|
||||
parentOption.selected);
|
||||
return !isChildSelectedWithParent;
|
||||
})
|
||||
.map(option => option.label)
|
||||
.join(', ');
|
||||
return (h("div", { class: `ifx-multiselect-container`, ref: el => this.dropdownElement = el }, this.label ?
|
||||
h("div", { class: "ifx-label-wrapper" }, h("span", null, this.label)) : null, h("div", { class: `ifx-multiselect-wrapper
|
||||
${this.getSizeClass()}
|
||||
${this.dropdownOpen ? 'active' : ''}
|
||||
${this.dropdownFlipped ? 'is-flipped' : ''}
|
||||
${this.internalError ? 'error' : ""}
|
||||
${this.disabled ? 'disabled' : ""}`, tabindex: "0", onClick: (event) => this.handleWrapperClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, h("div", { class: `ifx-multiselect-input
|
||||
${this.persistentSelectedOptions.length === 0 ? 'placeholder' : ""}
|
||||
`, onClick: this.disabled ? undefined : () => this.toggleDropdown() }, this.persistentSelectedOptions.length > 0 ? selectedOptionsLabels : this.placeholder), this.dropdownOpen && (h("div", { class: "ifx-multiselect-dropdown-menu", onScroll: (event) => this.handleScroll(event), style: { '--dynamic-z-index': this.zIndex.toString() } }, this.searchEnabled && h("input", { type: "text", role: "textbox", class: "search-input", onInput: (event) => this.handleSearch(event.target), placeholder: "Search..." }), this.filteredOptions.map((option, index) => this.renderOption(option, index)), this.isLoading && h("div", null, "Loading more options..."))), h("div", { class: "ifx-multiselect-icon-container" }, this.persistentSelectedOptions.length > 0 && (h("div", { class: "ifx-clear-button", onClick: () => this.clearSelection() }, h("ifx-icon", { icon: "cremove24" }))), h("div", { class: "icon-wrapper-up", onClick: this.disabled ? undefined : () => this.toggleDropdown() }, h("ifx-icon", { key: 'icon-up', icon: 'chevronup-16' })), h("div", { class: "icon-wrapper-down", onClick: this.disabled ? undefined : () => this.toggleDropdown() }, h("ifx-icon", { key: 'icon-down', icon: 'chevron-down-16' })))), this.internalError ?
|
||||
h("div", { class: "ifx-error-message-wrapper" }, h("span", null, this.errorMessage)) : null));
|
||||
}
|
||||
static get is() { return "ifx-multiselect"; }
|
||||
static get encapsulation() { return "shadow"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["multiselect.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["multiselect.css"]
|
||||
};
|
||||
}
|
||||
static get properties() {
|
||||
return {
|
||||
"options": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "any[] | string",
|
||||
"resolved": "any[] | string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "options",
|
||||
"reflect": false
|
||||
},
|
||||
"batchSize": {
|
||||
"type": "number",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "number",
|
||||
"resolved": "number",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "batch-size",
|
||||
"reflect": false,
|
||||
"defaultValue": "50"
|
||||
},
|
||||
"size": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "size",
|
||||
"reflect": false,
|
||||
"defaultValue": "'medium (40px)'"
|
||||
},
|
||||
"disabled": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "disabled",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"error": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "error",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"errorMessage": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "error-message",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"Error\""
|
||||
},
|
||||
"label": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "label",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"\""
|
||||
},
|
||||
"placeholder": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "placeholder",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"\""
|
||||
},
|
||||
"maxItemCount": {
|
||||
"type": "number",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "number",
|
||||
"resolved": "number",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "max-item-count",
|
||||
"reflect": false
|
||||
},
|
||||
"searchEnabled": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "search-enabled",
|
||||
"reflect": false,
|
||||
"defaultValue": "true"
|
||||
}
|
||||
};
|
||||
}
|
||||
static get states() {
|
||||
return {
|
||||
"internalError": {},
|
||||
"persistentSelectedOptions": {},
|
||||
"listOfOptions": {},
|
||||
"dropdownOpen": {},
|
||||
"dropdownFlipped": {},
|
||||
"zIndex": {},
|
||||
"isLoading": {},
|
||||
"loadedOptions": {},
|
||||
"filteredOptions": {}
|
||||
};
|
||||
}
|
||||
static get events() {
|
||||
return [{
|
||||
"method": "ifxSelect",
|
||||
"name": "ifxSelect",
|
||||
"bubbles": true,
|
||||
"cancelable": true,
|
||||
"composed": true,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"complexType": {
|
||||
"original": "any",
|
||||
"resolved": "any",
|
||||
"references": {}
|
||||
}
|
||||
}, {
|
||||
"method": "ifxMultiselectIsOpen",
|
||||
"name": "ifxMultiselectIsOpen",
|
||||
"bubbles": true,
|
||||
"cancelable": true,
|
||||
"composed": true,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"complexType": {
|
||||
"original": "any",
|
||||
"resolved": "any",
|
||||
"references": {}
|
||||
}
|
||||
}];
|
||||
}
|
||||
static get elementRef() { return "el"; }
|
||||
static get watchers() {
|
||||
return [{
|
||||
"propName": "error",
|
||||
"methodName": "updateInternalError"
|
||||
}, {
|
||||
"propName": "loadedOptions",
|
||||
"methodName": "loadedOptionsChanged"
|
||||
}];
|
||||
}
|
||||
}
|
||||
Multiselect.globalZIndex = 1; // This will be shared among all instances of the component.
|
||||
//# sourceMappingURL=multiselect.js.map
|
||||
Reference in New Issue
Block a user