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

package/dist/components/index25.js

@@ -1,409 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { e as ControlSize, B as ButtonVariant, p as Device, l as ListDividerType, g as KeyboardCode } from './index2.js';
-import { r as randomId, g as getDevice, l as handleEnterKeydSubmit } from './utils.js';
-import { d as defineCustomElement$9 } from './index5.js';
-import { d as defineCustomElement$8 } from './index7.js';
-import { d as defineCustomElement$7 } from './index10.js';
-import { d as defineCustomElement$6 } from './index12.js';
-import { d as defineCustomElement$5 } from './index13.js';
-import { d as defineCustomElement$4 } from './index14.js';
-import { d as defineCustomElement$3 } from './index15.js';
-import { d as defineCustomElement$2 } from './index16.js';
-import { d as defineCustomElement$1 } from './index26.js';
-
-const stylesCss$1 = ":host{--z-searchbar-tag-text-color:var(--color-primary03);--z-searchbar-tag-bg:var(--color-hover-primary);--z-searchbar-item-height:44px;z-index:15;display:flex;column-gap:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,*{box-sizing:border-box}:host::part(list-item-container){display:block;min-height:unset;padding:0}.input-container{position:relative;display:flex;width:100%;flex-direction:column}.results-wrapper{position:absolute;top:calc(100% - 1px);left:0;width:100%;padding:calc(var(--space-unit) / 4);border:var(--border-size-small) solid var(--color-surface03);border-top:none;background:var(--color-surface01)}.results{overflow:auto;max-height:var(--z-searchbar-results-height, 540px);padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 1.5)}.results::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}.results::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}.results::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(.results::-webkit-scrollbar-track){.results{scrollbar-color:var(--color-primary01) transparent}}.results .category-heading{display:block;font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:var(--font-size-3)}.results .category-heading>*{display:block}.results .category-heading>.category{color:var(--color-text05);font-style:italic}.results .category-heading>.subcategory{margin-top:var(--space-unit);color:var(--color-default-text);text-transform:uppercase}.results z-list-element{position:relative;display:block}z-list-element>.item-search{padding:var(--space-unit) 0}z-list z-list-element::before{position:absolute;z-index:100;top:5px;left:-20px;width:8px;height:1em;border-bottom:1px solid var(--color-disabled01-icon);border-left:1px solid var(--color-disabled01-icon);content:\"\";cursor:pointer}z-list z-list-element::after{position:absolute;z-index:100;top:5px;left:-20px;width:8px;height:100%;border-left:1px solid var(--color-disabled01-icon);content:\"\";cursor:pointer}z-list z-list-element:last-child::after{display:none}z-list>z-list-element::before,z-list>z-list-element::after,z-list>z-list-group>z-list-element::before,z-list>z-list-group>z-list-element::after{display:none}z-list>div.children-node{padding-left:calc(var(--space-unit) * 3)}.results z-list-element>.list-element{display:flex;justify-content:space-between;padding:calc(var(--space-unit) * 1.25) 0;cursor:pointer}.results z-list-element>.list-element:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.results z-list-element>.list-element .item.ellipsis{overflow:hidden}.results z-list-element .list-element::after{position:absolute;top:0;right:0;display:block;width:100%;height:44px;content:\"\";transform:translateX(-100%)}.results z-list-element .list-element.focused.hovered::after{padding-left:6px}.results z-list-element>.list-element:hover,.results z-list-element>.list-element:hover::after{background-color:var(--color-background);cursor:pointer}.results z-list-element>.list-element>z-tag{border:1px solid var(--gray800);font-size:var(--font-size-1);font-weight:var(--font-sb);--z-tag-bg:var(--z-searchbar-tag-bg);--z-tag-text-color:var(--z-searchbar-tag-text-color)}.results .item{--z-icon-height:12px;--z-icon-width:12px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:flex-start;color:var(--color-default-text);column-gap:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon);font-size:var(--font-size-2);line-height:var(--font-size-6)}.results .item.ellipsis>.item-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results .item>.item-label mark{background:var(--color-primary03)}.results .item.item-search{--z-icon-height:16px;--z-icon-width:16px}.results .item-show-all{text-align:center}.results .item-no-results{display:block;font-size:var(--font-size-2);font-style:italic;line-height:var(--font-size-5)}.results .item-no-results>ul{padding-left:calc(var(--space-unit) * 2);margin:var(--space-unit)}@media (min-width: 768px){.results .category-heading{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item.item-search{--z-icon-height:18px;--z-icon-width:18px}.results .item.ellipsis>.item-label{height:24px}.results z-list-element>.list-element>z-tag{min-width:max-content}}@media (min-width: 1152px){.results .item{cursor:pointer}.results .item-no-results{cursor:default;font-size:var(--font-size-3);line-height:var(--font-size-6)}}:host([size=\"small\"]) .results :is(.item,.category-heading),:host([size=\"x-small\"]) .results :is(.item,.category-heading){font-size:var(--font-size-2)}:host([size=\"small\"]) .results .item:not(.has-category),:host([size=\"x-small\"]) .results .item:not(.has-category){--z-icon-height:16px;--z-icon-width:16px}:host([size=\"small\"]) z-list-element>.list-element,:host([size=\"small\"]) z-list-element>.item-search{padding:calc(var(--space-unit) * 0.75) 0}:host([size=\"x-small\"]) z-list-element>.list-element,:host([size=\"x-small\"]) z-list-element>.item-search{padding:calc(var(--space-unit) / 2) 0}:host([size=\"small\"]) z-list-element .list-element::after{height:36px}:host([size=\"x-small\"]) z-list-element .list-element::after{height:32px}";
-const ZSearchbarStyle0 = stylesCss$1;
-
-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}";
-const ZSearchbarStyle1 = stylesCss;
-
-const ZSearchbar = /*@__PURE__*/ proxyCustomElement(class ZSearchbar extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.searchSubmit = createEvent(this, "searchSubmit", 7);
-        this.searchTyping = createEvent(this, "searchTyping", 7);
-        this.searchItemClick = createEvent(this, "searchItemClick", 7);
-        this.resultsItemsList = null;
-        this.items = [];
-        this.htmlid = `searchbar-${randomId()}`;
-        this.preventSubmit = false;
-        this.label = undefined;
-        this.htmlAriaLabel = undefined;
-        this.value = undefined;
-        this.placeholder = undefined;
-        this.autocomplete = false;
-        this.autocompleteMinChars = 3;
-        this.resultsCount = undefined;
-        this.searchHelperLabel = "Cerca {searchString}";
-        this.resultsItems = undefined;
-        this.sortResultsItems = false;
-        this.showSearchButton = false;
-        this.searchButtonIconOnly = false;
-        this.size = ControlSize.BIG;
-        this.variant = ButtonVariant.PRIMARY;
-        this.searchString = this.value;
-        this.currResultsCount = 0;
-        this.showResults = false;
-        this.isMobile = false;
-        this.selectedItem = undefined;
-    }
-    emitSearchSubmit() {
-        this.searchSubmit.emit(this.inputRef.value);
-    }
-    emitSearchTyping(search) {
-        this.searchTyping.emit(search);
-    }
-    emitSearchItemClick(item) {
-        this.searchItemClick.emit(item);
-        this.selectedItem = item;
-        this.searchString = "";
-    }
-    watchItems() {
-        this.resultsItemsList = this.getResultsItemsList();
-    }
-    watchResultsCount() {
-        this.currResultsCount = this.resultsCount;
-    }
-    watchValue() {
-        this.searchString = this.value;
-    }
-    watchSearchString() {
-        this.emitSearchTyping(this.searchString);
-        this.items = [];
-        if (!this.searchString) {
-            this.currResultsCount = this.resultsCount;
-        }
-    }
-    watchShowResults() {
-        if (!this.showResults) {
-            this.items = [];
-        }
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
-    }
-    componentDidLoad() {
-        this.resizeObserver = new ResizeObserver(() => {
-            if (getDevice() === Device.MOBILE && !this.isMobile) {
-                this.isMobile = true;
-            }
-            if (getDevice() !== Device.MOBILE && this.isMobile) {
-                this.isMobile = false;
-            }
-        });
-        this.resizeObserver.observe(this.element);
-    }
-    componentWillLoad() {
-        this.resultsItemsList = this.getResultsItemsList();
-        this.currResultsCount = this.resultsCount;
-    }
-    getResultsItemsList() {
-        return typeof this.resultsItems === "string" ? JSON.parse(this.resultsItems) : this.resultsItems;
-    }
-    getGroupedItems(items) {
-        const groupedItems = {};
-        items.forEach((item) => {
-            var _a;
-            const key = `${item === null || item === void 0 ? void 0 : item.category}${item === null || item === void 0 ? void 0 : item.subcategory}`;
-            groupedItems[key] = (_a = groupedItems[key]) !== null && _a !== void 0 ? _a : {
-                category: item === null || item === void 0 ? void 0 : item.category,
-                subcategory: item === null || item === void 0 ? void 0 : item.subcategory,
-                items: [],
-            };
-            groupedItems[key]["items"].push(item);
-        });
-        if (this.sortResultsItems) {
-            return Object.keys(groupedItems)
-                .sort()
-                .reduce((obj, key) => {
-                obj[key] = Object.assign(Object.assign({}, groupedItems[key]), { items: groupedItems[key]["items"].sort((a, b) => {
-                        const nameA = a.label.toUpperCase();
-                        const nameB = b.label.toUpperCase();
-                        if (nameA < nameB) {
-                            return -1;
-                        }
-                        if (nameA > nameB) {
-                            return 1;
-                        }
-                        return 0;
-                    }) });
-                return obj;
-            }, {});
-        }
-        return groupedItems;
-    }
-    checkResultsCount(counter) {
-        if (!this.currResultsCount || counter < this.currResultsCount) {
-            return true;
-        }
-        return false;
-    }
-    handleStopTyping(e) {
-        e.stopPropagation();
-        this.searchString = e.detail.value;
-        if (this.selectedItem) {
-            this.selectedItem = undefined;
-        }
-    }
-    handleSubmit() {
-        if (this.preventSubmit) {
-            return;
-        }
-        this.emitSearchSubmit();
-    }
-    handleOutsideClick(e) {
-        const cp = e.composedPath();
-        const searchbar = cp.find((elem) => elem.nodeName === "Z-SEARCHBAR");
-        if (!searchbar || searchbar.htmlid !== this.htmlid) {
-            this.showResults = false;
-            return;
-        }
-        if (cp.find((elem) => { var _a; return (elem === null || elem === void 0 ? void 0 : elem.nodeName) === "Z-INPUT" || ((_a = elem === null || elem === void 0 ? void 0 : elem.classList) === null || _a === void 0 ? void 0 : _a.contains("results")); })) {
-            this.showResults = true;
-            return;
-        }
-        this.showResults = false;
-    }
-    renderInput() {
-        var _a;
-        return (h("z-input", { ref: (val) => {
-                this.inputRef = val;
-            }, htmlid: `input-${this.htmlid}`, message: false, placeholder: this.placeholder, onStopTyping: (e) => this.handleStopTyping(e), onKeyUp: (e) => {
-                handleEnterKeydSubmit(e, () => this.handleSubmit());
-                this.handleArrowsNavigation(e);
-            }, value: this.searchString || ((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.label), size: this.size, label: this.label, "aria-label": this.htmlAriaLabel || this.placeholder }));
-    }
-    renderButton() {
-        if (!this.showSearchButton) {
-            return null;
-        }
-        const iconProp = this.searchButtonIconOnly ? { icon: "search" } : null;
-        const buttonLabel = this.searchButtonIconOnly ? "" : "CERCA";
-        const ariaLabel = this.searchButtonIconOnly ? { "aria-label": "CERCA" } : null;
-        const defaultProps = Object.assign(Object.assign({ disabled: this.preventSubmit, variant: this.variant, size: this.size, onClick: () => this.handleSubmit() }, iconProp), ariaLabel);
-        return h("z-button", Object.assign({}, defaultProps), buttonLabel);
-    }
-    renderResults() {
-        if (!this.showResults ||
-            !this.autocomplete ||
-            !this.searchString ||
-            this.searchString.length < this.autocompleteMinChars ||
-            !this.resultsItemsList) {
-            return null;
-        }
-        return (h("div", { class: "results-wrapper" }, h("div", { class: "results" }, this.renderResultsList())));
-    }
-    renderResultsList() {
-        var _a, _b;
-        if (this.preventSubmit && !((_a = this.resultsItemsList) === null || _a === void 0 ? void 0 : _a.length)) {
-            return (h("span", { class: "item item-no-results" }, "Non abbiamo trovato risultati per ", h("b", null, this.searchString), h("br", null), h("br", null), "Cosa puoi fare?", h("ul", null, h("li", null, "Verificare di aver scritto bene"), h("li", null, "Provare a cercare un'altra parola"), h("li", null, "Provare a cercare qualcosa di pi\u00F9 generico"))));
-        }
-        return (h("z-list", { role: "listbox", id: `list-${this.htmlid}`, "aria-label": this.htmlAriaLabel || this.label }, this.renderSearchHelper(!!((_b = this.resultsItemsList) === null || _b === void 0 ? void 0 : _b.length)), this.renderItems(), this.renderShowAllResults()));
-    }
-    renderItems() {
-        var _a;
-        if (!((_a = this.resultsItemsList) === null || _a === void 0 ? void 0 : _a.length)) {
-            return [];
-        }
-        const groupedItems = this.getGroupedItems(this.resultsItemsList);
-        const listGroups = [];
-        let counter = 0;
-        Object.values(groupedItems).forEach((groupItem, index, array) => {
-            if (this.checkResultsCount(counter)) {
-                const listGroupsElements = [];
-                groupItem.items.forEach((item, subindex, subarray) => {
-                    if (this.checkResultsCount(counter)) {
-                        const isLast = index === array.length - 1 && subindex === subarray.length - 1;
-                        listGroupsElements.push(this.renderItem(item, subindex, !isLast));
-                    }
-                    counter++;
-                });
-                if (listGroupsElements.length) {
-                    listGroups.push(h("z-list-group", { "divider-type": ListDividerType.ELEMENT }, this.renderItemCategory(groupItem), listGroupsElements));
-                }
-            }
-        });
-        return listGroups;
-    }
-    handleArrowsNavigation(e) {
-        const currentElement = e.target;
-        const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];
-        if (!arrows.includes(e.key)) {
-            e.preventDefault();
-            return;
-        }
-        if (!this.items.length) {
-            const list = this.element.shadowRoot.querySelector("z-list");
-            if (!list) {
-                return;
-            }
-            this.items = Array.from(list.querySelectorAll(".list-element"));
-        }
-        this.items.forEach((item) => item.classList.contains("focused") && item.classList.remove("focused"));
-        const currentIndex = this.items.indexOf(currentElement);
-        if (e.key === KeyboardCode.ARROW_DOWN) {
-            e.preventDefault();
-            const nextIndex = currentIndex + 1;
-            if (nextIndex < this.items.length) {
-                this.items[nextIndex].focus();
-                this.items[nextIndex].classList.add("focused");
-            }
-        }
-        if (e.key === KeyboardCode.ARROW_UP) {
-            e.preventDefault();
-            const prevIndex = currentIndex - 1;
-            if (prevIndex < 0) {
-                this.element.shadowRoot.querySelector("input").focus();
-                this.element.shadowRoot
-                    .querySelector("input")
-                    .setSelectionRange(this.inputRef.value.length, this.inputRef.value.length);
-            }
-            if (prevIndex >= 0) {
-                this.items[prevIndex].focus();
-                this.items[prevIndex].classList.add("focused");
-            }
-        }
-    }
-    renderItem(item, key, divider) {
-        return (h("z-list-element", { id: `list-item-${this.htmlid}-${key}`, tabIndex: 0, role: "option", dividerType: divider ? ListDividerType.ELEMENT : undefined, onKeyDown: (e) => this.handleArrowsNavigation(e) }, h("div", { class: "list-element", tabIndex: 0, onClick: () => this.emitSearchItemClick(item), onKeyDown: (e) => handleEnterKeydSubmit(e, () => this.emitSearchItemClick(item)), onMouseEnter: (e) => {
-                const currentElement = e.target;
-                currentElement.classList.add("hovered");
-            }, onMouseLeave: (e) => {
-                const currentElement = e.target;
-                currentElement.classList.contains("hovered") && currentElement.classList.remove("hovered");
-            } }, h("span", { class: "item ellipsis" }, (item === null || item === void 0 ? void 0 : item.icon) && (h("z-icon", { class: "item-icon", name: item.icon })), h("span", { class: "item-label", title: item.label, innerHTML: this.renderItemLabel(item.label) })), (item === null || item === void 0 ? void 0 : item.tag) && h("z-tag", { icon: item.tag.icon }, !this.isMobile ? item.tag.text : "")), item.children && item.children.length > 0 ? (h("z-list", null, h("div", { class: "children-node" }, item.children.map((child, index) => this.renderItem(child, index, false))))) : null));
-    }
-    renderItemLabel(label) {
-        if (!this.searchString) {
-            return label;
-        }
-        return label.replace(new RegExp(this.searchString.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "gmi"), (found) => `<mark>${found}</mark>`);
-    }
-    renderItemCategory(groupItem) {
-        if (!(groupItem === null || groupItem === void 0 ? void 0 : groupItem.category)) {
-            return null;
-        }
-        return (h("span", { class: "category-heading", slot: "header-title" }, h("span", { class: "category" }, groupItem.category), (groupItem === null || groupItem === void 0 ? void 0 : groupItem.subcategory) && h("span", { class: "subcategory" }, groupItem.subcategory)));
-    }
-    renderSearchHelper(hasDivider = true) {
-        if (!this.autocomplete || this.preventSubmit || !this.searchString) {
-            return null;
-        }
-        return (h("z-list-element", { role: "option", dividerType: hasDivider ? ListDividerType.ELEMENT : undefined, id: `list-item-${this.htmlid}-search`, onKeyDown: (e) => this.handleArrowsNavigation(e) }, h("div", { tabindex: 0, onClick: () => this.emitSearchSubmit(), onKeyDown: (e) => handleEnterKeydSubmit(e, () => this.emitSearchSubmit()), class: "list-element" }, h("span", { class: "item item-search" }, h("z-icon", { class: "search-icon", name: "left-magnifying-glass" }), h("span", { class: "item-label", innerHTML: this.searchHelperLabel.replace("{searchString}", `<mark>${this.searchString}</mark>`) })))));
-    }
-    renderShowAllResults() {
-        var _a, _b;
-        if (!this.currResultsCount ||
-            !this.searchString ||
-            !((_a = this.resultsItemsList) === null || _a === void 0 ? void 0 : _a.length) ||
-            this.currResultsCount >= ((_b = this.resultsItemsList) === null || _b === void 0 ? void 0 : _b.length)) {
-            return null;
-        }
-        return (h("z-list-element", { role: "option", tabindex: 0, clickable: true, id: `list-item-${this.htmlid}-show-all`, onClickItem: () => (this.currResultsCount = 0), color: "color-primary01" }, h("div", { class: "item-show-all" }, "Vedi tutti i risultati")));
-    }
-    render() {
-        return (h(Host, { key: '80709d742a085bb3045a2a8795e5e77ce8aa9e3e', onFocus: () => (this.showResults = true), onClick: (e) => this.handleOutsideClick(e), class: { "has-submit": this.showSearchButton, "has-results": this.autocomplete } }, h("div", { key: 'fb03a352402836b09da8b315e84a37c8bee98583', class: "input-container" }, this.renderInput(), this.renderResults()), this.renderButton()));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "resultsItems": ["watchItems"],
-        "resultsCount": ["watchResultsCount"],
-        "value": ["watchValue"],
-        "searchString": ["watchSearchString"],
-        "showResults": ["watchShowResults"]
-    }; }
-    static get style() { return ZSearchbarStyle0 + ZSearchbarStyle1; }
-}, [1, "z-searchbar", {
-        "htmlid": [513],
-        "preventSubmit": [4, "prevent-submit"],
-        "label": [1],
-        "htmlAriaLabel": [1, "html-aria-label"],
-        "value": [1],
-        "placeholder": [1],
-        "autocomplete": [4],
-        "autocompleteMinChars": [2, "autocomplete-min-chars"],
-        "resultsCount": [2, "results-count"],
-        "searchHelperLabel": [1, "search-helper-label"],
-        "resultsItems": [1, "results-items"],
-        "sortResultsItems": [4, "sort-results-items"],
-        "showSearchButton": [4, "show-search-button"],
-        "searchButtonIconOnly": [4, "search-button-icon-only"],
-        "size": [1],
-        "variant": [1],
-        "searchString": [32],
-        "currResultsCount": [32],
-        "showResults": [32],
-        "isMobile": [32],
-        "selectedItem": [32]
-    }, [[4, "click", "handleOutsideClick"]], {
-        "resultsItems": ["watchItems"],
-        "resultsCount": ["watchResultsCount"],
-        "value": ["watchValue"],
-        "searchString": ["watchSearchString"],
-        "showResults": ["watchShowResults"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-searchbar", "z-button", "z-divider", "z-icon", "z-input", "z-input-message", "z-list", "z-list-element", "z-list-group", "z-tag"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-searchbar":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZSearchbar);
-            }
-            break;
-        case "z-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "z-divider":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "z-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "z-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "z-input-message":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "z-list":
-            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;
-        case "z-tag":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { ZSearchbar as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index25.js.map
+import{proxyCustomElement as e,HTMLElement as r,h as a,transformTag as t}from"@stencil/core/internal/client";import{L as i}from"./index2.js";const o=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.allowTooltip=!1}getTitle(){return this.allowTooltip?this.titolo:""}componentDidLoad(){this.elementHasEllipsis()&&(this.allowTooltip=!0)}elementHasEllipsis(){return this.ellipsis.offsetWidth<this.ellipsis.scrollWidth}retrieveClass(){return{real:this.cardtype===i.REAL,trial:this.cardtype===i.TRIAL,temp:this.cardtype===i.TEMP,faded:this.faded}}render(){return a("header",{key:"8e8ab719ee2980ea4de54b3fcb217aacfd578c20",class:this.retrieveClass()},a("slot",{key:"9c504020c8d7535a8ef719b2e9b64a1c9cd6b8bd",name:"aria-heading"}),a("span",{key:"bf58a2840947b828a8a3cc73b5164c0f05fb9b57",class:"card-title",ref:e=>this.ellipsis=e,title:this.getTitle()},this.titolo),a("slot",{key:"7ba079e3389b6b5908e2296a397a28980b901e28",name:"icon"}))}static get style(){return'header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--blue100);background-color:var(--color-primary03)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-background)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--blue100);border-right:var(--border-size-medium) solid var(--blue100);border-left:var(--border-size-medium) solid var(--blue100)}'}},[257,"z-myz-card-header",{titolo:[1],faded:[4],cardtype:[1],allowTooltip:[32]}]);function s(){"undefined"!=typeof customElements&&["z-myz-card-header"].forEach((e=>{"z-myz-card-header"===e&&(customElements.get(t(e))||customElements.define(t(e),o))}))}export{o as Z,s as d}

package/dist/components/index26.js

@@ -1,49 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$1 } from './index10.js';
-
-const stylesCss = ".sc-z-tag-h{--z-icon-width:14px;--z-icon-height:14px;display:flex;width:fit-content;max-width:inherit;height:fit-content;max-height:inherit;align-items:flex-start;padding:calc(var(--space-unit) / 2);background-color:var(--z-tag-bg, var(--color-hover-primary));border-radius:var(--border-radius);color:var(--z-tag-text-color, var(--color-text-inverse));fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:14px;text-transform:uppercase}.sc-z-tag-h>z-icon.sc-z-tag{margin-right:0;transition:margin-right 0.3s ease-out}.has-text.sc-z-tag-h:not(.expandable)>z-icon.sc-z-tag{margin-right:var(--space-unit)}.has-text.expandable.sc-z-tag-h:hover>z-icon.sc-z-tag{margin-right:var(--space-unit)}.expandable.sc-z-tag-h>div.sc-z-tag{overflow:hidden;max-width:0;max-height:0}.expandable.sc-z-tag-h:hover>div.sc-z-tag{max-width:100%;max-height:100%}";
-const ZTagStyle0 = stylesCss;
-
-const ZTag = /*@__PURE__*/ proxyCustomElement(class ZTag extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.icon = undefined;
-        this.expandable = undefined;
-    }
-    render() {
-        var _a;
-        const hasText = ((_a = this.host.textContent) === null || _a === void 0 ? void 0 : _a.trim().length) > 0;
-        return (h(Host, { key: 'ed05949bf1f4fb03fdbecfaa7acb43bfbb6f8841', class: {
-                "expandable": this.expandable && !!this.icon,
-                "has-text": hasText,
-            } }, this.icon && h("z-icon", { key: '72ebeed5930725102f4131acedeabc536d887a44', name: this.icon }), h("div", { key: '7528424efc94fad4b910f54365a20dd644962936' }, h("slot", { key: '951b325ae2b157d343fd6fbed8bc8d40fcdd9e37' }))));
-    }
-    get host() { return this; }
-    static get style() { return ZTagStyle0; }
-}, [6, "z-tag", {
-        "icon": [1],
-        "expandable": [4]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-tag", "z-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-tag":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZTag);
-            }
-            break;
-        case "z-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { ZTag as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index26.js.map
+import{proxyCustomElement as i,HTMLElement as t,createEvent as s,h as e,transformTag as a}from"@stencil/core/internal/client";import{h as n}from"./utils.js";import{d as o}from"./index3.js";const l=i(class extends t{emitZListItemLinkClick(i,t){this.zListItemLinkClick.emit({e:i,linkId:t})}emitZListItemClick(i,t){this.zListItemClick.emit({e:i,listitemid:t})}constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.zListItemLinkClick=s(this,"zListItemLinkClick",7),this.zListItemClick=s(this,"zListItemClick",7),this.linktarget="_self",this.underlined=!0,this.emitZListItemLinkClick=this.emitZListItemLinkClick.bind(this),this.emitZListItemClick=this.emitZListItemClick.bind(this)}render(){const i=this.listitemid?`link_${this.listitemid}`:"";return e("li",{key:"b6ba862acc48ceb87ae354709401d3a3f1edded0",role:"button",id:this.listitemid,"data-action":this.action,onClick:i=>this.emitZListItemClick(i,this.listitemid),onKeyPress:i=>n(i,this.emitZListItemClick,this.listitemid)},e("span",{key:"e9d3ae7e318e02f241e3fcbdd512ee16df29732e",class:this.underlined&&"border"},this.icon&&e("z-icon",{key:"cd4898bfd2cec5d9455c16b3f7b2fb0d972475a4",name:this.icon}),this.link?e("a",{href:this.link?this.link:null,target:this.linktarget,id:i,onClick:t=>this.emitZListItemLinkClick(t,i),onKeyPress:t=>n(t,this.emitZListItemLinkClick,i),role:this.link?"link":"button",tabindex:"0"},this.text):e("span",{innerHTML:this.text}),e("slot",{key:"48bb5cc539f8eda84f21219103e17acd0d226c99"})))}static get style(){return":host li{all:unset;all:reset;width:100%;line-height:14px;list-style-type:none}:host li>span{display:flex;padding:calc(var(--space-unit) * 2) 0;color:var(--color-default-text);fill:var(--color-default-icon);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host(.small) li>span{padding:calc(var(--space-unit) * 1.5) 0;font-size:var(--font-size-2)}:host(.x-small) li>span{padding:var(--space-unit) 0;font-size:var(--font-size-2)}:host(.small) li>span>z-icon,:host(.x-small) li>span>z-icon{--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:calc(var(--space-unit) * 0.5);padding:0}:host li>span.border{border-bottom:2px solid var(--color-surface03)}:host li span:hover,a:hover{color:var(--color-primary01);fill:var(--color-primary01)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-repeat:no-repeat;background-size:contain;color:var(--color-primary01);fill:var(--color-primary01)}"}},[257,"z-myz-list-item",{text:[1],link:[1],linktarget:[1],icon:[1],listitemid:[1],action:[1],underlined:[4]}]);function c(){"undefined"!=typeof customElements&&["z-myz-list-item","z-icon"].forEach((i=>{switch(i){case"z-myz-list-item":customElements.get(a(i))||customElements.define(a(i),l);break;case"z-icon":customElements.get(a(i))||o()}}))}export{l as Z,c as d}

package/dist/components/index27.js

@@ -1,55 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { P as PopoverPosition } from './index2.js';
-import { d as defineCustomElement$1 } from './index24.js';
-
-const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-default-text);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base));--z-tooltip-padding:var(--space-unit)}z-popover{--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-padding:var(--z-tooltip-padding);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05);--z-popover-theme--text:var(--color-text-inverse)}";
-const ZTooltipStyle0 = stylesCss;
-
-const ZTooltip = /*@__PURE__*/ proxyCustomElement(class ZTooltip extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.openChange = createEvent(this, "openChange", 7);
-        this.position = PopoverPosition.AUTO;
-        this.dark = false;
-        this.open = false;
-        this.bindTo = undefined;
-        this.closable = true;
-    }
-    onPopoverOpenChange() {
-        this.open = this.popoverEl.open;
-    }
-    render() {
-        return (h("z-popover", { key: '8290e0b20bc315ce438e6407ff40c51d227f719d', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true, onOpenChange: (event) => this.openChange.emit(event.detail) }, h("slot", { key: 'e4f62754fc30723f63f99b79d53d72310f2cae91' })));
-    }
-    static get style() { return ZTooltipStyle0; }
-}, [1, "z-tooltip", {
-        "position": [513],
-        "dark": [516],
-        "open": [1540],
-        "bindTo": [1, "bind-to"],
-        "closable": [4]
-    }, [[0, "openChange", "onPopoverOpenChange"]]]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-tooltip", "z-popover"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-tooltip":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZTooltip);
-            }
-            break;
-        case "z-popover":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { ZTooltip as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index27.js.map
+import{proxyCustomElement as e,HTMLElement as o,createEvent as t,h as r,transformTag as s}from"@stencil/core/internal/client";import{P as p}from"./index2.js";import{d as i}from"./index17.js";const a=e(class extends o{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.openChange=t(this,"openChange",7),this.position=p.AUTO,this.dark=!1,this.open=!1,this.closable=!0}onPopoverOpenChange(){this.open=this.popoverEl.open}render(){return r("z-popover",{key:"b08b53e3dc8e8c44ec1354e1a19d071bdb5dd3cb",ref:e=>this.popoverEl=e,bindTo:this.bindTo,open:this.open,position:this.position,closable:this.closable,center:!0,showArrow:!0,onOpenChange:e=>this.openChange.emit(e.detail)},r("slot",{key:"45d59d5cf4dd196c2704511b9dcf0fa6c960dbb7"}))}static get style(){return":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-default-text);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base));--z-tooltip-padding:var(--space-unit)}z-popover{--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-padding:var(--z-tooltip-padding);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05);--z-popover-theme--text:var(--color-text-inverse)}"}},[257,"z-tooltip",{position:[513],dark:[516],open:[1540],bindTo:[1,"bind-to"],closable:[4]},[[0,"openChange","onPopoverOpenChange"]]]);function n(){"undefined"!=typeof customElements&&["z-tooltip","z-popover"].forEach((e=>{switch(e){case"z-tooltip":customElements.get(s(e))||customElements.define(s(e),a);break;case"z-popover":customElements.get(s(e))||i()}}))}export{a as Z,n as d}

package/dist/components/index3.js

@@ -1,36 +1 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-
-const stylesCss = ":host{display:block;box-sizing:border-box;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-rg);line-height:calc(var(--space-unit) * 2)}:host>div{padding:calc(var(--space-unit) * 2)}:host>.success{background:var(--color-inverse-success);fill:var(--color-default-success)}:host>.warning{background:var(--color-inverse-warning);fill:var(--color-default-warning)}:host>.error{background:var(--color-inverse-error);fill:var(--color-default-error)}";
-const ZAlertStyle0 = stylesCss;
-
-const ZAlert = /*@__PURE__*/ proxyCustomElement(class ZAlert extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.type = undefined;
-    }
-    render() {
-        return (h("div", { key: '9cdbd685674a5ee5f5d2dec9b9272402f76b9de8', class: this.type }, h("slot", { key: '36d8361bdc4a04c47695afe8e824f976ee8c47df' })));
-    }
-    static get style() { return ZAlertStyle0; }
-}, [1, "z-alert", {
-        "type": [1]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-alert"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-alert":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZAlert);
-            }
-            break;
-    } });
-}
-
-export { ZAlert as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index3.js.map
+import{proxyCustomElement as i,HTMLElement as t,h as e,Host as o,transformTag as n}from"@stencil/core/internal/client";import{I as s,C as r}from"./iconset.js";const h=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow()}selectPathOrPolygon(i){return(null==i?void 0:i.startsWith("M"))?e("path",{d:i}):e("polygon",{points:i})}renderBaseIcon(){return e("svg",{id:this.iconid||void 0,fill:this.fill?`var(--${this.fill})`:void 0,viewBox:"0 0 1000 1000",width:this.width,height:this.height},this.selectPathOrPolygon(s[this.name]))}render(){return e(o,{key:"65da13cefdf22f1935d9e1dbc171522955b24f1b","aria-hidden":"true"},r.includes(this.name)?e("div",{class:"icon-wrapper"},e("svg",{class:"color-indicator",fill:this.indicatorColor||"#FFFFFF00",viewBox:"0 0 1000 1000",width:this.width,height:this.height},this.selectPathOrPolygon(s["picker-color"])),this.renderBaseIcon()):this.renderBaseIcon())}static get style(){return":host{display:inline;margin-right:var(--z-icon-right-margin, 0);margin-left:var(--z-icon-left-margin, 0);line-height:0;vertical-align:middle}.icon-wrapper{position:relative;z-index:0;display:inline-block}svg:not([width]){width:var(--z-icon-width, 1.125rem)}svg:not([height]){height:var(--z-icon-height, 1.125rem)}.icon-wrapper svg.color-indicator{position:absolute;z-index:-1;bottom:0;left:0}"}},[1,"z-icon",{name:[1],height:[8],width:[8],iconid:[1],fill:[1],indicatorColor:[1,"indicator-color"]}]);function c(){"undefined"!=typeof customElements&&["z-icon"].forEach((i=>{"z-icon"===i&&(customElements.get(n(i))||customElements.define(n(i),h))}))}export{h as Z,c as d}