npm - @zanichelli/albe-web-components - Versions diffs - 5.6.2 → 6.0.0 - Mend

@zanichelli/albe-web-components 5.6.2 → 6.0.0

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 (874) hide show

package/dist/esm/z-myz-card-info.entry.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { P as PopoverPositions } from './index-8390ddaf.js';
-import { h as handleKeyboardSubmit } from './utils-2c5dfb88.js';
+import { r as registerInstance, c as createEvent, h } from './index-3517583d.js';
+import { P as PopoverPositions } from './index-9d028352.js';
+import { h as handleKeyboardSubmit } from './utils-39ca028c.js';
 import './breakpoints-c386984e.js';
-const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg);width:100%}:host>div{background:var(--color-surface01);width:calc(100% + calc(var(--space-unit) * 2));margin-left:calc(-1 * var(--space-unit));height:402px;border:var(--border-size-small) solid var(--color-primary01);box-shadow:0px 2px 4px 0px rgba(66, 69, 72, 0.35);border-radius:0px;box-sizing:border-box;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);position:relative}:host>div>z-icon{fill:var(--color-primary01);cursor:pointer;position:absolute;top:var(--space-unit);right:var(--space-unit)}:host>div{display:grid}:host>div>div.cta-wrapper{align-self:end;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between}:host>div>div.content-wrapper{overflow:hidden;position:relative;align-self:stretch}:host>div>div.content-wrapper>section{border-bottom:var(--border-size-small) solid var(--color-surface04);color:var(--color-surface05);padding:var(--space-unit) 0;font-size:14px;line-height:20px;box-sizing:border-box}:host>div>div.content-wrapper>section:last-child{border-bottom:none}:host>div>div.content-wrapper>section.info-wrapper{position:relative;overflow:hidden;box-sizing:border-box}:host>div>div.content-wrapper>section.info-wrapper.hidden:after{background:linear-gradient(\n    180deg,\n    rgba(255, 0, 0, 0),\n    rgba(255, 0, 0, 0) 60%,\n    white\n  );content:\"\";position:absolute;pointer-events:none;top:0;left:0;right:0;bottom:0}:host>div>div.content-wrapper>section>span.license-heading{display:flex;justify-content:space-between}:host>div>div.content-wrapper>section>span.license-heading>span.expired{color:var(--color-secondary02);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-warning01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0px;left:calc(var(--space-unit) * 4)}";
+const stylesCss = ":host{width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{position:relative;display:grid;width:calc(100% + calc(var(--space-unit) * 2));height:402px;box-sizing:border-box;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);border:var(--border-size-small) solid var(--color-primary01);margin-left:calc(-1 * var(--space-unit));background:var(--color-surface01);border-radius:0;box-shadow:0 2px 4px 0 rgb(66 69 72 / 35%)}:host>div>z-icon{position:absolute;top:var(--space-unit);right:var(--space-unit);cursor:pointer;fill:var(--color-primary01)}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-self:end;justify-content:space-between}:host>div>div.content-wrapper{position:relative;overflow:hidden;align-self:stretch}:host>div>div.content-wrapper>section{box-sizing:border-box;padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface04);color:var(--color-surface05);font-size:14px;line-height:20px}:host>div>div.content-wrapper>section:last-child{border-bottom:none}:host>div>div.content-wrapper>section.info-wrapper{position:relative;overflow:hidden;box-sizing:border-box}:host>div>div.content-wrapper>section.info-wrapper.hidden::after{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);content:\"\";pointer-events:none}:host>div>div.content-wrapper>section>span.license-heading{display:flex;justify-content:space-between}:host>div>div.content-wrapper>section>span.license-heading>span.expired{color:var(--color-secondary02);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-warning01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0;left:calc(var(--space-unit) * 4)}";
 const ZMyzCardInfo = class {
   constructor(hostRef) {
@@ -28,17 +28,20 @@ const ZMyzCardInfo = class {
     this.handleContentHeight();
   }
   handleContentHeight() {
-    if (!this.contentWrapper && !this.infoWrapper)
-      return (this.hiddenContent = false);
+    if (!this.contentWrapper && !this.infoWrapper) {
+      this.hiddenContent = false;
+      return;
+    }
     if (this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||
       this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight) {
       const height = this.contentWrapper.offsetHeight -
         this.onlineLicenseWrapper.offsetHeight -
         this.offlineLicenseWrapper.offsetHeight;
       this.infoWrapper.style.height = `${height}px`;
-      return (this.hiddenContent = true);
+      this.hiddenContent = true;
+      return;
     }
-    return (this.hiddenContent = false);
+    this.hiddenContent = false;
   }
   setStringOrArray() {
     if (typeof this.data === "string") {
@@ -58,31 +61,36 @@ const ZMyzCardInfo = class {
     const title = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.title;
     const description = (_b = this === null || this === void 0 ? void 0 : this.cardData) === null || _b === void 0 ? void 0 : _b.description;
     return (h("section", { class: `info-wrapper ${this.hiddenContent ? "hidden" : ""}`, onClick: () => {
-        if (this.hiddenContent)
+        if (this.hiddenContent) {
           this.tooltip = !this.tooltip;
+        }
       }, ref: (el) => (this.infoWrapper = el) }, this.renderAuthor(), this.renderYear(), title, h("br", null), description));
   }
   renderAuthor() {
     var _a;
     const author = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.author;
-    if (!author)
+    if (!author) {
       return null;
+    }
     return (h("span", null, "Autore: ", h("b", null, author), h("br", null)));
   }
   renderYear() {
     var _a;
     const year = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.year;
-    if (!year)
+    if (!year) {
       return null;
+    }
     return (h("span", null, "Anno: ", h("b", null, year), h("br", null)));
   }
   renderTooltip() {
-    if (!this.tooltip)
+    if (!this.tooltip) {
       return;
-    if (!this.cardData)
+    }
+    if (!this.cardData) {
       return;
+    }
     const { title, year, author, description } = this.cardData;
-    return (h("z-popover", { position: PopoverPositions.right, onClick: () => (this.tooltip = false) }, `${title} ${year} ${author} ${description}`));
+    return (h("z-popover", { position: PopoverPositions.RIGHT, onClick: () => (this.tooltip = false) }, `${title} ${year} ${author} ${description}`));
   }
   setExpirationLicenseMessage(type) {
     if ((type === "online" && this.cardData.onlineLicense.expired) ||
@@ -96,15 +104,17 @@ const ZMyzCardInfo = class {
   }
   renderOnlineLicenseSection() {
     var _a;
-    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.onlineLicense))
+    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.onlineLicense)) {
       return;
+    }
     return (h("section", { ref: (el) => (this.onlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza online"), this.setExpirationLicenseMessage("online")), "Scadenza il ", h("b", null, this.cardData.onlineLicense.expiration), h("br", null)));
   }
   renderOfflineLicenseSection() {
     var _a;
-    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.offlineLicense))
+    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.offlineLicense)) {
       return;
-    return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", h("b", null, this.cardData.offlineLicense.expiration), h("br", null), "Installazioni disponibili:", " ", h("b", null, this.cardData.offlineLicense.installations)));
+    }
+    return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", h("b", null, this.cardData.offlineLicense.expiration), h("br", null), "Installazioni disponibili: ", h("b", null, this.cardData.offlineLicense.installations)));
   }
   render() {
     return (h("div", null, this.renderCloseIcon(), h("div", { class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { class: "cta-wrapper" }, h("slot", null))));

package/dist/esm/z-myz-card-list.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-a2ca4b97.js';
+import { r as registerInstance, h } from './index-3517583d.js';
-const stylesCss = "ul{font-family:var(--font-family-sans);color:var(--color-primary02);margin:0 calc(var(--space-unit) * 2);padding:0px;overflow:hidden;list-style:none;width:auto;height:auto}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;font-size:14px;font-weight:var(--font-sb);text-decoration:none;color:var(--color-primary01);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);padding-top:calc(var(--space-unit) * .5)}ul>li>a:before{content:\"•\";padding-right:5px}ul>li>span{font-size:14px;font-weight:var(--font-rg);text-decoration:none;color:var(--color-surface04);padding:0 calc(var(--space-unit) * 2);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5)}";
+const stylesCss = "ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary02);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:\"•\"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}";
 const ZMyzCardList = class {
   constructor(hostRef) {
@@ -15,8 +15,9 @@ const ZMyzCardList = class {
   }
   formatListContent(data) {
     const { value, isLink, url } = data;
-    if (!isLink)
+    if (!isLink) {
       return h("span", null, value);
+    }
     return (h("a", { role: "button", onKeyPress: (e) => this.handleSpaceKeyPress(e, url), href: url, target: "_blank" }, value));
   }
   renderList(dataArray) {

package/dist/esm/z-myz-card_4.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { r as registerInstance, h } from './index-a2ca4b97.js';
-import { L as LicenseTypeEnum } from './index-8390ddaf.js';
+import { r as registerInstance, h } from './index-3517583d.js';
+import { L as LicenseType } from './index-9d028352.js';
-const stylesCss$3 = ":host{--card-overflow:hidden}div{background-color:var(--color-surface01);display:flex;flex-direction:column;width:auto;box-sizing:border-box;width:256px;height:522px;border:var(--border-size-medium) solid var(--color-surface03);border-radius:var(--border-radius);overflow:var(--card-overflow)}div.real,div.trial,div.temp{border-color:var(--accent)}div.faded{border:var(--border-size-medium) solid var(--color-surface02)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";
+const stylesCss$3 = ":host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--accent)}div.faded{border:var(--border-size-medium) solid var(--color-surface02)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";
 const ZMyzCardComponent = class {
   constructor(hostRef) {
@@ -13,12 +13,15 @@ const ZMyzCardComponent = class {
   }
   retrieveClass() {
     let elemClasses = "";
-    if (this.cardtype === LicenseTypeEnum.real)
+    if (this.cardtype === LicenseType.REAL) {
       elemClasses += "real";
-    else if (this.cardtype === LicenseTypeEnum.trial)
+    }
+    else if (this.cardtype === LicenseType.TRIAL) {
       elemClasses += "trial";
-    else if (this.cardtype === LicenseTypeEnum.temp)
+    }
+    else if (this.cardtype === LicenseType.TEMP) {
       elemClasses += "temp";
+    }
     if (this.faded) {
       elemClasses += " faded";
     }
@@ -36,7 +39,7 @@ const ZMyzCardComponent = class {
 };
 ZMyzCardComponent.style = stylesCss$3;
-const stylesCss$2 = ":host{height:340px;width:auto}:host>div{height:340px;width:auto;display:flex;align-items:center;justify-content:center;position:relative}";
+const stylesCss$2 = ":host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}";
 const ZMyzCardBody = class {
   constructor(hostRef) {
@@ -48,7 +51,7 @@ const ZMyzCardBody = class {
 };
 ZMyzCardBody.style = stylesCss$2;
-const stylesCss$1 = "img{display:block;margin:auto auto;height:340px;max-width:100%;object-fit:cover}img.faded{opacity:0.3}";
+const stylesCss$1 = "img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}";
 const ZMyzCardCover = class {
   constructor(hostRef) {
@@ -63,7 +66,7 @@ const ZMyzCardCover = class {
 };
 ZMyzCardCover.style = stylesCss$1;
-const stylesCss = "header{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;width:auto;height:calc(var(--space-unit) * 6);position:relative;border-bottom:var(--border-size-medium) solid var(--color-surface03);border-radius:var(--border-radius) var(--border-radius)\n    var(--border-no-radius) var(--border-no-radius);background-color:var(--color-surface01)}header.real,header.trial,header.temp{background-color:var(--accent-lighter);border-bottom:var(--border-size-medium) solid var(--accent)}h2{font-family:var(--font-family-sans);font-weight:var(--font-sb);color:var(--color-surface05);height:calc(var(--space-unit) * 2);font-size:12px;text-transform:uppercase;letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);margin:0px;padding:calc(var(--space-unit) * 2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.faded{border-bottom:var(--border-size-medium) solid var(--color-surface02)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--accent);border-right:var(--border-size-medium) solid var(--accent);border-left:var(--border-size-medium) solid var(--accent)}";
+const stylesCss = "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)}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--accent);background-color:var(--accent-lighter)}h2{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-surface02)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--accent);border-right:var(--border-size-medium) solid var(--accent);border-left:var(--border-size-medium) solid var(--accent)}";
 const ZMyzCardHeader = class {
   constructor(hostRef) {
@@ -74,17 +77,18 @@ const ZMyzCardHeader = class {
     return this.allowTooltip ? this.titolo : "";
   }
   componentDidLoad() {
-    if (this.elementHasEllipsis())
+    if (this.elementHasEllipsis()) {
       this.allowTooltip = true;
+    }
   }
   elementHasEllipsis() {
     return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
   }
   retrieveClass() {
     return {
-      real: this.cardtype === LicenseTypeEnum.real,
-      trial: this.cardtype === LicenseTypeEnum.trial,
-      temp: this.cardtype === LicenseTypeEnum.temp,
+      real: this.cardtype === LicenseType.REAL,
+      trial: this.cardtype === LicenseType.TRIAL,
+      temp: this.cardtype === LicenseType.TEMP,
       faded: this.faded,
     };
   }

package/dist/esm/z-myz-list-item.entry.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { h as handleKeyboardSubmit } from './utils-2c5dfb88.js';
-import './index-8390ddaf.js';
+import { r as registerInstance, c as createEvent, h } from './index-3517583d.js';
+import { h as handleKeyboardSubmit } from './utils-39ca028c.js';
+import './index-9d028352.js';
 import './breakpoints-c386984e.js';
-const stylesCss = ":host li{all:unset;all:reset;width:100%}:host li{list-style-type:none;line-height:14px}:host li>span{line-height:14px;padding:calc(var(--space-unit) * 2) 0;display:flex;font-family:var(--dashboard-font);font-weight:var(--font-rg);font-size:16px;letter-spacing:0.23px;color:var(--text-grey-800);fill:var(--text-grey-800)}:host li>span.border{border-bottom:2px solid var(--bg-grey-200)}:host li span:hover,a:hover{color:var(--myz-blue);fill:var(--myz-blue)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{color:var(--myz-blue);fill:var(--myz-blue);height:calc(var(--space-unit) * 2);width:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-size:contain;background-repeat:no-repeat}";
+const stylesCss = ":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(--text-grey-800);fill:var(--text-grey-800);font-family:var(--dashboard-font);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host li>span.border{border-bottom:2px solid var(--bg-grey-200)}:host li span:hover,a:hover{color:var(--myz-blue);fill:var(--myz-blue)}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(--myz-blue);fill:var(--myz-blue)}";
 const ZMyzListItem = class {
   constructor(hostRef) {

package/dist/esm/z-myz-topbar.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import { r as registerInstance, h, g as getElement } from './index-a2ca4b97.js';
-import { B as ButtonVariantEnum, c as ButtonSizeEnum } from './index-8390ddaf.js';
+import { r as registerInstance, h, g as getElement } from './index-3517583d.js';
+import { B as ButtonVariant, c as ButtonSize } from './index-9d028352.js';
 import { m as mobileBreakpoint, t as tabletBreakpoint } from './breakpoints-c386984e.js';
-const stylesCss = ":host a{cursor:pointer}header{position:sticky;top:0;z-index:99;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"main-header\";margin-bottom:calc(var(--space-unit) * 6.5);font-family:var(--dashboard-font);font-weight:var(--font-rg)}.main-header{display:grid;grid-template-columns:2fr 2fr 4fr 100px;grid-template-rows:1fr;grid-template-areas:\"logo link-int link-ext login\";grid-area:main-header;grid-column-gap:calc(var(--space-unit) * 0.5);align-items:center;background-color:var(--bg-grey-900);height:auto;align-items:center;z-index:10}.main-header.myz-out{background-color:var(--bg-white)}.logo{grid-area:logo;padding:6px}z-logo{transform:scale(0.9)}.dropdown-menu{display:none}.dropdown-menu.hidden{visibility:hidden}.dropdown-links{grid-area:dropdown-links;list-style:none;display:block;max-height:32px;margin:0;padding:0}.arrow{fill:var(--text-grey-200)}.dropdown-links>li{list-style:none;display:inline-block;margin:0;padding:0}.dropdown-links>li>a{width:auto;height:auto;color:var(--myz-blue);font-size:14px;letter-spacing:0.18px;line-height:32px;text-decoration:none;margin:var(--space-unit);padding-bottom:calc(var(--space-unit) * 0.5)}.dropdown-links>li>a:hover,.dropdown-links>li>a.active{color:var(--text-grey-800);border-bottom:2px solid var(--myz-blue)}.mobile-header{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:center;align-items:center;width:100%;background-color:var(--bg-grey-900);z-index:inherit;height:52px;position:fixed;top:0px;left:0;z-index:999}.mobile-header.myz-out{background-color:var(--bg-white)}.mobile-header>z-button{margin:0 calc(var(--space-unit) * 2)}.mobile-content{display:flex;flex-direction:column;flex-wrap:nowrap;align-content:center;justify-content:center;align-items:center;width:100%;background-color:var(--bg-grey-900);position:fixed;top:52px;left:0;z-index:999;max-height:0px;overflow:hidden;transition:max-height 1s cubic-bezier(0.46, 0, 1, 0.79)}.mobile-content.open{max-height:100vh;transition:max-height 2s cubic-bezier(0, 0.79, 0.46, 1)}.mobile-content.myz-out{background-color:var(--bg-white)}hr{display:block;position:relative;padding:0;margin:0px calc(var(--space-unit) * 4);height:0;width:calc(100% - 64px);max-height:0;font-size:1px;line-height:0;clear:both;border:none;border-top:1px solid var(--text-grey-700)}.menu-mobile{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;align-content:center;color:var(--bg-white);padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);cursor:pointer}.myz-out .menu-mobile{color:var(--text-grey-800)}.menu-toggle{grid-area:menu-toggle;display:flex;flex-direction:column;margin:0 var(--space-unit)}.menu-toggle .bar{width:20px;height:2px;background-color:var(--bg-white);margin:2px auto;transition:all 0.3s ease-in-out}.myz-out .menu-toggle .bar{background-color:var(--text-grey-800)}.menu-toggle:hover{cursor:pointer}#mobile-menu.is-active .bar:nth-child(2){opacity:0}#mobile-menu.is-active .bar:nth-child(1){transform:translateY(6px) rotate(45deg)}#mobile-menu.is-active .bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.booktab-button,.mobile-login{overflow:hidden;height:0%;max-height:100%;width:100%;height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:stretch;padding:0}.hidden{visibility:hidden}.login{grid-area:login;display:flex;justify-content:flex-end;padding:0 calc(var(--space-unit) * 2)}.login>z-button{color:var(--bg-white);fill:var(--bg-white)}.booktab-button>z-button{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center;align-items:center;align-content:center;padding:calc(var(--space-unit) * 2) 0px calc(var(--space-unit) * 4) 0px}.link-ext{grid-area:link-ext;overflow:hidden;height:0%;max-height:100%;width:100%;height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:stretch;padding:0}.link-ext-span{display:inline-block;width:100%;margin:calc(var(--space-unit) * 0.5) auto;box-sizing:border-box;margin:0px auto 0px auto;padding:0px calc(var(--space-unit) * 4) 0px calc(var(--space-unit) * 4);line-height:44px}.link-ext-span.myz:hover,.link-ext-span.myz:focus{background:var(--text-grey-800);border-radius:var(--border-radius);cursor:pointer}.link-ext z-link{font-size:12px;font-weight:var(--font-sb)}.link-int{overflow:hidden;max-height:100%;width:100%;height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:stretch;padding:0}.link-int>span{width:100%;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;align-content:flex-start}.link-int>span>.menu-item{height:auto;color:var(--bg-white);letter-spacing:0.2px;font-weight:var(--font-sb);font-size:16px;text-decoration:none;outline:none;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:stretch;width:100%;box-sizing:border-box;margin:0px auto 0px auto;padding:0px calc(var(--space-unit) * 4) 0px calc(var(--space-unit) * 4);line-height:44px}.link-int>span>.menu-item:hover,.link-int>span>.menu-item:focus{border-radius:0px}.link-int>span>.menu-item>span{white-space:nowrap}.link-int>span>.menu-item>i{padding-top:calc(var(--space-unit) * 2);height:28px;width:24px;text-align:right}.link-int>span:first-child>.menu-item{margin-top:0}.link-int>span>svg{display:none}.link-int>.mobile-dropdown{padding:0 48px}.mobile-login>span{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;align-content:flex-start;fill:white}.mobile-login>span:focus,.mobile-login>span:hover{background:var(--text-grey-800)}.myz-out .mobile-login>span:focus,.myz-out .mobile-login>span:hover{background:none}.mobile-login>span>.menu-item{height:auto;color:var(--bg-white);letter-spacing:0.2px;font-weight:var(--font-sb);font-size:16px;text-decoration:none;outline:none;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;align-content:stretch;width:100%;box-sizing:border-box;margin:0px auto 0px auto;padding:0px calc(var(--space-unit) * 4) 0px calc(var(--space-unit) * 4);line-height:44px}.myz-out .mobile-login>span>.menu-item{color:var(--text-grey-800)}.mobile-login>span>.menu-item>i{padding-top:calc(var(--space-unit) * 2);height:28px;width:24px;text-align:right}.mobile-login>span>.menu-item>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-login>span>.menu-item>span>z-icon{padding-right:var(--space-unit);fill:var(--bg-white)}.menu-item>i::before{border-style:solid;border-width:0.12em 0.12em 0 0;content:\" \";display:inline-block;height:0.45em;left:0.16em;position:relative;top:-0.12em;transform:rotate(135deg) scale(1.2);vertical-align:top;width:0.45em;margin-top:2px;margin-left:2px;margin-right:6px;transition:all 0.5s ease}.menu-item.isopen>i::before{top:0.24em;transform:rotate(-45deg) scale(1.2);transition:all 0.5s ease}.mobile-dropdown{background:white;display:block;overflow:hidden;width:100%;box-sizing:border-box;margin:0px auto 0px auto;padding:0px calc(var(--space-unit) * 4) 0px calc(var(--space-unit) * 4);line-height:44px;max-height:0px;transition:max-height 0.3s ease}.mobile-dropdown.visible{max-height:100vh;transition:max-height 0.5s ease}@media only screen and (min-width: 768px){header{grid-template-columns:1fr 0.8fr 1.5fr 1.1fr 0.7fr;grid-template-rows:0.2fr auto;grid-template-areas:\"main-header main-header main-header main-header main-header\" \"dropdown-menu dropdown-menu dropdown-menu dropdown-menu dropdown-menu\";margin-bottom:0}header.myz-out{top:0px;grid-template-rows:1fr}.main-header{display:grid;grid-template-columns:170px auto auto 120px;grid-template-rows:1fr;grid-template-areas:\"logo link-int link-ext login\";grid-area:main-header}.dropdown-menu{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:\"dropdown-links\";grid-area:dropdown-menu;grid-column-gap:var(--space-unit);background:var(--bg-grey-200);height:32px;visibility:visible;z-index:9;padding-left:160px}.booktab-button,.mobile-header,.mobile-login,.mobile-dropdown,.menu-mobile{display:none}.link-int{grid-area:link-int;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;align-content:center;max-height:46px;margin-top:calc(var(--space-unit) * 0.5)}.link-int>span{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:center;align-content:center;width:auto}.link-int>span>.menu-item{width:auto;height:auto;color:var(--bg-white);letter-spacing:0.2px;line-height:14px;font-weight:var(--font-sb);text-decoration:none;outline:none;padding:calc(var(--space-unit) * 1.5)}.link-int>span>svg{display:block}.menu-item>i{display:none}.link-int>span>.menu-item:focus,.link-int>span>.menu-item:hover{background:var(--text-grey-800);border-radius:var(--border-radius);cursor:pointer}.link-int>span>.menu-item::-moz-focus-inner{border:0}.link-int>span>.menu-item:focus+svg{visibility:visible}.link-ext{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;max-height:46px}.link-ext-span{width:auto;line-height:14px;margin:var(--space-unit);padding:calc(var(--space-unit) * 0.5) var(--space-unit)}}@media only screen and (min-width: 1152px){.main-header{grid-template-columns:170px auto auto 180px}}";
+const stylesCss = ":host a{cursor:pointer}header{position:sticky;z-index:99;top:0;display:grid;margin-bottom:calc(var(--space-unit) * 6.5);font-family:var(--dashboard-font);font-weight:var(--font-rg);grid-template:1fr / 1fr;grid-template-areas:\"main-header\"}.main-header{z-index:10;display:grid;height:auto;align-items:center;background-color:var(--bg-grey-900);grid-area:main-header;grid-column-gap:calc(var(--space-unit) * 0.5);grid-template:1fr / 2fr 2fr 4fr 100px;grid-template-areas:\"logo link-int link-ext login\"}.main-header.myz-out{background-color:var(--bg-white)}.logo{padding:6px;grid-area:logo}z-logo{transform:scale(0.9)}.dropdown-menu{display:none}.dropdown-menu.hidden{visibility:hidden}.dropdown-links{display:block;max-height:32px;padding:0;margin:0;grid-area:dropdown-links;list-style:none}.arrow{fill:var(--text-grey-200)}.dropdown-links>li{display:inline-block;padding:0;margin:0;list-style:none}.dropdown-links>li>a{width:auto;height:auto;padding-bottom:calc(var(--space-unit) * 0.5);margin:var(--space-unit);color:var(--myz-blue);font-size:14px;letter-spacing:0.18px;line-height:32px;text-decoration:none}.dropdown-links>li>a:hover,.dropdown-links>li>a.active{border-bottom:2px solid var(--myz-blue);color:var(--text-grey-800)}.mobile-header{position:fixed;z-index:inherit;z-index:999;top:0;left:0;display:flex;width:100%;height:52px;flex-flow:row nowrap;align-content:center;align-items:stretch;align-items:center;justify-content:space-between;background-color:var(--bg-grey-900)}.mobile-header.myz-out{background-color:var(--bg-white)}.mobile-header>z-button{margin:0 calc(var(--space-unit) * 2)}.mobile-content{position:fixed;z-index:999;top:52px;left:0;display:flex;overflow:hidden;width:100%;max-height:0;flex-flow:column nowrap;align-content:center;align-items:center;justify-content:center;background-color:var(--bg-grey-900);transition:max-height 1s cubic-bezier(0.46, 0, 1, 0.79)}.mobile-content.open{max-height:100vh;transition:max-height 2s cubic-bezier(0, 0.79, 0.46, 1)}.mobile-content.myz-out{background-color:var(--bg-white)}hr{position:relative;display:block;width:calc(100% - 64px);height:0;max-height:0;padding:0;border:none;border-top:1px solid var(--text-grey-700);margin:0 calc(var(--space-unit) * 4);clear:both;font-size:1px;line-height:0}.menu-mobile{display:flex;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:flex-start;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);color:var(--bg-white);cursor:pointer}.myz-out .menu-mobile{color:var(--text-grey-800)}.menu-toggle{display:flex;flex-direction:column;margin:0 var(--space-unit);grid-area:menu-toggle}.menu-toggle .bar{width:20px;height:2px;margin:2px auto;background-color:var(--bg-white);transition:all 0.3s ease-in-out}.myz-out .menu-toggle .bar{background-color:var(--text-grey-800)}.menu-toggle:hover{cursor:pointer}#mobile-menu.is-active .bar:nth-child(2){opacity:0}#mobile-menu.is-active .bar:nth-child(1){transform:translateY(6px) rotate(45deg)}#mobile-menu.is-active .bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.booktab-button,.mobile-login{display:flex;overflow:hidden;width:100%;height:0%;height:100%;max-height:100%;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:0}.hidden{visibility:hidden}.login{display:flex;justify-content:flex-end;padding:0 calc(var(--space-unit) * 2);grid-area:login}.login>z-button{color:var(--bg-white);fill:var(--bg-white)}.booktab-button>z-button{display:flex;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) 0 calc(var(--space-unit) * 4) 0}.link-ext{display:flex;overflow:hidden;width:100%;height:0%;height:100%;max-height:100%;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:0;grid-area:link-ext}.link-ext-span{display:inline-block;width:100%;box-sizing:border-box;padding:0 calc(var(--space-unit) * 4) 0 calc(var(--space-unit) * 4);margin:calc(var(--space-unit) * 0.5) auto;margin:0 auto;line-height:44px}.link-ext-span.myz:hover,.link-ext-span.myz:focus{background:var(--text-grey-800);border-radius:var(--border-radius);cursor:pointer}.link-ext z-link{font-size:12px;font-weight:var(--font-sb)}.link-int{display:flex;overflow:hidden;width:100%;height:100%;max-height:100%;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:0}.link-int>span{display:flex;width:100%;flex-flow:column nowrap;align-content:flex-start;align-items:stretch;justify-content:flex-start}.link-int>span>.menu-item{display:flex;width:100%;height:auto;box-sizing:border-box;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:0 calc(var(--space-unit) * 4) 0 calc(var(--space-unit) * 4);margin:0 auto;color:var(--bg-white);font-size:16px;font-weight:var(--font-sb);letter-spacing:0.2px;line-height:44px;outline:none;text-decoration:none}.link-int>span>.menu-item:hover,.link-int>span>.menu-item:focus{border-radius:0}.link-int>span>.menu-item>span{white-space:nowrap}.link-int>span>.menu-item>i{width:24px;height:28px;padding-top:calc(var(--space-unit) * 2);text-align:right}.link-int>span:first-child>.menu-item{margin-top:0}.link-int>span>svg{display:none}.link-int>.mobile-dropdown{padding:0 48px}.mobile-login>span{display:flex;flex-flow:column nowrap;align-content:flex-start;align-items:stretch;justify-content:flex-start;fill:white}.mobile-login>span:focus,.mobile-login>span:hover{background:var(--text-grey-800)}.myz-out .mobile-login>span:focus,.myz-out .mobile-login>span:hover{background:none}.mobile-login>span>.menu-item{display:flex;width:100%;height:auto;box-sizing:border-box;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:0 calc(var(--space-unit) * 4) 0 calc(var(--space-unit) * 4);margin:0 auto;color:var(--bg-white);font-size:16px;font-weight:var(--font-sb);letter-spacing:0.2px;line-height:44px;outline:none;text-decoration:none}.myz-out .mobile-login>span>.menu-item{color:var(--text-grey-800)}.mobile-login>span>.menu-item>i{width:24px;height:28px;padding-top:calc(var(--space-unit) * 2);text-align:right}.mobile-login>span>.menu-item>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mobile-login>span>.menu-item>span>z-icon{padding-right:var(--space-unit);fill:var(--bg-white)}.menu-item>i::before{position:relative;top:-0.12em;left:0.16em;display:inline-block;width:0.45em;height:0.45em;border-width:0.12em 0.12em 0 0;border-style:solid;margin-top:2px;margin-right:6px;margin-left:2px;content:\" \";transform:rotate(135deg) scale(1.2);transition:all 0.5s ease;vertical-align:top}.menu-item.isopen>i::before{top:0.24em;transform:rotate(-45deg) scale(1.2);transition:all 0.5s ease}.mobile-dropdown{display:block;overflow:hidden;width:100%;max-height:0;box-sizing:border-box;padding:0 calc(var(--space-unit) * 4) 0 calc(var(--space-unit) * 4);margin:0 auto;background:white;line-height:44px;transition:max-height 0.3s ease}.mobile-dropdown.visible{max-height:100vh;transition:max-height 0.5s ease}@media only screen and (min-width: 768px){header{margin-bottom:0;grid-template:0.2fr auto / 1fr 0.8fr 1.5fr 1.1fr 0.7fr;grid-template-areas:\"main-header main-header main-header main-header main-header\" \"dropdown-menu dropdown-menu dropdown-menu dropdown-menu dropdown-menu\"}header.myz-out{top:0;grid-template-rows:1fr}.main-header{display:grid;grid-area:main-header;grid-template:1fr / 170px auto auto 120px;grid-template-areas:\"logo link-int link-ext login\"}.dropdown-menu{z-index:9;display:grid;height:32px;padding-left:160px;background:var(--bg-grey-200);grid-area:dropdown-menu;grid-column-gap:var(--space-unit);grid-template:1fr / 1fr;grid-template-areas:\"dropdown-links\";visibility:visible}.booktab-button,.mobile-header,.mobile-login,.mobile-dropdown,.menu-mobile{display:none}.link-int{display:flex;max-height:46px;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:flex-start;margin-top:calc(var(--space-unit) * 0.5);grid-area:link-int}.link-int>span{display:flex;width:auto;flex-flow:column nowrap;align-content:center;align-items:center;justify-content:flex-start}.link-int>span>.menu-item{width:auto;height:auto;padding:calc(var(--space-unit) * 1.5);color:var(--bg-white);font-weight:var(--font-sb);letter-spacing:0.2px;line-height:14px;outline:none;text-decoration:none}.link-int>span>svg{display:block}.menu-item>i{display:none}.link-int>span>.menu-item:focus,.link-int>span>.menu-item:hover{background:var(--text-grey-800);border-radius:var(--border-radius);cursor:pointer}.link-int>span>.menu-item::-moz-focus-inner{border:0}.link-int>span>.menu-item:focus+svg{visibility:visible}.link-ext{display:flex;max-height:46px;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:flex-end}.link-ext-span{width:auto;padding:calc(var(--space-unit) * 0.5) var(--space-unit);margin:var(--space-unit);line-height:14px}}@media only screen and (min-width: 1152px){.main-header{grid-template-columns:170px auto auto 180px}}";
 const ZMyzTopbar = class {
   constructor(hostRef) {
@@ -27,23 +27,14 @@ const ZMyzTopbar = class {
   }
   componentWillLoad() {
     if (this.intlinkdata) {
-      this.intMenuData =
-        typeof this.intlinkdata === "string"
-          ? JSON.parse(this.intlinkdata)
-          : this.intlinkdata;
+      this.intMenuData = typeof this.intlinkdata === "string" ? JSON.parse(this.intlinkdata) : this.intlinkdata;
     }
     this.activeMenuItem = this.currentMenuItem = this.intMenuData.find((item) => item.id === this.activeintlinkid);
     if (this.extlinkdata) {
-      this.extMenuData =
-        typeof this.extlinkdata === "string"
-          ? JSON.parse(this.extlinkdata)
-          : this.extlinkdata;
+      this.extMenuData = typeof this.extlinkdata === "string" ? JSON.parse(this.extlinkdata) : this.extlinkdata;
     }
     if (this.userdata) {
-      this.userData =
-        typeof this.userdata === "string"
-          ? JSON.parse(this.userdata)
-          : this.userdata;
+      this.userData = typeof this.userdata === "string" ? JSON.parse(this.userdata) : this.userdata;
       this.isLogged = this.userData.islogged;
     }
     this.handleResize();
@@ -52,8 +43,9 @@ const ZMyzTopbar = class {
     return (h("div", { class: "logo" }, h("z-logo", { link: this.logolink ? this.logolink : null, "target-blank": true, width: 144, height: 36, "image-alt": this.imagealt })));
   }
   renderIntMenu(menuItems) {
-    if (!this.isLogged || !this.ismyz)
+    if (!this.isLogged || !this.ismyz) {
       return;
+    }
     return (h("div", { id: "link-int", class: "link-int" }, menuItems.map((item) => this.renderIntMenuItem(item))));
   }
   renderIntMenuItem(menuItem) {
@@ -61,8 +53,9 @@ const ZMyzTopbar = class {
     return (h("span", null, h("a", { href: link ? link : null, id: id, class: "menu-item", onClick: () => {
         this.activeMenuItem = this.currentMenuItem = menuItem;
         this.activeintlinkid = menuItem.id;
-        if (menuItem.subMenu)
+        if (menuItem.subMenu) {
           this.handleToggleMobileMenuItem(menuItem.id);
+        }
       }, onMouseEnter: () => {
         this.activeMenuItem = menuItem;
       }, onMouseLeave: () => {
@@ -75,18 +68,16 @@ const ZMyzTopbar = class {
     return this.intMenuData.indexOf(item) + 1;
   }
   handleToggleMobileMenuItem(elementId) {
-    if (!this.isMobile)
+    if (!this.isMobile) {
       return;
-    this.element.shadowRoot
-      .querySelector(`#${elementId}`)
-      .classList.toggle("isopen");
-    this.element.shadowRoot
-      .querySelector("#mobile-dropdown-" + elementId)
-      .classList.toggle("visible");
+    }
+    this.element.shadowRoot.querySelector(`#${elementId}`).classList.toggle("isopen");
+    this.element.shadowRoot.querySelector("#mobile-dropdown-" + elementId).classList.toggle("visible");
   }
   renderMenuItemsData(menuItem) {
-    if (!menuItem.subMenu)
+    if (!menuItem.subMenu) {
       return null;
+    }
     const listItems = menuItem.subMenu.map((item) => {
       return {
         id: item.id,
@@ -101,21 +92,25 @@ const ZMyzTopbar = class {
     return (h("span", { class: "mobile-dropdown", id: id ? `mobile-dropdown-${id}` : "" }, h("z-myz-list", { list: menuItems })));
   }
   renderSubMenu(menuItem) {
-    if (!this.ismyz || !this.isLogged)
+    if (!this.ismyz || !this.isLogged) {
       return;
-    if (!menuItem || !menuItem["subMenu"]) {
-      return h("div", { id: "dropdown-menu", class: `dropdown-menu hidden` });
+    }
+    if (!menuItem || !menuItem.subMenu) {
+      return (h("div", { id: "dropdown-menu", class: `dropdown-menu hidden` }));
     }
     return (h("div", { id: "dropdown-menu", class: `dropdown-menu` }, h("ul", { class: "dropdown-links" }, menuItem.subMenu.map((item) => (h("li", null, h("a", { id: item.id, class: item.id === this.activesublinkid ? "active" : "", href: item.link ? item.link : null, role: item.link ? "link" : "button", tabindex: this.getIntMenuItemTabindex(menuItem) }, item.label)))))));
   }
   renderExtLinksIcons(icon) {
     const width = window.innerWidth > 0 ? window.innerWidth : screen.width;
     const hideIcons = width > mobileBreakpoint && width < tabletBreakpoint;
-    return !hideIcons && { icon };
+    if (!hideIcons) {
+      return { icon };
+    }
   }
   renderExtMenu(menuItems) {
-    if (!this.isLogged)
+    if (!this.isLogged) {
       return h("div", null);
+    }
     return (h("div", { id: "link-ext", class: "link-ext" }, menuItems.map((menuItem) => {
       const { id, label, link, icon } = menuItem;
       return (h("span", { class: `link-ext-span${this.ismyz ? " myz" : ""}` }, h("z-link", Object.assign({ id: id, htmlid: id, href: link, iswhite: !!this.ismyz, target: "_blank", htmltabindex: 10 }, this.renderExtLinksIcons(icon)), label)));
@@ -128,14 +123,15 @@ const ZMyzTopbar = class {
     if (this.hideloginbutton) {
       return;
     }
-    return (h("z-button", { htmlid: "login-button", variant: this.ismyz ? ButtonVariantEnum.secondary : ButtonVariantEnum.tertiary, icon: "login", size: ButtonSizeEnum.small }, "entra"));
+    return (h("z-button", { htmlid: "login-button", variant: this.ismyz ? ButtonVariant.SECONDARY : ButtonVariant.TERTIARY, icon: "login", size: ButtonSize.SMALL }, "entra"));
   }
   renderMobileLoginDiv(userData) {
     return (h("div", { id: "mobile-login", class: "mobile-login" }, h("span", null, h("a", { class: "menu-item", id: "user-data", onClick: () => this.handleToggleMobileMenuItem("user-data"), role: "button" }, h("span", null, h("z-icon", { name: "user-avatar", height: 16, width: 16 }), userData.name), h("i", null)), this.renderUserData(userData))));
   }
   renderUserData(userData) {
-    if (this.isMobile && !userData)
+    if (this.isMobile && !userData) {
       return null;
+    }
     const listItems = userData.userlinks.map((item) => {
       return {
         text: item.label,
@@ -162,23 +158,23 @@ const ZMyzTopbar = class {
     return (h("div", { id: "mobile-header", class: `mobile-header${this.ismyz ? "" : " myz-out"}` }, this.renderLogoDiv(), this.renderMobileMenuToggle()));
   }
   renderMobileMenuToggle() {
-    if (!this.isLogged)
+    if (!this.isLogged) {
       return this.renderLoginButton();
+    }
     return (h("div", { class: "menu-mobile", id: "mobile-menu-wrapper", onClick: () => (this.isMenuMobileOpen = !this.isMenuMobileOpen) }, h("div", { class: `menu-toggle${this.isMenuMobileOpen ? " is-active" : ""}`, id: "mobile-menu" }, h("span", { class: "bar" }), h("span", { class: "bar" }), h("span", { class: "bar" })), h("span", null, "Menu")));
   }
   renderMobileMenuContent() {
-    if (!this.isLogged)
-      return null;
+    if (!this.isLogged) {
+      return;
+    }
     return (h("div", { id: "mobile-content", class: {
         "mobile-content": true,
-        open: this.isMenuMobileOpen,
+        "open": this.isMenuMobileOpen,
         "myz-out": !this.ismyz,
       } }, this.renderMobileLoginDiv(this.userData), this.ismyz && h("hr", null), this.renderIntMenu(this.intMenuData), h("hr", null), this.renderExtMenu(this.extMenuData)));
   }
   render() {
-    return this.isMobile
-      ? this.renderMobileHeader()
-      : this.renderDesktopHeader();
+    return this.isMobile ? this.renderMobileHeader() : this.renderDesktopHeader();
   }
   get element() { return getElement(this); }
   static get watchers() { return {

package/dist/esm/z-navigation-tab-link.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { N as NavigationTabsOrientations, a as NavigationTabsSizes } from './index-8390ddaf.js';
-import { i as icons } from './icons-92a7dcde.js';
+import { r as registerInstance, c as createEvent, h } from './index-3517583d.js';
+import { N as NavigationTabsOrientation, a as NavigationTabsSize } from './index-9d028352.js';
+import { I as ICONS } from './icons-56ca282c.js';
-const navigationTabCss = "z-navigation-tab>button,z-navigation-tab-link>a{position:relative;z-index:0;display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);background-color:unset;text-align:center;font-size:inherit;font-family:var(--font-family-sans);line-height:inherit;letter-spacing:inherit;white-space:nowrap;color:var(--color-primary01);fill:currentColor;border:none;border-radius:var(--border-no-radius);outline:none;cursor:pointer}z-navigation-tab-link>a{text-decoration:none}z-navigation-tab *,z-navigation-tab-link *,z-navigation-tab *::before,z-navigation-tab *::after,z-navigation-tab-link *::before,z-navigation-tab-link *::after{box-sizing:border-box}z-navigation-tab>*:focus:focus-visible,z-navigation-tab-link>*:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary)}z-navigation-tab:not([disabled]):hover>*,z-navigation-tab[selected]>*,z-navigation-tab-link:not([disabled]):hover>*,z-navigation-tab-link[selected]>*{color:var(--color-hover-secondary);fill:currentColor}z-navigation-tab:not([disabled]):hover>*::after,z-navigation-tab[selected]>*::after,z-navigation-tab-link:not([disabled]):hover>*::after,z-navigation-tab-link[selected]>*::after{content:\"\";position:absolute;background-color:var(--color-hover-secondary)}z-navigation-tab[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab-link[orientation=\"horizontal\"][selected]>*::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tab z-icon,z-navigation-tab-link z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tab[orientation=\"horizontal\"] z-icon,z-navigation-tab-link[orientation=\"horizontal\"] z-icon{margin-right:var(--space-unit)}z-navigation-tab:not([disabled]):hover>*{background-color:var(--color-background)}z-navigation-tab[disabled]>*{pointer-events:all;cursor:not-allowed;color:var(--gray500);fill:currentColor}z-navigation-tab[size=\"small\"]>*,z-navigation-tab-link[size=\"small\"]>*{font-size:var(--font-size-2);line-height:1.4;letter-spacing:0.16px}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]>*,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[size=\"small\"][orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]:hover>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"][selected]>*::after{height:var(--border-size-medium)}z-navigation-tab[size=\"small\"]:not([orientation=\"vertical\"]) z-icon,z-navigation-tab-link[size=\"small\"]:not([orientation=\"vertical\"]) z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tab[orientation=\"vertical\"]>*,z-navigation-tab-link[orientation=\"vertical\"]>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tab[orientation=\"vertical\"]:hover:not([disabled])>*::after,z-navigation-tab[orientation=\"vertical\"][selected]>*::after,z-navigation-tab-link[orientation=\"vertical\"]:hover>*::after,z-navigation-tab-link[orientation=\"vertical\"][selected]>*::after{width:var(--border-size-large);height:100%;top:0;right:0}";
+const navigationTabCss = "z-navigation-tab>button,z-navigation-tab-link>a{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tab-link>a{text-decoration:none}z-navigation-tab *,z-navigation-tab-link *,z-navigation-tab *::before,z-navigation-tab *::after,z-navigation-tab-link *::before,z-navigation-tab-link *::after{box-sizing:border-box}z-navigation-tab>*:focus:focus-visible,z-navigation-tab-link>*:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary)}z-navigation-tab:not([disabled]):hover>*,z-navigation-tab[selected]>*,z-navigation-tab-link:not([disabled]):hover>*,z-navigation-tab-link[selected]>*{color:var(--color-hover-secondary);fill:currentcolor}z-navigation-tab:not([disabled]):hover>*::after,z-navigation-tab[selected]>*::after,z-navigation-tab-link:not([disabled]):hover>*::after,z-navigation-tab-link[selected]>*::after{position:absolute;background-color:var(--color-hover-secondary);content:\"\"}z-navigation-tab[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab-link[orientation=\"horizontal\"][selected]>*::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tab z-icon,z-navigation-tab-link z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tab[orientation=\"horizontal\"] z-icon,z-navigation-tab-link[orientation=\"horizontal\"] z-icon{margin-right:var(--space-unit)}z-navigation-tab:not([disabled]):hover>*{background-color:var(--color-background)}z-navigation-tab[disabled]>*{color:var(--gray500);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tab[size=\"small\"]>*,z-navigation-tab-link[size=\"small\"]>*{font-size:var(--font-size-2);letter-spacing:0.16px;line-height:1.4}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]>*,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[size=\"small\"][orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]:hover>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"][selected]>*::after{height:var(--border-size-medium)}z-navigation-tab[size=\"small\"]:not([orientation=\"vertical\"]) z-icon,z-navigation-tab-link[size=\"small\"]:not([orientation=\"vertical\"]) z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tab[orientation=\"vertical\"]>*,z-navigation-tab-link[orientation=\"vertical\"]>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tab[orientation=\"vertical\"]:hover:not([disabled])>*::after,z-navigation-tab[orientation=\"vertical\"][selected]>*::after,z-navigation-tab-link[orientation=\"vertical\"]:hover>*::after,z-navigation-tab-link[orientation=\"vertical\"][selected]>*::after{top:0;right:0;width:var(--border-size-large);height:100%}";
 const ZNavigationTabLink = class {
   constructor(hostRef) {
@@ -19,19 +19,19 @@ const ZNavigationTabLink = class {
     /**
      * Tab orientation. Do not set this manually: `z-navigation-tabs` will handle this.
      */
-    this.orientation = NavigationTabsOrientations.horizontal;
+    this.orientation = NavigationTabsOrientation.HORIZONTAL;
     /**
      * Tab size. Do not set this manually: `z-navigation-tabs` will handle this.
      */
-    this.size = NavigationTabsSizes.big;
+    this.size = NavigationTabsSize.BIG;
   }
   /**
    * Scroll into view to center the tab.
    */
   scrollToTab({ target: button }) {
-    const scrollOptions = this.orientation === NavigationTabsOrientations.horizontal ?
-      { block: "nearest", inline: "center" } :
-      { block: "center", inline: "nearest" };
+    const scrollOptions = this.orientation === NavigationTabsOrientation.HORIZONTAL
+      ? { block: "nearest", inline: "center" }
+      : { block: "center", inline: "nearest" };
     button.scrollIntoView(Object.assign({ behavior: "smooth" }, scrollOptions));
   }
   onClick() {
@@ -49,8 +49,8 @@ const ZNavigationTabLink = class {
    */
   renderIcon() {
     let icon = this.icon;
-    const iconFilled = `${icon.replace(/-filled$/, '')}-filled`;
-    if (this.selected && Object.keys(icons).includes(iconFilled)) {
+    const iconFilled = `${icon.replace(/-filled$/, "")}-filled`;
+    if (this.selected && Object.keys(ICONS).includes(iconFilled)) {
       icon = iconFilled;
     }
     return h("z-icon", { name: icon });

package/dist/esm/z-navigation-tab.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { N as NavigationTabsOrientations, a as NavigationTabsSizes } from './index-8390ddaf.js';
-import { i as icons } from './icons-92a7dcde.js';
+import { r as registerInstance, c as createEvent, h } from './index-3517583d.js';
+import { N as NavigationTabsOrientation, a as NavigationTabsSize } from './index-9d028352.js';
+import { I as ICONS } from './icons-56ca282c.js';
-const navigationTabCss = "z-navigation-tab>button,z-navigation-tab-link>a{position:relative;z-index:0;display:inline-flex;align-items:center;justify-content:center;width:auto;margin:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);background-color:unset;text-align:center;font-size:inherit;font-family:var(--font-family-sans);line-height:inherit;letter-spacing:inherit;white-space:nowrap;color:var(--color-primary01);fill:currentColor;border:none;border-radius:var(--border-no-radius);outline:none;cursor:pointer}z-navigation-tab-link>a{text-decoration:none}z-navigation-tab *,z-navigation-tab-link *,z-navigation-tab *::before,z-navigation-tab *::after,z-navigation-tab-link *::before,z-navigation-tab-link *::after{box-sizing:border-box}z-navigation-tab>*:focus:focus-visible,z-navigation-tab-link>*:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary)}z-navigation-tab:not([disabled]):hover>*,z-navigation-tab[selected]>*,z-navigation-tab-link:not([disabled]):hover>*,z-navigation-tab-link[selected]>*{color:var(--color-hover-secondary);fill:currentColor}z-navigation-tab:not([disabled]):hover>*::after,z-navigation-tab[selected]>*::after,z-navigation-tab-link:not([disabled]):hover>*::after,z-navigation-tab-link[selected]>*::after{content:\"\";position:absolute;background-color:var(--color-hover-secondary)}z-navigation-tab[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab-link[orientation=\"horizontal\"][selected]>*::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tab z-icon,z-navigation-tab-link z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tab[orientation=\"horizontal\"] z-icon,z-navigation-tab-link[orientation=\"horizontal\"] z-icon{margin-right:var(--space-unit)}z-navigation-tab:not([disabled]):hover>*{background-color:var(--color-background)}z-navigation-tab[disabled]>*{pointer-events:all;cursor:not-allowed;color:var(--gray500);fill:currentColor}z-navigation-tab[size=\"small\"]>*,z-navigation-tab-link[size=\"small\"]>*{font-size:var(--font-size-2);line-height:1.4;letter-spacing:0.16px}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]>*,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[size=\"small\"][orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]:hover>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"][selected]>*::after{height:var(--border-size-medium)}z-navigation-tab[size=\"small\"]:not([orientation=\"vertical\"]) z-icon,z-navigation-tab-link[size=\"small\"]:not([orientation=\"vertical\"]) z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tab[orientation=\"vertical\"]>*,z-navigation-tab-link[orientation=\"vertical\"]>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tab[orientation=\"vertical\"]:hover:not([disabled])>*::after,z-navigation-tab[orientation=\"vertical\"][selected]>*::after,z-navigation-tab-link[orientation=\"vertical\"]:hover>*::after,z-navigation-tab-link[orientation=\"vertical\"][selected]>*::after{width:var(--border-size-large);height:100%;top:0;right:0}";
+const navigationTabCss = "z-navigation-tab>button,z-navigation-tab-link>a{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tab-link>a{text-decoration:none}z-navigation-tab *,z-navigation-tab-link *,z-navigation-tab *::before,z-navigation-tab *::after,z-navigation-tab-link *::before,z-navigation-tab-link *::after{box-sizing:border-box}z-navigation-tab>*:focus:focus-visible,z-navigation-tab-link>*:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary)}z-navigation-tab:not([disabled]):hover>*,z-navigation-tab[selected]>*,z-navigation-tab-link:not([disabled]):hover>*,z-navigation-tab-link[selected]>*{color:var(--color-hover-secondary);fill:currentcolor}z-navigation-tab:not([disabled]):hover>*::after,z-navigation-tab[selected]>*::after,z-navigation-tab-link:not([disabled]):hover>*::after,z-navigation-tab-link[selected]>*::after{position:absolute;background-color:var(--color-hover-secondary);content:\"\"}z-navigation-tab[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab-link[orientation=\"horizontal\"][selected]>*::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tab z-icon,z-navigation-tab-link z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tab[orientation=\"horizontal\"] z-icon,z-navigation-tab-link[orientation=\"horizontal\"] z-icon{margin-right:var(--space-unit)}z-navigation-tab:not([disabled]):hover>*{background-color:var(--color-background)}z-navigation-tab[disabled]>*{color:var(--gray500);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tab[size=\"small\"]>*,z-navigation-tab-link[size=\"small\"]>*{font-size:var(--font-size-2);letter-spacing:0.16px;line-height:1.4}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]>*,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tab[size=\"small\"][orientation=\"horizontal\"]:not([disabled]):hover>*::after,z-navigation-tab[size=\"small\"][orientation=\"horizontal\"][selected]>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"]:hover>*::after,z-navigation-tab-link[size=\"small\"][orientation=\"horizontal\"][selected]>*::after{height:var(--border-size-medium)}z-navigation-tab[size=\"small\"]:not([orientation=\"vertical\"]) z-icon,z-navigation-tab-link[size=\"small\"]:not([orientation=\"vertical\"]) z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tab[orientation=\"vertical\"]>*,z-navigation-tab-link[orientation=\"vertical\"]>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tab[orientation=\"vertical\"]:hover:not([disabled])>*::after,z-navigation-tab[orientation=\"vertical\"][selected]>*::after,z-navigation-tab-link[orientation=\"vertical\"]:hover>*::after,z-navigation-tab-link[orientation=\"vertical\"][selected]>*::after{top:0;right:0;width:var(--border-size-large);height:100%}";
 const ZNavigationTab = class {
   constructor(hostRef) {
@@ -19,19 +19,19 @@ const ZNavigationTab = class {
     /**
      * Tab orientation. Do not set this manually: `z-navigation-tabs` will handle this.
      */
-    this.orientation = NavigationTabsOrientations.horizontal;
+    this.orientation = NavigationTabsOrientation.HORIZONTAL;
     /**
      * Tab size. Do not set this manually: `z-navigation-tabs` will handle this.
      */
-    this.size = NavigationTabsSizes.big;
+    this.size = NavigationTabsSize.BIG;
   }
   /**
    * Scroll into view to center the tab.
    */
   scrollToTab({ target: button }) {
-    const scrollOptions = this.orientation === NavigationTabsOrientations.horizontal ?
-      { block: "nearest", inline: "center" } :
-      { block: "center", inline: "nearest" };
+    const scrollOptions = this.orientation === NavigationTabsOrientation.HORIZONTAL
+      ? { block: "nearest", inline: "center" }
+      : { block: "center", inline: "nearest" };
     button.scrollIntoView(Object.assign({ behavior: "smooth" }, scrollOptions));
   }
   onClick() {
@@ -51,14 +51,14 @@ const ZNavigationTab = class {
    */
   renderIcon() {
     let icon = this.icon;
-    const iconFilled = `${icon.replace(/-filled$/, '')}-filled`;
-    if (this.selected && Object.keys(icons).includes(iconFilled)) {
+    const iconFilled = `${icon.replace(/-filled$/, "")}-filled`;
+    if (this.selected && Object.keys(ICONS).includes(iconFilled)) {
       icon = iconFilled;
     }
     return h("z-icon", { name: icon });
   }
   render() {
-    return (h("button", { role: "tab", disabled: this.disabled, title: this.htmlTitle, onFocus: this.scrollToTab.bind(this) }, this.icon && this.renderIcon(), this.orientation === "horizontal" && this.label));
+    return (h("button", { role: "tab", disabled: this.disabled, title: this.htmlTitle, onFocus: this.scrollToTab.bind(this) }, this.icon && this.renderIcon(), this.orientation === NavigationTabsOrientation.HORIZONTAL && this.label));
   }
   static get watchers() { return {
     "selected": ["onSelected"]