@zanichelli/albe-web-components 19.2.2 → 19.2.3-RC1

package/dist/components/z-combobox.js

@@ -1,393 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { I as InputType, e as ControlSize, i as ListSize, g as KeyboardCode, l as ListDividerType } from './index2.js';
-import { r as randomId, b as getPlainText } from './utils.js';
-import { d as defineCustomElement$7 } from './index7.js';
-import { d as defineCustomElement$6 } from './index10.js';
-import { d as defineCustomElement$5 } from './index12.js';
-import { d as defineCustomElement$4 } from './index13.js';
-import { d as defineCustomElement$3 } from './index15.js';
-import { d as defineCustomElement$2 } from './index16.js';
-
-const stylesCss = ".z-label{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}:host{display:block;min-width:290px;color:var(--color-form-default-text);fill:var(--color-form-default-icon);font-family:var(--font-family-sans)}:host>div.fixed{position:relative}:host>div>.header{position:relative;z-index:10;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 calc(var(--space-unit) * 1.5);border:var(--border-size-small) solid var(--color-form-surface04);margin:0;background-color:var(--color-form-background);border-radius:var(--border-radius-small);cursor:pointer}:host([size=\"small\"])>div>.header{min-height:34px;font-size:var(--font-size-2)}:host([size=\"x-small\"])>div>.header{min-height:30px;font-size:var(--font-size-2)}:host>div>.header:hover{outline:var(--border-size-medium) solid var(--color-form-surface04);outline-offset:-2px}:host>div>div.header:focus:focus-visible{z-index:16;box-shadow:var(--shadow-focus-primary);outline:none}:host>div>.header>span.body-3>span{font-weight:var(--font-sb)}:host>div>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(360deg);transition:all 200ms linear}:host>div>.header>z-icon.small,:host>div>.header>z-icon.x-small{--z-icon-width:16px;--z-icon-height:16px}:host>div.open>.header{border:var(--border-size-small) solid var(--color-form-active-primary);border-radius:var(--border-radius-small) var(--border-radius-small) 0 0}:host>div.disabled{pointer-events:none}:host>div.disabled .header{border-color:var(--color-form-disabled03);fill:var(--color-form-disabled01-icon)}:host>div.disabled .header>span.body-3{color:var(--color-form-disabled03)}:host>div.disabled .header>z-icon:last-child{fill:var(--color-form-disabled01-icon)}:host>div.open>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(180deg);transition:all 200ms linear}:host>div>div.open-combo-data{display:none}:host>div.open>div.open-combo-data{position:relative;z-index:12;display:block;padding:var(--space-unit) calc(var(--space-unit) * 2);border:var(--border-size-small) solid var(--color-form-surface03);border-top:0;background-color:var(--color-form-background);border-radius:0;box-shadow:var(--shadow-2)}:host .open .open-combo-data z-input .z-label{color:var(--color-form-default-text)}:host>div.open>div.open-combo-data>div>div{overflow:auto;max-height:235px;padding:0;padding-left:var(--space-unit);margin-left:calc(var(--space-unit) * -1);}:host>div.open>div.open-combo-data>z-input{width:100%;margin-bottom:calc(var(--space-unit) * 2)}:host>div.open>div.open-combo-data>div>div>ul{max-height:235px;padding:0 calc(var(--space-unit) * 0.5);margin:0}:host .open-combo-data z-list-element{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}:host .open-combo-data z-list-element[disabled]{pointer-events:none}:host .open-combo-data z-list-element .option-wrap{display:flex;flex-direction:row;align-items:center;cursor:pointer;gap:var(--space-unit)}:host .open-combo-data z-list-element[size=\"medium\"] .option-wrap,:host .open-combo-data z-list-element[size=\"small\"] .option-wrap{--z-icon-width:16px;--z-icon-height:16px;font-size:var(--font-size-2);gap:calc(var(--space-unit) / 2)}:host .open-combo-data z-list-element .option-wrap>z-icon{fill:var(--color-primary01)}:host .open-combo-data z-list-element[disabled] .option-wrap>z-icon{fill:var(--color-disabled01)}:host .open-combo-data z-list-element .option-wrap>z-icon.focused{border-radius:var(--border-radius-small);box-shadow:var(--shadow-focus-primary);outline:none}:host .open-combo-data z-list-element .option-wrap>[role=\"option\"]:focus,:host .open-combo-data z-list-element .option-wrap>[role=\"option\"]:focus-visible{outline:none}::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(::-webkit-scrollbar-track){:host{scrollbar-color:var(--color-primary01) transparent}}:host>div.open>z-input{position:relative;z-index:1;width:238px;margin:0 calc(var(--space-unit) * 2);color:var(--color-form-active-primary)}:host>div.open>div.open-combo-data>div>div.search{overflow:hidden;max-height:none;margin-top:0}:host>div.open>div.open-combo-data>div>div.search>ul{overflow:auto;max-height:180px;padding:var(--space-unit) calc(var(--space-unit) * 2)}:host .open .open-combo-data .search .no-results{display:flex;align-items:center;column-gap:var(--space-unit)}:host>.open>.open-combo-data .search .close-search{display:flex;justify-content:center}:host>div.open>div.open-combo-data>div>div.search .close-search>a{display:inline-block;height:44px;color:var(--color-form-active-primary);cursor:pointer;font-size:14px;font-weight:var(--font-sb);line-height:44px;text-align:center;text-transform:uppercase}:host>div.open>div.open-combo-data>div>div.search .close-search>a:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2)\n    calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--gray800);margin-bottom:var(--space-unit);margin-left:calc(var(--space-unit) * -1);text-align:left}:host([size=\"small\"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5)}:host([size=\"x-small\"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:var(--space-unit) calc(var(--space-unit) * 0.5)}";
-const ZComboboxStyle0 = stylesCss;
-
-const ZCombobox$1 = /*@__PURE__*/ proxyCustomElement(class ZCombobox extends HTMLElement {
-    watchItems() {
-        this.itemsList = typeof this.items === "string" ? JSON.parse(this.items) : this.items;
-        this.selectedCounter = this.itemsList.filter((item) => item.checked).length;
-        this.updateRenderItemsList();
-    }
-    watchSearchValue() {
-        this.filterItems(this.searchValue);
-    }
-    emitComboboxChange() {
-        this.comboboxChange.emit({ id: this.inputid, items: this.itemsList });
-    }
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.comboboxChange = createEvent(this, "comboboxChange", 7);
-        this.itemsList = [];
-        this.inputType = InputType.TEXT;
-        this.inputid = `combo-${randomId()}`;
-        this.items = undefined;
-        this.label = undefined;
-        this.disabled = false;
-        this.hassearch = false;
-        this.searchlabel = undefined;
-        this.searchplaceholder = undefined;
-        this.searchtitle = undefined;
-        this.noresultslabel = "Nessun risultato";
-        this.isopen = false;
-        this.isfixed = false;
-        this.hascheckall = false;
-        this.checkalltext = "Seleziona tutti";
-        this.uncheckalltext = "Deseleziona tutti";
-        this.maxcheckableitems = 0;
-        this.hasgroupitems = undefined;
-        this.size = ControlSize.BIG;
-        this.htmlAriaLabel = undefined;
-        this.searchValue = undefined;
-        this.selectedCounter = undefined;
-        this.renderItemsList = [];
-        this.focusedItemId = "";
-        this.toggleComboBox = this.toggleComboBox.bind(this);
-        this.closeFilterItems = this.closeFilterItems.bind(this);
-    }
-    componentWillLoad() {
-        this.watchItems();
-    }
-    componentWillRender() {
-        this.selectedCounter = this.itemsList.filter((item) => item.checked).length;
-    }
-    getControlToListSize() {
-        switch (this.size) {
-            case ControlSize.X_SMALL:
-                return ListSize.SMALL;
-            case ControlSize.SMALL:
-                return ListSize.MEDIUM;
-            default:
-                return ListSize.LARGE;
-        }
-    }
-    getOptionId(itemId) {
-        return `${this.inputid}-option-${itemId}`;
-    }
-    getCheckAllOptionId() {
-        return `${this.inputid}-check-all`;
-    }
-    allOptionsSelected() {
-        return this.selectedCounter === this.itemsList.length;
-    }
-    hasReachedMaxSelections() {
-        return !!(this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems);
-    }
-    handleHeaderKeyDown(e) {
-        if (e.code === KeyboardCode.ENTER && !this.focusedItemId) {
-            this.toggleComboBox();
-        }
-        if (!this.isopen || this.hassearch) {
-            return;
-        }
-        switch (e.code) {
-            case KeyboardCode.SPACE:
-            case KeyboardCode.ENTER:
-                if (this.focusedItemId) {
-                    e.preventDefault();
-                    this.checkOption(this.focusedItemId);
-                }
-                break;
-            case KeyboardCode.ESC:
-                if (this.focusedItemId) {
-                    this.focusedItemId = "";
-                }
-                break;
-            case KeyboardCode.ARROW_DOWN:
-            case KeyboardCode.ARROW_UP:
-                this.handleArrowsNavigation(e);
-                break;
-        }
-    }
-    handleInputKeyDown(e) {
-        switch (e.code) {
-            case KeyboardCode.ENTER:
-            case KeyboardCode.SPACE:
-                if (this.focusedItemId) {
-                    e.preventDefault();
-                    this.checkOption(this.focusedItemId);
-                    break;
-                }
-                break;
-            case KeyboardCode.ARROW_DOWN:
-            case KeyboardCode.ARROW_UP:
-                this.handleArrowsNavigation(e);
-                break;
-            case KeyboardCode.ESC:
-                if (this.focusedItemId) {
-                    this.focusedItemId = "";
-                    break;
-                }
-                this.closeFilterItems();
-                break;
-            case KeyboardCode.TAB:
-                this.focusedItemId = "";
-                break;
-        }
-    }
-    checkOption(optionId) {
-        if (optionId === this.getCheckAllOptionId()) {
-            this.itemsList = this.itemsList.map((item) => (Object.assign(Object.assign({}, item), { checked: !this.allOptionsSelected() })));
-            this.focusedItemId = this.getCheckAllOptionId();
-        }
-        else {
-            this.itemsList = this.itemsList.map((i) => {
-                if (optionId === this.getOptionId(i.id)) {
-                    i.checked = !i.checked;
-                }
-                return i;
-            });
-        }
-        this.updateRenderItemsList();
-        this.emitComboboxChange();
-    }
-    handleArrowsNavigation(e) {
-        if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.code) || !this.isopen) {
-            return;
-        }
-        e.preventDefault();
-        e.stopPropagation();
-        const currElem = this.focusedItemId ? this.element.shadowRoot.querySelector(`#${this.focusedItemId}`) : null;
-        const options = Array.from(this.element.shadowRoot.querySelectorAll('[role="option"]'));
-        if (!options.length) {
-            return;
-        }
-        const currElemIndex = currElem ? options.indexOf(currElem) : null;
-        const firstElemIndex = 0;
-        const lastElemIndex = options.length - 1;
-        let nextElem = null;
-        if (e.code === KeyboardCode.ARROW_DOWN) {
-            nextElem =
-                currElemIndex === null ? options[firstElemIndex] : options[currElemIndex + 1] || options[lastElemIndex];
-        }
-        else if (e.code === KeyboardCode.ARROW_UP) {
-            nextElem =
-                currElemIndex === null ? options[lastElemIndex] : options[currElemIndex - 1] || options[firstElemIndex];
-        }
-        this.focusedItemId = nextElem.id;
-        nextElem.scrollIntoView({ block: "nearest", container: "nearest" });
-    }
-    updateRenderItemsList() {
-        if (this.searchValue) {
-            this.filterItems(this.searchValue);
-        }
-        else {
-            this.resetRenderItemsList();
-        }
-    }
-    resetRenderItemsList() {
-        const renderItemsList = [];
-        this.itemsList.forEach((item) => {
-            renderItemsList.push(Object.assign({}, item));
-        });
-        this.renderItemsList = renderItemsList;
-    }
-    filterItems(value) {
-        if (!value) {
-            return this.closeFilterItems();
-        }
-        this.resetRenderItemsList();
-        this.renderItemsList = this.renderItemsList.filter((item) => {
-            const start = item.name.toUpperCase().indexOf(value.toUpperCase());
-            const end = start + value.length;
-            const newName = item.name.substring(0, start) +
-                "<strong>" +
-                item.name.substring(start, end) +
-                "</strong>" +
-                item.name.substring(end, item.name.length);
-            item.name = newName;
-            return start >= 0;
-        });
-    }
-    closeFilterItems() {
-        this.searchValue = "";
-        this.resetRenderItemsList();
-    }
-    toggleComboBox() {
-        this.isopen = !this.isopen;
-    }
-    getComboboxA11yAttributes(isZInput) {
-        const role = "combobox";
-        const ariaLabel = this.htmlAriaLabel;
-        const ariaExpanded = this.isopen ? "true" : "false";
-        const ariaActivedescendant = this.isopen ? this.focusedItemId : "";
-        const ariaControls = `${this.inputid}_list`;
-        if (isZInput) {
-            return {
-                "role": role,
-                "aria-label": ariaLabel,
-                "html-aria-expanded": ariaExpanded,
-                "html-aria-activedescendant": ariaActivedescendant,
-                "html-aria-controls": ariaControls,
-            };
-        }
-        return {
-            "role": role,
-            "aria-label": ariaLabel,
-            "aria-expanded": ariaExpanded,
-            "aria-activedescendant": ariaActivedescendant,
-            "aria-controls": ariaControls,
-        };
-    }
-    renderHeader() {
-        const comboboxA11yAttributes = !this.hassearch ? this.getComboboxA11yAttributes(false) : {};
-        return (h("div", Object.assign({ class: "header", onClick: () => this.toggleComboBox(), onKeyDown: (e) => this.handleHeaderKeyDown(e), role: "button", tabindex: 0, "aria-controls": "open-combo-data", "aria-expanded": this.isopen ? "true" : "false" }, comboboxA11yAttributes), h("span", { class: "body-3", "aria-label": this.label
-                ? `${this.label}${this.selectedCounter > 0 ? ` - ${this.selectedCounter} selezionati` : ``}`
-                : undefined }, this.label, h("span", null, this.selectedCounter > 0 && ` (${this.selectedCounter})`)), h("z-icon", { name: "caret-down", class: this.size })));
-    }
-    renderContent() {
-        return (h("div", { id: "open-combo-data", class: "open-combo-data" }, this.hassearch && this.renderSearchInput(), h("div", { role: "listbox", "aria-label": this.label, "aria-multiselectable": "true", id: `${this.inputid}_list`, "aria-owns": `${this.hascheckall ? `${this.getCheckAllOptionId()} ` : ``}${this.itemsList.map((item) => this.getOptionId(item.id)).join(" ")}` }, this.renderItems())));
-    }
-    renderItems() {
-        return (h("div", { class: this.searchValue && "search", tabIndex: -1, role: "presentation" }, this.renderList(this.renderItemsList)));
-    }
-    renderItem(item, index, length) {
-        const optionId = this.getOptionId(item.id);
-        const isDisabled = !item.checked && this.hasReachedMaxSelections();
-        return (h("z-list-element", { htmlTabindex: -1, dividerType: index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE, size: this.getControlToListSize(), role: "presentation", disabled: !!isDisabled }, h("span", { class: "option-wrap", role: "presentation", onClick: () => {
-                this.focusedItemId = "";
-                this.checkOption(optionId);
-            } }, h("z-icon", { name: item.checked ? "checkbox-checked" : "checkbox", class: this.focusedItemId === optionId ? "focused" : "" }), h("span", { id: optionId, role: isDisabled ? "presentation" : "option", "aria-selected": item.checked ? "true" : "false", "aria-label": isDisabled ? undefined : getPlainText(item.name) }, h("span", { "aria-hidden": "true", innerHTML: item.name })))));
-    }
-    renderList(items) {
-        if (!items) {
-            return;
-        }
-        if (!items.length && this.searchValue) {
-            return this.renderNoSearchResults();
-        }
-        if (this.hasgroupitems) {
-            return this.renderGroups(items);
-        }
-        return (h("ul", { role: "presentation" }, this.renderCheckAll(), items.map((item, i) => {
-            return this.renderItem(item, i, items.length);
-        })));
-    }
-    renderGroups(items) {
-        const newData = items.reduce((group, item, index) => {
-            var _a;
-            const category = item.category || "Altra categoria";
-            const zListItem = this.renderItem(item, index, items.length);
-            group[category] = (_a = group[category]) !== null && _a !== void 0 ? _a : [];
-            group[category].push(zListItem);
-            return group;
-        }, {});
-        const listGroups = Object.entries(newData).map(([key, value], index) => {
-            return (h("z-list-group", { size: this.getControlToListSize(), "divider-type": ListDividerType.ELEMENT, "aria-labelledby": `${this.inputid}_list_group_${index}` }, h("span", { class: "body-3-sb z-list-group-title", slot: "header-title", id: `${this.inputid}_list_group_${index}`, "aria-hidden": "true" }, key), value.map((item) => item)));
-        });
-        return (h("ul", { role: "presentation" }, this.renderCheckAll(), listGroups));
-    }
-    renderNoSearchResults() {
-        return (h("div", { class: "no-results" }, h("span", null, this.noresultslabel)));
-    }
-    renderSearchInput() {
-        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, "html-aria-autocomplete": "list" }, this.getComboboxA11yAttributes(true), { onKeyDown: (e) => this.handleInputKeyDown(e), onInputChange: (e) => {
-                this.searchValue = e.detail.value;
-                this.focusedItemId = "";
-            } })));
-    }
-    renderCheckAll() {
-        if (!this.hascheckall || this.searchValue) {
-            return;
-        }
-        const optionId = this.getCheckAllOptionId();
-        const allChecked = this.allOptionsSelected();
-        const isDisabled = this.hasReachedMaxSelections() || (this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length);
-        return (h("z-list-element", { class: "check-all-wrapper", role: "presentation", htmlTabindex: -1, dividerType: ListDividerType.ELEMENT, dividerColor: "gray800", size: this.getControlToListSize(), disabled: !!isDisabled }, h("span", { class: "option-wrap", role: "presentation", onClick: () => this.checkOption(optionId) }, h("z-icon", { name: allChecked ? "checkbox-checked" : "checkbox", class: this.focusedItemId === optionId ? "focused" : "" }), h("span", { id: optionId, role: isDisabled ? "presentation" : "option", "aria-selected": allChecked ? "true" : "false" }, allChecked ? this.uncheckalltext : this.checkalltext))));
-    }
-    render() {
-        return (h("div", { key: '3d2a5f02bd730efb2ff1390c4e21e96224a4e552', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "items": ["watchItems"],
-        "searchValue": ["watchSearchValue"]
-    }; }
-    static get style() { return ZComboboxStyle0; }
-}, [1, "z-combobox", {
-        "inputid": [1],
-        "items": [1],
-        "label": [1],
-        "disabled": [516],
-        "hassearch": [4],
-        "searchlabel": [1],
-        "searchplaceholder": [1],
-        "searchtitle": [1],
-        "noresultslabel": [1],
-        "isopen": [1028],
-        "isfixed": [4],
-        "hascheckall": [4],
-        "checkalltext": [1],
-        "uncheckalltext": [1],
-        "maxcheckableitems": [2],
-        "hasgroupitems": [4],
-        "size": [1],
-        "htmlAriaLabel": [1, "html-aria-label"],
-        "searchValue": [32],
-        "selectedCounter": [32],
-        "renderItemsList": [32],
-        "focusedItemId": [32]
-    }, undefined, {
-        "items": ["watchItems"],
-        "searchValue": ["watchSearchValue"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-combobox", "z-divider", "z-icon", "z-input", "z-input-message", "z-list-element", "z-list-group"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-combobox":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZCombobox$1);
-            }
-            break;
-        case "z-divider":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "z-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "z-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "z-input-message":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "z-list-element":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "z-list-group":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const ZCombobox = ZCombobox$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { ZCombobox, defineCustomElement };
-
-//# sourceMappingURL=z-combobox.js.map
+import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as s,transformTag as o}from"@stencil/core/internal/client";import{e as a,I as r,i as n,g as l,l as c}from"./index2.js";import{r as h,b as d}from"./utils.js";import{d as p}from"./index6.js";import{d as m}from"./index3.js";import{d as u}from"./index7.js";import{d as b}from"./index8.js";import{d as v}from"./index10.js";import{d as f}from"./index11.js";const g=e(class extends t{watchItems(){this.itemsList="string"==typeof this.items?JSON.parse(this.items):this.items,this.selectedCounter=this.itemsList.filter((e=>e.checked)).length,this.updateRenderItemsList()}watchSearchValue(){this.filterItems(this.searchValue)}emitComboboxChange(){this.comboboxChange.emit({id:this.inputid,items:this.itemsList})}constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.comboboxChange=i(this,"comboboxChange",7),this.inputid="combo-"+h(),this.disabled=!1,this.hassearch=!1,this.noresultslabel="Nessun risultato",this.isopen=!1,this.isfixed=!1,this.hascheckall=!1,this.checkalltext="Seleziona tutti",this.uncheckalltext="Deseleziona tutti",this.maxcheckableitems=0,this.size=a.BIG,this.renderItemsList=[],this.focusedItemId="",this.itemsList=[],this.inputType=r.TEXT,this.toggleComboBox=this.toggleComboBox.bind(this),this.closeFilterItems=this.closeFilterItems.bind(this)}componentWillLoad(){this.watchItems()}componentWillRender(){this.selectedCounter=this.itemsList.filter((e=>e.checked)).length}getControlToListSize(){switch(this.size){case a.X_SMALL:return n.SMALL;case a.SMALL:return n.MEDIUM;default:return n.LARGE}}getOptionId(e){return`${this.inputid}-option-${e}`}getCheckAllOptionId(){return this.inputid+"-check-all"}allOptionsSelected(){return this.selectedCounter===this.itemsList.length}hasReachedMaxSelections(){return!!(this.maxcheckableitems&&this.selectedCounter>=this.maxcheckableitems)}handleHeaderKeyDown(e){if(e.code!==l.ENTER||this.focusedItemId||this.toggleComboBox(),this.isopen&&!this.hassearch)switch(e.code){case l.SPACE:case l.ENTER:this.focusedItemId&&(e.preventDefault(),this.checkOption(this.focusedItemId));break;case l.ESC:this.focusedItemId&&(this.focusedItemId="");break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e)}}handleInputKeyDown(e){switch(e.code){case l.ENTER:case l.SPACE:if(this.focusedItemId){e.preventDefault(),this.checkOption(this.focusedItemId);break}break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e);break;case l.ESC:if(this.focusedItemId){this.focusedItemId="";break}this.closeFilterItems();break;case l.TAB:this.focusedItemId=""}}checkOption(e){e===this.getCheckAllOptionId()?(this.itemsList=this.itemsList.map((e=>Object.assign(Object.assign({},e),{checked:!this.allOptionsSelected()}))),this.focusedItemId=this.getCheckAllOptionId()):this.itemsList=this.itemsList.map((t=>(e===this.getOptionId(t.id)&&(t.checked=!t.checked),t))),this.updateRenderItemsList(),this.emitComboboxChange()}handleArrowsNavigation(e){if(![l.ARROW_DOWN,l.ARROW_UP].includes(e.code)||!this.isopen)return;e.preventDefault(),e.stopPropagation();const t=this.focusedItemId?this.element.shadowRoot.querySelector("#"+this.focusedItemId):null,i=Array.from(this.element.shadowRoot.querySelectorAll('[role="option"]'));if(!i.length)return;const s=t?i.indexOf(t):null,o=i.length-1;let a=null;e.code===l.ARROW_DOWN?a=null===s?i[0]:i[s+1]||i[o]:e.code===l.ARROW_UP&&(a=null===s?i[o]:i[s-1]||i[0]),this.focusedItemId=a.id,a.scrollIntoView({block:"nearest",container:"nearest"})}updateRenderItemsList(){this.searchValue?this.filterItems(this.searchValue):this.resetRenderItemsList()}resetRenderItemsList(){const e=[];this.itemsList.forEach((t=>{e.push(Object.assign({},t))})),this.renderItemsList=e}filterItems(e){if(!e)return this.closeFilterItems();this.resetRenderItemsList(),this.renderItemsList=this.renderItemsList.filter((t=>{const i=t.name.toUpperCase().indexOf(e.toUpperCase()),s=i+e.length,o=t.name.substring(0,i)+"<strong>"+t.name.substring(i,s)+"</strong>"+t.name.substring(s,t.name.length);return t.name=o,i>=0}))}closeFilterItems(){this.searchValue="",this.resetRenderItemsList()}toggleComboBox(){this.isopen=!this.isopen}getComboboxA11yAttributes(e){const t="combobox",i=this.htmlAriaLabel,s=this.isopen?"true":"false",o=this.isopen?this.focusedItemId:"",a=this.inputid+"_list";return e?{role:t,"aria-label":i,"html-aria-expanded":s,"html-aria-activedescendant":o,"html-aria-controls":a}:{role:t,"aria-label":i,"aria-expanded":s,"aria-activedescendant":o,"aria-controls":a}}renderHeader(){const e=this.hassearch?{}:this.getComboboxA11yAttributes(!1);return s("div",Object.assign({class:"header",onClick:()=>this.toggleComboBox(),onKeyDown:e=>this.handleHeaderKeyDown(e),role:"button",tabindex:0,"aria-controls":"open-combo-data","aria-expanded":this.isopen?"true":"false"},e),s("span",{class:"body-3","aria-label":this.label?`${this.label}${this.selectedCounter>0?` - ${this.selectedCounter} selezionati`:""}`:void 0},this.label,s("span",null,this.selectedCounter>0&&` (${this.selectedCounter})`)),s("z-icon",{name:"caret-down",class:this.size}))}renderContent(){return s("div",{id:"open-combo-data",class:"open-combo-data"},this.hassearch&&this.renderSearchInput(),s("div",{role:"listbox","aria-label":this.label,"aria-multiselectable":"true",id:this.inputid+"_list","aria-owns":`${this.hascheckall?this.getCheckAllOptionId()+" ":""}${this.itemsList.map((e=>this.getOptionId(e.id))).join(" ")}`},this.renderItems()))}renderItems(){return s("div",{class:this.searchValue&&"search",tabIndex:-1,role:"presentation"},this.renderList(this.renderItemsList))}renderItem(e,t,i){const o=this.getOptionId(e.id),a=!e.checked&&this.hasReachedMaxSelections();return s("z-list-element",{htmlTabindex:-1,dividerType:t!==i-1?c.ELEMENT:c.NONE,size:this.getControlToListSize(),role:"presentation",disabled:!!a},s("span",{class:"option-wrap",role:"presentation",onClick:()=>{this.focusedItemId="",this.checkOption(o)}},s("z-icon",{name:e.checked?"checkbox-checked":"checkbox",class:this.focusedItemId===o?"focused":""}),s("span",{id:o,role:a?"presentation":"option","aria-selected":e.checked?"true":"false","aria-label":a?void 0:d(e.name)},s("span",{"aria-hidden":"true",innerHTML:e.name}))))}renderList(e){if(e)return!e.length&&this.searchValue?this.renderNoSearchResults():this.hasgroupitems?this.renderGroups(e):s("ul",{role:"presentation"},this.renderCheckAll(),e.map(((t,i)=>this.renderItem(t,i,e.length))))}renderGroups(e){const t=e.reduce(((t,i,s)=>{var o;const a=i.category||"Altra categoria",r=this.renderItem(i,s,e.length);return t[a]=null!==(o=t[a])&&void 0!==o?o:[],t[a].push(r),t}),{}),i=Object.entries(t).map((([e,t],i)=>s("z-list-group",{size:this.getControlToListSize(),"divider-type":c.ELEMENT,"aria-labelledby":`${this.inputid}_list_group_${i}`},s("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.inputid}_list_group_${i}`,"aria-hidden":"true"},e),t.map((e=>e)))));return s("ul",{role:"presentation"},this.renderCheckAll(),i)}renderNoSearchResults(){return s("div",{class:"no-results"},s("span",null,this.noresultslabel))}renderSearchInput(){return s("z-input",Object.assign({htmlid:this.inputid+"_search",label:this.searchlabel,placeholder:this.searchplaceholder,htmltitle:this.searchtitle,type:this.inputType,value:this.searchValue,message:!1,size:this.size,"html-aria-autocomplete":"list"},this.getComboboxA11yAttributes(!0),{onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>{this.searchValue=e.detail.value,this.focusedItemId=""}}))}renderCheckAll(){if(!this.hascheckall||this.searchValue)return;const e=this.getCheckAllOptionId(),t=this.allOptionsSelected(),i=this.hasReachedMaxSelections()||this.maxcheckableitems&&this.maxcheckableitems<this.itemsList.length;return s("z-list-element",{class:"check-all-wrapper",role:"presentation",htmlTabindex:-1,dividerType:c.ELEMENT,dividerColor:"gray800",size:this.getControlToListSize(),disabled:!!i},s("span",{class:"option-wrap",role:"presentation",onClick:()=>this.checkOption(e)},s("z-icon",{name:t?"checkbox-checked":"checkbox",class:this.focusedItemId===e?"focused":""}),s("span",{id:e,role:i?"presentation":"option","aria-selected":t?"true":"false"},t?this.uncheckalltext:this.checkalltext)))}render(){return s("div",{key:"f65a92eded2c6cd7d4bb42ddc5f667806a4f5582","data-action":"combo-"+this.inputid,class:{open:this.isopen,fixed:this.isfixed,disabled:this.disabled},id:this.inputid},this.renderHeader(),!this.disabled&&this.renderContent())}get element(){return this}static get watchers(){return{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}}static get style(){return'.z-label{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}:host{display:block;min-width:290px;color:var(--color-form-default-text);fill:var(--color-form-default-icon);font-family:var(--font-family-sans)}:host>div.fixed{position:relative}:host>div>.header{position:relative;z-index:10;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 calc(var(--space-unit) * 1.5);border:var(--border-size-small) solid var(--color-form-surface04);margin:0;background-color:var(--color-form-background);border-radius:var(--border-radius-small);cursor:pointer}:host([size="small"])>div>.header{min-height:34px;font-size:var(--font-size-2)}:host([size="x-small"])>div>.header{min-height:30px;font-size:var(--font-size-2)}:host>div>.header:hover{outline:var(--border-size-medium) solid var(--color-form-surface04);outline-offset:-2px}:host>div>div.header:focus:focus-visible{z-index:16;box-shadow:var(--shadow-focus-primary);outline:none}:host>div>.header>span.body-3>span{font-weight:var(--font-sb)}:host>div>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(360deg);transition:all 200ms linear}:host>div>.header>z-icon.small,:host>div>.header>z-icon.x-small{--z-icon-width:16px;--z-icon-height:16px}:host>div.open>.header{border:var(--border-size-small) solid var(--color-form-active-primary);border-radius:var(--border-radius-small) var(--border-radius-small) 0 0}:host>div.disabled{pointer-events:none}:host>div.disabled .header{border-color:var(--color-form-disabled03);fill:var(--color-form-disabled01-icon)}:host>div.disabled .header>span.body-3{color:var(--color-form-disabled03)}:host>div.disabled .header>z-icon:last-child{fill:var(--color-form-disabled01-icon)}:host>div.open>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(180deg);transition:all 200ms linear}:host>div>div.open-combo-data{display:none}:host>div.open>div.open-combo-data{position:relative;z-index:12;display:block;padding:var(--space-unit) calc(var(--space-unit) * 2);border:var(--border-size-small) solid var(--color-form-surface03);border-top:0;background-color:var(--color-form-background);border-radius:0;box-shadow:var(--shadow-2)}:host .open .open-combo-data z-input .z-label{color:var(--color-form-default-text)}:host>div.open>div.open-combo-data>div>div{overflow:auto;max-height:235px;padding:0;padding-left:var(--space-unit);margin-left:calc(var(--space-unit) * -1);}:host>div.open>div.open-combo-data>z-input{width:100%;margin-bottom:calc(var(--space-unit) * 2)}:host>div.open>div.open-combo-data>div>div>ul{max-height:235px;padding:0 calc(var(--space-unit) * 0.5);margin:0}:host .open-combo-data z-list-element{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}:host .open-combo-data z-list-element[disabled]{pointer-events:none}:host .open-combo-data z-list-element .option-wrap{display:flex;flex-direction:row;align-items:center;cursor:pointer;gap:var(--space-unit)}:host .open-combo-data z-list-element[size="medium"] .option-wrap,:host .open-combo-data z-list-element[size="small"] .option-wrap{--z-icon-width:16px;--z-icon-height:16px;font-size:var(--font-size-2);gap:calc(var(--space-unit) / 2)}:host .open-combo-data z-list-element .option-wrap>z-icon{fill:var(--color-primary01)}:host .open-combo-data z-list-element[disabled] .option-wrap>z-icon{fill:var(--color-disabled01)}:host .open-combo-data z-list-element .option-wrap>z-icon.focused{border-radius:var(--border-radius-small);box-shadow:var(--shadow-focus-primary);outline:none}:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus,:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus-visible{outline:none}::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(::-webkit-scrollbar-track){:host{scrollbar-color:var(--color-primary01) transparent}}:host>div.open>z-input{position:relative;z-index:1;width:238px;margin:0 calc(var(--space-unit) * 2);color:var(--color-form-active-primary)}:host>div.open>div.open-combo-data>div>div.search{overflow:hidden;max-height:none;margin-top:0}:host>div.open>div.open-combo-data>div>div.search>ul{overflow:auto;max-height:180px;padding:var(--space-unit) calc(var(--space-unit) * 2)}:host .open .open-combo-data .search .no-results{display:flex;align-items:center;column-gap:var(--space-unit)}:host>.open>.open-combo-data .search .close-search{display:flex;justify-content:center}:host>div.open>div.open-combo-data>div>div.search .close-search>a{display:inline-block;height:44px;color:var(--color-form-active-primary);cursor:pointer;font-size:14px;font-weight:var(--font-sb);line-height:44px;text-align:center;text-transform:uppercase}:host>div.open>div.open-combo-data>div>div.search .close-search>a:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2)     calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--gray800);margin-bottom:var(--space-unit);margin-left:calc(var(--space-unit) * -1);text-align:left}:host([size="small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5)}:host([size="x-small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:var(--space-unit) calc(var(--space-unit) * 0.5)}'}},[1,"z-combobox",{inputid:[1],items:[1],label:[1],disabled:[516],hassearch:[4],searchlabel:[1],searchplaceholder:[1],searchtitle:[1],noresultslabel:[1],isopen:[1028],isfixed:[4],hascheckall:[4],checkalltext:[1],uncheckalltext:[1],maxcheckableitems:[2],hasgroupitems:[4],size:[1],htmlAriaLabel:[1,"html-aria-label"],searchValue:[32],selectedCounter:[32],renderItemsList:[32],focusedItemId:[32]},void 0,{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}]),x=g,z=function(){"undefined"!=typeof customElements&&["z-combobox","z-divider","z-icon","z-input","z-input-message","z-list-element","z-list-group"].forEach((e=>{switch(e){case"z-combobox":customElements.get(o(e))||customElements.define(o(e),g);break;case"z-divider":customElements.get(o(e))||p();break;case"z-icon":customElements.get(o(e))||m();break;case"z-input":customElements.get(o(e))||u();break;case"z-input-message":customElements.get(o(e))||b();break;case"z-list-element":customElements.get(o(e))||v();break;case"z-list-group":customElements.get(o(e))||f()}}))};export{x as ZCombobox,z as defineCustomElement}

package/dist/components/z-cover-hero.js

@@ -1,66 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { J as CoverHeroVariant, M as CoverHeroContentPosition } from './index2.js';
-
-const stylesCss = ":host{--cover-hero-overlay:linear-gradient(270deg, #0000 0%, #000000e6 100%);--cover-hero-text-color:var(--color-text-inverse);display:block;overflow:hidden}:host,*{box-sizing:border-box}:host .main-container{position:relative;width:100%;align-items:baseline}:host .content-container{color:var(--cover-hero-text-color);fill:var(--cover-hero-text-color)}:host .main-container .cover-container{position:relative;width:100%;padding-top:calc(100% / (var(--cover-hero-aspect-ratio, var(--image-aspect-ratio, 16/9))));background-color:var(--gray600)}::slotted([slot=\"cover\"]){position:absolute;display:block;width:100%;height:100%;inset:0;object-fit:cover;object-position:top center}::slotted(z-info-reveal){position:absolute;z-index:1;right:var(--grid-margin);bottom:var(--grid-margin)}:host([variant=\"overlay\"]:not([preserve-aspect-ratio=\"\"],[preserve-aspect-ratio=\"true\"])) .main-container{height:100%}:host([variant=\"overlay\"]:not([preserve-aspect-ratio=\"\"],[preserve-aspect-ratio=\"true\"])) .main-container .cover-container{position:absolute;z-index:-1;height:100%;padding:0}:host([variant=\"overlay\"]) .main-container .cover-container::after{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--cover-hero-overlay);content:\"\"}:host([variant=\"overlay\"]:is([preserve-aspect-ratio=\"\"],[preserve-aspect-ratio=\"true\"])) .main-container .content-container{position:absolute;inset:0}:host([variant=\"overlay\"]) .main-container .content-container{height:100%;padding:var(--grid-margin)}:host([variant=\"stacked\"]){--cover-hero-text-color:var(--color-default-text)}:host([variant=\"stacked\"]) .content-container ::slotted(*){padding:var(--grid-margin) 0}";
-const ZCoverHeroStyle0 = stylesCss;
-
-const ZCoverHero$1 = /*@__PURE__*/ proxyCustomElement(class ZCoverHero extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.variant = CoverHeroVariant.OVERLAY;
-        this.contentPosition = CoverHeroContentPosition.TOP;
-        this.preserveAspectRatio = true;
-    }
-    /**
-     * Store the intrinsic aspect ratio of the slotted image when loaded,
-     * to have a default when `--cover-hero-aspect-ratio` is not set.
-     * @param target The event target
-     */
-    onImgLoad({ target }) {
-        if (target instanceof Image && target.closest("[slot=cover]")) {
-            const ratio = target.naturalWidth / target.naturalHeight;
-            this.host.style.setProperty("--image-aspect-ratio", ratio.toString());
-        }
-    }
-    /**
-     * Template for the content.
-     */
-    renderContent() {
-        return (h("div", { class: "content-container" }, h("slot", { name: "content" })));
-    }
-    render() {
-        return (h(Host, { key: '1eb5d39f26e19f213d435c185167eb83500225f3' }, this.variant === CoverHeroVariant.STACKED &&
-            this.contentPosition === CoverHeroContentPosition.TOP &&
-            this.renderContent(), h("div", { key: '61c495773839b7741f674719325fe98a65956986', class: "main-container" }, h("div", { key: '0ea2f83f40f60017fb2e7a4501cb67c34d954f6c', class: "cover-container" }, h("slot", { key: '68a40d93440b22ce2afb9ff8db3cb9ca90ec7263', name: "cover" })), h("slot", { key: 'c29feaf859382807e0e55bcf2db27a98387c2e96', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
-            this.contentPosition === CoverHeroContentPosition.BOTTOM &&
-            this.renderContent()));
-    }
-    get host() { return this; }
-    static get style() { return ZCoverHeroStyle0; }
-}, [1, "z-cover-hero", {
-        "variant": [513],
-        "contentPosition": [513, "content-position"],
-        "preserveAspectRatio": [516, "preserve-aspect-ratio"]
-    }, [[2, "load", "onImgLoad"]]]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-cover-hero"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-cover-hero":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZCoverHero$1);
-            }
-            break;
-    } });
-}
-
-const ZCoverHero = ZCoverHero$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { ZCoverHero, defineCustomElement };
-
-//# sourceMappingURL=z-cover-hero.js.map
+import{proxyCustomElement as e,HTMLElement as t,h as o,Host as r,transformTag as a}from"@stencil/core/internal/client";import{J as i,M as n}from"./index2.js";const s=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.variant=i.OVERLAY,this.contentPosition=n.TOP,this.preserveAspectRatio=!0}onImgLoad({target:e}){e instanceof Image&&e.closest("[slot=cover]")&&this.host.style.setProperty("--image-aspect-ratio",""+e.naturalWidth/e.naturalHeight)}renderContent(){return o("div",{class:"content-container"},o("slot",{name:"content"}))}render(){return o(r,{key:"0e8ec76a2293bbf7044d2a5d0ec951ac096adcd1"},this.variant===i.STACKED&&this.contentPosition===n.TOP&&this.renderContent(),o("div",{key:"e2dd8963eb05d5a1a602b05d6275d52c01b8dbc9",class:"main-container"},o("div",{key:"3b537c3b07906fd72795b105e4189252bf876b51",class:"cover-container"},o("slot",{key:"f99228a940cfc96ae4ff98a6b79df622d033e00d",name:"cover"})),o("slot",{key:"86b43980717df411f76b098628d83fa80c8dcff6",name:"info-reveal"}),this.variant===i.OVERLAY&&this.renderContent()),this.variant===i.STACKED&&this.contentPosition===n.BOTTOM&&this.renderContent())}get host(){return this}static get style(){return':host{--cover-hero-overlay:linear-gradient(270deg, #0000 0%, #000000e6 100%);--cover-hero-text-color:var(--color-text-inverse);display:block;overflow:hidden}:host,*{box-sizing:border-box}:host .main-container{position:relative;width:100%;align-items:baseline}:host .content-container{color:var(--cover-hero-text-color);fill:var(--cover-hero-text-color)}:host .main-container .cover-container{position:relative;width:100%;padding-top:calc(100% / (var(--cover-hero-aspect-ratio, var(--image-aspect-ratio, 16/9))));background-color:var(--gray600)}::slotted([slot="cover"]){position:absolute;display:block;width:100%;height:100%;inset:0;object-fit:cover;object-position:top center}::slotted(z-info-reveal){position:absolute;z-index:1;right:var(--grid-margin);bottom:var(--grid-margin)}:host([variant="overlay"]:not([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container{height:100%}:host([variant="overlay"]:not([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container .cover-container{position:absolute;z-index:-1;height:100%;padding:0}:host([variant="overlay"]) .main-container .cover-container::after{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--cover-hero-overlay);content:""}:host([variant="overlay"]:is([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container .content-container{position:absolute;inset:0}:host([variant="overlay"]) .main-container .content-container{height:100%;padding:var(--grid-margin)}:host([variant="stacked"]){--cover-hero-text-color:var(--color-default-text)}:host([variant="stacked"]) .content-container ::slotted(*){padding:var(--grid-margin) 0}'}},[257,"z-cover-hero",{variant:[513],contentPosition:[513,"content-position"],preserveAspectRatio:[516,"preserve-aspect-ratio"]},[[2,"load","onImgLoad"]]]),c=s,d=function(){"undefined"!=typeof customElements&&["z-cover-hero"].forEach((e=>{"z-cover-hero"===e&&(customElements.get(a(e))||customElements.define(a(e),s))}))};export{c as ZCoverHero,d as defineCustomElement}