@zanichelli/albe-web-components 6.1.0-a1 → 6.1.0

package/dist/esm/z-menu-dropdown_2.entry.js

@@ -1,5 +1,6 @@
 import { r as registerInstance, h } from './index-a2ca4b97.js';
-import { a as getElementTree, h as handleKeyboardSubmit, e as getClickedElement } from './utils-420e8552.js';
+import { K as KeyboardKeyCode } from './index-9d028352.js';
+import { a as getElementTree, h as handleKeyboardSubmit, e as getClickedElement } from './utils-39ca028c.js';
 import './breakpoints-c386984e.js';
 
 const stylesCss$1 = ":host{width:inherit;height:32px;font-family:var(--dashboard-font);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.17px}a,a:visited,a:active{color:inherit;text-decoration:none}:host>a{display:block;border:var(--border-size-small) solid transparent;background:var(--bg-grey-050);border-radius:var(--border-radius);color:var(--text-grey-800);outline:none}:host>a::-moz-focus-inner{border:0}:host>a:hover,:host>a.menu-opened:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}:host>a:focus{border:var(--border-size-small) solid var(--myz-blue);box-shadow:0 0 2px 2px var(--myz-blue-light);color:var(--myz-blue);fill:var(--myz-blue)}:host>a:active{border:var(--border-size-small) solid var(--myz-blue-light);box-shadow:0 2px 4px 0 rgb(0 0 0 / 40%);color:var(--myz-blue-light);fill:var(--myz-blue-light)}div.container{position:relative;display:flex;height:32px;align-items:center;justify-content:space-between;padding:0 var(--basex1)}div.container>span.user-wrapper{display:flex}div.container>span.user-wrapper>span.user{overflow:hidden;width:30px;padding:0 var(--basex1);cursor:pointer;text-overflow:ellipsis;white-space:nowrap}div.container>span.arrow{display:flex;align-items:center;justify-content:center}div.container>span.arrow>z-icon{transform:rotate(360deg);transition:all 200ms linear}ul{padding:0 calc(var(--space-unit) * 2);margin:0;list-style:none}li{display:flex;width:max-content;height:var(--basex3);align-items:center;padding:calc(var(--space-unit) / 4) 0}.menu-opened{position:inherit;width:auto !important;min-width:147px;padding-bottom:calc(var(--space-unit) * 2)}.menu-opened a,.menu-opened a:active,.menu-opened a:visited{color:var(--myz-blue);fill:var(--myz-blue)}.menu-opened a:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}.menu-opened>div.container{margin-bottom:var(--basex1)}.menu-opened>div.container>span.user-wrapper>span.user{width:auto}.menu-opened>div.container>span.arrow>z-icon{transform:rotate(180deg);transition:all 200ms linear}@media only screen and (min-width: 1152px){:host>a{width:147px;padding:0 calc(var(--space-unit) / 4)}:host>a.menu-opened{width:147px;padding-bottom:calc(var(--space-unit) * 2)}div.container>span.user-wrapper>span.user{width:80px}}";
@@ -7,9 +8,6 @@ const stylesCss$1 = ":host{width:inherit;height:32px;font-family:var(--dashboard
 const ZMenuDropdown = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.nomeutente = undefined;
-    this.menucontent = undefined;
-    this.buttonid = undefined;
     this.ismenuopen = false;
     this.handleToggle = this.handleToggle.bind(this);
     this.handleFocus = this.handleFocus.bind(this);
@@ -34,7 +32,7 @@ const ZMenuDropdown = class {
     this.ismenuopen = !this.ismenuopen;
   }
   handleFocus(e) {
-    if (e instanceof KeyboardEvent && e.keyCode !== 9 /* KeyboardKeyCode.TAB */) {
+    if (e instanceof KeyboardEvent && e.keyCode !== KeyboardKeyCode.TAB) {
       return;
     }
     const tree = getElementTree(getClickedElement());
@@ -59,8 +57,6 @@ const stylesCss = "ul{padding:0;margin:0}";
 const ZMyzList = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.inputrawdata = undefined;
-    this.list = undefined;
   }
   componentWillLoad() {
     if (this.inputrawdata) {

package/dist/esm/z-menu-section.entry.js

@@ -7,9 +7,6 @@ const ZMenuSection = class {
     registerInstance(this, hostRef);
     this.opened = createEvent(this, "opened", 7);
     this.closed = createEvent(this, "closed", 7);
-    this.active = undefined;
-    this.open = undefined;
-    this.hasContent = undefined;
   }
   toggle() {
     if (!this.hasContent) {

package/dist/esm/z-menu.entry.js

@@ -7,11 +7,18 @@ const ZMenu = class {
     registerInstance(this, hostRef);
     this.opened = createEvent(this, "opened", 7);
     this.closed = createEvent(this, "closed", 7);
-    this.active = undefined;
+    /**
+     * Flag to set the display mode of the list.
+     * If true, the list will be absolutely positioned under the menu label,
+     * stacked beneath it otherwise.
+     * @default false
+     */
     this.floating = false;
+    /**
+     * The opening state of the menu.
+     * @default false
+     */
     this.open = false;
-    this.hasHeader = undefined;
-    this.hasContent = undefined;
     this.toggle = this.toggle.bind(this);
     this.checkContent = this.checkContent.bind(this);
     this.onItemsChange = this.onItemsChange.bind(this);

package/dist/esm/z-messages-pocket.entry.js

@@ -1,13 +1,13 @@
 import { r as registerInstance, h } from './index-a2ca4b97.js';
+import { r as PocketStatus } from './index-9d028352.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>z-pocket{width:100%}:host>z-pocket.closed{width:158px}:host>z-pocket>z-pocket-header{color:var(--color-primary01);fill:var(--color-primary01);font-size:12px;font-weight:var(--font-sb)}:host>z-pocket>z-pocket-header span.badge{display:inline-block;padding:0 calc(var(--space-unit) * 0.5);margin-left:var(--space-unit);background:var(--color-secondary02);border-radius:50%;color:var(--color-surface01)}:host>z-pocket>z-pocket-header>z-icon{margin-left:var(--space-unit)}:host>z-pocket>z-pocket-body>div.body{overflow:hidden;padding:var(--space-unit);margin:0 var(--space-unit)}:host>z-pocket.preview>z-pocket-body{position:relative}:host>z-pocket.preview>z-pocket-body>div.gradient{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgb(255 0 0 / 0%), white)}:host>z-pocket.open>z-pocket-body>div.body{overflow:auto;max-height:calc(100vh - 166px);scrollbar-width:none}:host ::-webkit-scrollbar{width:0}@media only screen and (min-width: 768px){:host>z-pocket{width:768px;margin:0 calc((100% - 768px) / 2)}:host>z-pocket.closed{margin:0 calc((100% - 158px) / 2)}:host>z-pocket.open>z-pocket-body>div.body{max-height:326px}}@media only screen and (min-width: 1152px){:host>z-pocket.open>z-pocket-body>div.body{scrollbar-color:var(--color-primary01) var(--color-surface03);scrollbar-width:thin}:host ::-webkit-scrollbar{width:10px;background:linear-gradient(\n      90deg,\n      var(--color-surface01) 2px,\n      var(--color-surface03) 4px,\n      var(--color-surface01) 8px\n    );border-radius:var(--radius-base)}:host ::-webkit-scrollbar-thumb{width:var(--space-unit);background-color:var(--color-primary01);border-radius:var(--radius-base)}}";
 
 const ZMessagesPocket = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.pocketid = undefined;
-    this.messages = undefined;
-    this.status = "preview" /* PocketStatus.PREVIEW */;
+    /** pocket status */
+    this.status = PocketStatus.PREVIEW;
   }
   handlePocketToggle(e) {
     if (e.detail.id === this.pocketid) {
@@ -18,12 +18,12 @@ const ZMessagesPocket = class {
     let message;
     let icon;
     switch (this.status) {
-      case "preview" /* PocketStatus.PREVIEW */:
-      case "closed" /* PocketStatus.CLOSED */:
+      case PocketStatus.PREVIEW:
+      case PocketStatus.CLOSED:
         message = (h("span", null, "Messaggi ", h("span", { class: "badge" }, this.messages)));
         icon = "chevron-up";
         break;
-      case "open" /* PocketStatus.OPEN */:
+      case PocketStatus.OPEN:
         message = h("span", null, "Riduci");
         icon = "chevron-down";
         break;

package/dist/esm/z-modal-login.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-a2ca4b97.js';
+import { d as InputStatus, B as ButtonVariant, I as InputType } from './index-9d028352.js';
 
 const stylesCss = ".sc-z-modal-login-h{font-family:var(--dashboard-font);font-weight:var(--font-rg)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login{display:flex;box-sizing:border-box;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;padding:calc(var(--space-unit) * 4) calc(var(--space-unit) * 2) calc(var(--space-unit) * 3)\n    calc(var(--space-unit) * 2);color:var(--text-grey-800)}z-button.sc-z-modal-login,z-input.sc-z-modal-login,.sc-z-modal-login-s>z-button,.sc-z-modal-login-s>z-input{display:inline-block;width:100%}z-link.sc-z-modal-login,.sc-z-modal-login-s>z-link{font-size:12px}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login{display:flex;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start}div.wrapper>form>div.username.sc-z-modal-login-s>z-input,div.wrapper>form>div.password.sc-z-modal-login-s>z-input,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.username.sc-z-modal-login z-input.sc-z-modal-login,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.password.sc-z-modal-login z-input.sc-z-modal-login{margin-bottom:var(--space-unit)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>z-link.forget.sc-z-modal-login{align-self:flex-end;font-size:12px}div.wrapper>form>div.login.sc-z-modal-login-s>z-button,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.login.sc-z-modal-login z-button.sc-z-modal-login{align-self:flex-start;margin:calc(var(--space-unit) * 3) 0}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>hr.sc-z-modal-login{width:100%;border:none;border-top:var(--border-size-medium) solid var(--bg-grey-200);margin-bottom:calc(var(--space-unit) * 3);margin-block-start:unset}div.wrapper>div.signup.sc-z-modal-login-s>z-button,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.signup.sc-z-modal-login z-button.sc-z-modal-login{display:inline-block;margin:calc(var(--space-unit) * 2) 0}.sc-z-modal-login-h div.providers.sc-z-modal-login{display:grid;gap:calc(var(--space-unit) * 2) 0;grid-auto-rows:auto;grid-template-columns:1fr}slot-fb[name=\"provider\"].sc-z-modal-login{display:grid;gap:calc(var(--space-unit) * 2) 0;grid-auto-rows:auto;grid-template-columns:1fr}.sc-z-modal-login-h div.providers.sc-z-modal-login>z-body.sc-z-modal-login{padding-top:calc(var(--space-unit) * 2)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.providers.sc-z-modal-login .zd.sc-z-modal-login{display:flex;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:center}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.providers.sc-z-modal-login .zd.sc-z-modal-login>svg.sc-z-modal-login{margin-right:var(--space-unit)}@media only screen and (min-width: 768px){z-button.sc-z-modal-login,.sc-z-modal-login-s>z-button{width:initial}.sc-z-modal-login-h div.wrapper.sc-z-modal-login{width:396px;padding:calc(var(--space-unit) * 3)}.sc-z-modal-login-h div.providers.sc-z-modal-login{display:grid;align-items:center;justify-content:center;gap:var(--space-unit);grid-auto-rows:auto;grid-template-columns:1fr 1fr}.sc-z-modal-login-h div.providers.sc-z-modal-login>z-body.sc-z-modal-login{padding-bottom:var(--space-unit);grid-column:1 / 3}.sc-z-modal-login-s>[slot=\"provider\"]{width:100%}slot-fb[name=\"provider\"].sc-z-modal-login{display:grid;align-items:center;justify-content:center;gap:var(--space-unit);grid-auto-rows:auto;grid-column:1 / 3;grid-template-columns:1fr 1fr}slot-fb[name=\"provider\"].sc-z-modal-login>*.sc-z-modal-login{width:100%}}@media only screen and (min-width: 1366px){.sc-z-modal-login-h div.wrapper.sc-z-modal-login{width:477px;padding:calc(var(--space-unit) * 4)}}";
 
@@ -9,11 +10,8 @@ const ZModalLogin = class {
     this.statusUpdate = createEvent(this, "statusUpdate", 7);
     this.signupClick = createEvent(this, "signupClick", 7);
     this.zainoDigitaleClick = createEvent(this, "zainoDigitaleClick", 7);
-    this.forgotPasswordUrl = undefined;
+    /** Login modal title */
     this.heading = "Entra in MyZanichelli";
-    this.status = undefined;
-    this.message = undefined;
-    this.pwdmessage = undefined;
     this.externalProviderCheck = false;
   }
   componentDidLoad() {
@@ -29,7 +27,7 @@ const ZModalLogin = class {
     let username = usernameInput.value;
     const password = passwordInput.value;
     if (!username || !password) {
-      this.status = "error" /* InputStatus.ERROR */;
+      this.status = InputStatus.ERROR;
       return;
     }
     username = this.cleanUsername(username);
@@ -70,10 +68,10 @@ const ZModalLogin = class {
     return username;
   }
   renderZainoDigitaleButton() {
-    return (h("z-button", { variant: "secondary" /* ButtonVariant.SECONDARY */, onClick: () => this.emitZainoDigitaleClick(), class: "zainoDigitale" }, h("div", { class: "zd" }, h("svg", { width: "18px", height: "24px", viewBox: "0 0 18 24" }, h("g", { stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" }, h("g", { transform: "translate(-313.000000, -329.000000)", fill: "#E2001A", "fill-rule": "nonzero" }, h("g", { transform: "translate(25.000000, 191.000000)" }, h("g", null, h("g", { transform: "translate(0.000000, 100.000000)" }, h("g", null, h("g", { transform: "translate(276.000000, 28.000000)" }, h("path", { d: "M29.8953704,30.5632326 C29.9143039,30.3327754 29.5356326,30.0447041 29.1380277,29.8142469 C29.2516291,28.7963947 29.4409647,26.9719425 29.2705626,26.3189807 C29.0433598,25.416357 28.3428178,24.8018047 28.380685,23.822362 C28.4185521,22.8429193 28.1913493,16.5437582 27.0364017,15.1802202 C26.1654576,14.162368 25.4649156,12.8372396 23.4390239,12.2418921 C23.4390239,12.0498445 23.4390239,11.8770016 23.4200903,11.7425683 C23.3822232,10.9167637 21.9622056,10.090959 21.6214014,10.0525495 C21.2805972,10.01414 20.371786,9.95652568 20.0309818,10.0525495 C19.6901775,10.1293685 19.0464362,11.128016 18.7434992,11.4352922 C18.5920306,11.5889302 18.5541635,11.9538207 18.5730971,12.3187111 C17.437083,12.6836015 16.1306669,13.4325871 15.4490584,14.9497631 C14.2941108,17.676839 13.4799674,18.9251483 13.6693031,24.1680477 C13.5935688,25.1090809 13.2906318,25.6084046 13.1012961,25.6852237 C12.9119604,25.7620427 12.798359,25.9156808 12.7604919,26.1077284 C12.7226247,26.2805712 12.5522226,28.37389 12.7415583,29.8718612 C12.3818205,30.1023183 12.0788834,30.3519802 12.097817,30.5632326 C12.1546177,31.0625563 11.8516806,31.7731324 12.097817,32.0612038 C12.230352,32.2148419 12.7226247,32.5413228 13.3284989,32.8293942 C13.6125024,33.4631512 14.199443,33.9240655 15.467992,33.9816797 C18.1565586,34.0584988 26.2601254,33.8664512 26.5630625,33.9048607 C26.847066,33.9432702 28.4374857,34.0008845 28.683622,32.8293942 C29.2894962,32.5413228 29.781769,32.2148419 29.9143039,32.0612038 C30.1415067,31.7731324 29.8385697,31.0625563 29.8953704,30.5632326 Z M12.0319858,31.2 C12.1173988,31.1230769 12.3736379,31.0461538 12.743761,31 C12.857645,31.3230769 12.914587,31.6615385 13,32 C12.4021089,31.8153846 11.8611598,31.5692308 12.0319858,31.2 Z M21.1618497,12.8394441 C21.1618497,12.8394441 20.6763006,12.8165075 20,13 L20,12.9770634 C20,12.5642053 20.3121387,11.3256309 20.3988439,11.1192018 C20.4855491,10.9127728 21.265896,11.0274556 21.8554913,11.0733287 C22.6358382,11.0503922 22.4624277,11.2568212 22.8092486,11.9907912 C22.9306358,12.2889666 22.982659,12.6559516 23,13 C22.4797688,12.8623806 21.8728324,12.8165075 21.1618497,12.8394441 Z M28.3324094,30 C28.6648189,30.0833333 28.9085858,30.2222222 28.9750677,30.3888889 C29.1301921,31.1666667 28.5318551,31.6388889 28,32 C28.0221606,31.5 28.0664819,31.1111111 28.0664819,31.1111111 L28.2437669,30.6111111 L28.3324094,30 Z M21.8571429,23 L21.8571429,23.8 L22.7142857,23.8 L22.7142857,24.6 L23.5714286,24.6 L23.5714286,25.4 L24.4285714,25.4 L24.4285714,26.2 L25.2857143,26.2 L25.2857143,27 L26.1428571,27 L26.1428571,27.8 L27,27.8 L27,28.6 L24.4285714,28.6 L24.4285714,29.4 L25.2857143,29.4 L25.2857143,31 L24.4285714,31 L24.4285714,30.2 L23.5714286,30.2 L23.5714286,29.4 L22.7142857,29.4 L22.7142857,30.2 L21.8571429,30.2 L21.8571429,31 L21,31 L21,23 L21.8571429,23 Z" }))))))))), h("span", null, "ZAINO DIGITALE"))));
+    return (h("z-button", { variant: ButtonVariant.SECONDARY, onClick: () => this.emitZainoDigitaleClick(), class: "zainoDigitale" }, h("div", { class: "zd" }, h("svg", { width: "18px", height: "24px", viewBox: "0 0 18 24" }, h("g", { stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" }, h("g", { transform: "translate(-313.000000, -329.000000)", fill: "#E2001A", "fill-rule": "nonzero" }, h("g", { transform: "translate(25.000000, 191.000000)" }, h("g", null, h("g", { transform: "translate(0.000000, 100.000000)" }, h("g", null, h("g", { transform: "translate(276.000000, 28.000000)" }, h("path", { d: "M29.8953704,30.5632326 C29.9143039,30.3327754 29.5356326,30.0447041 29.1380277,29.8142469 C29.2516291,28.7963947 29.4409647,26.9719425 29.2705626,26.3189807 C29.0433598,25.416357 28.3428178,24.8018047 28.380685,23.822362 C28.4185521,22.8429193 28.1913493,16.5437582 27.0364017,15.1802202 C26.1654576,14.162368 25.4649156,12.8372396 23.4390239,12.2418921 C23.4390239,12.0498445 23.4390239,11.8770016 23.4200903,11.7425683 C23.3822232,10.9167637 21.9622056,10.090959 21.6214014,10.0525495 C21.2805972,10.01414 20.371786,9.95652568 20.0309818,10.0525495 C19.6901775,10.1293685 19.0464362,11.128016 18.7434992,11.4352922 C18.5920306,11.5889302 18.5541635,11.9538207 18.5730971,12.3187111 C17.437083,12.6836015 16.1306669,13.4325871 15.4490584,14.9497631 C14.2941108,17.676839 13.4799674,18.9251483 13.6693031,24.1680477 C13.5935688,25.1090809 13.2906318,25.6084046 13.1012961,25.6852237 C12.9119604,25.7620427 12.798359,25.9156808 12.7604919,26.1077284 C12.7226247,26.2805712 12.5522226,28.37389 12.7415583,29.8718612 C12.3818205,30.1023183 12.0788834,30.3519802 12.097817,30.5632326 C12.1546177,31.0625563 11.8516806,31.7731324 12.097817,32.0612038 C12.230352,32.2148419 12.7226247,32.5413228 13.3284989,32.8293942 C13.6125024,33.4631512 14.199443,33.9240655 15.467992,33.9816797 C18.1565586,34.0584988 26.2601254,33.8664512 26.5630625,33.9048607 C26.847066,33.9432702 28.4374857,34.0008845 28.683622,32.8293942 C29.2894962,32.5413228 29.781769,32.2148419 29.9143039,32.0612038 C30.1415067,31.7731324 29.8385697,31.0625563 29.8953704,30.5632326 Z M12.0319858,31.2 C12.1173988,31.1230769 12.3736379,31.0461538 12.743761,31 C12.857645,31.3230769 12.914587,31.6615385 13,32 C12.4021089,31.8153846 11.8611598,31.5692308 12.0319858,31.2 Z M21.1618497,12.8394441 C21.1618497,12.8394441 20.6763006,12.8165075 20,13 L20,12.9770634 C20,12.5642053 20.3121387,11.3256309 20.3988439,11.1192018 C20.4855491,10.9127728 21.265896,11.0274556 21.8554913,11.0733287 C22.6358382,11.0503922 22.4624277,11.2568212 22.8092486,11.9907912 C22.9306358,12.2889666 22.982659,12.6559516 23,13 C22.4797688,12.8623806 21.8728324,12.8165075 21.1618497,12.8394441 Z M28.3324094,30 C28.6648189,30.0833333 28.9085858,30.2222222 28.9750677,30.3888889 C29.1301921,31.1666667 28.5318551,31.6388889 28,32 C28.0221606,31.5 28.0664819,31.1111111 28.0664819,31.1111111 L28.2437669,30.6111111 L28.3324094,30 Z M21.8571429,23 L21.8571429,23.8 L22.7142857,23.8 L22.7142857,24.6 L23.5714286,24.6 L23.5714286,25.4 L24.4285714,25.4 L24.4285714,26.2 L25.2857143,26.2 L25.2857143,27 L26.1428571,27 L26.1428571,27.8 L27,27.8 L27,28.6 L24.4285714,28.6 L24.4285714,29.4 L25.2857143,29.4 L25.2857143,31 L24.4285714,31 L24.4285714,30.2 L23.5714286,30.2 L23.5714286,29.4 L22.7142857,29.4 L22.7142857,30.2 L21.8571429,30.2 L21.8571429,31 L21,31 L21,23 L21.8571429,23 Z" }))))))))), h("span", null, "ZAINO DIGITALE"))));
   }
   render() {
-    return (h("z-modal", { modaltitle: this.heading }, h("div", { class: "wrapper", slot: "modalContent" }, h("form", { method: "post" }, h("div", { class: "username" }, h("slot", { name: "username" }, h("z-input", { id: "username", label: "email o numero di cellulare", placeholder: "Inserisci l'email o il cellulare", autocomplete: "username", name: "username", status: this.status, message: this.message, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), h("div", { class: "password" }, h("slot", { name: "password" }, h("z-input", { id: "password", label: "password", placeholder: "Inserisci la tua password", type: "password" /* InputType.PASSWORD */, name: "password", autocomplete: "current-password", status: this.status, message: this.pwdmessage, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), h("z-link", { class: "forget", href: this.forgotPasswordUrl }, "Password dimenticata?"), h("div", { class: "login" }, h("slot", { name: "login" }, h("z-button", { variant: "primary" /* ButtonVariant.PRIMARY */, onClick: () => this.emitLoginSubmit() }, "Accedi")))), h("hr", null), h("z-body", { class: "signup", level: 4, variant: "semibold" }, "Non hai ancora un account?"), h("div", { class: "signup" }, h("slot", { name: "signup" }, h("z-button", { variant: "secondary" /* ButtonVariant.SECONDARY */, onClick: () => this.emitSignupClick() }, "Registrati"))), !this.externalProviderCheck && (h("div", { class: "providers" }, h("z-body", { class: "provider", level: 5, variant: "regular" }, "OPPURE ACCEDI CON:"), h("slot", { name: "provider" }, this.renderZainoDigitaleButton(), h("z-link", { icon: "informationsource", href: "https://www.zainodigitale.it/#/landing" }, "Cos'\u00E8 Zaino Digitale?")))))));
+    return (h("z-modal", { modaltitle: this.heading }, h("div", { class: "wrapper", slot: "modalContent" }, h("form", { method: "post" }, h("div", { class: "username" }, h("slot", { name: "username" }, h("z-input", { id: "username", label: "email o numero di cellulare", placeholder: "Inserisci l'email o il cellulare", autocomplete: "username", name: "username", status: this.status, message: this.message, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), h("div", { class: "password" }, h("slot", { name: "password" }, h("z-input", { id: "password", label: "password", placeholder: "Inserisci la tua password", type: InputType.PASSWORD, name: "password", autocomplete: "current-password", status: this.status, message: this.pwdmessage, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), h("z-link", { class: "forget", href: this.forgotPasswordUrl }, "Password dimenticata?"), h("div", { class: "login" }, h("slot", { name: "login" }, h("z-button", { variant: ButtonVariant.PRIMARY, onClick: () => this.emitLoginSubmit() }, "Accedi")))), h("hr", null), h("z-body", { class: "signup", level: 4, variant: "semibold" }, "Non hai ancora un account?"), h("div", { class: "signup" }, h("slot", { name: "signup" }, h("z-button", { variant: ButtonVariant.SECONDARY, onClick: () => this.emitSignupClick() }, "Registrati"))), !this.externalProviderCheck && (h("div", { class: "providers" }, h("z-body", { class: "provider", level: 5, variant: "regular" }, "OPPURE ACCEDI CON:"), h("slot", { name: "provider" }, this.renderZainoDigitaleButton(), h("z-link", { icon: "informationsource", href: "https://www.zainodigitale.it/#/landing" }, "Cos'\u00E8 Zaino Digitale?")))))));
   }
   get hostElement() { return getElement(this); }
 };

package/dist/esm/z-modal.entry.js

@@ -8,9 +8,7 @@ const ZModal = class {
     this.modalClose = createEvent(this, "modalClose", 7);
     this.modalHeaderActive = createEvent(this, "modalHeaderActive", 7);
     this.modalBackgroundClick = createEvent(this, "modalBackgroundClick", 7);
-    this.modalid = undefined;
-    this.modaltitle = undefined;
-    this.modalsubtitle = undefined;
+    /** aria-label for close button (optional) */
     this.closeButtonLabel = "close modal";
   }
   emitModalClose() {

package/dist/esm/z-myz-card-alert.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
+import { p as AlertType } from './index-9d028352.js';
 
 const stylesCss = ":host{position:absolute;z-index:2;top:0;left:0;width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>z-alert{height:calc(var(--space-unit) * 6)}.relative-container{position:relative;display:grid;align-items:center;padding:0;grid-column-gap:var(--space-unit);grid-template-columns:18px auto 46px;grid-template-rows:1fr;outline:none}.relative-container::-moz-focus-inner{border:0}.alert-external-wrapper.remove-alert{border:var(--border-size-medium) solid var(--color-surface02);border-top:none}:host div.add-alert{background:var(--color-success-inverse)}:host div.remove-alert{background:var(--color-warning-inverse)}:host div>.content-text{color:var(--color-surface05);font-size:14px;letter-spacing:0.16px;line-height:20px}:host div>.content-action{height:20px;color:var(--color-primary01);cursor:pointer;font-size:12px;font-weight:var(--font-sb);letter-spacing:0.32px;line-height:20px}:host div>z-icon{justify-self:center}";
 
@@ -6,10 +7,6 @@ const ZMyzCardAlert = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.undoAction = createEvent(this, "undoAction", 7);
-    this.iconname = undefined;
-    this.contenttext = undefined;
-    this.actiontext = undefined;
-    this.type = undefined;
   }
   emitUndoAction() {
     this.undoAction.emit({ actionType: this.type });
@@ -42,9 +39,9 @@ const ZMyzCardAlert = class {
   getAlertType() {
     switch (this.type) {
       case "add":
-        return "success" /* AlertType.SUCCESS */;
+        return AlertType.SUCCESS;
       case "remove":
-        return "warning" /* AlertType.WARNING */;
+        return AlertType.WARNING;
       default:
         return null;
     }

package/dist/esm/z-myz-card-dictionary.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
+import { B as ButtonVariant, c as ButtonSize } from './index-9d028352.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host z-myz-card{--card-overflow:visible}:host>div{position:relative;width:100%;height:522px;transition:-webkit-transform 0.5s ease-out;transition:transform 0.5s ease-out;transition:transform 0.5s ease-out, -webkit-transform 0.5s ease-out}:host>div .content{position:relative;z-index:2;width:100%;height:522px;transform-style:preserve-3d;transition:-webkit-transform 0.5s ease-out;transition:transform 0.5s ease-out;transition:transform 0.5s ease-out, -webkit-transform 0.5s ease-out}:host>div .content.flipped{margin-top:-2px;transform:rotateY(180deg)}:host>div .front,:host>div .back{position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden}:host>div .front{z-index:2;top:0;left:0;transform:rotateY(0deg)}:host>div .front z-button{position:absolute;z-index:3;top:calc(var(--space-unit) * 0.5);left:calc(-1 * var(--space-unit))}:host>div .back{z-index:1;top:0;left:0;display:flex;justify-content:center;padding:0 var(--space-unit);margin-left:calc(-1 * var(--space-unit));transform:rotateY(180deg)}.hide-info{display:none}";
 
@@ -6,11 +7,13 @@ const ZMyzCardDictionary = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.cardFlipped = createEvent(this, "cardFlipped", 7);
-    this.name = undefined;
-    this.cover = undefined;
+    /** card is disabled */
     this.disabled = false;
+    /** card is flipped */
     this.flipped = false;
+    /** flip button label */
     this.flipbuttonlabel = "INFO";
+    /** hide info button */
     this.hideinfobtn = false;
   }
   handleFlipCard(e) {
@@ -21,7 +24,7 @@ const ZMyzCardDictionary = class {
     this.cardFlipped.emit(showBack);
   }
   render() {
-    return (h("div", null, h("z-myz-card", null, h("z-myz-card-header", { titolo: this.name }), h("div", { class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { class: "front" }, h("z-myz-card-body", null, h("z-myz-card-cover", { slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { class: { "hide-info": this.hideinfobtn }, variant: "secondary" /* ButtonVariant.SECONDARY */, icon: "informationsource", size: "x-small" /* ButtonSize.X_SMALL */, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { class: "back" }, h("slot", { name: "info" }))), h("slot", null))));
+    return (h("div", null, h("z-myz-card", null, h("z-myz-card-header", { titolo: this.name }), h("div", { class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { class: "front" }, h("z-myz-card-body", null, h("z-myz-card-cover", { slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { class: { "hide-info": this.hideinfobtn }, variant: ButtonVariant.SECONDARY, icon: "informationsource", size: ButtonSize.X_SMALL, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { class: "back" }, h("slot", { name: "info" }))), h("slot", null))));
   }
 };
 ZMyzCardDictionary.style = stylesCss;

package/dist/esm/z-myz-card-footer.entry.js

@@ -1,16 +1,14 @@
 import { r as registerInstance, h } from './index-a2ca4b97.js';
+import { L as LicenseType } from './index-9d028352.js';
 
 const stylesCss = "footer{position:relative;z-index:5;top:0;width:auto;height:calc(var(--space-unit) * 6);padding:0;border-top:var(--border-size-medium) solid var(--color-surface03);margin:0;background-color:var(--color-surface01);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-family:var(--font-family-sans);font-weight:var(--font-rg);transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.real,footer.trial,footer.temp{border-top:var(--border-size-medium) solid var(--accent)}footer .bold{font-family:var(--font-family-sans);font-weight:var(--font-sb)}footer>p{overflow:hidden;height:40px;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);margin:0;background-color:var(--color-surface01);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);line-height:22px;transition:all 200ms linear}footer.isopen>p{background-color:var(--bg-neutral-200);font-size:14px;font-weight:var(--font-sb);transition:all 200ms linear}footer.isopen.real>p,footer.isopen.trial>p,footer.isopen.temp>p{background-color:var(--accent)}footer .visible{display:block}footer .hidden{display:none}footer>div.content{overflow:hidden;height:60px}footer>div.content>div:not(.slot-handler){padding:var(--space-unit) calc(var(--space-unit) * 2)}footer>div.content>div>p{overflow:hidden;height:20px;padding:0;margin:0;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}footer>div.content>div>p.year-isbn{display:flex;flex-direction:row;justify-content:space-between;padding-top:var(--space-unit)}footer>div.content>div>p.year-isbn>span.isbn{overflow:hidden;text-overflow:ellipsis}footer.isopen>div.content>div:not(.slot-handler){height:68px}footer.isopen>div.content>div>p.authors{height:40px;text-overflow:initial;white-space:initial}footer.isopen>div.content>div>p.year-isbn{height:50px;flex-direction:column;padding-left:0}footer.isopen>div.content>div>p.year-isbn>span.isbn{display:inline-grid;padding-left:0}footer.isopen{top:-212px;height:295px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content{top:-292px}footer.isopen>div.content{height:280px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content>div.content{height:230px}.toggle{position:absolute;z-index:10;top:-24px;left:16px}.faded{opacity:0.3;pointer-events:none}footer>p.custom-content,footer .content.custom-content{display:none}footer.isopen>p.custom-content,footer.isopen .content.custom-content{display:block}div.wrapper{position:relative;height:100%}div.wrapper ::slotted([slot=\"content\"]){position:absolute;z-index:10;top:calc(var(--space-unit) * 2);display:block;width:100%;height:112px;box-sizing:border-box;padding:0 calc(var(--space-unit) * 2);border-top:var(--border-size-medium) solid transparent;background:var(--color-white)}div.wrapper.isopen ::slotted([slot=\"content\"]){top:0;bottom:0;height:128px;padding:calc(var(--space-unit) * 2);border-color:var(--accent)}";
 
 const ZMyzCardFooter = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.titolo = undefined;
-    this.autori = undefined;
-    this.isbn = undefined;
-    this.faded = undefined;
-    this.cardtype = undefined;
+    /** footer opened by default (optional) */
     this.opened = false;
+    /** display footer custom slotted content */
     this.customContent = false;
     this.isOpen = false;
     this.allowTooltipAuthors = false;
@@ -35,9 +33,9 @@ const ZMyzCardFooter = class {
   retrieveClass() {
     return {
       "isopen": this.isOpen,
-      "real": this.cardtype === "reale" /* LicenseType.REAL */,
-      "trial": this.cardtype === "saggio" /* LicenseType.TRIAL */,
-      "temp": this.cardtype === "reale_temp" /* LicenseType.TEMP */,
+      "real": this.cardtype === LicenseType.REAL,
+      "trial": this.cardtype === LicenseType.TRIAL,
+      "temp": this.cardtype === LicenseType.TEMP,
       "custom-content": this.customContent,
     };
   }

package/dist/esm/z-myz-card-icon.entry.js

@@ -5,8 +5,9 @@ const stylesCss = "button{display:flex;width:42px;width:calc(var(--space-unit) *
 const ZMyzCardIcon = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.icon = undefined;
+    /** disabled status flag */
     this.isdisabled = false;
+    /** description of the icon*/
     this.ariaLabel = "";
   }
   render() {

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

@@ -1,5 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { h as handleKeyboardSubmit } from './utils-420e8552.js';
+import { P as PopoverPositions } from './index-9d028352.js';
+import { h as handleKeyboardSubmit } from './utils-39ca028c.js';
 import './breakpoints-c386984e.js';
 
 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)}";
@@ -8,7 +9,7 @@ const ZMyzCardInfo = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.flipCard = createEvent(this, "flipCard", 7);
-    this.data = undefined;
+    /** tabindex link attribute (optional) */
     this.htmltabindex = 0;
     this.hiddenContent = false;
     this.tooltip = false;
@@ -89,7 +90,7 @@ const ZMyzCardInfo = class {
       return;
     }
     const { title, year, author, description } = this.cardData;
-    return (h("z-popover", { position: "right" /* 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) ||

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

@@ -5,7 +5,6 @@ const stylesCss = "ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0
 const ZMyzCardList = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.listdata = undefined;
     this.renderList = this.renderList.bind(this);
   }
   handleSpaceKeyPress(e, url) {

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

@@ -1,24 +1,25 @@
 import { r as registerInstance, h } from './index-a2ca4b97.js';
+import { L as LicenseType } from './index-9d028352.js';
 
 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) {
     registerInstance(this, hostRef);
-    this.faded = undefined;
-    this.cardtype = undefined;
+    /** pressed status */
     this.ispressed = false;
+    /** highlighted status */
     this.ishighlighted = false;
   }
   retrieveClass() {
     let elemClasses = "";
-    if (this.cardtype === "reale" /* LicenseType.REAL */) {
+    if (this.cardtype === LicenseType.REAL) {
       elemClasses += "real";
     }
-    else if (this.cardtype === "saggio" /* LicenseType.TRIAL */) {
+    else if (this.cardtype === LicenseType.TRIAL) {
       elemClasses += "trial";
     }
-    else if (this.cardtype === "reale_temp" /* LicenseType.TEMP */) {
+    else if (this.cardtype === LicenseType.TEMP) {
       elemClasses += "temp";
     }
     if (this.faded) {
@@ -55,10 +56,6 @@ const stylesCss$1 = "img{display:block;max-width:100%;height:340px;margin:auto;o
 const ZMyzCardCover = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.img = undefined;
-    this.titolo = undefined;
-    this.faded = undefined;
-    this.defaultimg = undefined;
   }
   hadleOnImageError() {
     this.img = this.defaultimg;
@@ -74,9 +71,6 @@ const stylesCss = "header{position:relative;display:flex;width:auto;height:calc(
 const ZMyzCardHeader = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.titolo = undefined;
-    this.faded = undefined;
-    this.cardtype = undefined;
     this.allowTooltip = false;
   }
   getTitle() {
@@ -92,9 +86,9 @@ const ZMyzCardHeader = class {
   }
   retrieveClass() {
     return {
-      real: this.cardtype === "reale" /* LicenseType.REAL */,
-      trial: this.cardtype === "saggio" /* LicenseType.TRIAL */,
-      temp: this.cardtype === "reale_temp" /* LicenseType.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

@@ -1,5 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-import { h as handleKeyboardSubmit } from './utils-420e8552.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%;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)}";
@@ -9,12 +10,9 @@ const ZMyzListItem = class {
     registerInstance(this, hostRef);
     this.zListItemLinkClick = createEvent(this, "zListItemLinkClick", 7);
     this.zListItemClick = createEvent(this, "zListItemClick", 7);
-    this.text = undefined;
-    this.link = undefined;
+    /** link target (optional) */
     this.linktarget = "_self";
-    this.icon = undefined;
-    this.listitemid = undefined;
-    this.action = undefined;
+    /** underlined style flag */
     this.underlined = true;
     this.emitZListItemLinkClick = this.emitZListItemLinkClick.bind(this);
     this.emitZListItemClick = this.emitZListItemClick.bind(this);

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-a2ca4b97.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;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}}";
@@ -6,22 +7,11 @@ const stylesCss = ":host a{cursor:pointer}header{position:sticky;z-index:99;top:
 const ZMyzTopbar = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.isMobile = true;
+    this.isMenuMobileOpen = false;
     this.intMenuData = [];
     this.extMenuData = [];
     this.isLogged = false;
-    this.intlinkdata = undefined;
-    this.extlinkdata = undefined;
-    this.userdata = undefined;
-    this.ismyz = undefined;
-    this.logolink = undefined;
-    this.imagealt = undefined;
-    this.activeintlinkid = undefined;
-    this.activesublinkid = undefined;
-    this.hideloginbutton = undefined;
-    this.activeMenuItem = undefined;
-    this.currentMenuItem = undefined;
-    this.isMobile = true;
-    this.isMenuMobileOpen = false;
   }
   activeIntLinkChange(newValue) {
     this.activeMenuItem = this.currentMenuItem = this.intMenuData.find((item) => item.id === newValue);
@@ -133,7 +123,7 @@ const ZMyzTopbar = class {
     if (this.hideloginbutton) {
       return;
     }
-    return (h("z-button", { htmlid: "login-button", variant: this.ismyz ? "secondary" /* ButtonVariant.SECONDARY */ : "tertiary" /* ButtonVariant.TERTIARY */, icon: "login", size: "small" /* ButtonSize.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))));

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.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;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%}";
@@ -7,21 +8,28 @@ const ZNavigationTabLink = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.selectedEvent = createEvent(this, "selected", 7);
+    /**
+     * Whether the tab is selected.
+     */
     this.selected = false;
+    /**
+     * Whether the tab is disabled.
+     */
     this.disabled = false;
-    this.orientation = "horizontal" /* NavigationTabsOrientation.HORIZONTAL */;
-    this.size = "big" /* NavigationTabsSize.BIG */;
-    this.htmlTitle = undefined;
-    this.target = undefined;
-    this.href = undefined;
-    this.icon = undefined;
-    this.label = undefined;
+    /**
+     * Tab orientation. Do not set this manually: `z-navigation-tabs` will handle this.
+     */
+    this.orientation = NavigationTabsOrientation.HORIZONTAL;
+    /**
+     * Tab size. Do not set this manually: `z-navigation-tabs` will handle this.
+     */
+    this.size = NavigationTabsSize.BIG;
   }
   /**
    * Scroll into view to center the tab.
    */
   scrollToTab({ target: button }) {
-    const scrollOptions = this.orientation === "horizontal" /* NavigationTabsOrientation.HORIZONTAL */
+    const scrollOptions = this.orientation === NavigationTabsOrientation.HORIZONTAL
       ? { block: "nearest", inline: "center" }
       : { block: "center", inline: "nearest" };
     button.scrollIntoView(Object.assign({ behavior: "smooth" }, scrollOptions));

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.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;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%}";
@@ -7,19 +8,28 @@ const ZNavigationTab = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.selectedEvent = createEvent(this, "selected", 7);
+    /**
+     * Whether the tab is selected.
+     */
     this.selected = false;
+    /**
+     * Whether the tab is disabled.
+     */
     this.disabled = false;
-    this.orientation = "horizontal" /* NavigationTabsOrientation.HORIZONTAL */;
-    this.size = "big" /* NavigationTabsSize.BIG */;
-    this.icon = undefined;
-    this.label = undefined;
-    this.htmlTitle = undefined;
+    /**
+     * Tab orientation. Do not set this manually: `z-navigation-tabs` will handle this.
+     */
+    this.orientation = NavigationTabsOrientation.HORIZONTAL;
+    /**
+     * Tab size. Do not set this manually: `z-navigation-tabs` will handle this.
+     */
+    this.size = NavigationTabsSize.BIG;
   }
   /**
    * Scroll into view to center the tab.
    */
   scrollToTab({ target: button }) {
-    const scrollOptions = this.orientation === "horizontal" /* NavigationTabsOrientation.HORIZONTAL */
+    const scrollOptions = this.orientation === NavigationTabsOrientation.HORIZONTAL
       ? { block: "nearest", inline: "center" }
       : { block: "center", inline: "nearest" };
     button.scrollIntoView(Object.assign({ behavior: "smooth" }, scrollOptions));
@@ -48,7 +58,7 @@ const ZNavigationTab = class {
     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" /* NavigationTabsOrientation.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"]