@zanichelli/delta_share 2.0.3 → 2.0.6

package/dist/wc/esm/z-divider.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host } from './index-5ecd661f.js';
-import { D as DividerSize, d as DividerOrientation } from './index-e68ea3a2.js';
+import { r as registerInstance, h, H as Host } from './index-b3a91e19.js';
+import { k as DividerSize, c as DividerOrientation } from './index-654849a7.js';
 
 const stylesCss = ".sc-z-divider-h{display:block;padding:0;margin:0}.divider-horizontal.sc-z-divider-h{width:100%}.divider-vertical.sc-z-divider-h{height:100%}.divider-small.divider-horizontal.sc-z-divider-h{height:var(--border-size-small)}.divider-medium.divider-horizontal.sc-z-divider-h{height:var(--border-size-medium)}.divider-large.divider-horizontal.sc-z-divider-h{height:var(--border-size-large)}.divider-small.divider-vertical.sc-z-divider-h{width:var(--border-size-small)}.divider-medium.divider-vertical.sc-z-divider-h{width:var(--border-size-medium)}.divider-large.divider-vertical.sc-z-divider-h{width:var(--border-size-large)}";
 

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

@@ -0,0 +1,43 @@
+import { r as registerInstance, c as createEvent, h } from './index-b3a91e19.js';
+
+const stylesCss = ".sc-z-dragdrop-area-h{font-family:var(--font-family-sans);font-weight:var(--font-rg);margin-top:calc(var(--space-unit) * 3)}.sc-z-dragdrop-area-h>.dragdrop.sc-z-dragdrop-area{display:flex;color:var(--color-text01);flex-direction:column;position:relative;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;border-color:var(--color-surface04);height:228px;background-color:var(--color-surface02)}.sc-z-dragdrop-area-h>.dragdrop.dragover.sc-z-dragdrop-area *.sc-z-dragdrop-area{pointer-events:none}.sc-z-dragdrop-area-h>.dragdrop.sc-z-dragdrop-area .dragover-container.sc-z-dragdrop-area{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;display:none;background-color:var(--color-primary03);box-shadow:var(--shadow-focus-primary)}.sc-z-dragdrop-area-h>.dragdrop.sc-z-dragdrop-area .dragover-container.sc-z-dragdrop-area .dragover-message.sc-z-dragdrop-area{background-color:var(--color-link-primary);color:var(--color-text04);padding:10px 28px}.sc-z-dragdrop-area-h>.dragdrop.dragover.sc-z-dragdrop-area .dragover-container.sc-z-dragdrop-area{display:flex;justify-content:center;align-items: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");
+      }, onDragEnd: () => { }, 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);
+    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/wc/esm/z-file-upload.entry.js

@@ -0,0 +1,168 @@
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-b3a91e19.js';
+import { j as ZFileUploadTypeEnum, D as DeviceEnum, k as DividerSize } from './index-654849a7.js';
+import { g as getDevice } from './utils-417652d9.js';
+import './breakpoints-e07f80e7.js';
+
+const stylesCss = ".sc-z-file-upload-h{font-family:var(--font-family-sans);font-weight:var(--font-rg);color:var(--color-text01)}.sc-z-file-upload-h>.container.sc-z-file-upload{display:flex;flex-direction:column}.sc-z-file-upload-h .modalWrapper.sc-z-file-upload{display:flex;justify-content:center;align-items:center}.sc-z-file-upload-h .modalWrapper.sc-z-file-upload>.files.sc-z-file-upload{margin:calc(var(--space-unit) * 4);display:flex;flex-direction:column;gap:var(--space-unit)}.sc-z-file-upload-h .text-container.sc-z-file-upload{display:flex;flex-direction:column;margin:auto}.sc-z-file-upload-h .text-container.sc-z-file-upload z-body.sc-z-file-upload{text-align:center}.sc-z-file-upload-h .text-container.sc-z-file-upload .upload-link.sc-z-file-upload{color:var(--color-link-primary);cursor:pointer}.sc-z-file-upload-h .text-container.sc-z-file-upload .upload-link-text.sc-z-file-upload{margin-bottom:var(--space-unit)}input#fileElem.sc-z-file-upload{display:none}#title.sc-z-file-upload{display:inline-block;margin-bottom:var(--space-unit)}.sc-z-file-upload-h>.container.sc-z-file-upload>z-button-deprecated.sc-z-file-upload{display:inline-block;margin-top:calc(var(--space-unit) * 3)}.sc-z-file-upload-h>.container.sc-z-file-upload>.files-container.sc-z-file-upload>z-heading.sc-z-file-upload{display:inline-block;margin:calc(var(--space-unit) * 3) 0}.sc-z-file-upload-h>.container.sc-z-file-upload>.files-container.sc-z-file-upload>.files.sc-z-file-upload{display:flex;flex-wrap:wrap;row-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2)}.sc-z-file-upload-h>.container.sc-z-file-upload>.files-container.sc-z-file-upload>z-divider.sc-z-file-upload{margin-top:calc(var(--space-unit) * 3);margin-bottom:0}@media only screen and (min-width: 768px){.sc-z-file-upload-h>.container.sc-z-file-upload>z-button-deprecated.sc-z-file-upload{align-self:flex-start}}";
+
+const ZFileUpload = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.fileInput = createEvent(this, "fileInput", 7);
+    /** Prop indicating the file upload type - can be default or dragdrop */
+    this.type = ZFileUploadTypeEnum.default;
+    /** Number of files added by the user */
+    this.filesNumber = 0;
+    this.inputAttributes = {
+      type: "file",
+      id: "fileElem",
+      multiple: true,
+    };
+  }
+  /** Listen removeFile event sent from z-file component */
+  removeFileListener() {
+    this.filesNumber--;
+  }
+  /** Listen fileDropped event sent from z-dragdrop-area component */
+  fileDroppedListener(e) {
+    this.input.files = e.detail;
+    this.fileInputHandler();
+  }
+  componentDidUpdate() {
+    this.handleAccessibility();
+    this.invalidFiles.size && this.errorModal.focus();
+  }
+  componentWillLoad() {
+    this.invalidFiles = new Map();
+    if (this.type === ZFileUploadTypeEnum.dragdrop &&
+      getDevice() !== DeviceEnum.desktop)
+      this.type = ZFileUploadTypeEnum.default;
+  }
+  fileInputHandler() {
+    if (this.input.files.length) {
+      this.invalidFiles = this.checkFiles(Array.from(this.input.files));
+    }
+  }
+  handleAccessibility() {
+    if (this.filesNumber > 0) {
+      this.el.querySelector("z-file:last-child z-chip button").focus();
+    }
+    else {
+      this.type === ZFileUploadTypeEnum.default
+        ? this.button.shadowRoot.querySelector("button").focus()
+        : this.uploadLink.focus();
+    }
+  }
+  checkFiles(files) {
+    let errors = new Map();
+    const sizeErrorString = `supera i ${this.fileMaxSize}MB`;
+    const formatErrorString = " ha un'estensione non prevista";
+    files.forEach((file) => {
+      const fileSize = file.size / 1024 / 1024;
+      const fileFormatOk = this.acceptedFormat
+        .split(",")
+        .some((ext) => file.name.toLowerCase().endsWith(ext.trim()));
+      const fileSizeOk = fileSize <= this.fileMaxSize;
+      if (fileSizeOk && fileFormatOk) {
+        this.fileInput.emit(file);
+        this.filesNumber++;
+        this.input.value = "";
+        return;
+      }
+      errors.set(file.name, []);
+      if (!fileSizeOk) {
+        errors.get(file.name).push(sizeErrorString);
+      }
+      if (!fileFormatOk) {
+        errors.get(file.name).push(formatErrorString);
+      }
+    });
+    return errors;
+  }
+  renderTitle() {
+    return (h("z-heading", { id: "title", variant: "semibold", level: 2 }, this.mainTitle));
+  }
+  renderDescription(variant, level) {
+    return (h("z-body", { variant: variant, level: level }, this.description));
+  }
+  renderAllowedFileExtensions() {
+    let fileFormatString = "";
+    let fileWeightString = "";
+    if (this.acceptedFormat) {
+      const fileFormat = this.acceptedFormat
+        .split(", ")
+        .map((string) => string.substring(1).toUpperCase())
+        .join(", ");
+      fileFormatString = ` nei formati ${fileFormat}`;
+    }
+    if (this.fileMaxSize) {
+      fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;
+    }
+    const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;
+    return (h("z-body", { level: 3 }, fileFormatString || fileWeightString ? finalString : null));
+  }
+  renderFileSection() {
+    return (this.filesNumber > 0 && (h("section", { class: "files-container" }, h("z-heading", { variant: "semibold", level: 4 }, "File appena caricati"), h("div", { class: "files" }, h("slot", { name: "files" })), h("z-divider", { size: DividerSize.medium }))));
+  }
+  renderInput() {
+    return (h("input", Object.assign({}, this.inputAttributes, { onChange: () => this.fileInputHandler(), accept: this.acceptedFormat, ref: (val) => (this.input = val) })));
+  }
+  renderUploadButton() {
+    return [
+      this.renderInput(),
+      h("z-button-deprecated", { onClick: () => this.input.click(), onKeyPress: (e) => {
+          if (e.code == "Space" || e.code == "Enter") {
+            e.preventDefault();
+            this.input.click();
+          }
+        }, id: "fileSelect", variant: this.buttonVariant, icon: "upload", ref: (val) => (this.button = val) }, "Allega"),
+    ];
+  }
+  renderUploadLink() {
+    return [
+      this.renderInput(),
+      h("z-body", { class: "upload-link-text", variant: "regular", level: 1 }, "Trascinalo qui o", " ", h("z-body", { tabIndex: 0, class: "upload-link", onClick: () => this.input.click(), onKeyPress: (e) => {
+          if (e.code == "Space" || e.code == "Enter") {
+            e.preventDefault();
+            this.input.click();
+          }
+        }, variant: "semibold", level: 1, ref: (val) => (this.uploadLink = val) }, "caricalo"), " ", "dal tuo computer"),
+    ];
+  }
+  renderDefaultMode() {
+    return [
+      this.renderDescription("semibold", 3),
+      this.renderAllowedFileExtensions(),
+      this.renderFileSection(),
+      this.renderUploadButton(),
+    ];
+  }
+  renderDragDropMode() {
+    return [
+      this.renderFileSection(),
+      h("z-dragdrop-area", null, h("div", { class: "text-container" }, this.renderDescription("regular", 1), this.renderUploadLink(), this.renderAllowedFileExtensions())),
+    ];
+  }
+  formatErrorString(key, value) {
+    var _a, _b;
+    const bothErrors = value[0] && value[1] ? ", " : "";
+    return `Il file ${key} ${(_a = value[0]) !== null && _a !== void 0 ? _a : ""}${bothErrors} ${(_b = value[1]) !== null && _b !== void 0 ? _b : ""} e non può quindi essere caricato.`;
+  }
+  handleErrorModalContent() {
+    return (h("div", { slot: "modalContent" }, h("div", { class: "modalWrapper" }, h("div", { class: "files" }, Array.from(this.invalidFiles).map(([key, value]) => {
+      return (h("z-body", { variant: "regular", level: 3 }, this.formatErrorString(key, value)));
+    })))));
+  }
+  render() {
+    return [
+      h("div", { tabIndex: 0, class: `container ${this.type}` }, this.renderTitle(), this.type == ZFileUploadTypeEnum.default
+        ? this.renderDefaultMode()
+        : this.renderDragDropMode()),
+      !!this.invalidFiles.size && (h("z-modal", { tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: "Attenzione", onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent())),
+    ];
+  }
+  get el() { return getElement(this); }
+};
+ZFileUpload.style = stylesCss;
+
+export { ZFileUpload as z_file_upload };

package/dist/wc/esm/z-file.entry.js

@@ -0,0 +1,43 @@
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-b3a91e19.js';
+import { h as ZChipType, i as TooltipPosition } from './index-654849a7.js';
+import { t as tabletBreakpoint } from './breakpoints-e07f80e7.js';
+
+const stylesCss = ".sc-z-file-h{font-family:var(--font-family-sans);font-weight:var(--font-rg);position:relative}.sc-z-file-h>z-tooltip.sc-z-file{z-index:10}.sc-z-file-h>z-tooltip.sc-z-file>.tootip-content.sc-z-file{white-space:nowrap}.sc-z-file-h>z-chip.sc-z-file span.sc-z-file{max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.33;letter-spacing:0.32px;display:block}";
+
+const ZFile = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.removeFile = createEvent(this, "removeFile", 7);
+    this.allowTooltip = false;
+    this.tooltipVisible = false;
+  }
+  removeFileHandler() {
+    this.removeFile.emit();
+    this.el.remove();
+  }
+  onMouseOver() {
+    this.tooltipVisible = true;
+  }
+  onMouseLeave() {
+    this.tooltipVisible = false;
+  }
+  onInteractiveIconClick() {
+    this.removeFileHandler();
+  }
+  componentDidLoad() {
+    var _a, _b;
+    if (this.elementHasEllipsis() && window.innerWidth > tabletBreakpoint)
+      this.allowTooltip = true;
+    (_b = (_a = this.icon) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.call(_a);
+  }
+  elementHasEllipsis() {
+    return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
+  }
+  render() {
+    return (h(Host, null, this.allowTooltip && (h("z-tooltip", { open: this.tooltipVisible, type: TooltipPosition.AUTO, "bind-to": `#chip-${this.fileNumber}` }, h("span", { class: "body-5 tootip-content" }, this.ellipsis.innerText))), h("z-chip", { id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.default }, h("span", { ref: (el) => (this.ellipsis = el), tabIndex: -1 }, h("slot", null)))));
+  }
+  get el() { return getElement(this); }
+};
+ZFile.style = stylesCss;
+
+export { ZFile as z_file };

package/dist/wc/esm/z-footer-link_3.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-5ecd661f.js';
+import { r as registerInstance, h } from './index-b3a91e19.js';
 
-const stylesCss$2 = ":host{font-family:var(--dashboard-font);font-weight:var(--font-rg)}:host>a{display:inline-block;color:var(--color-white);padding:calc(var(--space-unit) / 2 * 3) 0;border-bottom:1px solid var(--gray50);text-decoration:none;font-size:14px;width:100%}@media only screen and (min-width: 768px){:host a{font-size:12px;border-bottom:none;text-decoration:underline;padding:0;width:initial}}";
+const stylesCss$2 = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>a{display:inline-block;color:var(--color-white);padding:calc(var(--space-unit) / 2 * 3) 0;border-bottom:1px solid var(--gray50);text-decoration:none;font-size:14px;width:100%}@media only screen and (min-width: 768px){:host a{font-size:12px;border-bottom:none;text-decoration:underline;padding:0;width:initial}}";
 
 const ZFooterLink = class {
   constructor(hostRef) {
@@ -12,7 +12,7 @@ const ZFooterLink = class {
 };
 ZFooterLink.style = stylesCss$2;
 
-const stylesCss$1 = ":host{font-family:var(--dashboard-font);font-weight:var(--font-rg)}:host>nav{background-color:var(--bg-grey-900);display:flex;flex-direction:column;justify-items:flex-start;overflow:hidden;margin:calc(var(--space-unit) / 2) 0 calc(var(--space-unit) / 2) 0;padding:0}:host>nav>.header{position:relative;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;align-content:flex-start;margin:0 calc(var(--space-unit) * 4);height:calc(var(--space-unit) * 4);border-bottom:1px solid var(--gray50);line-height:1}:host>nav>.header>h2{color:var(--color-white);font-size:16px;margin:var(--space-unit) 0 var(--space-unit) 0}:host>nav>.header{fill:var(--color-white)}:host>nav>.header>button{position:absolute;top:var(--space-unit);right:0;margin:0;padding:0;background:transparent;border:0;appearance:none;cursor:pointer}:host>nav>.header>z-icon{display:block}:host>nav>.content{background-color:var(--text-grey-800);display:none;height:0;transition:0.3s ease;padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 4)}:host>nav>.content.show{display:block;height:auto;transition:0.3s ease}@media only screen and (min-width: 768px){:host>nav{display:grid;grid-template-columns:repeat(4, 1fr);grid-template-rows:1fr;grid-column-gap:var(--grid-tablet-margin);padding:calc(var(--space-unit) * 2) 0;border-bottom:1px solid var(--color-white);margin:0;background-color:var(--bg-grey-800)}:host>nav>.header>button.toggleButton{display:none}:host>nav>.header{border-bottom:none;padding:0;margin:0}:host>nav>.header>h2{border:none}:host>nav>.content,:host>nav>.content.show{grid-column:span 3;width:100%;padding:0;margin:0;display:grid;grid-template-columns:repeat(3, 1fr);grid-column-gap:var(--grid-tablet-margin);grid-row-gap:var(--space-unit);height:auto;align-items:stretch;align-content:stretch;margin:0}}@media only screen and (min-width: 1152px){:host>nav{display:grid;grid-template-columns:1fr;grid-template-rows:40px 4fr;padding:0;border-bottom:none}:host>nav>.header{position:relative;display:inline-flex;height:24px}:host>nav>.header>h2{width:auto;font-size:16px;line-height:1;font-weight:600;color:var(--gray50);padding:0 0 var(--space-unit);margin:0}:host>nav>.header::after{content:\"\";display:block;position:absolute;top:100%;left:0;width:120px;border-bottom:1px solid var(--gray50)}:host>nav>.content,:host>nav>.content.show{grid-column:auto;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:flex-start}}";
+const stylesCss$1 = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>nav{background-color:var(--gray900);display:flex;flex-direction:column;justify-items:flex-start;overflow:hidden;margin:calc(var(--space-unit) / 2) 0;padding:0}:host>nav>.header{position:relative;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;align-content:flex-start;height:calc(var(--space-unit) * 4);border-bottom:1px solid var(--gray50);line-height:1}:host>nav>.header>h2{color:var(--color-white);font-size:16px;margin:var(--space-unit) 0}:host>nav>.header{fill:var(--color-white)}:host>nav>.header>button{position:absolute;top:var(--space-unit);right:0;margin:0;padding:0;background:transparent;border:0;appearance:none;cursor:pointer}:host>nav>.header>z-icon{display:block}:host>nav>.content{background-color:var(--gray800);display:none;height:0;transition:0.3s ease;padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}:host>nav>.content.show{display:block;height:auto;transition:0.3s ease}@media only screen and (min-width: 768px){:host>nav{display:grid;grid-template-columns:repeat(4, 1fr);grid-template-rows:1fr;grid-column-gap:var(--grid-tablet-margin);padding:calc(var(--space-unit) * 2) 0;border-bottom:1px solid var(--color-white);margin:0;background-color:var(--gray800)}:host>nav>.header>button.toggleButton{display:none}:host>nav>.header{border-bottom:none;padding:0;margin:0}:host>nav>.header>h2{border:none}:host>nav>.content,:host>nav>.content.show{grid-column:span 3;width:100%;padding:0;margin:0;display:grid;grid-template-columns:repeat(3, 1fr);grid-column-gap:var(--grid-tablet-margin);grid-row-gap:var(--space-unit);height:auto;align-items:stretch;align-content:stretch;margin:0}}@media only screen and (min-width: 1152px){:host>nav{display:grid;grid-template-columns:1fr;grid-template-rows:40px 4fr;padding:0;border-bottom:none}:host>nav>.header{position:relative;display:inline-flex;height:24px}:host>nav>.header>h2{width:auto;font-size:16px;line-height:1;font-weight:600;color:var(--gray50);padding:0 0 var(--space-unit);margin:0}:host>nav>.header::after{content:\"\";display:block;position:absolute;top:100%;left:0;width:120px;border-bottom:1px solid var(--gray50)}:host>nav>.content,:host>nav>.content.show{grid-column:auto;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:flex-start}}";
 
 const ZFooterSection = class {
   constructor(hostRef) {
@@ -28,7 +28,7 @@ const ZFooterSection = class {
 };
 ZFooterSection.style = stylesCss$1;
 
-const stylesCss = ":host{font-family:var(--dashboard-font);font-weight:var(--font-rg)}:host>a>img{width:calc(var(--space-unit) * 3)}@media only screen and (min-width: 1152px){:host>a>img{width:16px}}";
+const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>a>img{width:calc(var(--space-unit) * 3)}@media only screen and (min-width: 1152px){:host>a>img{width:16px}}";
 
 const ZFooterSocial = class {
   constructor(hostRef) {

package/dist/wc/esm/z-footer.entry.js

@@ -1,22 +1,36 @@
-import { r as registerInstance, h } from './index-5ecd661f.js';
+import { r as registerInstance, c as createEvent, h } from './index-b3a91e19.js';
+import { B as ButtonVariantEnum, b as ButtonSizeEnum } from './index-654849a7.js';
 
-const stylesCss = ":host{width:100%}footer{width:auto;height:auto;box-sizing:border-box;font-family:var(--dashboard-font);font-size:13px;padding:var(--space-unit) 0 var(--space-unit) 0;background-color:var(--bg-grey-900);color:var(--gray50)}footer *{box-sizing:border-box}footer>section{display:grid}footer>section.bottom{display:grid;grid-template-columns:1fr;width:auto;height:auto;margin:0;padding:0;white-space:pre-line;font-size:12px}footer>section.bottom>div.item{display:flex;flex-direction:column;align-items:flex-start;grid-column:span 1;height:auto;width:auto;padding:calc(var(--space-unit) * 2) 0;margin:0 calc(var(--space-unit) * 3)}footer>section.bottom>div.item:nth-child(1){order:2}footer>section.bottom>div.item:nth-child(2){order:1;border-bottom:1px solid var(--gray50)}footer>section.bottom>div.item>div.social{display:grid;grid-template-columns:repeat(5, 1fr);grid-template-rows:repeat(auto-fill, 24px);column-gap:12px;padding:0;margin-bottom:0px}footer>section.bottom>div.bottom-links{display:none}footer>section.bottom>div.item>p{margin:var(--space-unit) 0;padding:var(--space-unit) 0}footer>section.bottom>div.item>p:first-child{margin-top:0}footer>section.bottom>div.item>p:last-child{margin-bottom:0}footer>section.bottom>div.logo>p>span{display:block}@media only screen and (min-width: 768px){footer{padding:0}footer>section.top{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);background-color:var(--text-grey-800)}footer>section.top>z-footer-section:last-child{display:none}footer>section.bottom{grid-template-columns:repeat(4, 1fr);grid-column-gap:var(--grid-tablet-margin);background-color:var(--bg-grey-900);padding:0 calc(var(--space-unit) * 4)}footer>section.bottom>div.item{margin:0}footer>section.bottom>div.item:nth-child(1){order:1}footer>section.bottom>div.item:nth-child(2){order:2;border-bottom:none}footer>section.bottom>div.item>p{padding-top:0}footer>section.bottom>div.logo>z-logo{width:auto;height:39px}footer>section.bottom>div.bottom-links{display:block;grid-column:span 2;order:3}footer>section.bottom>div.bottom-links{display:grid;grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(auto-fill, 24px);grid-column-gap:var(--grid-tablet-margin);font-size:12px}}@media only screen and (min-width: 1152px){footer>section.top{grid-template-columns:repeat(6, 1fr);grid-column-gap:var(--grid-desktop-margin);width:100%;padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 4)}footer>section.bottom{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4)}footer>section.bottom>div.item:nth-child(1)>p:nth-of-type(2){font-size:10px}footer>section.bottom>div.item>p{padding-bottom:0;margin-bottom:calc(var(--space-unit) * 2)}footer>section.bottom>div.item>div.social{margin-top:0}footer>section.bottom>div.bottom-links{padding:calc(var(--space-unit) * 2) 0 0 0}footer>section.bottom>div.bottom-links{grid-template-columns:repeat(3, 1fr);grid-column-gap:var(--grid-desktop-margin);margin:0}}";
+const stylesCss = ":host{width:100%}footer{width:auto;height:auto;box-sizing:border-box;font-family:var(--font-family-sans);font-size:13px;padding:var(--space-unit) 0;background-color:var(--gray900);color:var(--gray50)}footer *{box-sizing:border-box}footer>section>div{display:grid}#top{padding:0 calc(var(--space-unit) * 2)}#bottom{width:auto;height:auto;margin:0;padding:0 calc(var(--space-unit) * 2);white-space:pre-line;font-size:12px}#bottom>div{display:grid;grid-template-columns:1fr}#bottom>div>div.item{display:flex;flex-direction:column;align-items:flex-start;grid-column:span 1;height:auto;width:auto;padding:calc(var(--space-unit) * 2) 0}#bottom>div>div.item:nth-child(1){order:2}#bottom>div>div.item:nth-child(2){order:1;border-bottom:1px solid var(--gray50)}#bottom>div>div.item>div.social{display:grid;grid-template-columns:repeat(5, 1fr);grid-template-rows:repeat(auto-fill, 24px);column-gap:12px;padding:0;margin-bottom:0px}#bottom>div>div.bottom-links{display:none}#bottom>div>div.item>p{margin:var(--space-unit) 0;padding:var(--space-unit) 0}#bottom>div>div.item>p:first-child{margin-top:0}#bottom>div>div.item>p:last-child{margin-bottom:0}#bottom>div>div.logo>p>span{display:block}#extension{padding:0 calc(var(--space-unit) * 2)}#extension>div{display:grid;grid-template-columns:1fr;grid-row-gap:var(--space-unit);align-items:center}#extension z-divider{margin-top:var(--space-unit)}#extension z-button-deprecated{margin-left:var(--space-unit)}div.limited-width{margin:auto;max-width:var(--mw)}@media only screen and (min-width: 768px){footer{padding:0}#top{background-color:var(--gray800);padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3)}#top z-footer-section:last-child{display:none}#bottom{background-color:var(--gray900);padding:0 calc(var(--space-unit) * 3)}#bottom>div{grid-template-columns:repeat(4, 1fr);grid-column-gap:var(--grid-tablet-margin)}#bottom>div>div.item{margin:0}#bottom>div>div.item:nth-child(1){order:1}#bottom>div>div.item:nth-child(2){order:2;border-bottom:none}#bottom>div>div.item>p{padding-top:0}#bottom>div>div.logo>z-logo{width:auto;height:39px}#bottom>div>div.bottom-links{display:block;grid-column:span 2;order:3}#bottom>div>div.bottom-links{display:grid;grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(auto-fill, 24px);grid-column-gap:var(--grid-tablet-margin);font-size:12px}#extension{margin:auto;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3) 0;background-color:var(--gray800);color:white;grid-template-columns:1fr 1fr}#extension>div>div{text-align:end}#extension z-divider{grid-column:1 / span 2}}@media only screen and (min-width: 1152px){#top{width:100%}#top>div{grid-template-columns:repeat(6, 1fr);grid-column-gap:var(--grid-desktop-margin)}#bottom>div>div.item:nth-child(1)>p:nth-of-type(2){font-size:10px}#bottom>div>div.item>p{padding-bottom:0;margin-bottom:calc(var(--space-unit) * 2)}#bottom>div>div.item>div.social{margin-top:0}#bottom>div>div.bottom-links{padding:calc(var(--space-unit) * 2) 0 0 0}#bottom>div>div.bottom-links{grid-template-columns:repeat(3, 1fr);grid-column-gap:var(--grid-desktop-margin);margin:0}}@media only screen and (min-width: 1366px){#top{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4)}#bottom{padding:0 calc(var(--space-unit) * 4)}#extension{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4) 0}}";
 
 const ZFooter = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.creditsLinkClick = createEvent(this, "creditsLinkClick", 7);
+    this.reportAProblemButtonClick = createEvent(this, "reportAProblemButtonClick", 7);
+    this.creditsLinkId = "creditsLinkId";
+    this.emitReportAProblemButtonClick =
+      this.emitReportAProblemButtonClick.bind(this);
   }
   componentWillLoad() {
     if (this.data) {
       console.warn("z-footer: `data` prop is deprecated and will be removed in a future version. Use slots instead.");
       this.jsonData = JSON.parse(this.data);
     }
-    if (this.copyrightuser) {
-      console.warn("z-footer: `copyrightuser` prop is deprecated and will be removed in a future version.");
+  }
+  zLinkClickListener(e) {
+    if (e.detail.linkId === this.creditsLinkId) {
+      this.emitCreditsLinkClick();
     }
   }
+  emitCreditsLinkClick() {
+    this.creditsLinkClick.emit();
+  }
+  emitReportAProblemButtonClick() {
+    this.reportAProblemButtonClick.emit();
+  }
   renderZLogo() {
-    return (h("z-logo", { link: "https://www.zanichelli.it", width: 144, height: 38, imagealt: "Home Zanichelli", targetblank: true }));
+    return (h("z-logo", { link: "https://www.zanichelli.it", width: 144, height: 38, imageAlt: "Home Zanichelli", targetBlank: true }));
   }
   renderAddress() {
     return (h("p", null, "Zanichelli editore S.p.A. via Irnerio 34, 40126 Bologna", h("br", null), "Fax 051 - 249.782 / 293.224 | Tel. 051 - 293.111 / 245.024", h("br", null), "Partita IVA 03978000374"));
@@ -34,10 +48,23 @@ const ZFooter = class {
     return (h("div", { class: "item bottom-links" }, h("slot", { name: "links" }), this.renderFooterBottomJsonData()));
   }
   renderFooterBottom() {
-    return (h("section", { class: "bottom" }, h("div", { class: "item logo" }, this.renderZLogo(), this.renderCopyright(), this.renderCertification()), h("div", { class: "item" }, this.renderAddress(), this.renderSocial()), this.renderBottomLinks()));
+    return (h("section", { id: "bottom" }, h("div", { class: { "limited-width": !!this.contentMaxWidth }, style: this.contentMaxWidth ? { "--mw": `${this.contentMaxWidth}px` } : {} }, h("div", { class: "item logo" }, this.renderZLogo(), this.renderCopyright(), this.renderCertification()), h("div", { class: "item" }, this.renderAddress(), this.renderSocial()), this.renderBottomLinks())));
   }
   renderFooterTop() {
-    return (h("section", { class: "top" }, h("slot", null), this.renderFooterTopJsonData()));
+    return (h("section", { id: "top" }, h("div", { class: { "limited-width": !!this.contentMaxWidth }, style: this.contentMaxWidth ? { "--mw": `${this.contentMaxWidth}px` } : {} }, h("slot", null), this.renderFooterTopJsonData())));
+  }
+  renderFooterProductInfo() {
+    var _a;
+    if (this.productName ||
+      this.productVersion ||
+      this.productCreditsLink != null ||
+      this.showReportAProblemButton) {
+      const versionString = `${this.productName ? " versione" : "Versione"} ${this.productVersion}`;
+      const creditsObject = (h("z-body", { level: 5 }, (this.productName || this.productVersion) && " - ", h("z-link", { htmlid: this.creditsLinkId, href: (_a = this.productCreditsLink) === null || _a === void 0 ? void 0 : _a.trim(), target: "_blank", textcolor: "white" }, "Credits")));
+      return (h("div", { id: "extension" }, h("div", { class: { "limited-width": !!this.contentMaxWidth }, style: this.contentMaxWidth
+          ? { "--mw": `${this.contentMaxWidth}px` }
+          : {} }, h("span", null, this.productName && (h("z-body", { level: 5, variant: "semibold" }, this.productName)), this.productVersion && (h("z-body", { level: 5 }, versionString)), this.productCreditsLink != null && creditsObject), this.showReportAProblemButton && (h("div", null, h("z-body", { level: 5 }, "Hai bisogno di aiuto?"), h("z-button-deprecated", { variant: ButtonVariantEnum["dark-bg"], size: ButtonSizeEnum.small, onClick: this.emitReportAProblemButtonClick }, "SEGNALA UN PROBLEMA"))), h("z-divider", { color: "gray500" }))));
+    }
   }
   // INFO: backward compatibility
   renderFooterTopJsonData() {
@@ -68,7 +95,7 @@ const ZFooter = class {
     return social.map((item) => (h("z-footer-social", { href: item.link, icon: item.icon, description: item.description })));
   }
   render() {
-    return (h("footer", null, this.renderFooterTop(), this.renderFooterBottom()));
+    return (h("footer", null, this.renderFooterProductInfo(), this.renderFooterTop(), this.renderFooterBottom()));
   }
 };
 ZFooter.style = stylesCss;

package/dist/wc/esm/z-ghost-loading.entry.js

@@ -0,0 +1,15 @@
+import { r as registerInstance, h, H as Host } from './index-b3a91e19.js';
+
+const stylesCss = ":host{display:inline-block;width:100%;height:100%;background:var(--bg-neutral-100);overflow:hidden;border-radius:4px;transform:translate3d(0, 0, 0)}:host::after{content:' ';display:block;width:100%;height:100%;box-shadow:#e8ebee20 0px 0px 1px;background-image:linear-gradient(\n        90deg,\n        var(--bg-neutral-100) 0%,\n        var(--bg-neutral-150) 95%,\n        var(--bg-neutral-100) 100%\n    );animation:progress 1.6s ease-in-out infinite}@keyframes progress{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}";
+
+const ZGhostLoading = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  render() {
+    return (h(Host, null));
+  }
+};
+ZGhostLoading.style = stylesCss;
+
+export { ZGhostLoading as z_ghost_loading };

package/dist/wc/esm/z-icon-package.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h } from './index-5ecd661f.js';
-import { i as icons } from './icons-973d360b.js';
+import { r as registerInstance, h } from './index-b3a91e19.js';
+import { i as icons } from './icons-74713b55.js';
 
 const stylesCss = ":host>div{display:flex;flex-flow:row wrap;justify-content:flex-start;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:12px}:host>div>div{width:300px;margin:5px}:host>div>div>label{margin:0 10px}";