npm - @zanichelli/albe-web-components - Versions diffs - 13.1.2 → 13.2.0-rc1 - Mend

@zanichelli/albe-web-components 13.1.2 → 13.2.0-rc1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (118) hide show

package/dist/collection/components/file-upload/z-file-upload/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/file-upload/z-file-upload/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Prop, h, EventEmitter, Event, State, Listen, Element, Host, Method} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n tag: \"z-file-upload\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZFileUpload {\n /** Prop indicating the file upload type - can be default or dragdrop /\n @Prop({reflect: true})\n type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n /* Prop indicating the button variant/\n @Prop()\n buttonVariant?: ButtonVariant;\n\n /* Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" /\n @Prop()\n acceptedFormat?: string;\n\n /* Max file dimension in Megabyte /\n @Prop()\n fileMaxSize?: number;\n\n /* Title /\n @Prop()\n mainTitle?: string;\n\n /* Description /\n @Prop()\n description?: string;\n\n /* Files added by the user /\n @State()\n files: File[] = [];\n\n /* upoload button label /\n @Prop()\n uploadBtnLabel?: string = \"allega\";\n\n /* drag & drop button label /\n @Prop()\n dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n /* uploaded files history rendering /\n @Prop()\n hasFileSection?: boolean = true;\n\n /* List of files not allowed to be uploaded /\n @State()\n invalidFiles: Map<string, string[]>;\n\n @Element() el: HTMLZFileUploadElement;\n\n private input: HTMLInputElement;\n\n private button: HTMLZButtonElement;\n\n private errorModal: HTMLZModalElement;\n\n private uploadLink: HTMLSpanElement;\n\n private inputAttributes = {\n type: \"file\",\n id: \"file-elem\",\n multiple: true,\n };\n\n /* Listen removeFile event sent from z-file component /\n @Listen(\"removeFile\")\n removeFileListener(e: CustomEvent): void {\n this.removeFileHandler(e.detail);\n }\n\n /* Listen fileDropped event sent from z-dragdrop-area component /\n @Listen(\"fileDropped\")\n fileDroppedListener(e: CustomEvent): void {\n this.input.files = e.detail;\n this.fileInputHandler();\n }\n\n componentDidUpdate(): void {\n this.handleAccessibility();\n this.invalidFiles.size && this.errorModal.focus();\n }\n\n componentWillLoad(): void {\n this.invalidFiles = new Map<string, string[]>();\n }\n\n /* Emitted when user select one or more files /\n @Event()\n fileInput: EventEmitter;\n\n private fileInputHandler(): void {\n if (this.input.files.length) {\n this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n }\n }\n\n /* get array of uploaded files /\n @Method()\n async getFiles(): Promise<File[]> {\n return this.files;\n }\n\n /* remove file from the array */\n @Method()\n async removeFile(fileName: string): Promise<void> {\n this.removeFileHandler(fileName);\n }\n\n private removeFileHandler(fileName: string): void {\n const files = this.files;\n const file = files.find((file) => file.name === fileName);\n if (file) {\n const index = files.indexOf(file);\n if (index >= 0) {\n files.splice(index, 1);\n this.files = [...files];\n }\n }\n }\n\n private getType(): ZFileUploadType {\n if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n return ZFileUploadType.DEFAULT;\n }\n\n return this.type;\n }\n\n private handleAccessibility(): void {\n const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n if (this.files.length > 0 && lastFile) {\n (lastFile as HTMLElement).focus();\n } else {\n this.getType() === ZFileUploadType.DEFAULT\n ? this.button.querySelector(\"button\").focus()\n : this.uploadLink.focus();\n }\n }\n\n private checkFiles(files: File[]): Map<string, string[]> {\n const errors = new Map<string, string[]>();\n const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n const formatErrorString = \" ha un formato non supportato\";\n files.forEach((file: File) => {\n const fileSize = file.size / 1024 / 1024;\n const fileFormatOk = this.acceptedFormat\n .split(\",\")\n .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n const fileSizeOk = fileSize <= this.fileMaxSize;\n if (fileSizeOk && fileFormatOk) {\n if (!this.files.find((f) => f.name === file.name)) {\n this.files.push(file);\n this.fileInput.emit(file);\n this.input.value = \"\";\n }\n\n return;\n }\n errors.set(file.name, []);\n if (!fileSizeOk) {\n errors.get(file.name).push(sizeErrorString);\n }\n if (!fileFormatOk) {\n errors.get(file.name).push(formatErrorString);\n }\n });\n\n return errors;\n }\n\n private renderTitle(): HTMLElement {\n return <span id=\"title\">{this.mainTitle}</span>;\n }\n\n private renderDescription(cssClass): HTMLElement {\n return <span class={cssClass}>{this.description}</span>;\n }\n\n private renderAllowedFileExtensions(): HTMLElement {\n let fileFormatString = \"\";\n let fileWeightString = \"\";\n\n if (this.acceptedFormat) {\n const fileFormat = this.acceptedFormat\n .split(\", \")\n .map((string) => string.substring(1).toUpperCase())\n .join(\", \");\n fileFormatString = ` nei formati ${fileFormat}`;\n }\n\n if (this.fileMaxSize) {\n fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n }\n\n const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n return <span class=\"body-3\">{fileFormatString \|\| fileWeightString ? finalString : null}</span>;\n }\n\n private renderFileSection(): HTMLElement {\n if (!this.hasFileSection) {\n return;\n }\n\n return (\n <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n <span class=\"heading-4-sb\">File appena caricati</span>\n <div class=\"files-wrapper\">\n <slot name=\"files\" />\n </div>\n <z-divider size={DividerSize.MEDIUM} />\n </section>\n );\n }\n\n private renderInput(): HTMLInputElement {\n return (\n <input\n {...this.inputAttributes}\n onChange={() => this.fileInputHandler()}\n accept={this.acceptedFormat}\n ref={(val) => (this.input = val)}\n />\n );\n }\n\n private renderUploadButton(): unknown[] {\n return [\n this.renderInput(),\n <z-button\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n id=\"fileSelect\"\n variant={this.buttonVariant}\n icon=\"upload\"\n ref={(val) => (this.button = val)}\n >\n {this.uploadBtnLabel}\n </z-button>,\n ];\n }\n\n private renderUploadLink(): unknown[] {\n return [\n this.renderInput(),\n <span class=\"body-1 upload-link-text\">\n Trascina o{\" \"}\n <span\n tabIndex={0}\n class=\"body-1-sb upload-link\"\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n ref={(val) => (this.uploadLink = val)}\n >\n carica\n </span>{\" \"}\n dal tuo computer\n </span>,\n ];\n }\n\n private renderDefaultMode(): unknown[] {\n return [\n this.renderDescription(\"body-3-sb\"),\n this.renderAllowedFileExtensions(),\n this.renderFileSection(),\n this.renderUploadButton(),\n ];\n }\n\n private renderDragDropMode(): unknown[] {\n return [\n this.renderFileSection(),\n <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n <div class=\"text-container\">\n {this.renderDescription(\"body-1\")}\n {this.renderUploadLink()}\n {this.renderAllowedFileExtensions()}\n </div>\n </z-dragdrop-area>,\n ];\n }\n\n private formatErrorString(key, value): string {\n const bothErrors = value[0] && value[1] ? \" e \" : \"\";\n\n return (\n <span class=\"error-message\">\n Il file <span class=\"file-name\">{key}</span> {value[1] ?? \"\"}\n {bothErrors}\n {value[0] ?? \"\"}.\n </span>\n );\n }\n\n private handleErrorModalContent(): HTMLDivElement {\n return (\n <div slot=\"modalContent\">\n <div class=\"modal-wrapper\">\n <div class=\"files\">\n {Array.from(this.invalidFiles).map(([key, value]) => {\n return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n })}\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZFileUploadElement {\n return (\n <Host>\n <div\n tabIndex={0}\n class={`container ${this.getType()}`}\n >\n {this.mainTitle && this.renderTitle()}\n {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n </div>\n {!!this.invalidFiles.size && (\n <z-modal\n modalid={`file-upload-${this.type}-error-modal`}\n tabIndex={0}\n ref={(val) => (this.errorModal = val)}\n modaltitle=\"Errore di caricamento\"\n onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n >\n {this.handleErrorModalContent()}\n </z-modal>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/file-upload/z-file-upload/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Prop, h, EventEmitter, Event, State, Listen, Element, Host, Method} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n tag: \"z-file-upload\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZFileUpload {\n /** Prop indicating the file upload type - can be default or dragdrop /\n @Prop({reflect: true})\n type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n /* Prop indicating the button variant/\n @Prop()\n buttonVariant?: ButtonVariant;\n\n /* Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" /\n @Prop()\n acceptedFormat?: string;\n\n /* Max file dimension in Megabyte /\n @Prop()\n fileMaxSize?: number;\n\n /* Title /\n @Prop()\n mainTitle?: string;\n\n /* Description /\n @Prop()\n description?: string;\n\n /* Files added by the user /\n @State()\n files: File[] = [];\n\n /* upoload button label /\n @Prop()\n uploadBtnLabel?: string = \"allega\";\n\n /* drag & drop button label /\n @Prop()\n dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n /* List of files not allowed to be uploaded /\n @State()\n invalidFiles: Map<string, string[]>;\n\n @Element() el: HTMLZFileUploadElement;\n\n private input: HTMLInputElement;\n\n private button: HTMLZButtonElement;\n\n private errorModal: HTMLZModalElement;\n\n private uploadLink: HTMLSpanElement;\n\n private inputAttributes = {\n type: \"file\",\n id: \"file-elem\",\n multiple: true,\n };\n\n /* Listen removeFile event sent from z-file component /\n @Listen(\"removeFile\")\n removeFileListener(e: CustomEvent): void {\n const files = this.files;\n const file = files.find((file) => file.name === e.detail.fileName);\n if (file) {\n const index = files.indexOf(file);\n if (index >= 0) {\n files.splice(index, 1);\n this.files = [...files];\n }\n }\n }\n\n /* Listen fileDropped event sent from z-dragdrop-area component /\n @Listen(\"fileDropped\")\n fileDroppedListener(e: CustomEvent): void {\n this.input.files = e.detail;\n this.fileInputHandler();\n }\n\n componentDidUpdate(): void {\n this.handleAccessibility();\n this.invalidFiles.size && this.errorModal.focus();\n }\n\n componentWillLoad(): void {\n this.invalidFiles = new Map<string, string[]>();\n }\n\n /* Emitted when user select one or more files /\n @Event()\n fileInput: EventEmitter;\n\n private fileInputHandler(): void {\n if (this.input.files.length) {\n this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n }\n }\n\n /* get array of uploaded files */\n @Method()\n async getFiles(): Promise<File[]> {\n return this.files;\n }\n\n private getType(): ZFileUploadType {\n if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n return ZFileUploadType.DEFAULT;\n }\n\n return this.type;\n }\n\n private handleAccessibility(): void {\n const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n if (this.files.length > 0 && lastFile) {\n (lastFile as HTMLElement).focus();\n } else {\n this.getType() === ZFileUploadType.DEFAULT\n ? this.button.querySelector(\"button\").focus()\n : this.uploadLink.focus();\n }\n }\n\n private checkFiles(files: File[]): Map<string, string[]> {\n const errors = new Map<string, string[]>();\n const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n const formatErrorString = \" ha un'estensione non prevista\";\n files.forEach((file: File) => {\n const fileSize = file.size / 1024 / 1024;\n const fileFormatOk = this.acceptedFormat\n .split(\",\")\n .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n const fileSizeOk = fileSize <= this.fileMaxSize;\n if (fileSizeOk && fileFormatOk) {\n if (!this.files.find((f) => f.name === file.name)) {\n this.files.push(file);\n this.fileInput.emit(file);\n this.input.value = \"\";\n }\n\n return;\n }\n errors.set(file.name, []);\n if (!fileSizeOk) {\n errors.get(file.name).push(sizeErrorString);\n }\n if (!fileFormatOk) {\n errors.get(file.name).push(formatErrorString);\n }\n });\n\n return errors;\n }\n\n private renderTitle(): HTMLElement {\n return <span id=\"title\">{this.mainTitle}</span>;\n }\n\n private renderDescription(cssClass): HTMLElement {\n return <span class={cssClass}>{this.description}</span>;\n }\n\n private renderAllowedFileExtensions(): HTMLElement {\n let fileFormatString = \"\";\n let fileWeightString = \"\";\n\n if (this.acceptedFormat) {\n const fileFormat = this.acceptedFormat\n .split(\", \")\n .map((string) => string.substring(1).toUpperCase())\n .join(\", \");\n fileFormatString = ` nei formati ${fileFormat}`;\n }\n\n if (this.fileMaxSize) {\n fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n }\n\n const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n return <span class=\"body-3\">{fileFormatString \|\| fileWeightString ? finalString : null}</span>;\n }\n\n private renderFileSection(): HTMLElement {\n return (\n <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n <span class=\"heading-4-sb\">File appena caricati</span>\n <div class=\"files-wrapper\">\n <slot name=\"files\" />\n </div>\n <z-divider size={DividerSize.MEDIUM} />\n </section>\n );\n }\n\n private renderInput(): HTMLInputElement {\n return (\n <input\n {...this.inputAttributes}\n onChange={() => this.fileInputHandler()}\n accept={this.acceptedFormat}\n ref={(val) => (this.input = val)}\n />\n );\n }\n\n private renderUploadButton(): unknown[] {\n return [\n this.renderInput(),\n <z-button\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n id=\"fileSelect\"\n variant={this.buttonVariant}\n icon=\"upload\"\n ref={(val) => (this.button = val)}\n >\n {this.uploadBtnLabel}\n </z-button>,\n ];\n }\n\n private renderUploadLink(): unknown[] {\n return [\n this.renderInput(),\n <span class=\"body-1 upload-link-text\">\n Trascina o{\" \"}\n <span\n tabIndex={0}\n class=\"body-1-sb upload-link\"\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n ref={(val) => (this.uploadLink = val)}\n >\n carica\n </span>{\" \"}\n dal tuo computer\n </span>,\n ];\n }\n\n private renderDefaultMode(): unknown[] {\n return [\n this.renderDescription(\"body-3-sb\"),\n this.renderAllowedFileExtensions(),\n this.renderFileSection(),\n this.renderUploadButton(),\n ];\n }\n\n private renderDragDropMode(): unknown[] {\n return [\n this.renderFileSection(),\n <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n <div class=\"text-container\">\n {this.renderDescription(\"body-1\")}\n {this.renderUploadLink()}\n {this.renderAllowedFileExtensions()}\n </div>\n </z-dragdrop-area>,\n ];\n }\n\n private formatErrorString(key, value): string {\n const bothErrors = value[0] && value[1] ? \", ed \" : \"\";\n\n return `Il file ${key} ${value[0] ?? \"\"}${bothErrors}${value[1] ?? \"\"}.`;\n }\n\n private handleErrorModalContent(): HTMLDivElement {\n return (\n <div slot=\"modalContent\">\n <div class=\"modal-wrapper\">\n <div class=\"files\">\n {Array.from(this.invalidFiles).map(([key, value]) => {\n return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n })}\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZFileUploadElement {\n return (\n <Host>\n <div\n tabIndex={0}\n class={`container ${this.getType()}`}\n >\n {this.mainTitle && this.renderTitle()}\n {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n </div>\n {!!this.invalidFiles.size && (\n <z-modal\n modalid={`file-upload-${this.type}-error-modal`}\n tabIndex={0}\n ref={(val) => (this.errorModal = val)}\n modaltitle=\"Attenzione\"\n onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n >\n {this.handleErrorModalContent()}\n </z-modal>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/file-upload/z-file-upload/styles.css CHANGED Viewed

@@ -90,18 +90,6 @@ input#file-elem {
   margin: calc(var(--space-unit) * 3) 0;
 }
-:host .error-message {
-  font-size: 14px;
-  font-weight: 400;
-  letter-spacing: 0.16%;
-  line-height: 20px;
-  text-align: left;
-}
-:host .error-message > .file-name {
-  font-weight: 600;
-}
 /* Tablet breakpoint */
 @media only screen and (min-width: 768px) {
   :host > .container > z-button {

package/dist/collection/components/inputs/z-combobox/index.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { InputType, KeyboardKeyCode, ListDividerType, ControlSize } from "../../../beans";
+import { InputType, ListDividerType, ControlSize, KeyboardCode, ListSize } from "../../../beans";
 import { handleKeyboardSubmit } from "../../../utils/utils";
 export class ZCombobox {
     watchItems() {
@@ -9,20 +9,13 @@ export class ZCombobox {
     }
     watchSearchValue() {
         this.filterItems(this.searchValue);
-    }
-    inputCheckListener(e) {
-        const id = e.detail.id.replace(`combo-checkbox-${this.inputid}-`, "");
-        if (id === "check-all" && (!this.maxcheckableitems || this.maxcheckableitems >= this.itemsList.length)) {
-            return this.checkAll(e.detail.checked);
+        const elem = this.element.shadowRoot.querySelector(`.${this.getCheckboxClass()} input`);
+        if (elem) {
+            elem.setAttribute("tabindex", "0");
         }
-        this.itemsList = this.itemsList.map((item) => {
-            if (item.id === id) {
-                item.checked = e.detail.checked;
-            }
-            return item;
-        });
-        this.updateRenderItemsList();
-        this.emitComboboxChange();
+    }
+    getFocusedItemHandler(e) {
+        this.focusedItemId = e.detail;
     }
     emitComboboxChange() {
         this.comboboxChange.emit({ id: this.inputid, items: this.itemsList });
@@ -51,6 +44,7 @@ export class ZCombobox {
         this.searchValue = undefined;
         this.selectedCounter = undefined;
         this.renderItemsList = [];
+        this.focusedItemId = undefined;
         this.toggleComboBox = this.toggleComboBox.bind(this);
         this.closeFilterItems = this.closeFilterItems.bind(this);
     }
@@ -60,6 +54,101 @@ export class ZCombobox {
     componentWillRender() {
         this.selectedCounter = this.itemsList.filter((item) => item.checked).length;
     }
+    getControlToListSize() {
+        let size;
+        switch (this.size) {
+            case ControlSize.BIG:
+                size = ListSize.LARGE;
+                break;
+            case ControlSize.SMALL:
+                size = ListSize.SMALL;
+                break;
+            case ControlSize.X_SMALL:
+                size = ListSize.SMALL;
+                break;
+            default:
+                size = ListSize.MEDIUM;
+        }
+        return size;
+    }
+    getItemId(item) {
+        return `combo-checkbox-${this.inputid}-${item.id}`;
+    }
+    getCheckboxClass() {
+        return `combo-item-checkbox-input-${this.inputid}`;
+    }
+    getCheckAllId() {
+        return `combo-checkbox-${this.inputid}-check-all`;
+    }
+    hasCheckAllDisabled() {
+        return this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length;
+    }
+    resetInputTabIndex() {
+        this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input`).forEach(function (item) {
+            item.setAttribute("tabindex", "-1");
+        });
+    }
+    setInputTabIndex(itemId, index) {
+        if (index === 0) {
+            if (!this.hascheckall ||
+                (this.hascheckall && this.searchValue) ||
+                (this.hascheckall && this.hasCheckAllDisabled())) {
+                return 0;
+            }
+        }
+        return itemId === this.focusedItemId ? 0 : -1;
+    }
+    handleSelectArrowsNavigation(e, key) {
+        let index = key;
+        this.resetInputTabIndex();
+        this.focusComboboxItem(index);
+        const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];
+        if (!arrows.includes(e.key) || !this.isopen) {
+            return;
+        }
+        e.preventDefault();
+        e.stopPropagation();
+        const firstCheckbox = this.hascheckall && !this.hasCheckAllDisabled() && !this.searchValue ? -1 : 0;
+        const itemsLentgh = this.renderItemsList.length - 1;
+        if (e.key === KeyboardCode.ARROW_DOWN) {
+            index = index === itemsLentgh ? firstCheckbox : key + 1;
+        }
+        else if (e.key === KeyboardCode.ARROW_UP) {
+            if (this.hascheckall && !this.searchValue) {
+                index = index < 0 ? itemsLentgh : key - 1;
+            }
+            else {
+                index = index === 0 ? itemsLentgh : key - 1;
+            }
+        }
+        this.resetInputTabIndex();
+        this.focusComboboxItem(index);
+    }
+    handleHeaderKeyboardEvent(ev) {
+        if (ev.key === KeyboardCode.SPACE) {
+            ev.preventDefault();
+        }
+        if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) || (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {
+            this.toggleComboBox();
+        }
+    }
+    focusComboboxItem(index) {
+        let focusElem;
+        if (index < 0) {
+            focusElem = this.element.shadowRoot.querySelector(`#${this.getCheckAllId()}`);
+        }
+        else {
+            const item = this.renderItemsList[index];
+            if (!item) {
+                return;
+            }
+            focusElem = this.element.shadowRoot.querySelector(`#${this.getItemId(item)}`);
+        }
+        if (focusElem) {
+            focusElem.setAttribute("tabindex", "0");
+            focusElem.focus();
+        }
+    }
     updateRenderItemsList() {
         if (this.searchValue) {
             this.filterItems(this.searchValue);
@@ -84,7 +173,9 @@ export class ZCombobox {
             const start = item.name.toUpperCase().indexOf(value.toUpperCase());
             const end = start + value.length;
             const newName = item.name.substring(0, start) +
-                item.name.substring(start, end).bold() +
+                "<strong>" +
+                item.name.substring(start, end) +
+                "</strong>" +
                 item.name.substring(end, item.name.length);
             item.name = newName;
             return start >= 0;
@@ -101,28 +192,35 @@ export class ZCombobox {
     }
     toggleComboBox() {
         this.isopen = !this.isopen;
+        this.focusedItemId = "";
     }
     renderHeader() {
         return (h("div", { class: "header", onClick: () => this.toggleComboBox(), onKeyDown: (ev) => {
-                if (ev.keyCode === KeyboardKeyCode.SPACE) {
-                    ev.preventDefault();
-                }
-            }, onKeyUp: (ev) => handleKeyboardSubmit(ev, this.toggleComboBox), role: "button", tabindex: 0 }, h("p", { class: "body-3" }, this.label, h("span", null, this.selectedCounter > 0 && ` (${this.selectedCounter})`)), h("z-icon", { name: "caret-down", class: this.size })));
+                this.handleHeaderKeyboardEvent(ev);
+            }, onKeyUp: (ev) => handleKeyboardSubmit(ev, this.toggleComboBox), role: "button", tabindex: 0, "aria-expanded": this.isopen ? "true" : "false" }, h("p", { class: "body-3" }, this.label, h("span", null, this.selectedCounter > 0 && ` (${this.selectedCounter})`)), h("z-icon", { name: "caret-down", class: this.size })));
     }
     renderContent() {
         if (!this.isopen) {
             return;
         }
-        return (h("div", { class: "open-combo-data" }, this.hassearch && this.renderSearchInput(), this.hascheckall && this.renderCheckAll(), this.renderItems()));
+        return (h("div", { class: "open-combo-data" }, this.hassearch && this.renderSearchInput(), !this.hassearch ? h("span", Object.assign({}, this.getComboboxA11yAttributes())) : null, h("div", { role: "listbox", "aria-multiselectable": true, id: `${this.inputid}_list`, "aria-owns": `${this.hascheckall ? `${this.getCheckAllId()} ` : ``}${this.itemsList
+                .map((item) => this.getItemId(item))
+                .join(" ")}` }, this.hascheckall && this.renderCheckAll(), this.renderItems())));
     }
     renderItems() {
-        if (!this.isopen) {
-            return;
-        }
-        return (h("div", { class: this.searchValue && "search", tabindex: -1 }, this.renderList(this.renderItemsList), this.searchValue && this.renderCloseButton()));
+        return (h("div", { class: this.searchValue && "search" }, this.renderList(this.renderItemsList), this.searchValue && this.renderCloseButton()));
     }
     renderItem(item, index, length) {
-        return (h("z-myz-list-item", { id: item.id, listitemid: item.id, action: `combo-li-${this.inputid}`, underlined: index !== length - 1, class: this.size }, h("z-input", { type: InputType.CHECKBOX, checked: item.checked, htmlid: `combo-checkbox-${this.inputid}-${item.id}`, label: item.name, disabled: !item.checked && this.maxcheckableitems && this.maxcheckableitems === this.selectedCounter, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size })));
+        return (h("z-list-element", { id: item.id, htmlTabindex: null, dividerType: index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE, size: this.getControlToListSize() }, h("z-input", { innerTabIndex: this.setInputTabIndex(item.id, index), type: InputType.CHECKBOX, checked: item.checked, htmlid: this.getItemId(item), label: item.name, class: this.getCheckboxClass(), disabled: !item.checked && this.maxcheckableitems && this.maxcheckableitems === this.selectedCounter, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size, role: "option", "aria-selected": item.checked ? "true" : "false", onKeyDown: (e) => this.handleSelectArrowsNavigation(e, index), onInputCheck: (e) => {
+                this.itemsList = this.itemsList.map((i) => {
+                    if (item.id === i.id) {
+                        i.checked = e.detail.checked;
+                    }
+                    return i;
+                });
+                this.updateRenderItemsList();
+                this.emitComboboxChange();
+            } })));
     }
     renderList(items) {
         if (!items) {
@@ -132,9 +230,9 @@ export class ZCombobox {
             return this.renderNoSearchResults();
         }
         if (this.hasgroupitems) {
-            return this.renderGroups(this.itemsList);
+            return this.renderGroups(items);
         }
-        return (h("ul", null, items.map((item, i) => {
+        return (h("ul", { role: "none" }, items.map((item, i) => {
             return this.renderItem(item, i, items.length);
         })));
     }
@@ -150,34 +248,42 @@ export class ZCombobox {
         const listGroups = Object.entries(newData).map(([key, value]) => {
             return (h("z-list-group", { "divider-type": ListDividerType.ELEMENT }, h("span", { class: "body-3-sb z-list-group-title", slot: "header-title" }, key), value.map((item) => item)));
         });
-        return h("ul", null, listGroups);
+        return h("ul", { role: "none" }, listGroups);
     }
     renderNoSearchResults() {
-        return (h("ul", null, h("z-myz-list-item", { id: "no-results", text: this.noresultslabel, listitemid: "no-results", icon: "multiply-circle", class: this.size })));
+        return (h("ul", { role: "none" }, h("z-myz-list-item", { id: "no-results", text: this.noresultslabel, listitemid: "no-results", icon: "multiply-circle", class: this.size })));
     }
     renderCloseButton() {
         return (h("div", null, h("a", { onClick: () => this.closeFilterItems(), onKeyUp: (e) => handleKeyboardSubmit(e, this.closeFilterItems), role: "button", tabindex: 0 }, this.closesearchtext)));
     }
+    getComboboxA11yAttributes() {
+        return {
+            "role": "combobox",
+            "aria-expanded": this.isopen ? "true" : "false",
+            "aria-activedescendant": this.isopen ? this.focusedItemId : "",
+            "aria-controls": `${this.inputid}_list`,
+        };
+    }
     renderSearchInput() {
-        if (!this.isopen) {
-            return;
-        }
-        return (h("z-input", { htmlid: `${this.inputid}_search`, label: this.searchlabel, placeholder: this.searchplaceholder, htmltitle: this.searchtitle, type: this.inputType, value: this.searchValue, message: false, size: this.size, onInputChange: (e) => {
-                if (e.detail.keycode === 27) {
-                    return this.closeFilterItems();
+        return (h("z-input", Object.assign({ htmlid: `${this.inputid}_search`, label: this.searchlabel, placeholder: this.searchplaceholder, htmltitle: this.searchtitle, type: this.inputType, value: this.searchValue, message: false, size: this.size, "aria-autocomplete": "list" }, this.getComboboxA11yAttributes(), { onKeyUp: (e) => {
+                if (e.key === KeyboardCode.ESC) {
+                    this.closeFilterItems();
                 }
+            }, onInputChange: (e) => {
                 this.searchValue = e.detail.value;
-            } }));
+            } })));
     }
     renderCheckAll() {
         if (this.searchValue) {
             return;
         }
         const allChecked = this.selectedCounter === this.itemsList.length;
-        return (h("div", { class: "check-all-wrapper" }, h("z-input", { type: InputType.CHECKBOX, checked: allChecked, htmlid: `combo-checkbox-${this.inputid}-check-all`, label: allChecked ? this.uncheckalltext : this.checkalltext, disabled: this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size })));
+        return (h("div", { class: "check-all-wrapper" }, h("z-input", { type: InputType.CHECKBOX, checked: allChecked, htmlid: this.getCheckAllId(), class: this.getCheckboxClass(), label: allChecked ? this.uncheckalltext : this.checkalltext, disabled: this.hasCheckAllDisabled(), size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size, role: "option", "aria-selected": allChecked ? "true" : "false", onKeyDown: (e) => this.handleSelectArrowsNavigation(e, -1), onInputCheck: (e) => {
+                this.checkAll(e.detail.checked);
+            } })));
     }
     render() {
-        return (h("div", { key: '60fd65ff74672014003f4f0bfe8187a3b9688e72', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
+        return (h("div", { key: 'c12854ede2b8c8c8301ff18831e51f974ae00a3d', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
     }
     static get is() { return "z-combobox"; }
     static get encapsulation() { return "shadow"; }
@@ -528,7 +634,8 @@ export class ZCombobox {
         return {
             "searchValue": {},
             "selectedCounter": {},
-            "renderItemsList": {}
+            "renderItemsList": {},
+            "focusedItemId": {}
         };
     }
     static get events() {
@@ -549,6 +656,7 @@ export class ZCombobox {
                 }
             }];
     }
+    static get elementRef() { return "element"; }
     static get watchers() {
         return [{
                 "propName": "items",
@@ -560,8 +668,8 @@ export class ZCombobox {
     }
     static get listeners() {
         return [{
-                "name": "inputCheck",
-                "method": "inputCheckListener",
+                "name": "ariaDescendantFocus",
+                "method": "getFocusedItemHandler",
                 "target": undefined,
                 "capture": false,
                 "passive": false

package/dist/collection/components/inputs/z-combobox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/inputs/z-combobox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAe,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAY,SAAS,EAAE,eAAe,EAAE,eAAe,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEnG,OAAO,EAAC,oBAAoB,EAAC,MAAM,sBAAsB,CAAC;AAQ1D,MAAM,OAAO,SAAS;IAuFpB,UAAU;QACR,IAAI,CAAC,SAAS,GAAG,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;QACtF,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC;QAC5E,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAGD,gBAAgB;QACd,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACrC,CAAC;IAGD,kBAAkB,CAAC,CAAc;QAC/B,MAAM,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,kBAAkB,IAAI,CAAC,OAAO,GAAG,EAAE,EAAE,CAAC,CAAC;QAEtE,IAAI,EAAE,KAAK,WAAW,IAAI,CAAC,CAAC,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC;YACvG,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACzC,CAAC;QAED,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAe,EAAE,EAAE;YACtD,IAAI,IAAI,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC;gBACnB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;YAClC,CAAC;YAED,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAMO,kBAAkB;QACxB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,EAAC,CAAC,CAAC;IACtE,CAAC;IAED;QA3CQ,cAAS,GAAgB,EAAE,CAAC;QAE5B,cAAS,GAAc,SAAS,CAAC,IAAI,CAAC;;;;wBArEzB,KAAK;yBAIJ,KAAK;;;;8BAgBD,kBAAkB;sBAInC,KAAK;uBAIJ,KAAK;+BAIY,QAAQ;2BAIX,KAAK;4BAIL,iBAAiB;8BAIf,mBAAmB;iCAIzB,CAAC;;oBAQA,WAAW,CAAC,GAAG;;;+BASL,EAAE;QA8C/B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACrD,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC1D;IAED,iBAAiB;QACf,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC;IAC9E,CAAC;IAEO,qBAAqB;QAC3B,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACrC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAEO,oBAAoB;QAC1B,MAAM,eAAe,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,IAAe,EAAE,EAAE;YACzC,eAAe,CAAC,IAAI,mBAAK,IAAI,EAAE,CAAC;QAClC,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,eAAe,GAAG,eAAe,CAAC;IACzC,CAAC;IAEO,WAAW,CAAC,KAAa;QAC/B,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACjC,CAAC;QAED,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE;YAC1D,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC;YACnE,MAAM,GAAG,GAAG,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;YACjC,MAAM,OAAO,GACX,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC;gBAC7B,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE;gBACtC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAE7C,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC;YAEpB,OAAO,KAAK,IAAI,CAAC,CAAC;QACpB,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,QAAQ,CAAC,OAAO,GAAG,IAAI;QAC7B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAe,EAAE,EAAE,CAAC,iCACpD,IAAI,KACP,OAAO,EAAE,OAAO,IAChB,CAAC,CAAC;QACJ,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;QACtB,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC7B,CAAC;IAEO,YAAY;QAClB,OAAO,CACL,WACE,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,EACpC,SAAS,EAAE,CAAC,EAAiB,EAAE,EAAE;gBAC/B,IAAI,EAAE,CAAC,OAAO,KAAK,eAAe,CAAC,KAAK,EAAE,CAAC;oBACzC,EAAE,CAAC,cAAc,EAAE,CAAC;gBACtB,CAAC;YACH,CAAC,EACD,OAAO,EAAE,CAAC,EAAiB,EAAE,EAAE,CAAC,oBAAoB,CAAC,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,EAC7E,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC;YAEX,SAAG,KAAK,EAAC,QAAQ;gBACd,IAAI,CAAC,KAAK;gBACX,gBAAO,IAAI,CAAC,eAAe,GAAG,CAAC,IAAI,KAAK,IAAI,CAAC,eAAe,GAAG,CAAQ,CACrE;YACJ,cACE,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,IAAI,CAAC,IAAI,GAChB,CACE,CACP,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,OAAO,CACL,WAAK,KAAK,EAAC,iBAAiB;YACzB,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1C,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,cAAc,EAAE;YACzC,IAAI,CAAC,WAAW,EAAE,CACf,CACP,CAAC;IACJ,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,OAAO,CACL,WACE,KAAK,EAAE,IAAI,CAAC,WAAW,IAAI,QAAQ,EACnC,QAAQ,EAAE,CAAC,CAAC;YAEX,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;YACrC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,iBAAiB,EAAE,CACzC,CACP,CAAC;IACJ,CAAC;IAEO,UAAU,CAAC,IAAe,EAAE,KAAa,EAAE,MAAc;QAC/D,OAAO,CACL,uBACE,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,UAAU,EAAE,IAAI,CAAC,EAAE,EACnB,MAAM,EAAE,YAAY,IAAI,CAAC,OAAO,EAAE,EAClC,UAAU,EAAE,KAAK,KAAK,MAAM,GAAG,CAAC,EAChC,KAAK,EAAE,IAAI,CAAC,IAAI;YAEhB,eACE,IAAI,EAAE,SAAS,CAAC,QAAQ,EACxB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,kBAAkB,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,EAAE,EAAE,EACnD,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,QAAQ,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,iBAAiB,KAAK,IAAI,CAAC,eAAe,EACpG,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,GACvE,CACc,CACnB,CAAC;IACJ,CAAC;IAEO,UAAU,CAAC,KAAkB;QACnC,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,OAAO;QACT,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACtC,OAAO,IAAI,CAAC,qBAAqB,EAAE,CAAC;QACtC,CAAC;QAED,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC3C,CAAC;QAED,OAAO,CACL,cACG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;YACrB,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QAChD,CAAC,CAAC,CACC,CACN,CAAC;IACJ,CAAC;IAEO,YAAY,CAAC,KAAkB;QACrC,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE;;YAClD,MAAM,EAAC,QAAQ,EAAC,GAAG,IAAI,CAAC;YACxB,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;YAE7D,KAAK,CAAC,QAAQ,CAAC,GAAG,MAAA,KAAK,CAAC,QAAQ,CAAC,mCAAI,EAAE,CAAC;YACxC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YAEhC,OAAO,KAAK,CAAC;QACf,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,OAAqD,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YAC5G,OAAO,CACL,oCAA4B,eAAe,CAAC,OAAO;gBACjD,YACE,KAAK,EAAC,8BAA8B,EACpC,IAAI,EAAC,cAAc,IAElB,GAAG,CACC;gBACN,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,CACb,CAChB,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,OAAO,cAAK,UAAU,CAAM,CAAC;IAC/B,CAAC;IAEO,qBAAqB;QAC3B,OAAO,CACL;YACE,uBACE,EAAE,EAAC,YAAY,EACf,IAAI,EAAE,IAAI,CAAC,cAAc,EACzB,UAAU,EAAC,YAAY,EACvB,IAAI,EAAC,iBAAiB,EACtB,KAAK,EAAE,IAAI,CAAC,IAAI,GAChB,CACC,CACN,CAAC;IACJ,CAAC;IAEO,iBAAiB;QACvB,OAAO,CACL;YACE,SACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EACtC,OAAO,EAAE,CAAC,CAAgB,EAAE,EAAE,CAAC,oBAAoB,CAAC,CAAC,EAAE,IAAI,CAAC,gBAAgB,CAAC,EAC7E,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,IAEV,IAAI,CAAC,eAAe,CACnB,CACA,CACP,CAAC;IACJ,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,OAAO,CACL,eACE,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,SAAS,EAChC,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,WAAW,EAAE,IAAI,CAAC,iBAAiB,EACnC,SAAS,EAAE,IAAI,CAAC,WAAW,EAC3B,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,OAAO,EAAE,KAAK,EACd,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,aAAa,EAAE,CAAC,CAAc,EAAE,EAAE;gBAChC,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,KAAK,EAAE,EAAE,CAAC;oBAC5B,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACjC,CAAC;gBACD,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;YACpC,CAAC,GACD,CACH,CAAC;IACJ,CAAC;IAEO,cAAc;QACpB,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC;QAElE,OAAO,CACL,WAAK,KAAK,EAAC,mBAAmB;YAC5B,eACE,IAAI,EAAE,SAAS,CAAC,QAAQ,EACxB,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,kBAAkB,IAAI,CAAC,OAAO,YAAY,EAClD,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,EAC3D,QAAQ,EAAE,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAClF,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,GACvE,CACE,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,2EACe,SAAS,IAAI,CAAC,OAAO,EAAE,EACpC,KAAK,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAC,EACxE,EAAE,EAAE,IAAI,CAAC,OAAO;YAEf,IAAI,CAAC,YAAY,EAAE;YACnB,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,aAAa,EAAE,CACnC,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h, State, Listen, Watch, Event, EventEmitter} from \"@stencil/core\";\nimport {ComboItem, InputType, KeyboardKeyCode, ListDividerType, ControlSize} from \"../../../beans\";\nimport {ZInput} from \"../z-input\";\nimport {handleKeyboardSubmit} from \"../../../utils/utils\";\nimport {ZMyzListItem} from \"../../../snowflakes/myz/list/z-myz-list-item\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n /** input unique id /\n @Prop()\n inputid: string;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n }\n\n @Listen(\"inputCheck\")\n inputCheckListener(e: CustomEvent): void {\n const id = e.detail.id.replace(`combo-checkbox-${this.inputid}-`, \"\");\n\n if (id === \"check-all\" && (!this.maxcheckableitems \|\| this.maxcheckableitems >= this.itemsList.length)) {\n return this.checkAll(e.detail.checked);\n }\n\n this.itemsList = this.itemsList.map((item: ComboItem) => {\n if (item.id === id) {\n item.checked = e.detail.checked;\n }\n\n return item;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n item.name.substring(start, end).bold() +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n if (ev.keyCode === KeyboardKeyCode.SPACE) {\n ev.preventDefault();\n }\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div\n class={this.searchValue && \"search\"}\n tabindex={-1}\n >\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): ZMyzListItem {\n return (\n <z-myz-list-item\n id={item.id}\n listitemid={item.id}\n action={`combo-li-${this.inputid}`}\n underlined={index !== length - 1}\n class={this.size}\n >\n <z-input\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={`combo-checkbox-${this.inputid}-${item.id}`}\n label={item.name}\n disabled={!item.checked && this.maxcheckableitems && this.maxcheckableitems === this.selectedCounter}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n />\n </z-myz-list-item>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(this.itemsList);\n }\n\n return (\n <ul>\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul>{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <ul>\n <z-myz-list-item\n id=\"no-results\"\n text={this.noresultslabel}\n listitemid=\"no-results\"\n icon=\"multiply-circle\"\n class={this.size}\n />\n </ul>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div>\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private renderSearchInput(): ZInput {\n if (!this.isopen) {\n return;\n }\n\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n onInputChange={(e: CustomEvent) => {\n if (e.detail.keycode === 27) {\n return this.closeFilterItems();\n }\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={`combo-checkbox-${this.inputid}-check-all`}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/inputs/z-combobox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Prop, h, State, Listen, Watch, Event, Element, EventEmitter} from \"@stencil/core\";\nimport {ComboItem, InputType, ListDividerType, ControlSize, KeyboardCode, ListSize} from \"../../../beans\";\nimport {ZInput} from \"../z-input\";\nimport {handleKeyboardSubmit} from \"../../../utils/utils\";\nimport {ZMyzListItem} from \"../../../snowflakes/myz/list/z-myz-list-item\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n @Element() element: HTMLZComboboxElement;\n\n /** input unique id /\n @Prop()\n inputid: string;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n @State()\n focusedItemId: string;\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n const elem = this.element.shadowRoot.querySelector(`.${this.getCheckboxClass()} input`);\n if (elem) {\n elem.setAttribute(\"tabindex\", \"0\");\n }\n }\n\n @Listen(\"ariaDescendantFocus\")\n getFocusedItemHandler(e: CustomEvent): void {\n this.focusedItemId = e.detail;\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n private getControlToListSize(): ListSize {\n let size;\n switch (this.size) {\n case ControlSize.BIG:\n size = ListSize.LARGE;\n break;\n case ControlSize.SMALL:\n size = ListSize.SMALL;\n break;\n case ControlSize.X_SMALL:\n size = ListSize.SMALL;\n break;\n default:\n size = ListSize.MEDIUM;\n }\n\n return size;\n }\n\n private getItemId(item: ComboItem): string {\n return `combo-checkbox-${this.inputid}-${item.id}`;\n }\n\n private getCheckboxClass(): string {\n return `combo-item-checkbox-input-${this.inputid}`;\n }\n\n private getCheckAllId(): string {\n return `combo-checkbox-${this.inputid}-check-all`;\n }\n\n private hasCheckAllDisabled(): boolean {\n return this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length;\n }\n\n private resetInputTabIndex(): void {\n this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input`).forEach(function (item) {\n item.setAttribute(\"tabindex\", \"-1\");\n });\n }\n\n private setInputTabIndex(itemId, index): number {\n if (index === 0) {\n if (\n !this.hascheckall \|\|\n (this.hascheckall && this.searchValue) \|\|\n (this.hascheckall && this.hasCheckAllDisabled())\n ) {\n return 0;\n }\n }\n\n return itemId === this.focusedItemId ? 0 : -1;\n }\n\n private handleSelectArrowsNavigation(e: KeyboardEvent, key: number): void {\n let index = key;\n\n this.resetInputTabIndex();\n this.focusComboboxItem(index);\n\n const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];\n if (!arrows.includes(e.key as KeyboardCode) \|\| !this.isopen) {\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n const firstCheckbox = this.hascheckall && !this.hasCheckAllDisabled() && !this.searchValue ? -1 : 0;\n const itemsLentgh = this.renderItemsList.length - 1;\n\n if (e.key === KeyboardCode.ARROW_DOWN) {\n index = index === itemsLentgh ? firstCheckbox : key + 1;\n } else if (e.key === KeyboardCode.ARROW_UP) {\n if (this.hascheckall && !this.searchValue) {\n index = index < 0 ? itemsLentgh : key - 1;\n } else {\n index = index === 0 ? itemsLentgh : key - 1;\n }\n }\n\n this.resetInputTabIndex();\n this.focusComboboxItem(index);\n }\n\n private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n }\n if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) \|\| (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n this.toggleComboBox();\n }\n }\n\n private focusComboboxItem(index: number): void {\n let focusElem: HTMLElement;\n\n if (index < 0) {\n focusElem = this.element.shadowRoot.querySelector(`#${this.getCheckAllId()}`);\n } else {\n const item = this.renderItemsList[index];\n\n if (!item) {\n return;\n }\n\n focusElem = this.element.shadowRoot.querySelector(`#${this.getItemId(item)}`);\n }\n\n if (focusElem) {\n focusElem.setAttribute(\"tabindex\", \"0\");\n focusElem.focus();\n }\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n \"<strong>\" +\n item.name.substring(start, end) +\n \"</strong>\" +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n this.focusedItemId = \"\";\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n this.handleHeaderKeyboardEvent(ev);\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n aria-expanded={this.isopen ? \"true\" : \"false\"}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n <div\n role=\"listbox\"\n aria-multiselectable={true}\n id={`${this.inputid}_list`}\n aria-owns={`${this.hascheckall ? `${this.getCheckAllId()} ` : ``}${this.itemsList\n .map((item) => this.getItemId(item))\n .join(\" \")}`}\n >\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n return (\n <div class={this.searchValue && \"search\"}>\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): ZMyzListItem {\n return (\n <z-list-element\n id={item.id}\n htmlTabindex={null}\n dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n size={this.getControlToListSize()}\n >\n <z-input\n innerTabIndex={this.setInputTabIndex(item.id, index)}\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={this.getItemId(item)}\n label={item.name}\n class={this.getCheckboxClass()}\n disabled={!item.checked && this.maxcheckableitems && this.maxcheckableitems === this.selectedCounter}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={item.checked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, index)}\n onInputCheck={(e: CustomEvent) => {\n this.itemsList = this.itemsList.map((i: ComboItem) => {\n if (item.id === i.id) {\n i.checked = e.detail.checked;\n }\n\n return i;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }}\n />\n </z-list-element>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(items);\n }\n\n return (\n <ul role=\"none\">\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul role=\"none\">{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <ul role=\"none\">\n <z-myz-list-item\n id=\"no-results\"\n text={this.noresultslabel}\n listitemid=\"no-results\"\n icon=\"multiply-circle\"\n class={this.size}\n />\n </ul>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div>\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private getComboboxA11yAttributes(): Record<string, unknown> {\n return {\n \"role\": \"combobox\",\n \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n \"aria-controls\": `${this.inputid}_list`,\n };\n }\n\n private renderSearchInput(): ZInput {\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n aria-autocomplete=\"list\"\n {...this.getComboboxA11yAttributes()}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.key === KeyboardCode.ESC) {\n this.closeFilterItems();\n }\n }}\n onInputChange={(e: CustomEvent) => {\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={this.getCheckAllId()}\n class={this.getCheckboxClass()}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.hasCheckAllDisabled()}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={allChecked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, -1)}\n onInputCheck={(e: CustomEvent) => {\n this.checkAll(e.detail.checked);\n }}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}