@zanichelli/albe-web-components 5.5.5 → 5.6.0

package/dist/collection/components/navigation/z-app-header/index.js

@@ -1,4 +1,4 @@
-import { Component, h, Element, Prop, State, Watch, Host, Event } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 const SUPPORT_INTERSECTION_OBSERVER = typeof IntersectionObserver !== 'undefined';
 /**
  * @slot title
@@ -107,29 +107,7 @@ export class ZAppHeader {
     }
   }
   render() {
-    return h(Host, { "menu-length": this.menuLength },
-      h("div", { class: "heading-panel", ref: (el) => this.container = el },
-        h("div", { class: "hero-container" },
-          h("slot", { name: "hero" }, this.hero && h("img", { alt: "", src: this.hero }))),
-        h("div", { class: "heading-container" },
-          h("div", { class: "heading-title" },
-            this.menuLength > 0 && h("button", { class: "drawer-trigger", "aria-label": "Apri menu", onClick: this.openDrawer },
-              h("z-icon", { name: "burger-menu" })),
-            h("slot", { name: "title" })),
-          h("div", { class: "heading-subtitle" },
-            h("slot", { name: "subtitle" }))),
-        h("div", { class: "menu-container" }, !this.drawerOpen && this.flow !== 'offcanvas' && h("slot", { name: "menu", onSlotchange: () => this.collectMenuElements() }))),
-      h("div", { class: "drawer-container" },
-        h("div", { class: "drawer-overlay", onClick: this.closeDrawer }),
-        h("div", { class: "drawer-panel" },
-          h("button", { class: "drawer-close", "aria-label": "Chiudi menu", onClick: this.closeDrawer },
-            h("z-icon", { name: "close" })),
-          h("div", { class: "drawer-content" }, this.drawerOpen && h("slot", { name: "menu", onSlotchange: () => this.collectMenuElements() })))),
-      this.stucked && h("div", { class: "heading-stucked" },
-        this.menuLength > 0 && h("button", { class: "drawer-trigger", "aria-label": "Apri menu", onClick: this.openDrawer },
-          h("z-icon", { name: "burger-menu" })),
-        h("div", { class: "heading-title" },
-          h("slot", { name: "stucked-title" }, this.title))));
+    return h(Host, { "menu-length": this.menuLength }, h("div", { class: "heading-panel", ref: (el) => this.container = el }, h("div", { class: "hero-container" }, h("slot", { name: "hero" }, this.hero && h("img", { alt: "", src: this.hero }))), h("div", { class: "heading-container" }, h("div", { class: "heading-title" }, this.menuLength > 0 && h("button", { class: "drawer-trigger", "aria-label": "Apri menu", onClick: this.openDrawer }, h("z-icon", { name: "burger-menu" })), h("slot", { name: "title" })), h("div", { class: "heading-subtitle" }, h("slot", { name: "subtitle" }))), h("div", { class: "menu-container" }, !this.drawerOpen && this.flow !== 'offcanvas' && h("slot", { name: "menu", onSlotchange: () => this.collectMenuElements() }))), h("div", { class: "drawer-container" }, h("div", { class: "drawer-overlay", onClick: this.closeDrawer }), h("div", { class: "drawer-panel" }, h("button", { class: "drawer-close", "aria-label": "Chiudi menu", onClick: this.closeDrawer }, h("z-icon", { name: "close" })), h("div", { class: "drawer-content" }, this.drawerOpen && h("slot", { name: "menu", onSlotchange: () => this.collectMenuElements() })))), this.stucked && h("div", { class: "heading-stucked" }, this.menuLength > 0 && h("button", { class: "drawer-trigger", "aria-label": "Apri menu", onClick: this.openDrawer }, h("z-icon", { name: "burger-menu" })), h("div", { class: "heading-title" }, h("slot", { name: "stucked-title" }, this.title))));
   }
   openDrawer() {
     this.drawerOpen = true;
@@ -139,132 +117,144 @@ export class ZAppHeader {
   }
   static get is() { return "z-app-header"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "stuck": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Stuck mode for the header.\nYou can programmatically set it using an IntersectionObserver.\n**Optional**"
-      },
-      "attribute": "stuck",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "hero": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set the hero image source for the header.\nYou can also use a slot=\"hero\" node for advanced customisation.\n**Optional**"
-      },
-      "attribute": "hero",
-      "reflect": false
-    },
-    "overlay": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Should place an overlay over the hero image.\nUseful for legibility purpose.\n**Optional**"
-      },
-      "attribute": "overlay",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "flow": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'auto'|'stack'|'offcanvas'",
-        "resolved": "\"auto\" | \"offcanvas\" | \"stack\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Control menu bar position in the header.\n- auto: the menu bar is positioned near the title\n- stack: the menu bar is positioned below the title\n- offcanvas: the menu bar is not displayed and a burger icon appears to open the offcanvas menu\n\n**Optional**"
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "stuck": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Stuck mode for the header.\nYou can programmatically set it using an IntersectionObserver.\n**Optional**"
+        },
+        "attribute": "stuck",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "flow",
-      "reflect": true,
-      "defaultValue": "'auto'"
-    },
-    "drawerOpen": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "hero": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set the hero image source for the header.\nYou can also use a slot=\"hero\" node for advanced customisation.\n**Optional**"
+        },
+        "attribute": "hero",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The opening state of the drawer."
+      "overlay": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Should place an overlay over the hero image.\nUseful for legibility purpose.\n**Optional**"
+        },
+        "attribute": "overlay",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "drawer-open",
-      "reflect": true,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "stucked": {},
-    "menuLength": {}
-  }; }
-  static get events() { return [{
-      "method": "sticking",
-      "name": "sticking",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the `stucked` state of the header changes"
+      "flow": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'auto'|'stack'|'offcanvas'",
+          "resolved": "\"auto\" | \"offcanvas\" | \"stack\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Control menu bar position in the header.\n- auto: the menu bar is positioned near the title\n- stack: the menu bar is positioned below the title\n- offcanvas: the menu bar is not displayed and a burger icon appears to open the offcanvas menu\n\n**Optional**"
+        },
+        "attribute": "flow",
+        "reflect": true,
+        "defaultValue": "'auto'"
       },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+      "drawerOpen": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The opening state of the drawer."
+        },
+        "attribute": "drawer-open",
+        "reflect": true,
+        "defaultValue": "false"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "stucked": {},
+      "menuLength": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "sticking",
+        "name": "sticking",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the `stucked` state of the header changes"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "stuck",
-      "methodName": "onStuckMode"
-    }, {
-      "propName": "stucked",
-      "methodName": "onStucked"
-    }, {
-      "propName": "drawerOpen",
-      "methodName": "setMenuFloatingMode"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "stuck",
+        "methodName": "onStuckMode"
+      }, {
+        "propName": "stucked",
+        "methodName": "onStucked"
+      }, {
+        "propName": "drawerOpen",
+        "methodName": "setMenuFloatingMode"
+      }];
+  }
 }

package/dist/collection/components/navigation/z-app-switcher/index.js

@@ -1,4 +1,4 @@
-import { Component, Event, h, Prop, State } from "@stencil/core";
+import { h } from "@stencil/core";
 import { ThemeVariant } from "../../../beans";
 export class ZAppSwitcher {
   constructor() {
@@ -12,59 +12,68 @@ export class ZAppSwitcher {
     this.appButtonClick.emit({ isopen: this.isopen });
   }
   render() {
-    return (h("button", { title: "app-switcher", onClick: () => this.emitAppButtonClick() },
-      h("z-icon", { name: "app-switcher", class: this.theme })));
+    return (h("button", { title: "app-switcher", onClick: () => this.emitAppButtonClick() }, h("z-icon", { name: "app-switcher", class: this.theme })));
   }
   static get is() { return "z-app-switcher"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "theme": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "ThemeVariantBean",
-        "resolved": "\"dark\" | \"light\"",
-        "references": {
-          "ThemeVariantBean": {
-            "location": "import",
-            "path": "../../../beans"
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "theme": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "ThemeVariantBean",
+          "resolved": "\"dark\" | \"light\"",
+          "references": {
+            "ThemeVariantBean": {
+              "location": "import",
+              "path": "../../../beans"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "theme variant, default 'dark'"
-      },
-      "attribute": "theme",
-      "reflect": false,
-      "defaultValue": "ThemeVariant.dark"
-    }
-  }; }
-  static get states() { return {
-    "isopen": {}
-  }; }
-  static get events() { return [{
-      "method": "appButtonClick",
-      "name": "appButtonClick",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "emitted on app button icon click, returns open/closed state"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "theme variant, default 'dark'"
+        },
+        "attribute": "theme",
+        "reflect": false,
+        "defaultValue": "ThemeVariant.dark"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "isopen": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "appButtonClick",
+        "name": "appButtonClick",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "emitted on app button icon click, returns open/closed state"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
 }