@zanichelli/delta_share 3.0.2 → 3.2.0

package/dist/wc/cjs/z-table.cjs.entry.js

@@ -3,76 +3,54 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
-const index$1 = require('./index-1112cdb1.js');
-const breakpoints = require('./breakpoints-a55736d0.js');
+require('./index-f4792a6f.js');
+require('./index-db42857f.js');
+require('./index-044ebc8a.js');
+require('./index-4a04e2aa.js');
+require('./utils-8fd01df0.js');
+require('./index-c0af2262.js');
+require('./breakpoints-e7c8838e.js');
+require('./index-18a2a552.js');
+require('./index-05a1b9dc.js');
 
-const stylesCss = "z-table{display:block;width:100%;background-color:var(--color-white);font-family:var(--dashboard-font);font-weight:var(--font-rg);overflow-x:auto}z-table>div.table{display:table;width:100%;border-collapse:separate}z-table>div.table-bordered>z-table-body>z-table-row>z-table-cell:not(:last-child),z-table>div.table-bordered>z-table-head>z-table-header-row>z-table-header:not(:last-child){border-right:var(--border-size-small) solid var(--bg-grey-200)}z-table>div>z-table-body>z-table-row[expandable]>z-table-cell:first-child,z-table>div>z-table-head>z-table-header-row[expandable]>z-table-header:first-child{border-right:none}z-table>div>z-table-body>z-table-row[expanded]>z-table-cell{background-color:var(--gray50)}z-table>div>z-table-body>z-table-row[expanded]+z-table-expanded-row{border-bottom:1px solid var(--gray200)}z-table>div.table-column-sticky>z-table-body>z-table-row>z-table-cell:first-child,z-table>div.table-column-sticky>z-table-head>z-table-header-row>z-table-header:first-child{position:sticky;z-index:1;left:0;box-shadow:1px 0 4px -1px rgb(66 69 72 / 40%)}z-table>div.table-header-sticky>z-table-head>z-table-header-row>z-table-header{position:sticky;z-index:2;top:0;box-shadow:0 2px 3px -3px rgb(66 69 72 / 40%)}z-table>div.table-header-sticky>z-table-head>z-table-header-row>z-table-header:first-child,z-table>div.table-column-sticky>z-table-head>z-table-header-row>z-table-header:first-child{z-index:5}z-table-body{width:auto;background-color:var(--color-white)}z-table-empty-box{display:flex;flex-direction:column;flex-grow:1;border-bottom:var(--border-size-small) solid var(--bg-grey-200)}z-table-empty-box.bordered{border-left:var(--border-size-small) solid var(--bg-grey-200)}.error-message{margin-top:calc(var(--space-unit) * 2)}.table-content{display:flex;width:100%;flex-direction:row}.error-content{display:flex;padding:calc(var(--space-unit) * 3);font-family:var(--dashboard-font)}.error-content>img{width:244px;height:188px;margin-right:calc(var(--space-unit) * 3)}@media only screen and (max-width: 768px){z-table>div.table-empty{display:none}.error-content{display:flex;flex-direction:column}.error-content>img{width:auto;height:auto}.text{padding:calc(var(--space-unit) * 3) 0}}";
+const stylesCss = ":host{--z-table--cells-padding:calc(var(--space-unit) * 2);position:relative;display:block;overflow:auto;max-width:100%;box-sizing:border-box;background-color:var(--color-surface01)}:host([expandable]){--z-table--expand-button-size:40px}:host([bordered]){--z-table--cell-left-border:1px solid var(--color-surface03)}.table{min-width:max-content}";
 
 const ZTable = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.callToAction = index.createEvent(this, "callToAction", 7);
-    this.callToActionTwo = index.createEvent(this, "callToActionTwo", 7);
-    /** Error message */
-    this.errorMessage = "Siamo spiacenti, non siamo riusciti a caricare il contenuto richiesto";
-    /** Sets table with border */
+    /**
+     * Whether the table cells should show a border between them.
+     */
     this.bordered = false;
-    /** Sets first column sticky */
-    this.columnSticky = false;
-    /** Sets empty table */
-    this.empty = false;
-    /** Set error status */
-    this.error = false;
-    /** Sets header sticky */
-    this.headerSticky = false;
-    /** Set message */
-    this.message = "Siamo spiacenti, al momento non sono presenti dati da visualizzare";
-    /** Set subtitle */
-    this.subtitle = "";
+    /**
+     * Whether the table contains some expandable rows.
+     */
+    this.expandable = false;
   }
-  handleResize() {
-    this.isMobile = window.innerWidth <= breakpoints.mobileBreakpoint;
-  }
-  handleOrientationChange() {
-    this.isMobile = screen.width <= breakpoints.mobileBreakpoint;
+  updateExpandable() {
+    this.expandable = this.host.querySelectorAll("z-tr[expandable]").length > 0;
   }
+  /**
+   * Setup the table creating a mutation observer for the expandable attribute.
+   */
   componentWillLoad() {
-    var _a;
-    this.isMobile = window.innerWidth <= breakpoints.mobileBreakpoint;
-    const tableBody = this.host.querySelector('[slot="table-body"]');
-    this.hasTableBody = !!((_a = tableBody === null || tableBody === void 0 ? void 0 : tableBody.children) === null || _a === void 0 ? void 0 : _a.length);
-    if (!!tableBody && !this.hasTableBody) {
-      tableBody.remove();
-    }
-  }
-  componentWillRender() {
-    this.host.setAttribute("role", "table");
-  }
-  renderError(tableClass) {
-    const minHeight = this.lines ? `calc(40px * ${this.lines})` : "auto";
-    return (index.h(index.Host, null, index.h("div", { class: tableClass }, index.h("slot", { name: "table-header" })), index.h("z-table-error", null, index.h("div", { class: "error-content", style: { minHeight } }, index.h("slot", { name: "error-image" }), index.h("div", { class: "text" }, index.h("span", { class: "body-3-sb error-message" }, this.errorMessage), index.h("slot", { name: "error-action" }))))));
-  }
-  renderEmpty(tableClass) {
-    const buttonSize = this.isMobile ? index$1.ButtonSize.SMALL : index$1.ButtonSize.BIG;
-    const tableContentClass = `${this.hasTableBody ? "table-content" : ""}`;
-    if (this.hasTableBody) {
-      return (index.h(index.Host, null, index.h("div", { class: tableClass }, index.h("slot", { name: "table-header" }), index.h("div", { class: tableContentClass }, index.h("slot", { name: "table-body" }), index.h("z-table-empty-box", { class: this.bordered && "bordered", message: this.message, subtitle: this.subtitle }, !!this.callToActionLabel && (index.h("z-button", { slot: "cta1", variant: index$1.ButtonVariant.TERTIARY, onClick: () => this.callToAction.emit(), size: buttonSize }, this.callToActionLabel)), !!this.callToActionTwoLabel && (index.h("z-button", { slot: "cta2", variant: index$1.ButtonVariant.TERTIARY, onClick: () => this.callToActionTwo.emit(), size: buttonSize }, this.callToActionTwoLabel)))))));
-    }
-    return (index.h(index.Host, null, index.h("div", { class: tableClass }, index.h("slot", { name: "table-header" })), index.h("z-table-empty-box", { class: this.bordered && "bordered", message: this.message, subtitle: this.subtitle }, !!this.callToActionLabel && (index.h("z-button", { slot: "cta1", variant: index$1.ButtonVariant.TERTIARY, onClick: () => this.callToAction.emit(), size: buttonSize }, this.callToActionLabel)), !!this.callToActionTwoLabel && (index.h("z-button", { slot: "cta2", variant: index$1.ButtonVariant.TERTIARY, onClick: () => this.callToActionTwo.emit(), size: buttonSize }, this.callToActionTwoLabel)))));
+    this.expandableMutationObserver = new MutationObserver(() => {
+      this.updateExpandable();
+    });
+    this.expandableMutationObserver.observe(this.host, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: ["expandable"],
+      attributeOldValue: false,
+    });
+  }
+  disconnectedCallback() {
+    this.expandableMutationObserver.disconnect();
   }
   render() {
-    const tableClass = `table ${this.empty ? "table-empty" : ""} ${this.bordered ? "table-bordered" : ""}
-    ${this.columnSticky ? "table-column-sticky" : ""}
-    ${this.headerSticky ? "table-header-sticky" : ""}`;
-    if (this.error) {
-      return this.renderError(tableClass);
-    }
-    if (this.empty) {
-      return this.renderEmpty(tableClass);
-    }
-    return (index.h(index.Host, null, index.h("div", { class: tableClass }, index.h("slot", null)), index.h("slot", { name: "sticky-footer" })));
+    return (index.h(index.Host, { expandable: this.expandable }, index.h("div", { class: "table", role: "table" }, index.h("slot", null))));
   }
-  static get assetsDirs() { return ["assets"]; }
   get host() { return index.getElement(this); }
 };
 ZTable.style = stylesCss;

package/dist/wc/cjs/z-tbody.cjs.entry.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-db42857f.js');
+require('./index-9ca7d5e5.js');
+
+
+
+exports.z_tbody = index.ZTbody;

package/dist/wc/cjs/z-td.cjs.entry.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-18a2a552.js');
+require('./index-9ca7d5e5.js');
+require('./index-c0af2262.js');
+
+
+
+exports.z_td = index.ZTd;

package/dist/wc/cjs/z-tfoot.cjs.entry.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-4a04e2aa.js');
+require('./index-9ca7d5e5.js');
+
+
+
+exports.z_tfoot = index.ZTfoot;

package/dist/wc/cjs/z-th.cjs.entry.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-05a1b9dc.js');
+require('./index-9ca7d5e5.js');
+require('./index-c0af2262.js');
+
+
+
+exports.z_th = index.ZTh;

package/dist/wc/cjs/z-thead.cjs.entry.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-f4792a6f.js');
+require('./index-9ca7d5e5.js');
+
+
+
+exports.z_thead = index.ZThead;

package/dist/wc/cjs/z-toast-notification-list.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
-const index$1 = require('./index-1112cdb1.js');
+const index$1 = require('./index-c0af2262.js');
 
 const stylesCss = ":host{position:fixed;z-index:10000;display:flex;flex-flow:column nowrap;margin-top:calc(var(--space-unit) * 2);margin-bottom:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}::slotted(z-toast-notification){width:100vw}::slotted(:not(:last-child)){margin-bottom:calc(var(--space-unit) * 1)}:host([position=\"bottom-centre\"]),:host([position=\"bottom-right\"]),:host([position=\"bottom-left\"]){bottom:0;align-items:flex-end;justify-content:flex-end}:host([position=\"top-left\"]),:host([position=\"top-right\"]),:host([position=\"top-centre\"]){top:0;align-items:flex-start;justify-content:flex-start}@media only screen and (min-width: 768px){:host{margin:calc(var(--space-unit) * 3)}:host([position=\"top-centre\"]){top:0;left:50%;align-items:center;justify-content:flex-start;transform:translateX(-50%)}:host([position=\"top-left\"]){top:0;left:0;align-items:flex-start;justify-content:flex-start}:host([position=\"top-right\"]){top:0;right:0;align-items:flex-end;justify-content:flex-start}:host([position=\"bottom-centre\"]){bottom:0;left:50%;align-items:center;justify-content:flex-end;transform:translateX(-50%)}:host([position=\"bottom-right\"]){right:0;bottom:0;align-items:flex-end;justify-content:flex-end}:host([position=\"bottom-left\"]){bottom:0;left:0;align-items:flex-start;justify-content:flex-end}::slotted(z-toast-notification){width:50vw}}@media only screen and (min-width: 1366px){:host{margin:calc(var(--space-unit) * 4)}::slotted(z-toast-notification){width:33vw}}";
 

package/dist/wc/cjs/z-toast-notification.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
-const index$1 = require('./index-1112cdb1.js');
-const breakpoints = require('./breakpoints-a55736d0.js');
+const index$1 = require('./index-c0af2262.js');
+const breakpoints = require('./breakpoints-e7c8838e.js');
 const hammer = require('./hammer-4f20813e.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/wc/cjs/z-toggle-button.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
 
-const stylesCss = "button{height:36px;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--bg-white);border-radius:var(--border-radius);box-shadow:0 0 4px 0 rgb(0 0 0 / 20%);color:var(--myz-blue);cursor:pointer;fill:var(--myz-blue);font-family:var(--dashboard-font);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase;transition:all 200ms linear}button::-moz-focus-inner{border:0}button:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}button:focus{border-color:var(--myz-blue);box-shadow:0 0 2px 2px var(--accent-dark);color:var(--myz-blue);fill:var(--myz-blue)}button:active{border-color: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)}button:disabled{color:var(--text-grey-700);fill:var(--text-grey-700)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";
+const stylesCss = "button{height:36px;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--bg-white);border-radius:var(--border-radius);box-shadow:0 0 4px 0 rgb(0 0 0 / 20%);color:var(--myz-blue);cursor:pointer;fill:var(--myz-blue);font-family:var(--dashboard-font);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase}button::-moz-focus-inner{border:0}button:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}button:focus{box-shadow:var(--shadow-focus-primary);color:var(--myz-blue);fill:var(--myz-blue)}button:active{border-color: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)}button:disabled{color:var(--text-grey-700);fill:var(--text-grey-700)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";
 
 const ZToggleButton = class {
   constructor(hostRef) {
@@ -14,6 +14,8 @@ const ZToggleButton = class {
     this.isdisabled = false;
     /** open by default (optional) */
     this.opened = false;
+    /**  aria-label for the button */
+    this.ariaLabel = "";
   }
   emitToggleClick() {
     if (this.isdisabled) {
@@ -26,7 +28,7 @@ const ZToggleButton = class {
     return (index.h("button", { tabindex: this.avoidclick ? "-1" : "0", class: {
         "isopen": this.opened,
         "avoid-clicks": this.avoidclick,
-      }, disabled: this.isdisabled, onClick: () => this.emitToggleClick() }, index.h("z-icon", { name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
+      }, disabled: this.isdisabled, "aria-expanded": this.opened ? "true" : "false", "aria-label": this.ariaLabel, onClick: () => this.emitToggleClick() }, index.h("z-icon", { name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
   }
 };
 ZToggleButton.style = stylesCss;

package/dist/wc/cjs/z-toggle-switch.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
-const utils = require('./utils-3ac19501.js');
-const index$1 = require('./index-1112cdb1.js');
-require('./breakpoints-a55736d0.js');
+const utils = require('./utils-8fd01df0.js');
+const index$1 = require('./index-c0af2262.js');
+require('./breakpoints-e7c8838e.js');
 
 const stylesCss = ".sc-z-toggle-switch-h{position:relative;display:inline-flex;font-family:var(--font-family-sans);font-weight:var(--font-rg)}label.sc-z-toggle-switch{display:flex;flex-direction:row;align-items:center;cursor:pointer}label.disabled.sc-z-toggle-switch{cursor:default}label.right.sc-z-toggle-switch{flex-direction:row-reverse}label.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{color:var(--color-text01);letter-spacing:0}label.left.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-right:var(--space-unit)}label.right.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-left:var(--space-unit)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch{position:relative;top:1px;left:1px;display:flex;width:calc(var(--space-unit) * 4);height:18px;align-items:center;background-color:var(--gray500);border-radius:var(--space-unit);color:var(--gray500);cursor:pointer}label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch,label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch{background-color:var(--color-disabled01);cursor:default}label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch>span.circle.sc-z-toggle-switch>z-icon.sc-z-toggle-switch{fill:var(--color-disabled01)}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch{background-color:var(--color-primary01);fill:var(--color-primary01)}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled){box-shadow:var(--shadow-focus-primary);outline:none}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch{outline:none}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled):hover{background-color:var(--color-hover-primary);fill:var(--color-hover-primary)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{position:absolute;top:1px;left:1px;display:flex;width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);align-items:center;justify-content:center;margin:0;background-color:var(--color-white);border-radius:7px;box-shadow:var(--shadow-1);transition:transform 0.3s ease}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{transform:translateX(calc(100% - 2px))}input[type=\"checkbox\"].sc-z-toggle-switch{position:absolute;z-index:-1;opacity:0;pointer-events:none}";
 

package/dist/wc/cjs/z-tooltip.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca7d5e5.js');
-const index$1 = require('./index-1112cdb1.js');
+const index$1 = require('./index-c0af2262.js');
 
-const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-text01);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base))}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05)}z-popover{--z-popover-padding:var(--space-unit);--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}";
+const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-text01);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base))}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05);--z-popover-theme--text:var(--color-text-inverse)}z-popover{--z-popover-padding:var(--space-unit);--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}";
 
 const ZTooltip = class {
   constructor(hostRef) {
@@ -18,12 +18,18 @@ const ZTooltip = class {
      * The open state of the tooltip.
      */
     this.open = false;
+    /**
+     * Reflects `closable` prop of the popover.
+     * "If true, the popover can be closed by clicking outside of it or pressing the escape key.
+     * Otherwise, it will be closed only programmatically (by setting `open` to `false`)."
+     */
+    this.closable = true;
   }
   onPopoverOpenChange() {
-    this.open = this.popover.open;
+    this.open = this.popoverEl.open;
   }
   render() {
-    return (index.h("z-popover", { ref: (el) => (this.popover = el), bindTo: this.bindTo, open: this.open, position: this.position, center: true, showArrow: true }, index.h("slot", null)));
+    return (index.h("z-popover", { ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true }, index.h("slot", null)));
   }
 };
 ZTooltip.style = stylesCss;

package/dist/wc/cjs/z-tr.cjs.entry.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-044ebc8a.js');
+require('./index-9ca7d5e5.js');
+require('./utils-8fd01df0.js');
+require('./index-c0af2262.js');
+require('./breakpoints-e7c8838e.js');
+require('./index-18a2a552.js');
+require('./index-05a1b9dc.js');
+
+
+
+exports.z_tr = index.ZTr;

package/dist/wc/collection/collection-manifest.json

@@ -14,13 +14,15 @@
     {
       "name": "@zanichelli/albe-web-components",
       "tags": [
+        "z-accordion",
         "z-alert",
         "z-anchor-navigation",
         "z-app-header",
-        "z-app-switcher",
         "z-aria-alert",
         "z-avatar",
         "z-body",
+        "z-book-card",
+        "z-breadcrumb",
         "z-button",
         "z-button-sort",
         "z-card",
@@ -87,6 +89,7 @@
         "z-table",
         "z-table-body",
         "z-table-cell",
+        "z-table-deprecated",
         "z-table-empty-box",
         "z-table-expanded-row",
         "z-table-footer",
@@ -96,11 +99,17 @@
         "z-table-row",
         "z-table-sticky-footer",
         "z-tag",
+        "z-tbody",
+        "z-td",
+        "z-tfoot",
+        "z-th",
+        "z-thead",
         "z-toast-notification",
         "z-toast-notification-list",
         "z-toggle-button",
         "z-toggle-switch",
         "z-tooltip",
+        "z-tr",
         "z-typography",
         "z-visually-hidden"
       ]

package/dist/wc/collection/components/license-activation/license-activation.js

@@ -63,7 +63,7 @@ export class LicenseActivation {
     const url = `${this.environment.API_V3_URL}/licenses/real`;
     this.licenseActivationState = Object.assign(Object.assign({}, this.licenseActivationState), { licenseActivationApiLoading: true });
     const requestOpt = {
-      credentials: "include"
+      credentials: "include",
     };
     const sampleCodeError = state.cms["newdashboard.licenseActivation.error.sampleCodeMessage"];
     // INFO: controllo che il codice inserito non sia quello di esempio
@@ -121,19 +121,23 @@ export class LicenseActivation {
   renderLicenseActivationModal() {
     return (h("license-activation-modal", { id: `${this.host.id}-modal`, "modal-title": this.cms["newdashboard.licenseActivation.modalTitle"], onActivationModalClose: () => this.handleLicenseModalClose(), resetStore: this.resetStore }, this.renderLicenseActivationForm(LicenseActivationVariantEnum.modal)));
   }
-  retrieveTextsObject() {
-    const { inputMessage, inputLabel, inputPlaceholder, buttonLabel, isMobile, additionalDescription, buttonIcon, previewInputPlaceholder, previewButtonLabel, previewButtonIcon, previewButtonSize, } = this;
+  retrieveTextsObject(variant) {
+    const { inputMessage, inputLabel, inputPlaceholder, buttonLabel, additionalDescription, buttonIcon, previewInputPlaceholder, previewButtonLabel, previewButtonIcon, previewButtonSize, } = this;
     const { licenseActivationStatus } = this.licenseActivationState;
+    let description = null, defaultInputMessage = null;
+    if (variant === LicenseActivationVariantEnum.modal) {
+      description = additionalDescription || this.cms["newdashboard.licenseActivation.additionalDescription"];
+    }
+    else {
+      defaultInputMessage = this.cms["newdashboard.licenseActivation.inputHelperMessage"];
+    }
     return {
       inputStatus: this.mapInputStatus(licenseActivationStatus),
-      inputMessage: inputMessage ||
-        this.cms["newdashboard.licenseActivation.inputHelperMessage"],
+      inputMessage: inputMessage || defaultInputMessage,
       placeholder: inputPlaceholder ||
         this.cms["newdashboard.licenseActivation.inputPlaceholder"],
       inputLabel: inputLabel || this.cms["newdashboard.licenseActivation.inputLabel"],
-      buttonLabel: isMobile
-        ? buttonLabel || this.cms["newdashboard.licenseActivation.submitLabel"]
-        : this.cms["newdashboard.onboarding.licenseActivation.submitLabel"],
+      buttonLabel: buttonLabel || this.cms["newdashboard.onboarding.licenseActivation.submitLabel"],
       buttonIcon,
       previewInputPlaceholder,
       previewButtonLabel,
@@ -145,37 +149,24 @@ export class LicenseActivation {
       infoBoxIcon: `${this.environment.URL_S3_IMAGES_FOLDER}bollinoSIAE.svg`,
       infoBoxContent: this.cms["newdashboard.licenseActivation.infoBoxContent"],
       supportLink: this.cms["newdashboard.licenseActivation.contactUs.url"],
-      additionalDescription: this.variant === LicenseActivationVariantEnum.modal &&
-        additionalDescription,
+      additionalDescription: description
     };
   }
   renderLicenseActivationForm(variant) {
     const { componentid } = this;
     const { licenseActivationState: { licenseActivationMessage, licenseActivationCode, licenseActivationApiLoading, }, } = this;
-    const textObject = this.retrieveTextsObject();
+    const textObject = this.retrieveTextsObject(variant);
     return (h("license-activation-form", { direction: "column", error: licenseActivationMessage, initialCode: licenseActivationCode, formTexts: textObject, requestLoading: !!licenseActivationApiLoading, enableButton: this.enableFormSubmitButton, formid: componentid, initialShowInfoBox: this.initialShowInfoBox, onFormInputChange: (e) => this.handleFormInputChange(e.detail.value), onSubmitButtonClick: (e) => this.handleSubmitButtonClick(e.detail.value), variant: variant, handleModalOpen: () => this.handleLicenseModalOpen(true) }));
   }
   renderMobileButton() {
     return (h("z-button", { onClick: () => this.handleMobileButtonClick() }, this.cms["newdashboard.onboarding.licenseActivation.mobileSubmitLabel"]));
   }
   render() {
-    if (this.isMobile &&
-      this.variant !== LicenseActivationVariantEnum.preview) {
-      return (h(Host, null,
-        this.forceModal
-          ? this.renderLicenseActivationModal()
-          : this.renderMobileButton(),
-        this.variant === LicenseActivationVariantEnum.box &&
-          this.modalState === "open" &&
-          this.renderLicenseActivationModal()));
-    }
     return (h(Host, null,
-      this.variant === LicenseActivationVariantEnum.box ||
-        this.variant === LicenseActivationVariantEnum.preview
+      this.variant !== LicenseActivationVariantEnum.modal
         ? this.renderLicenseActivationBox(this.variant)
         : this.modalState === "open" && this.renderLicenseActivationModal(),
-      (this.variant === LicenseActivationVariantEnum.box ||
-        this.variant === LicenseActivationVariantEnum.preview) &&
+      this.variant !== LicenseActivationVariantEnum.modal &&
         this.modalState === "open" &&
         this.submitClicked &&
         this.renderLicenseActivationModal()));

package/dist/wc/collection/components/license-activation-form/license-activation-form.css

@@ -1,11 +1,10 @@
 :host {
   display: block;
-  padding: calc(var(--space-unit) * 2);
 }
 
 :host > div > .body-3 {
   display: block;
-  margin-bottom: calc(var(--space-unit) * 2);
+  margin-bottom: calc(var(--space-unit) * 4);
 }
 
 :host > div > z-button {
@@ -25,6 +24,10 @@
   display: flex;
 }
 
+:host([variant="modal"]) {
+  padding: calc(var(--space-unit) * 2);
+}
+
 :host([variant="modal"]) .error-section {
   display: flex;
   flex-direction: column;
@@ -65,12 +68,8 @@
 
 /* Tablet breakpoint */
 @media only screen and (min-width: 768px) {
-  :host {
-    padding: 0;
-  }
-
   :host([variant="modal"]) {
-    padding: 32px;
+    padding: calc(var(--space-unit) * 3);
     width: 396px;
   }
 
@@ -93,7 +92,7 @@
   }
 
   :host([variant="modal"]) > div > z-button {
-    padding: 32px 0 calc(var(--space-unit) * 2);
+    padding: calc(var(--space-unit) * 3) 0 calc(var(--space-unit) * 2);
     width: max-content;
   }
 
@@ -104,10 +103,6 @@
 
 /* Desktop breakpoint */
 @media only screen and (min-width: 1152px) {
-  :host([variant="modal"]) {
-    width: 477px;
-  }
-
   :host > div {
     flex-direction: row;
   }
@@ -115,4 +110,8 @@
 
 /* Wide breakpoint */
 @media only screen and (min-width: 1366px) {
+  :host([variant="modal"]) {
+    padding: calc(var(--space-unit) * 4);
+    width: 477px;
+  }
 }

package/dist/wc/collection/components/license-activation-form/license-activation-form.js

@@ -82,7 +82,7 @@ export class LicenseActivationForm {
     const { additionalDescription } = this.formTexts;
     if (!additionalDescription)
       return;
-    return h("span", { class: "body-3" }, additionalDescription);
+    return h("span", { class: "body-3", innerHTML: manageMarkupContent(additionalDescription) });
   }
   renderInfoLink() {
     const { linkLabel } = this.formTexts;