@zanichelli/albe-web-components 5.5.5 → 5.5.6-cs1

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

@@ -4,7 +4,7 @@
   --z-icon-width: 16px;
   --z-icon-height: 16px;
   --z-icon-right-margin: var(--space-unit);
-  --rgb-white: 240, 240, 240
+  --rgb-white: 240, 240, 240;
 }
 
 button:disabled,
@@ -15,55 +15,55 @@ button:disabled,
 button,
 ::slotted(button),
 ::slotted(a) {
-  box-sizing: border-box;
   display: inline-flex;
+  width: 100%;
+  box-sizing: border-box;
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  width: 100%;
-  font-family: var(--dashboard-font);
-  font-weight: var(--font-sb);
-  font-size: 14px;
-  line-height: 1;
-  letter-spacing: 0.3px;
   border-width: var(--border-size-medium);
   border-style: solid;
   border-radius: var(--border-radius);
-  vertical-align: middle;
-  text-transform: uppercase;
-  text-decoration: none;
   cursor: pointer;
-  white-space: nowrap;
+  fill: currentcolor;
+  font-family: var(--dashboard-font);
+  font-size: 14px;
+  font-weight: var(--font-sb);
+  letter-spacing: 0.3px;
+  line-height: 1;
   outline: none;
-  fill: currentColor;
+  text-decoration: none;
+  text-transform: uppercase;
+  vertical-align: middle;
+  white-space: nowrap;
 }
 
 button.big,
 :host([size="big"]) ::slotted(button),
 :host([size="big"]) ::slotted(a) {
-  height: 44px;
   min-width: 44px;
+  height: 44px;
 }
 
 button.small,
 :host([size="small"]) ::slotted(button),
 :host([size="small"]) ::slotted(a) {
-  height: 36px;
   min-width: 36px;
+  height: 36px;
 }
 
 button.issmall,
 :host([issmall]) ::slotted(button),
 :host([issmall]) ::slotted(a) {
-  height: 36px;
   min-width: 36px;
+  height: 36px;
 }
 
 button.x-small,
 :host([size="x-small"]) ::slotted(button),
 :host([size="x-small"]) ::slotted(a) {
-  height: 32px;
   min-width: 32px;
+  height: 32px;
 }
 
 button:not(.square),
@@ -81,8 +81,8 @@ button.square,
 button.primary,
 :host([variant="primary"]) ::slotted(button),
 :host([variant="primary"]) ::slotted(a) {
-  background-color: var(--color-primary01);
   border-color: var(--color-primary01);
+  background-color: var(--color-primary01);
   color: var(--color-text-inverse);
 }
 
@@ -90,8 +90,8 @@ button.primary,
   button.primary:hover,
   :host([variant="primary"]) ::slotted(button:hover),
   :host([variant="primary"]) ::slotted(a:hover) {
-    background-color: var(--color-hover-primary);
     border-color: var(--color-hover-primary);
+    background-color: var(--color-hover-primary);
     color: var(--color-text-inverse);
   }
 }
@@ -105,24 +105,24 @@ button:focus:focus-visible,
 button.primary:active,
 :host([variant="primary"]) ::slotted(button:active),
 :host([variant="primary"]) ::slotted(a:active) {
-  background-color: var(--color-pressed-primary);
   border-color: var(--color-pressed-primary);
-  color: var(--color-text-inverse);
+  background-color: var(--color-pressed-primary);
   box-shadow: var(--shadow-2);
+  color: var(--color-text-inverse);
 }
 
 button.primary:disabled,
 :host([variant="primary"]) ::slotted(button:disabled) {
-  background-color: var(--color-disabled01);
   border-color: var(--color-disabled01);
+  background-color: var(--color-disabled01);
   color: var(--color-disabled02);
 }
 
 button.secondary,
 :host([variant="secondary"]) ::slotted(button),
 :host([variant="secondary"]) ::slotted(a) {
-  background-color: var(--color-surface01);
   border-color: var(--color-primary01);
+  background-color: var(--color-surface01);
   color: var(--color-primary01);
 }
 
@@ -130,8 +130,8 @@ button.secondary,
   button.secondary:hover,
   :host([variant="secondary"]) ::slotted(button:hover),
   :host([variant="secondary"]) ::slotted(a:hover) {
-    background-color: var(--color-surface01);
     border-color: var(--color-hover-primary);
+    background-color: var(--color-surface01);
     color: var(--color-hover-primary);
   }
 }
@@ -139,28 +139,28 @@ button.secondary,
 button.secondary:active,
 :host([variant="secondary"]) ::slotted(button:active),
 :host([variant="secondary"]) ::slotted(a:active) {
-  background-color: var(--color-surface01);
   border-color: var(--color-pressed-primary);
-  color: var(--color-pressed-primary);
+  background-color: var(--color-surface01);
   box-shadow: var(--shadow-2);
+  color: var(--color-pressed-primary);
 }
 
 button.secondary:disabled,
 :host([variant="secondary"]) ::slotted(button:disabled) {
-  background-color: var(--color-surface01);
   border-color: var(--color-disabled01);
+  background-color: var(--color-surface01);
   color: var(--color-disabled02);
 }
 
 button.tertiary,
 :host([variant="tertiary"]) ::slotted(button),
 :host([variant="tertiary"]) ::slotted(a) {
-  background-color: transparent;
   border-color: transparent;
+  background-color: transparent;
   color: var(--color-primary01);
 }
 
-button.tertiary.hasContent {
+button.tertiary.has-content {
   padding: 0 var(--space-unit);
 }
 
@@ -168,8 +168,8 @@ button.tertiary.hasContent {
   button.tertiary:hover,
   :host([variant="tertiary"]) ::slotted(button:hover),
   :host([variant="tertiary"]) ::slotted(a:hover) {
-    background-color: var(--color-primary03);
     border-color: var(--color-primary03);
+    background-color: var(--color-primary03);
     color: var(--color-hover-primary);
   }
 }
@@ -177,36 +177,36 @@ button.tertiary.hasContent {
 button.tertiary:focus:focus-visible,
 :host([variant="tertiary"]) ::slotted(button:focus:focus-visible),
 :host([variant="tertiary"]) ::slotted(a:focus:focus-visible) {
-  background-color: var(--color-surface01);
   border-color: var(--color-surface01);
+  background-color: var(--color-surface01);
   color: var(--color-primary01);
 }
 
 button.tertiary:active,
 :host([variant="tertiary"]) ::slotted(button:active),
 :host([variant="tertiary"]) ::slotted(a:active) {
-  background-color: var(--color-surface01);
   border-color: var(--color-surface01);
-  color: var(--color-primary01);
+  background-color: var(--color-surface01);
   box-shadow: var(--shadow-2);
+  color: var(--color-primary01);
 }
 
 button.tertiary:disabled,
 :host([variant="tertiary"]) ::slotted(button:disabled) {
-  background-color: transparent;
   border-color: transparent;
+  background-color: transparent;
   color: var(--color-disabled02);
 }
 
 button.dark-bg,
 :host([variant="dark-bg"]) ::slotted(button),
 :host([variant="dark-bg"]) ::slotted(a) {
-  background-color: rgba(var(--rgb-white), 0.2);
   border-color: transparent;
+  background-color: rgb(var(--rgb-white) 0.2);
   color: var(--color-text04);
 }
 
-button.dark-bg.hasContent {
+button.dark-bg.has-content {
   padding: 0 var(--space-unit);
 }
 
@@ -214,18 +214,18 @@ button.dark-bg.hasContent {
   button.dark-bg:hover,
   :host([variant="dark-bg"]) ::slotted(button:hover),
   :host([variant="dark-bg"]) ::slotted(a:hover) {
-    background-color: rgba(var(--rgb-white), 0.1);
+    background-color: rgb(var(--rgb-white) 0.1);
   }
 }
 
 button.dark-bg:active,
 :host([variant="dark-bg"]) ::slotted(button:active),
 :host([variant="dark-bg"]) ::slotted(a:active) {
-  background-color: rgba(var(--rgb-white), 0.3);
+  background-color: rgb(var(--rgb-white) 0.3);
 }
 
 button.dark-bg:disabled,
 :host([variant="dark-bg"]) ::slotted(button:disabled) {
+  background-color: rgb(var(--rgb-white) 0.05);
   color: var(--color-disabled03);
-  background-color: rgba(var(--rgb-white), 0.05);
 }

package/dist/collection/deprecated/z-button-filter/index.js

@@ -1,4 +1,4 @@
-import { Component, Prop, Event, h } from "@stencil/core";
+import { h } from "@stencil/core";
 export class ZButtonFilter {
   constructor() {
     /** disable action on button */
@@ -15,18 +15,15 @@ export class ZButtonFilter {
     });
   }
   renderFixedPillow(filtername) {
-    return (h("button", { class: `container ${this.issmall ? "small" : ""}` },
-      this.renderIcon(),
-      this.renderContent(filtername)));
+    return (h("button", { class: `container ${this.issmall ? "small" : ""}` }, this.renderIcon(), this.renderContent(filtername)));
   }
   renderDynamicPillow(filtername) {
-    return (h("button", { class: `container isactive ${this.issmall ? "small" : ""}`, onClick: this.handleRemovingFilterClick },
-      this.renderIcon(),
-      this.renderContent(filtername)));
+    return (h("button", { class: `container isactive ${this.issmall ? "small" : ""}`, onClick: this.handleRemovingFilterClick }, this.renderIcon(), this.renderContent(filtername)));
   }
   renderIcon() {
-    if (!this.hasicon)
+    if (!this.hasicon) {
       return null;
+    }
     return (h("z-icon", { class: "close-icon-container", name: "multiply", height: 12, width: 12 }));
   }
   renderContent(filtername) {
@@ -40,116 +37,124 @@ export class ZButtonFilter {
   }
   static get is() { return "z-button-filter"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "filtername": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "filter text content"
-      },
-      "attribute": "filtername",
-      "reflect": false
-    },
-    "isfixed": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "disable action on button"
-      },
-      "attribute": "isfixed",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "hasicon": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "add icon to button"
-      },
-      "attribute": "hasicon",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "filterid": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "filter id"
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "filtername": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "filter text content"
+        },
+        "attribute": "filtername",
+        "reflect": false
       },
-      "attribute": "filterid",
-      "reflect": false
-    },
-    "issmall": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "isfixed": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "disable action on button"
+        },
+        "attribute": "isfixed",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "reduce button size (optional)"
+      "hasicon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "add icon to button"
+        },
+        "attribute": "hasicon",
+        "reflect": false,
+        "defaultValue": "true"
       },
-      "attribute": "issmall",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get events() { return [{
-      "method": "removefilter",
-      "name": "removefilter",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "remove filter click event, returns filterid"
+      "filterid": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "filter id"
+        },
+        "attribute": "filterid",
+        "reflect": false
       },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+      "issmall": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "reduce button size (optional)"
+        },
+        "attribute": "issmall",
+        "reflect": false,
+        "defaultValue": "false"
       }
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "removefilter",
+        "name": "removefilter",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "remove filter click event, returns filterid"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
 }

package/dist/collection/deprecated/z-button-filter/styles.css

@@ -1,27 +1,17 @@
 button.container {
   min-height: 32px;
-  line-height: 32px;
-
+  padding: 0 calc(var(--space-unit) * 2);
   border: var(--border-size-small) solid var(--bg-grey-200);
   border-radius: 16px;
-
-  box-shadow: 0px 2px 5px 0px var(--bg-neutral-300);
-  -webkit-box-shadow: 0px 2px 5px 0px var(--bg-neutral-300);
-  -moz-box-shadow: 0px 2px 5px 0px var(--bg-neutral-300);
-
-  text-align: center;
-
-  padding: 0 calc(var(--space-unit) * 2);
-
+  box-shadow: 0 2px 5px 0 var(--bg-neutral-300);
   cursor: pointer;
-
-  letter-spacing: 0.17px;
   font-family: var(--dashboard-font);
   font-size: 12px;
   font-weight: var(--font-sb);
-
+  letter-spacing: 0.17px;
+  line-height: 32px;
   opacity: 1;
-
+  text-align: center;
   transition: all 200ms linear;
 }
 
@@ -62,9 +52,9 @@ button.container.isactive:hover {
 }
 
 button.container.isactive:focus {
-  background-color: var(--myz-blue-dark);
   border-color: var(--myz-blue-dark);
-  box-shadow: 0px 0px 4px 0px var(--text-grey-800);
+  background-color: var(--myz-blue-dark);
+  box-shadow: 0 0 4px 0 var(--text-grey-800);
   color: var(--bg-white);
   fill: var(--bg-white);
 }

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

@@ -1,59 +1,59 @@
-import { Component, Prop, h } from '@stencil/core';
+import { h } from "@stencil/core";
 export class ZChipDeprecated {
   renderLegacyChip() {
-    return h("div", null,
-      h("span", { class: "boldtext" }, this.boldtext),
-      " ",
-      this.regulartext);
+    return (h("div", null, h("span", { class: "boldtext" }, this.boldtext), " ", this.regulartext));
   }
   render() {
-    return this.boldtext != null || this.regulartext != null ?
-      this.renderLegacyChip() :
-      h("div", null,
-        h("slot", null));
+    return this.boldtext != null || this.regulartext != null ? (this.renderLegacyChip()) : (h("div", null, h("slot", null)));
   }
   static get is() { return "z-chip-deprecated"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "regulartext": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "regulartext",
-      "reflect": false
-    },
-    "boldtext": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "regulartext": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Text with regular font weight"
+        },
+        "attribute": "regulartext",
+        "reflect": false
       },
-      "attribute": "boldtext",
-      "reflect": false
-    }
-  }; }
+      "boldtext": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Text with bold font weight"
+        },
+        "attribute": "boldtext",
+        "reflect": false
+      }
+    };
+  }
 }

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

@@ -1,15 +1,15 @@
 :host > div {
   display: inline-block;
   min-height: 28px;
-  line-height: 28px;
   padding: 0 calc(var(--space-unit) * 1.5);
-  background-color: var(--bg-white);
   border: var(--border-size-small) solid var(--bg-grey-200);
+  background-color: var(--bg-white);
   border-radius: 14px;
   color: var(--text-grey-800);
   fill: var(--text-grey-800);
   font-family: var(--dashboard-font);
   font-size: 12px;
+  line-height: 28px;
 }
 
 .boldtext {