@zanichelli/albe-web-components 6.5.0 → 6.5.2

package/dist/collection/components/navigation/z-user-dropdown/styles.css

@@ -1,306 +0,0 @@
-:host {
-  background-color: var(--gray900);
-}
-
-:host(.inverse) {
-  background-color: var(--color-white);
-}
-
-button {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  padding: 0;
-  border: none;
-  margin: 0;
-  background-color: var(--gray900);
-  cursor: pointer;
-  letter-spacing: 0.16px;
-  white-space: nowrap;
-}
-
-button.inverse {
-  background-color: var(--color-white);
-}
-
-button div.firstline {
-  display: flex;
-  max-width: 200px;
-  align-items: center;
-  justify-content: flex-end;
-}
-
-button.open div.firstline {
-  max-width: none;
-}
-
-z-icon {
-  padding: 0 2px;
-  fill: var(--color-white);
-}
-
-z-icon.inverse {
-  fill: var(--gray900);
-}
-
-ul {
-  position: absolute;
-  left: 0;
-  width: 100%;
-  box-sizing: border-box;
-  padding: calc(var(--space-unit) / 2) calc(var(--space-unit) * 2) 0 calc(var(--space-unit) * 2);
-  margin: calc(var(--space-unit) * 1.5) 0 0 0;
-  background-color: var(--gray900);
-  font-family: var(--font-family-sans);
-  font-size: 14px;
-  font-weight: var(--font-sb);
-  letter-spacing: 0.3px;
-  line-height: 20px;
-}
-
-ul.inverse {
-  background-color: var(--color-white);
-}
-
-ul > li {
-  display: flex;
-  justify-content: flex-end;
-  padding: calc(var(--space-unit) * 1.5 - 1px) 0;
-  border-bottom: var(--border-base) solid var(--gray700);
-  margin: 0;
-  white-space: nowrap;
-}
-
-ul > li.inverse {
-  border-bottom-color: var(--gray400);
-}
-
-ul > li:first-child {
-  flex-direction: column;
-  align-items: end;
-  padding-top: 0;
-  padding-bottom: calc(var(--space-unit) + 6px);
-  border-top: none;
-}
-
-ul > li:last-child {
-  border-bottom: none;
-  margin-bottom: 0;
-}
-
-#guestbutton {
-  display: inline-flex;
-  width: 100%;
-  min-width: 32px;
-  height: 32px;
-  box-sizing: border-box;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  padding: 0 calc(var(--space-unit) * 2);
-  border-width: var(--border-size-medium);
-  border-style: solid;
-  border-color: var(--color-white);
-  background-color: var(--color-white);
-  border-radius: var(--border-radius);
-  color: var(--gray800);
-  cursor: pointer;
-  fill: currentcolor;
-  font-family: var(--font-family-sans);
-  font-size: 14px;
-  font-weight: var(--font-sb);
-  letter-spacing: 0.3px;
-  line-height: 1;
-  outline: none;
-  text-decoration: none;
-  text-transform: uppercase;
-  vertical-align: middle;
-}
-
-#guestbutton.inverse {
-  border-color: var(--gray800);
-  background-color: var(--gray800);
-  color: var(--color-white);
-}
-
-.userfullname {
-  overflow: hidden;
-  width: 100%;
-  max-width: 250px;
-  padding: 0;
-  color: var(--color-white);
-  font-family: var(--font-family-sans);
-  font-size: 16px;
-  font-weight: var(--font-sb);
-  letter-spacing: 0;
-  line-height: 24px;
-  text-align: right;
-  text-overflow: ellipsis;
-}
-
-.userfullname.inverse {
-  color: var(--gray800);
-}
-
-.useremail {
-  overflow: hidden;
-  width: 100%;
-  color: var(--color-white);
-  font-family: var(--font-family-sans);
-  font-size: 12px;
-  font-weight: var(--font-rg);
-  letter-spacing: 0.32px;
-  line-height: 16px;
-  text-align: right;
-  text-overflow: ellipsis;
-}
-
-.useremail.inverse {
-  color: var(--gray800);
-}
-
-/* Tablet breakpoint */
-@media only screen and (min-width: 768px) {
-  :host {
-    height: calc(var(--space-unit) * 4);
-    background-color: var(--gray900);
-  }
-
-  :host(.inverse) {
-    background-color: var(--color-white);
-  }
-
-  :host > div {
-    position: relative;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  :host > div.open {
-    top: auto;
-    transform: none;
-  }
-
-  :host > div > div {
-    padding: 0;
-  }
-
-  :host > div > div.open {
-    position: absolute;
-    right: calc(var(--space-unit) * -1);
-    padding: calc(var(--space-unit) / 2 + 1px) var(--space-unit) 0 var(--space-unit);
-    margin-top: calc(var(--space-unit) / 2);
-    background-color: var(--color-white);
-    box-shadow: 0 2px calc(var(--space-unit) * 0.5) 0 rgb(0 0 0 / 50%);
-    transform: translate(0, -4px);
-  }
-
-  :host > div > div.inverse.open {
-    background-color: var(--gray800);
-  }
-
-  button {
-    display: flex;
-    flex-flow: row nowrap;
-    align-content: center;
-    align-items: end;
-    justify-content: flex-end;
-  }
-
-  button.open {
-    max-width: initial;
-    padding-right: var(--space-unit);
-    border-top: var(--border-size-small) solid var(--color-white);
-    margin-left: var(--space-unit);
-    background-color: var(--color-white);
-    border-top-left-radius: calc(var(--space-unit) * 0.5);
-    border-top-right-radius: calc(var(--space-unit) * 0.5);
-  }
-
-  button.open.inverse {
-    border-top-color: var(--gray800);
-    background-color: var(--gray800);
-  }
-
-  button:not(.open) z-icon {
-    fill: var(--color-white);
-  }
-
-  button:not(.open) z-icon.inverse {
-    fill: var(--gray800);
-  }
-
-  button.open z-icon {
-    fill: var(--gray800);
-  }
-
-  button.open z-icon.inverse {
-    fill: var(--color-white);
-  }
-
-  .userfullname {
-    width: auto;
-    padding: 0 calc(var(--space-unit) - 6px) 0 calc(var(--space-unit) - 2px);
-    font-family: var(--font-family-sans);
-    font-size: 14px;
-    font-weight: var(--font-sb);
-    letter-spacing: 0.16px;
-    line-height: 20px;
-  }
-
-  .userfullname.inverse {
-    color: var(--gray800);
-  }
-
-  button.open div.userfullname {
-    max-width: none;
-    color: var(--gray800);
-    text-overflow: clip;
-  }
-
-  button.open div.userfullname.inverse {
-    color: var(--color-white);
-  }
-
-  .useremail {
-    box-sizing: border-box;
-    padding-right: calc(var(--space-unit) * 3 - 2px);
-  }
-
-  button.open div.useremail {
-    color: var(--gray800);
-  }
-
-  button.open div.useremail.inverse {
-    color: var(--color-white);
-  }
-
-  ul {
-    position: initial;
-    left: initial;
-    width: 100%;
-    padding: 0;
-    background-color: var(--color-white);
-  }
-
-  ul.inverse {
-    border-bottom-color: var(--gray800);
-    background-color: var(--gray800);
-  }
-
-  ul > li {
-    border-bottom: var(--border-base) solid var(--gray400);
-    margin: 0 var(--space-unit);
-    color: var(--gray800);
-  }
-
-  ul > li.inverse {
-    color: var(--color-white);
-  }
-
-  ul > li:first-child {
-    padding-top: calc(var(--space-unit) + 3px);
-    padding-bottom: calc(var(--space-unit) + 5px);
-    border-top: var(--border-base) solid var(--gray400);
-  }
-}

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

@@ -1,37 +0,0 @@
-import { r as registerInstance, h, H as Host } from './index-a2ca4b97.js';
-import { T as ThemeVariant, f as DividerOrientation } from './index-968a240f.js';
-import { m as mobileBreakpoint } from './breakpoints-c386984e.js';
-
-const stylesCss = ":host{position:sticky;z-index:99;top:0;display:block;height:calc(var(--space-unit) * 6);box-sizing:border-box;padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 2);background-color:var(--gray900);border-radius:var(--border-no-radius)}:host(.light){background-color:var(--color-white)}:host>div{display:flex;align-items:center;justify-content:space-between}:host(.limited-width) #content-container{--mw:none;max-width:var(--mw);margin:auto}.content-panel{display:flex;align-items:center}.content-panel>:not(:last-child){margin-right:calc(var(--space-unit) * 2)}#divider-container{display:none}z-link{font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.3px;line-height:20px}@media only screen and (min-width: 768px){:host{padding:var(--space-unit) calc(var(--space-unit) * 2) var(--space-unit) var(--space-unit)}:host(.limited-width){padding:var(--space-unit)}#divider-container{display:block;height:calc(var(--space-unit) * 3)}}";
-
-const ZAppTopbar = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /** theme variant, default 'dark' */
-    this.theme = ThemeVariant.DARK;
-    this.topbarLinks = [];
-  }
-  handleResize() {
-    this.isMobile = window.innerWidth <= mobileBreakpoint;
-  }
-  componentWillLoad() {
-    this.isMobile = window.screen.width <= mobileBreakpoint || window.innerWidth <= mobileBreakpoint;
-  }
-  componentWillRender() {
-    if (this.topbarContent) {
-      this.topbarLinks = typeof this.topbarContent === "string" ? JSON.parse(this.topbarContent) : this.topbarContent;
-    }
-  }
-  renderTopbarLinks() {
-    return this.topbarLinks.map((link) => (h("z-link", { htmlid: link.id, textcolor: this.theme === ThemeVariant.LIGHT ? "black" : "white", href: link.link, target: link.target, icon: this.isMobile ? link.icon : undefined }, !this.isMobile && link.label)));
-  }
-  render() {
-    return (h(Host, { class: {
-        [this.theme]: true,
-        "limited-width": !!this.contentMaxWidth,
-      } }, h("div", { id: "content-container", style: this.contentMaxWidth ? { "--mw": `${this.contentMaxWidth}px` } : {} }, h("div", { id: "left-panel", class: "content-panel" }, h("z-logo", { mobileLogo: this.isMobile, width: this.isMobile ? 32 : 128, height: this.isMobile ? 40 : 32, imageAlt: "zanichelli-logo", link: this.logoLink, targetBlank: true }), this.isMobile && this.renderTopbarLinks()), h("div", { id: "right-panel", class: "content-panel" }, !this.isMobile && this.renderTopbarLinks(), this.showAppSwitcher && h("z-app-switcher", { theme: this.theme }), h("div", { id: "divider-container" }, h("z-divider", { orientation: DividerOrientation.VERTICAL, color: this.theme === ThemeVariant.LIGHT ? "gray800" : "color-white" })), h("slot", { name: "login" })))));
-  }
-};
-ZAppTopbar.style = stylesCss;
-
-export { ZAppTopbar as z_app_topbar };

package/dist/esm/z-dragdrop-area_2.entry.js

@@ -1,44 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './index-a2ca4b97.js';
-
-const stylesCss = ":host{margin-top:calc(var(--space-unit) * 3);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.dragdrop{position:relative;display:flex;height:228px;flex-direction:column;border-color:var(--color-surface04);background-color:var(--color-surface02);background-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='2' ry='2' stroke='%23CACCCEFF' stroke-width='2' stroke-dasharray='15%2c 10%2c 14%2c 11' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e\");border-radius:2px;color:var(--color-text01)}:host>.dragdrop.dragover *{pointer-events:none}:host>.dragdrop .dragover-container{position:absolute;z-index:10;top:0;left:0;display:none;width:100%;height:100%;background-color:var(--color-primary03);box-shadow:var(--shadow-focus-primary)}:host>.dragdrop .dragover-container .dragover-message{padding:10px 28px;background-color:var(--color-link-primary);color:var(--color-text04)}:host>.dragdrop.dragover .dragover-container{display:flex;align-items:center;justify-content:center}";
-
-const ZDragdropArea = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.fileDropped = createEvent(this, "fileDropped", 7);
-  }
-  fileDroppedHandler(files) {
-    this.fileDropped.emit(files);
-  }
-  renderOnDragOverMessage() {
-    return (h("div", { class: "dragover-container" }, h("div", { class: "dragover-message" }, h("z-body", { variant: "semibold", level: 2 }, "Rilascia i file in questa area per allegarli."))));
-  }
-  render() {
-    return (h("div", { tabIndex: 0, ref: (val) => (this.dragDropContainer = val), class: "dragdrop", onDragOver: (e) => {
-        e.preventDefault();
-        this.dragDropContainer.classList.add("dragover");
-      }, onDragLeave: () => {
-        this.dragDropContainer.classList.remove("dragover");
-      }, onDrop: (e) => {
-        e.preventDefault();
-        if (e.dataTransfer.files.length) {
-          this.dragDropContainer.classList.remove("dragover");
-          this.fileDroppedHandler(e.dataTransfer.files);
-        }
-      } }, this.renderOnDragOverMessage(), h("slot", null)));
-  }
-};
-ZDragdropArea.style = stylesCss;
-
-const ZHeading = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /** Font weight variant */
-    this.variant = "regular";
-  }
-  render() {
-    return (h("z-typography", { tabIndex: 0, component: this.component || `h${this.level}`, level: `h${this.level}`, variant: this.variant }, h("slot", null)));
-  }
-};
-
-export { ZDragdropArea as z_dragdrop_area, ZHeading as z_heading };

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

@@ -1,55 +0,0 @@
-import { r as registerInstance, h } from './index-a2ca4b97.js';
-import { K as KeyboardKeyCode } from './index-968a240f.js';
-import { a as getElementTree, h as handleKeyboardSubmit, b as getClickedElement } from './utils-ccb4d66f.js';
-import './breakpoints-c386984e.js';
-
-const stylesCss = ":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}}";
-
-const ZMenuDropdown = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ismenuopen = false;
-    this.handleToggle = this.handleToggle.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
-  }
-  componentWillRender() {
-    this.linkarray = typeof this.menucontent === "string" ? JSON.parse(this.menucontent) : this.menucontent;
-  }
-  renderMenuOpen() {
-    if (this.ismenuopen) {
-      return (h("ul", null, this.linkarray.map((bean) => (h("li", null, h("z-link", { htmlid: bean.id, href: bean.link, icon: bean.icon }, bean.label))))));
-    }
-  }
-  renderButtonMenu() {
-    return (h("span", { class: "arrow" }, h("z-icon", { name: "caret-down", width: 14, height: 14 })));
-  }
-  retriveMenuClass() {
-    if (this.ismenuopen) {
-      return "menu-opened";
-    }
-  }
-  handleToggle() {
-    this.ismenuopen = !this.ismenuopen;
-  }
-  handleFocus(e) {
-    if (e instanceof KeyboardEvent && e.keyCode !== KeyboardKeyCode.TAB) {
-      return;
-    }
-    const tree = getElementTree(getClickedElement());
-    const menuParent = tree.find((elem) => elem.nodeName.toLowerCase() === "z-menu-dropdown");
-    if (!menuParent) {
-      document.removeEventListener("click", this.handleFocus);
-      document.removeEventListener("keyup", this.handleFocus);
-      this.ismenuopen = false;
-    }
-  }
-  render() {
-    return (h("a", { class: this.retriveMenuClass(), role: "button", tabindex: "0", onFocus: () => {
-        document.addEventListener("click", this.handleFocus);
-        document.addEventListener("keyup", this.handleFocus);
-      }, onKeyUp: (e) => handleKeyboardSubmit(e, this.handleToggle) }, h("div", { class: "container", onClick: () => this.handleToggle() }, h("span", { class: "user-wrapper" }, h("z-icon", { name: "user-avatar", width: 14, height: 14 }), h("span", { class: "user" }, this.nomeutente)), this.renderButtonMenu()), this.renderMenuOpen()));
-  }
-};
-ZMenuDropdown.style = stylesCss;
-
-export { ZMenuDropdown as z_menu_dropdown };

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

@@ -1,80 +0,0 @@
-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-968a240f.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)}}";
-
-const ZModalLogin = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.loginSubmit = createEvent(this, "loginSubmit", 7);
-    this.statusUpdate = createEvent(this, "statusUpdate", 7);
-    this.signupClick = createEvent(this, "signupClick", 7);
-    this.zainoDigitaleClick = createEvent(this, "zainoDigitaleClick", 7);
-    /** Login modal title */
-    this.heading = "Entra in MyZanichelli";
-    this.externalProviderCheck = false;
-  }
-  componentDidLoad() {
-    this.externalProviderCheck = !!this.hostElement.querySelectorAll('[slot="provider"]').length;
-  }
-  emitLoginSubmit() {
-    const usernameInput = this.hostElement.querySelector("z-input#username");
-    const passwordInput = this.hostElement.querySelector("z-input#password");
-    // INFO: slotted inputs
-    if (!usernameInput || !passwordInput) {
-      return;
-    }
-    let username = usernameInput.value;
-    const password = passwordInput.value;
-    if (!username || !password) {
-      this.status = InputStatus.ERROR;
-      return;
-    }
-    username = this.cleanUsername(username);
-    this.loginSubmit.emit({
-      username,
-      password,
-      originalUsername: usernameInput.value,
-    });
-  }
-  emitStatusUpdate(status) {
-    this.statusUpdate.emit(status);
-  }
-  emitSignupClick() {
-    this.signupClick.emit();
-  }
-  emitZainoDigitaleClick() {
-    this.zainoDigitaleClick.emit();
-  }
-  handleInputKeyUp(e) {
-    if (e.code !== "Enter") {
-      return;
-    }
-    this.emitLoginSubmit();
-  }
-  handleInputChange() {
-    this.status = null;
-    this.emitStatusUpdate(this.status);
-  }
-  cleanUsername(username) {
-    username = username.trim().toLowerCase();
-    const mobileRegex = /^[+]?[\s./0-9]*[(]?[0-9]{1,4}[)]?[(]?[0-9]{1,4}[)]?[-\s./0-9]*$/g;
-    if (mobileRegex.test(username)) {
-      username = username.replace(/[- .)(]/g, "");
-      if (/^[\d ]*$/.test(username)) {
-        username = "+39" + username;
-      }
-    }
-    return username;
-  }
-  renderZainoDigitaleButton() {
-    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: 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); }
-};
-ZModalLogin.style = stylesCss;
-
-export { ZModalLogin as z_modal_login };

package/dist/esm/z-user-dropdown.entry.js

@@ -1,89 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-a2ca4b97.js';
-import { m as mobileBreakpoint } from './breakpoints-c386984e.js';
-
-const stylesCss = ":host{background-color:var(--gray900)}:host(.inverse){background-color:var(--color-white)}button{display:flex;width:100%;flex-direction:column;padding:0;border:none;margin:0;background-color:var(--gray900);cursor:pointer;letter-spacing:0.16px;white-space:nowrap}button.inverse{background-color:var(--color-white)}button div.firstline{display:flex;max-width:200px;align-items:center;justify-content:flex-end}button.open div.firstline{max-width:none}z-icon{padding:0 2px;fill:var(--color-white)}z-icon.inverse{fill:var(--gray900)}ul{position:absolute;left:0;width:100%;box-sizing:border-box;padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 2) 0 calc(var(--space-unit) * 2);margin:calc(var(--space-unit) * 1.5) 0 0 0;background-color:var(--gray900);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.3px;line-height:20px}ul.inverse{background-color:var(--color-white)}ul>li{display:flex;justify-content:flex-end;padding:calc(var(--space-unit) * 1.5 - 1px) 0;border-bottom:var(--border-base) solid var(--gray700);margin:0;white-space:nowrap}ul>li.inverse{border-bottom-color:var(--gray400)}ul>li:first-child{flex-direction:column;align-items:end;padding-top:0;padding-bottom:calc(var(--space-unit) + 6px);border-top:none}ul>li:last-child{border-bottom:none;margin-bottom:0}#guestbutton{display:inline-flex;width:100%;min-width:32px;height:32px;box-sizing:border-box;flex-direction:row;align-items:center;justify-content:center;padding:0 calc(var(--space-unit) * 2);border-width:var(--border-size-medium);border-style:solid;border-color:var(--color-white);background-color:var(--color-white);border-radius:var(--border-radius);color:var(--gray800);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.3px;line-height:1;outline:none;text-decoration:none;text-transform:uppercase;vertical-align:middle}#guestbutton.inverse{border-color:var(--gray800);background-color:var(--gray800);color:var(--color-white)}.userfullname{overflow:hidden;width:100%;max-width:250px;padding:0;color:var(--color-white);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-sb);letter-spacing:0;line-height:24px;text-align:right;text-overflow:ellipsis}.userfullname.inverse{color:var(--gray800)}.useremail{overflow:hidden;width:100%;color:var(--color-white);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-rg);letter-spacing:0.32px;line-height:16px;text-align:right;text-overflow:ellipsis}.useremail.inverse{color:var(--gray800)}@media only screen and (min-width: 768px){:host{height:calc(var(--space-unit) * 4);background-color:var(--gray900)}:host(.inverse){background-color:var(--color-white)}:host>div{position:relative;top:50%;transform:translateY(-50%)}:host>div.open{top:auto;transform:none}:host>div>div{padding:0}:host>div>div.open{position:absolute;right:calc(var(--space-unit) * -1);padding:calc(var(--space-unit) / 2 + 1px) var(--space-unit) 0 var(--space-unit);margin-top:calc(var(--space-unit) / 2);background-color:var(--color-white);box-shadow:0 2px calc(var(--space-unit) * 0.5) 0 rgb(0 0 0 / 50%);transform:translate(0, -4px)}:host>div>div.inverse.open{background-color:var(--gray800)}button{display:flex;flex-flow:row nowrap;align-content:center;align-items:end;justify-content:flex-end}button.open{max-width:initial;padding-right:var(--space-unit);border-top:var(--border-size-small) solid var(--color-white);margin-left:var(--space-unit);background-color:var(--color-white);border-top-left-radius:calc(var(--space-unit) * 0.5);border-top-right-radius:calc(var(--space-unit) * 0.5)}button.open.inverse{border-top-color:var(--gray800);background-color:var(--gray800)}button:not(.open) z-icon{fill:var(--color-white)}button:not(.open) z-icon.inverse{fill:var(--gray800)}button.open z-icon{fill:var(--gray800)}button.open z-icon.inverse{fill:var(--color-white)}.userfullname{width:auto;padding:0 calc(var(--space-unit) - 6px) 0 calc(var(--space-unit) - 2px);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:20px}.userfullname.inverse{color:var(--gray800)}button.open div.userfullname{max-width:none;color:var(--gray800);text-overflow:clip}button.open div.userfullname.inverse{color:var(--color-white)}.useremail{box-sizing:border-box;padding-right:calc(var(--space-unit) * 3 - 2px)}button.open div.useremail{color:var(--gray800)}button.open div.useremail.inverse{color:var(--color-white)}ul{position:initial;left:initial;width:100%;padding:0;background-color:var(--color-white)}ul.inverse{border-bottom-color:var(--gray800);background-color:var(--gray800)}ul>li{border-bottom:var(--border-base) solid var(--gray400);margin:0 var(--space-unit);color:var(--gray800)}ul>li.inverse{color:var(--color-white)}ul>li:first-child{padding-top:calc(var(--space-unit) + 3px);padding-bottom:calc(var(--space-unit) + 5px);border-top:var(--border-base) solid var(--gray400)}}";
-
-const ZUserDropdown = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.userButtonClick = createEvent(this, "userButtonClick", 7);
-    this.dropdownMenuLinkClick = createEvent(this, "dropdownMenuLinkClick", 7);
-    /** if inner components colors are inverted, or not, default false */
-    this.useInverseColors = false;
-    this.isMenuOpen = false;
-    this.handleLoggedButtonClick = this.handleLoggedButtonClick.bind(this);
-    this.emitDropdownMenuLinkClick = this.emitDropdownMenuLinkClick.bind(this);
-  }
-  componentDidLoad() {
-    this.setMobileAndDivToResizeWidth();
-  }
-  componentWillUpdate() {
-    this.setMobileAndDivToResizeWidth();
-  }
-  componentWillRender() {
-    if (this.menuContent) {
-      this.linkArray = typeof this.menuContent === "string" ? JSON.parse(this.menuContent) : this.menuContent;
-    }
-  }
-  setMobileAndDivToResizeWidth() {
-    var _a;
-    if (this.divToResize) {
-      this.isMobile = window.screen.width <= mobileBreakpoint || window.innerWidth <= mobileBreakpoint;
-      if (this.logged && !this.isMobile && this.isMenuOpen) {
-        this.divToResize.style.width = `${(_a = this.userButton) === null || _a === void 0 ? void 0 : _a.offsetWidth}px`;
-      }
-      else {
-        this.divToResize.removeAttribute("style");
-      }
-    }
-  }
-  emitUserButtonClick() {
-    this.userButtonClick.emit(this.isMenuOpen);
-  }
-  emitDropdownMenuLinkClick(e) {
-    this.isMenuOpen = false;
-    this.dropdownMenuLinkClick.emit({ e, linkId: e.detail.linkId });
-  }
-  handleResize() {
-    this.isMobile = window.innerWidth <= mobileBreakpoint;
-  }
-  handleOrientationChange() {
-    this.isMobile = screen.width <= mobileBreakpoint;
-  }
-  handleClickOutside(e) {
-    if (e.target.nodeName !== "Z-USER-DROPDOWN") {
-      this.isMenuOpen = false;
-    }
-  }
-  handleLoggedButtonClick() {
-    this.isMenuOpen = !this.isMenuOpen;
-    this.emitUserButtonClick();
-  }
-  renderGuestButton() {
-    return (h("button", { id: "guestbutton", class: this.useInverseColors ? "inverse" : "", onClick: () => this.emitUserButtonClick() }, "ENTRA"));
-  }
-  renderLoggedButton() {
-    const direction = this.isMenuOpen ? "up" : "down";
-    const colorClass = this.useInverseColors ? "inverse" : "";
-    return (h("button", { ref: (el) => (this.userButton = el), title: this.userFullName, class: `${colorClass} ${this.isMenuOpen ? "open" : ""}`, onClick: this.handleLoggedButtonClick }, h("div", null, h("div", { class: "firstline" }, h("z-icon", { class: colorClass, name: "user-avatar-filled", height: 16, width: 16 }), !this.isMobile && h("div", { class: `userfullname ${colorClass}` }, this.userFullName), h("z-icon", { class: colorClass, name: `caret-${direction}-filled`, height: 16, width: 16 })), !this.isMobile && this.isMenuOpen && h("div", { class: `useremail ${colorClass}` }, this.userEmail))));
-  }
-  getZLinkTextcolor() {
-    if (this.isMobile) {
-      return this.useInverseColors ? "black" : "white";
-    }
-    return this.useInverseColors ? "white" : "black";
-  }
-  renderDropdownMenu() {
-    const colorClass = this.useInverseColors ? "inverse" : "";
-    return (this.isMenuOpen && (h("ul", { class: colorClass }, this.isMobile && (h("li", { class: colorClass }, h("div", { class: `userfullname ${colorClass}` }, this.userFullName), h("div", { class: `useremail ${colorClass}` }, this.userEmail))), this.linkArray &&
-      this.linkArray.map((link) => (h("li", { id: link.id, class: colorClass }, h("z-link", { textcolor: this.getZLinkTextcolor(), href: link.link, htmlid: link.id, target: link.target, icon: link.icon, onZLinkClick: this.emitDropdownMenuLinkClick }, link.label)))))));
-  }
-  render() {
-    const openClass = `${this.logged && this.isMenuOpen ? "open" : ""}`;
-    const colorClass = this.useInverseColors ? "inverse" : "";
-    return (h(Host, { class: colorClass }, h("div", { ref: (el) => (this.divToResize = el), class: openClass }, h("div", { class: `${colorClass} ${openClass}` }, this.logged ? this.renderLoggedButton() : this.renderGuestButton(), this.logged && this.renderDropdownMenu()))));
-  }
-};
-ZUserDropdown.style = stylesCss;
-
-export { ZUserDropdown as z_user_dropdown };