@zanichelli/albe-web-components 2.33.3 → 2.33.5-rc2

package/dist/collection/snowflakes/myz/card/z-myz-card-icon/styles.css

@@ -1,70 +1,70 @@
-button {
-  width: 42px;
-  height: calc(var(--space-unit) * 5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--color-primary01);
-  fill: var(--color-primary01);
-  cursor: pointer;
-  outline: none;
-
-  background: none;
-  border: none;
-  border-left: var(--border-size-medium) solid var(--color-surface03);
-  border-radius: 0px var(--border-radius) 0px 0px;
-  margin: 0;
-  padding: 0px;
-  width: calc(var(--space-unit) * 6);
-  height: calc(var(--space-unit) * 6);
-}
-
-button:active,
-button:focus {
-  color: var(--blue700);
-  fill: var(--blue700);
-}
-
-button > span {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  border-radius: var(--border-radius);
-  border: 0px;
-}
-
-button:hover > span {
-  background: var(--color-primary03);
-}
-
-button:focus > span {
-  background: var(--color-surface01);
-  border-radius: var(--border-radius);
-  box-shadow: 0px 0px 2px 2px var(--accent-dark);
-}
-
-button:active > span {
-  background: var(--color-surface01);
-  border-radius: var(--border-radius);
-  box-shadow: var(--shadow-2);
-}
-
-button:disabled {
-  cursor: not-allowed;
-}
-
-button:disabled > span {
-  background: none;
-  box-shadow: var(--shadow-0);
-  pointer-events: none;
-}
-
-button:disabled > span > z-icon {
-  fill: var(--color-surface03);
-}
-
-button::-moz-focus-inner {
-  border: 0;
-}
+button {
+  width: 42px;
+  height: calc(var(--space-unit) * 5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-primary01);
+  fill: var(--color-primary01);
+  cursor: pointer;
+  outline: none;
+
+  background: none;
+  border: none;
+  border-left: var(--border-size-medium) solid var(--color-surface03);
+  border-radius: 0px var(--border-radius) 0px 0px;
+  margin: 0;
+  padding: 0px;
+  width: calc(var(--space-unit) * 6);
+  height: calc(var(--space-unit) * 6);
+}
+
+button:active,
+button:focus {
+  color: var(--blue700);
+  fill: var(--blue700);
+}
+
+button > span {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border-radius: var(--border-radius);
+  border: 0px;
+}
+
+button:hover > span {
+  background: var(--color-primary03);
+}
+
+button:focus > span {
+  background: var(--color-surface01);
+  border-radius: var(--border-radius);
+  box-shadow: 0px 0px 2px 2px var(--accent-dark);
+}
+
+button:active > span {
+  background: var(--color-surface01);
+  border-radius: var(--border-radius);
+  box-shadow: var(--shadow-2);
+}
+
+button:disabled {
+  cursor: not-allowed;
+}
+
+button:disabled > span {
+  background: none;
+  box-shadow: var(--shadow-0);
+  pointer-events: none;
+}
+
+button:disabled > span > z-icon {
+  fill: var(--color-surface03);
+}
+
+button::-moz-focus-inner {
+  border: 0;
+}

package/dist/collection/snowflakes/myz/card/z-myz-card-info/index.js

@@ -1,213 +1,213 @@
-import { Component, Prop, h, Event, State } from "@stencil/core";
-import { TooltipPosition } from "../../../../beans";
-import { handleKeyboardSubmit } from "../../../../utils/utils";
-/**
- * @slot  - content
- */
-export class ZMyzCardInfo {
-  constructor() {
-    /** tabindex link attribute (optional) */
-    this.htmltabindex = 0;
-    this.hiddenContent = false;
-    this.tooltip = false;
-    this.emitFlipCard = this.emitFlipCard.bind(this);
-  }
-  emitFlipCard(showBack = false) {
-    this.flipCard.emit(showBack);
-  }
-  componentWillLoad() {
-    this.setStringOrArray();
-  }
-  componentWillUpdate() {
-    this.setStringOrArray();
-  }
-  componentDidRender() {
-    this.handleContentHeight();
-  }
-  handleContentHeight() {
-    if (!this.contentWrapper && !this.infoWrapper)
-      return (this.hiddenContent = false);
-    if (this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||
-      this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight) {
-      const height = this.contentWrapper.offsetHeight -
-        this.onlineLicenseWrapper.offsetHeight -
-        this.offlineLicenseWrapper.offsetHeight;
-      this.infoWrapper.style.height = `${height}px`;
-      return (this.hiddenContent = true);
-    }
-    return (this.hiddenContent = false);
-  }
-  setStringOrArray() {
-    if (typeof this.data === "string") {
-      this.cardData = JSON.parse(this.data);
-    }
-    else {
-      this.cardData = this.data;
-    }
-  }
-  renderCloseIcon() {
-    return (h("z-icon", { name: "multiply-circled-filled", height: 18, width: 18, onClick: () => this.emitFlipCard(false), tabindex: this.htmltabindex, onKeyUp: (e) => {
-        handleKeyboardSubmit(e, this.emitFlipCard, false);
-      } }));
-  }
-  renderGeneralSection() {
-    var _a, _b;
-    const title = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.title;
-    const description = (_b = this === null || this === void 0 ? void 0 : this.cardData) === null || _b === void 0 ? void 0 : _b.description;
-    return (h("section", { class: `info-wrapper ${this.hiddenContent ? "hidden" : ""}`, onClick: () => {
-        if (this.hiddenContent)
-          this.tooltip = !this.tooltip;
-      }, ref: (el) => (this.infoWrapper = el) },
-      this.renderAuthor(),
-      this.renderYear(),
-      title,
-      h("br", null),
-      description));
-  }
-  renderAuthor() {
-    var _a;
-    const author = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.author;
-    if (!author)
-      return null;
-    return (h("span", null,
-      "Autore: ",
-      h("b", null, author),
-      h("br", null)));
-  }
-  renderYear() {
-    var _a;
-    const year = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.year;
-    if (!year)
-      return null;
-    return (h("span", null,
-      "Anno: ",
-      h("b", null, year),
-      h("br", null)));
-  }
-  renderTooltip() {
-    if (!this.tooltip)
-      return;
-    if (!this.cardData)
-      return;
-    const { title, year, author, description } = this.cardData;
-    return (h("z-tooltip", { content: `${title} ${year} ${author} ${description}`, type: TooltipPosition.RIGHT, onClick: () => (this.tooltip = false) }));
-  }
-  setExpirationLicenseMessage(type) {
-    if ((type === "online" && this.cardData.onlineLicense.expired) ||
-      (type === "offline" && this.cardData.offlineLicense.expired)) {
-      return h("span", { class: "expired" }, "SCADUTA");
-    }
-    if ((type === "online" && this.cardData.onlineLicense.expiring) ||
-      (type === "offline" && this.cardData.offlineLicense.expiring)) {
-      return h("span", { class: "expiring" }, "IN SCADENZA");
-    }
-  }
-  renderOnlineLicenseSection() {
-    var _a;
-    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.onlineLicense))
-      return;
-    return (h("section", { ref: (el) => (this.onlineLicenseWrapper = el) },
-      h("span", { class: "license-heading" },
-        h("span", null, "Licenza online"),
-        this.setExpirationLicenseMessage("online")),
-      "Scadenza il ",
-      h("b", null, this.cardData.onlineLicense.expiration),
-      h("br", null)));
-  }
-  renderOfflineLicenseSection() {
-    var _a;
-    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.offlineLicense))
-      return;
-    return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) },
-      h("span", { class: "license-heading" },
-        h("span", null, "Licenza offline"),
-        this.setExpirationLicenseMessage("offline")),
-      "Scadenza il ",
-      h("b", null, this.cardData.offlineLicense.expiration),
-      h("br", null),
-      "Installazioni disponibili:",
-      " ",
-      h("b", null, this.cardData.offlineLicense.installations)));
-  }
-  render() {
-    return (h("div", null,
-      this.renderCloseIcon(),
-      h("div", { class: "content-wrapper", ref: (el) => (this.contentWrapper = el) },
-        this.renderGeneralSection(),
-        this.renderTooltip(),
-        this.renderOnlineLicenseSection(),
-        this.renderOfflineLicenseSection()),
-      h("div", { class: "cta-wrapper" },
-        h("slot", null))));
-  }
-  static get is() { return "z-myz-card-info"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "data": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string | DictionaryData",
-        "resolved": "string | { author: string; year: string; title: string; description: string; onlineLicense: DictionaryLicenseData; offlineLicense: DictionaryLicenseData; }",
-        "references": {
-          "DictionaryData": {
-            "location": "import",
-            "path": "../../../../beans"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "dictionary info"
-      },
-      "attribute": "data",
-      "reflect": false
-    },
-    "htmltabindex": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "tabindex link attribute (optional)"
-      },
-      "attribute": "htmltabindex",
-      "reflect": false,
-      "defaultValue": "0"
-    }
-  }; }
-  static get states() { return {
-    "hiddenContent": {},
-    "tooltip": {}
-  }; }
-  static get events() { return [{
-      "method": "flipCard",
-      "name": "flipCard",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "flip card to front"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-}
+import { Component, Prop, h, Event, State } from "@stencil/core";
+import { TooltipPosition } from "../../../../beans";
+import { handleKeyboardSubmit } from "../../../../utils/utils";
+/**
+ * @slot  - content
+ */
+export class ZMyzCardInfo {
+  constructor() {
+    /** tabindex link attribute (optional) */
+    this.htmltabindex = 0;
+    this.hiddenContent = false;
+    this.tooltip = false;
+    this.emitFlipCard = this.emitFlipCard.bind(this);
+  }
+  emitFlipCard(showBack = false) {
+    this.flipCard.emit(showBack);
+  }
+  componentWillLoad() {
+    this.setStringOrArray();
+  }
+  componentWillUpdate() {
+    this.setStringOrArray();
+  }
+  componentDidRender() {
+    this.handleContentHeight();
+  }
+  handleContentHeight() {
+    if (!this.contentWrapper && !this.infoWrapper)
+      return (this.hiddenContent = false);
+    if (this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||
+      this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight) {
+      const height = this.contentWrapper.offsetHeight -
+        this.onlineLicenseWrapper.offsetHeight -
+        this.offlineLicenseWrapper.offsetHeight;
+      this.infoWrapper.style.height = `${height}px`;
+      return (this.hiddenContent = true);
+    }
+    return (this.hiddenContent = false);
+  }
+  setStringOrArray() {
+    if (typeof this.data === "string") {
+      this.cardData = JSON.parse(this.data);
+    }
+    else {
+      this.cardData = this.data;
+    }
+  }
+  renderCloseIcon() {
+    return (h("z-icon", { name: "multiply-circled-filled", height: 18, width: 18, onClick: () => this.emitFlipCard(false), tabindex: this.htmltabindex, onKeyUp: (e) => {
+        handleKeyboardSubmit(e, this.emitFlipCard, false);
+      } }));
+  }
+  renderGeneralSection() {
+    var _a, _b;
+    const title = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.title;
+    const description = (_b = this === null || this === void 0 ? void 0 : this.cardData) === null || _b === void 0 ? void 0 : _b.description;
+    return (h("section", { class: `info-wrapper ${this.hiddenContent ? "hidden" : ""}`, onClick: () => {
+        if (this.hiddenContent)
+          this.tooltip = !this.tooltip;
+      }, ref: (el) => (this.infoWrapper = el) },
+      this.renderAuthor(),
+      this.renderYear(),
+      title,
+      h("br", null),
+      description));
+  }
+  renderAuthor() {
+    var _a;
+    const author = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.author;
+    if (!author)
+      return null;
+    return (h("span", null,
+      "Autore: ",
+      h("b", null, author),
+      h("br", null)));
+  }
+  renderYear() {
+    var _a;
+    const year = (_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.year;
+    if (!year)
+      return null;
+    return (h("span", null,
+      "Anno: ",
+      h("b", null, year),
+      h("br", null)));
+  }
+  renderTooltip() {
+    if (!this.tooltip)
+      return;
+    if (!this.cardData)
+      return;
+    const { title, year, author, description } = this.cardData;
+    return (h("z-tooltip", { content: `${title} ${year} ${author} ${description}`, type: TooltipPosition.RIGHT, onClick: () => (this.tooltip = false) }));
+  }
+  setExpirationLicenseMessage(type) {
+    if ((type === "online" && this.cardData.onlineLicense.expired) ||
+      (type === "offline" && this.cardData.offlineLicense.expired)) {
+      return h("span", { class: "expired" }, "SCADUTA");
+    }
+    if ((type === "online" && this.cardData.onlineLicense.expiring) ||
+      (type === "offline" && this.cardData.offlineLicense.expiring)) {
+      return h("span", { class: "expiring" }, "IN SCADENZA");
+    }
+  }
+  renderOnlineLicenseSection() {
+    var _a;
+    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.onlineLicense))
+      return;
+    return (h("section", { ref: (el) => (this.onlineLicenseWrapper = el) },
+      h("span", { class: "license-heading" },
+        h("span", null, "Licenza online"),
+        this.setExpirationLicenseMessage("online")),
+      "Scadenza il ",
+      h("b", null, this.cardData.onlineLicense.expiration),
+      h("br", null)));
+  }
+  renderOfflineLicenseSection() {
+    var _a;
+    if (!((_a = this === null || this === void 0 ? void 0 : this.cardData) === null || _a === void 0 ? void 0 : _a.offlineLicense))
+      return;
+    return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) },
+      h("span", { class: "license-heading" },
+        h("span", null, "Licenza offline"),
+        this.setExpirationLicenseMessage("offline")),
+      "Scadenza il ",
+      h("b", null, this.cardData.offlineLicense.expiration),
+      h("br", null),
+      "Installazioni disponibili:",
+      " ",
+      h("b", null, this.cardData.offlineLicense.installations)));
+  }
+  render() {
+    return (h("div", null,
+      this.renderCloseIcon(),
+      h("div", { class: "content-wrapper", ref: (el) => (this.contentWrapper = el) },
+        this.renderGeneralSection(),
+        this.renderTooltip(),
+        this.renderOnlineLicenseSection(),
+        this.renderOfflineLicenseSection()),
+      h("div", { class: "cta-wrapper" },
+        h("slot", null))));
+  }
+  static get is() { return "z-myz-card-info"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["styles.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["styles.css"]
+  }; }
+  static get properties() { return {
+    "data": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string | DictionaryData",
+        "resolved": "string | { author: string; year: string; title: string; description: string; onlineLicense: DictionaryLicenseData; offlineLicense: DictionaryLicenseData; }",
+        "references": {
+          "DictionaryData": {
+            "location": "import",
+            "path": "../../../../beans"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "dictionary info"
+      },
+      "attribute": "data",
+      "reflect": false
+    },
+    "htmltabindex": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "tabindex link attribute (optional)"
+      },
+      "attribute": "htmltabindex",
+      "reflect": false,
+      "defaultValue": "0"
+    }
+  }; }
+  static get states() { return {
+    "hiddenContent": {},
+    "tooltip": {}
+  }; }
+  static get events() { return [{
+      "method": "flipCard",
+      "name": "flipCard",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "flip card to front"
+      },
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      }
+    }]; }
+}