@zanichelli/albe-web-components 12.1.2 → 12.1.4-rc

package/dist/collection/deprecated/z-table-deprecated/z-table-cell/index.js

@@ -1,84 +0,0 @@
-import { h, Host } from "@stencil/core";
-import { ButtonVariant, ButtonSize } from "../../../beans";
-/**
- * @deprecated
- */
-export class ZTableCell {
-  constructor() {
-    /** Set padding size of cell, if special 0px padding will be set */
-    this.padding = "medium";
-    this.isMenuOpened = false;
-  }
-  handleMenu() {
-    this.isMenuOpened = !this.isMenuOpened;
-  }
-  componentWillRender() {
-    this.host.setAttribute("role", "cell");
-  }
-  render() {
-    return (h(Host, null, this.showButton && (h("div", { class: {
-        "button-container": true,
-        "visible": this.isMenuOpened,
-      } }, h("div", { class: "button-content" }, h("z-button", { icon: "contextual-menu", variant: ButtonVariant.TERTIARY, size: ButtonSize.X_SMALL, onClick: () => this.handleMenu() }), h("div", { class: {
-        "contextual-menu-container": true,
-        "visible": this.isMenuOpened,
-      } }, h("slot", { name: "contextual-menu" }))))), h("slot", null)));
-  }
-  static get is() { return "z-table-cell"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "showButton": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "[Optional] Show contextual menu button"
-        },
-        "attribute": "show-button",
-        "reflect": false
-      },
-      "padding": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "\"x-small\" | \"small\" | \"medium\" | \"large\" | \"special\"",
-          "resolved": "\"large\" | \"medium\" | \"small\" | \"special\" | \"x-small\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Set padding size of cell, if special 0px padding will be set"
-        },
-        "attribute": "padding",
-        "reflect": true,
-        "defaultValue": "\"medium\""
-      }
-    };
-  }
-  static get states() {
-    return {
-      "isMenuOpened": {}
-    };
-  }
-  static get elementRef() { return "host"; }
-}

package/dist/collection/deprecated/z-table-deprecated/z-table-cell/styles.css

@@ -1,58 +0,0 @@
-:host {
-  display: table-cell;
-  border-bottom: var(--border-size-small) solid var(--color-surface03);
-  background-color: var(--color-white);
-  font-family: var(--font-family-sans);
-  font-weight: var(--font-rg);
-}
-
-:host > .button-container {
-  display: none;
-}
-
-:host:hover > .button-container {
-  display: initial;
-}
-
-.button-container {
-  position: absolute;
-  z-index: 5;
-  top: 8px;
-  right: 8px;
-}
-
-.button-content {
-  position: relative;
-}
-
-.contextual-menu-container {
-  position: absolute;
-  top: calc(100% - var(--space-unit));
-  right: 0;
-  display: none;
-}
-
-.button-container.visible,
-.contextual-menu-container.visible {
-  display: initial;
-}
-
-:host([padding="x-small"]) {
-  padding: calc(var(--space-unit) * 0.5);
-}
-
-:host([padding="small"]) {
-  padding: calc(var(--space-unit));
-}
-
-:host([padding="medium"]) {
-  padding: calc(var(--space-unit) * 2);
-}
-
-:host([padding="large"]) {
-  padding: calc(var(--space-unit) * 2.5);
-}
-
-:host([padding="special"]) {
-  padding: 0;
-}

package/dist/collection/deprecated/z-table-deprecated/z-table-deprecated/index.js

@@ -1,363 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { ButtonSize, ButtonVariant } from "../../../beans";
-import { mobileBreakpoint } from "../../../constants/breakpoints";
-import "../z-table-body/index";
-import "../z-table-cell/index";
-import "../z-table-empty-box/index";
-import "../z-table-expanded-row/index";
-import "../z-table-footer/index";
-import "../z-table-head/index";
-import "../z-table-header/index";
-import "../z-table-header-row/index";
-import "../z-table-row/index";
-import "../z-table-sticky-footer/index";
-/**
- * @slot - table elements
- * @slot sticky-footer - set the content of the sticky footer
- * @deprecated
- */
-export class ZTableDeprecated {
-  constructor() {
-    /** Error message */
-    this.errorMessage = "Siamo spiacenti, non siamo riusciti a caricare il contenuto richiesto";
-    /** Sets table with border */
-    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 = "";
-  }
-  handleResize() {
-    this.isMobile = window.innerWidth <= mobileBreakpoint;
-  }
-  handleOrientationChange() {
-    this.isMobile = screen.width <= mobileBreakpoint;
-  }
-  componentWillLoad() {
-    var _a;
-    this.isMobile = window.innerWidth <= 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 (h(Host, null, h("div", { class: tableClass }, h("slot", { name: "table-header" })), h("z-table-error", null, h("div", { class: "error-content", style: { minHeight } }, h("slot", { name: "error-image" }), h("div", { class: "text" }, h("span", { class: "body-3-sb error-message" }, this.errorMessage), h("slot", { name: "error-action" }))))));
-  }
-  renderEmpty(tableClass) {
-    const buttonSize = this.isMobile ? ButtonSize.SMALL : ButtonSize.BIG;
-    const tableContentClass = `${this.hasTableBody ? "table-content" : ""}`;
-    if (this.hasTableBody) {
-      return (h(Host, null, h("div", { class: tableClass }, h("slot", { name: "table-header" }), h("div", { class: tableContentClass }, h("slot", { name: "table-body" }), h("z-table-empty-box", { class: this.bordered && "bordered", message: this.message, subtitle: this.subtitle }, !!this.callToActionLabel && (h("z-button", { slot: "cta1", variant: ButtonVariant.TERTIARY, onClick: () => this.callToAction.emit(), size: buttonSize }, this.callToActionLabel)), !!this.callToActionTwoLabel && (h("z-button", { slot: "cta2", variant: ButtonVariant.TERTIARY, onClick: () => this.callToActionTwo.emit(), size: buttonSize }, this.callToActionTwoLabel)))))));
-    }
-    return (h(Host, null, h("div", { class: tableClass }, h("slot", { name: "table-header" })), h("z-table-empty-box", { class: this.bordered && "bordered", message: this.message, subtitle: this.subtitle }, !!this.callToActionLabel && (h("z-button", { slot: "cta1", variant: ButtonVariant.TERTIARY, onClick: () => this.callToAction.emit(), size: buttonSize }, this.callToActionLabel)), !!this.callToActionTwoLabel && (h("z-button", { slot: "cta2", variant: ButtonVariant.TERTIARY, onClick: () => this.callToActionTwo.emit(), size: buttonSize }, this.callToActionTwoLabel)))));
-  }
-  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 (h(Host, null, h("div", { class: tableClass }, h("slot", null)), h("slot", { name: "sticky-footer" })));
-  }
-  static get is() { return "z-table-deprecated"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get assetsDirs() { return ["assets"]; }
-  static get properties() {
-    return {
-      "lines": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Number of lines of element"
-        },
-        "attribute": "lines",
-        "reflect": true
-      },
-      "errorMessage": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Error message"
-        },
-        "attribute": "error-message",
-        "reflect": false,
-        "defaultValue": "\"Siamo spiacenti, non siamo riusciti a caricare il contenuto richiesto\""
-      },
-      "bordered": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets table with border"
-        },
-        "attribute": "bordered",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "callToActionLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets call to action label"
-        },
-        "attribute": "call-to-action-label",
-        "reflect": false
-      },
-      "callToActionTwoLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets call to action label"
-        },
-        "attribute": "call-to-action-two-label",
-        "reflect": false
-      },
-      "columnSticky": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets first column sticky"
-        },
-        "attribute": "column-sticky",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "empty": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets empty table"
-        },
-        "attribute": "empty",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "error": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Set error status"
-        },
-        "attribute": "error",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "errorLink": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Set error status"
-        },
-        "attribute": "error-link",
-        "reflect": false
-      },
-      "headerSticky": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets header sticky"
-        },
-        "attribute": "header-sticky",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "message": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Set message"
-        },
-        "attribute": "message",
-        "reflect": false,
-        "defaultValue": "\"Siamo spiacenti, al momento non sono presenti dati da visualizzare\""
-      },
-      "subtitle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Set subtitle"
-        },
-        "attribute": "subtitle",
-        "reflect": false,
-        "defaultValue": "\"\""
-      }
-    };
-  }
-  static get states() {
-    return {
-      "hasTableBody": {},
-      "isMobile": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "callToAction",
-        "name": "callToAction",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "remove call to action event"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "callToActionTwo",
-        "name": "callToActionTwo",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "remove call to action event"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }];
-  }
-  static get elementRef() { return "host"; }
-  static get listeners() {
-    return [{
-        "name": "resize",
-        "method": "handleResize",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }, {
-        "name": "orientationchange",
-        "method": "handleOrientationChange",
-        "target": "window",
-        "capture": false,
-        "passive": false
-      }];
-  }
-}

package/dist/collection/deprecated/z-table-deprecated/z-table-deprecated/styles.css

@@ -1,115 +0,0 @@
-z-table-deprecated {
-  display: block;
-  width: 100%;
-  background-color: var(--color-white);
-  font-family: var(--font-family-sans);
-  font-weight: var(--font-rg);
-  overflow-x: auto;
-}
-
-z-table-deprecated > div.table {
-  display: table;
-  width: 100%;
-  border-collapse: separate;
-}
-
-z-table-deprecated > div.table-bordered > z-table-body > z-table-row > z-table-cell:not(:last-child),
-z-table-deprecated > div.table-bordered > z-table-head > z-table-header-row > z-table-header:not(:last-child) {
-  border-right: var(--border-size-small) solid var(--color-surface03);
-}
-
-/** Remove border right to first cell if row is expandable */
-z-table-deprecated > div > z-table-body > z-table-row[expandable] > z-table-cell:first-child,
-z-table-deprecated > div > z-table-head > z-table-header-row[expandable] > z-table-header:first-child {
-  border-right: none;
-}
-
-z-table-deprecated > div > z-table-body > z-table-row[expanded] > z-table-cell {
-  background-color: var(--gray50);
-}
-
-z-table-deprecated > div > z-table-body > z-table-row[expanded] + z-table-expanded-row {
-  border-bottom: 1px solid var(--gray200);
-}
-
-z-table-deprecated > div.table-column-sticky > z-table-body > z-table-row > z-table-cell:first-child,
-z-table-deprecated > 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-deprecated > div.table-header-sticky > z-table-head > z-table-header-row > z-table-header {
-  position: sticky;
-  z-index: 2; /* L'ombra delle celle sticky non va sopra all'header fisso. */
-  top: 0;
-  box-shadow: 0 2px 3px -3px rgb(66 69 72 / 40%);
-}
-
-/**
- * La cella in alto a sinistra rimane sempre sopra alle cell durante lo scroll.
- */
-z-table-deprecated > div.table-header-sticky > z-table-head > z-table-header-row > z-table-header:first-child,
-z-table-deprecated > 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(--color-surface03);
-}
-
-z-table-empty-box.bordered {
-  border-left: var(--border-size-small) solid var(--color-surface03);
-}
-
-.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(--font-family-sans);
-}
-
-.error-content > img {
-  width: 244px;
-  height: 188px;
-  margin-right: calc(var(--space-unit) * 3);
-}
-
-/* Mobile */
-@media only screen and (max-width: 768px) {
-  z-table-deprecated > 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;
-  }
-}

package/dist/collection/deprecated/z-table-deprecated/z-table-empty-box/index.js

@@ -1,75 +0,0 @@
-import { h, Host } from "@stencil/core";
-/**
- * @deprecated
- */
-export class ZTableEmptyBox {
-  constructor() {
-    /** Sets main title message*/
-    this.message = "Siamo spiacenti, al momento non sono presenti dati da visualizzare.";
-    /** Sets message */
-    this.subtitle = "";
-  }
-  componentWillLoad() {
-    this.hasCta1Slot = !!this.hostElement.querySelector('[slot="cta1"]');
-    this.hasCta2Slot = !!this.hostElement.querySelector('[slot="cta2"]');
-  }
-  render() {
-    return (h(Host, null, h("span", { class: "body-3-sb" }, this.message), h("br", null), !!this.subtitle && h("span", { class: "body-4" }, this.subtitle), (!!this.hasCta1Slot || !!this.hasCta2Slot) && (h("div", { class: {
-        "cta": true,
-        "has-2-cta": !!this.hasCta1Slot && !!this.hasCta2Slot,
-      } }, h("slot", { name: "cta1" }), h("slot", { name: "cta2" })))));
-  }
-  static get is() { return "z-table-empty-box"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["styles.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "message": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets main title message"
-        },
-        "attribute": "message",
-        "reflect": false,
-        "defaultValue": "\"Siamo spiacenti, al momento non sono presenti dati da visualizzare.\""
-      },
-      "subtitle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Sets message"
-        },
-        "attribute": "subtitle",
-        "reflect": false,
-        "defaultValue": "\"\""
-      }
-    };
-  }
-  static get elementRef() { return "hostElement"; }
-}