@zanichelli/zanichelli-it-frontend-kit 1.4.0-RC2 → 1.4.0-RC3

package/dist/collection/components/menubar/menubar.css

@@ -0,0 +1,170 @@
+:host {
+  --zanit-menubar-max-width: ;
+  --zanit-menubar-top-offset: ;
+
+  position: relative;
+  z-index: 2;
+  display: flex;
+  width: 100%;
+  background-color: #fff;
+  color: var(--gray900);
+  font-family: var(--font-family-sans);
+}
+
+:host,
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+*:focus:focus-visible {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none;
+}
+
+ul {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+
+a {
+  color: var(--gray900);
+  cursor: pointer;
+  text-decoration: none;
+}
+
+button {
+  all: unset;
+  cursor: pointer;
+}
+
+:host nav {
+  width: 100%;
+}
+
+.shadow-wrapper {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  width: 100%;
+}
+
+.shadow-wrapper::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  background: transparent;
+  box-shadow: var(--shadow-1);
+  content: '';
+  pointer-events: none;
+}
+
+.width-limiter {
+  position: relative;
+  display: flex;
+  width: 100%;
+  max-width: var(--zanit-menubar-max-width, 1366px);
+  margin: 0 auto;
+}
+
+.shadow-wrapper + .shadow-wrapper {
+  z-index: 0;
+}
+
+.sub-menubar > ul {
+  gap: 28px;
+}
+
+.width-limiter > ul,
+.sub-menubar > ul {
+  position: relative;
+  z-index: 3;
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding: 0 var(--grid-margin);
+  margin-right: auto;
+  margin-left: auto;
+  gap: 20px;
+}
+
+.shadow-wrapper > .width-limiter,
+.shadow-wrapper > ul {
+  width: 100%;
+  max-width: var(--zanit-menubar-max-width, 1366px);
+}
+
+ul.menubar {
+  height: 3rem;
+  padding-right: 0;
+}
+
+.menubar z-ghost-loading {
+  display: block;
+  width: 120px;
+  height: 1.25rem;
+}
+
+/* separator bar */
+.menubar > li[role='separator'] {
+  width: 1px;
+  height: 1.25rem;
+  background-color: #000;
+}
+
+.menubar-item {
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding: 14px 0;
+  font-size: 1rem;
+  gap: 8px;
+  line-height: 1.25rem;
+}
+
+.menubar .menubar-item {
+  text-transform: uppercase;
+}
+
+.menubar-item [data-text] {
+  display: flex;
+  flex-direction: column;
+}
+
+.menubar-item.active > [data-text],
+.menubar-item:hover > [data-text],
+.menubar-item:focus:focus-visible > [data-text] {
+  font-weight: var(--font-bd);
+}
+
+/* To avoid size changes in the element, when it is hovered and becomes bold,
+we put the same text already bold with height 0, so as to always occupy the maximum necessary width. */
+.menubar-item > [data-text]::after {
+  height: 0;
+  content: attr(data-text) / '';
+  font-weight: var(--font-bd);
+  letter-spacing: normal;
+  pointer-events: none;
+  user-select: none;
+  visibility: hidden;
+}
+
+/* active item bottom border */
+.sub-menubar .menubar-item.active::after {
+  position: absolute;
+  z-index: -1;
+  bottom: 0;
+  left: -4px;
+  width: calc(100% + 8px); /* the border is 4px per side larger than its container */
+  height: 4px;
+  background-color: var(--red500);
+  content: '';
+}
+
+zanit-search-form {
+  margin-left: auto;
+}

package/dist/{zanichelli-it-frontend-kit/zanit-menubar.entry.js → collection/components/menubar/menubar.js}

@@ -1,16 +1,14 @@
-import { r as registerInstance, a as getElement, h, F as Fragment } from './index-DPw_TAEB.js';
-import { S as SearchEnv, c as containsTarget, m as moveFocus } from './subjects.api-BRhngFD0.js';
-import { M as Menu } from './menu-BsP3cOc_.js';
-
-const menubarCss = ":host{position:relative;z-index:2;display:flex;width:100%;background-color:#fff;color:var(--gray900);font-family:var(--font-family-sans)}:host,*,::before,::after{box-sizing:border-box}*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}ul{padding:0;margin:0;list-style:none}a{color:var(--gray900);cursor:pointer;text-decoration:none}button{all:unset;cursor:pointer}:host nav{width:100%}.shadow-wrapper{position:relative;z-index:1;display:flex;width:100%}.shadow-wrapper::after{position:absolute;top:0;right:0;width:100%;height:100%;background:transparent;box-shadow:var(--shadow-1);content:'';pointer-events:none}.width-limiter{position:relative;display:flex;width:100%;max-width:var(--zanit-menubar-max-width, 1366px);margin:0 auto}.shadow-wrapper+.shadow-wrapper{z-index:0}.sub-menubar>ul{gap:28px}.width-limiter>ul,.sub-menubar>ul{position:relative;z-index:3;display:flex;width:100%;align-items:center;padding:0 var(--grid-margin);margin-right:auto;margin-left:auto;gap:20px}.shadow-wrapper>.width-limiter,.shadow-wrapper>ul{width:100%;max-width:var(--zanit-menubar-max-width, 1366px)}ul.menubar{height:3rem;padding-right:0}.menubar z-ghost-loading{display:block;width:120px;height:1.25rem}.menubar>li[role='separator']{width:1px;height:1.25rem;background-color:#000}.menubar-item{position:relative;display:flex;align-items:center;padding:14px 0;font-size:1rem;gap:8px;line-height:1.25rem}.menubar .menubar-item{text-transform:uppercase}.menubar-item [data-text]{display:flex;flex-direction:column}.menubar-item.active>[data-text],.menubar-item:hover>[data-text],.menubar-item:focus:focus-visible>[data-text]{font-weight:var(--font-bd)}.menubar-item>[data-text]::after{height:0;content:attr(data-text) / '';font-weight:var(--font-bd);letter-spacing:normal;pointer-events:none;user-select:none;visibility:hidden}.sub-menubar .menubar-item.active::after{position:absolute;z-index:-1;bottom:0;left:-4px;width:calc(100% + 8px);height:4px;background-color:var(--red500);content:''}zanit-search-form{margin-left:auto}";
-
-const menuCss = ".menu-wrapper{width:100%;background-color:#fff}.menu{position:relative;display:flex;width:100%;flex-direction:column;gap:32px 0}.menu .group{display:flex;flex-direction:column}.menu .group .group-name{border-bottom:1px solid currentcolor;margin-bottom:4px;color:var(--red500);font-size:0.875rem;font-weight:var(--font-md)}.menu .group .menu-list{display:flex;flex-direction:column;gap:8px}.menu .group .menu-list .menu-item{display:block;border-bottom:2px solid transparent;font-size:0.875rem;font-weight:var(--font-md)}.menu .menu-list .menu-item.active,.menu .menu-list .menu-item:hover{border-bottom-color:var(--red500)}.menu .group.highlight .menu-list .menu-item{font-size:1rem}@media (width >= 768px){.menu-wrapper{position:absolute;top:100%;left:0;display:flex;justify-content:center;box-shadow:var(--shadow-1)}.menu{display:grid;width:100%;max-width:var(--zanit-menubar-max-width, 1366px);padding:16px var(--grid-margin);gap:0 24px;grid-auto-columns:minmax(0, max-content);grid-auto-flow:column;grid-template-rows:minmax(0, max-content) max-content}.menu .group{display:grid;grid-row:1 / -1;grid-template-columns:1fr;grid-template-rows:subgrid}@supports not (grid-template-rows: subgrid){.menu .group{grid-template-rows:repeat(auto-fit, minmax(0, max-content))}}.menu .group .group-name{border:none;margin-bottom:16px}.menu .group .menu-list .menu-item{font-size:1rem}.menu .group.highlight .menu-list .menu-item{font-size:1.5rem}}";
-
-const ZanitMenubar = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    get host() { return getElement(this); }
+import { Fragment, h } from "@stencil/core";
+import { containsTarget, moveFocus } from "../../utils";
+import { Menu } from "./menu/menu";
+import { SearchEnv } from "../../utils/subjects.api";
+/**
+ * Main menubar component. Each item can have a menu with subitems
+ * When a main menubar item is the current active one, a sub-menubar is shown and each subitem can have a menu with subitems.
+ * @cssprop {--zanit-menubar-max-width} Maximum width of the menubar.
+ */
+export class ZanitMenubar {
+    host;
     /** Menubar items extracted from `data`. */
     items = [];
     /** ID of the currently open menu. */
@@ -395,16 +393,196 @@ const ZanitMenubar = class {
                 'active': this.isActive(subitem),
             }, href: subitem.href, id: subitem.id, role: "menuitem", tabIndex: -1, "aria-haspopup": subitem.menuItems?.length ? 'true' : 'false', "aria-expanded": subitem.menuItems?.length ? (this.openMenu === subitem.id ? 'true' : 'false') : undefined, "aria-current": this.current.includes(subitem.id) ? 'page' : 'false', onPointerOver: () => this.showMenu(subitem), onKeyDown: (event) => this.handleItemKeydown(event, subitem), target: item.target }, h("span", null, subitem.label), subitem.menuItems?.length > 0 && (h("z-icon", { name: this.openMenu === subitem.id ? 'chevron-up' : 'chevron-down', width: "0.75rem", height: "0.75rem" })))))))), item.navbarItems.map((subitem) => this.openMenu === subitem.id && (h(Menu, { controlledBy: subitem.id, items: subitem.menuItems, currentPath: this.currentPath, onItemKeyDown: (event) => this.handleMenuKeydown(event) }))))))));
     }
+    static get is() { return "zanit-menubar"; }
+    static get encapsulation() { return "shadow"; }
     static get delegatesFocus() { return true; }
-    static get watchers() { return {
-        "data": ["parseData"],
-        "items": ["onItemsChange"],
-        "current": ["onCurrentChange"]
-    }; }
-};
-ZanitMenubar.style = menubarCss + menuCss;
-
-export { ZanitMenubar as zanit_menubar };
-//# sourceMappingURL=zanit-menubar.entry.esm.js.map
-
-//# sourceMappingURL=zanit-menubar.entry.js.map
+    static get originalStyleUrls() {
+        return {
+            "$": ["menubar.css", "menu/menu.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["menubar.css", "menu/menu.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "data": {
+                "type": "string",
+                "attribute": "data",
+                "mutable": false,
+                "complexType": {
+                    "original": "Promise<MenubarItem[]> | MenubarItem[] | URL | string",
+                    "resolved": "MenubarItem[] | Promise<MenubarItem[]> | URL | string",
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "MenubarItem": {
+                            "location": "import",
+                            "path": "../../utils",
+                            "id": "src/utils/index.ts::MenubarItem"
+                        },
+                        "URL": {
+                            "location": "global",
+                            "id": "global::URL"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The data to build the menu (as an array of `MenubarItem` or a JSON array) or the url to fetch to retrieve it."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "current": {
+                "type": "string",
+                "attribute": "current",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | undefined",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Path of the current item."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "undefined"
+            },
+            "searchQuery": {
+                "type": "string",
+                "attribute": "search-query",
+                "mutable": true,
+                "complexType": {
+                    "original": "string | undefined",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Initial search query."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "undefined"
+            },
+            "searchEnv": {
+                "type": "string",
+                "attribute": "search-env",
+                "mutable": false,
+                "complexType": {
+                    "original": "SearchEnv",
+                    "resolved": "SearchEnv.DEV | SearchEnv.PROD | SearchEnv.TEST",
+                    "references": {
+                        "SearchEnv": {
+                            "location": "import",
+                            "path": "../../utils/subjects.api",
+                            "id": "src/utils/subjects.api.ts::SearchEnv"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Environment for search suggestions"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "SearchEnv.PROD"
+            },
+            "searchArea": {
+                "type": "string",
+                "attribute": "search-area",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | undefined",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Search area (e.g. \"SCUOLA\", \"UNIVERSIT\u00C0\", \"DIZIONARI\")."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "items": {},
+            "openMenu": {},
+            "openNavbar": {},
+            "currentPath": {},
+            "isMobile": {},
+            "loading": {}
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "data",
+                "methodName": "parseData"
+            }, {
+                "propName": "items",
+                "methodName": "onItemsChange"
+            }, {
+                "propName": "current",
+                "methodName": "onCurrentChange"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "click",
+                "method": "handleOutsideClick",
+                "target": "document",
+                "capture": false,
+                "passive": true
+            }, {
+                "name": "keydown",
+                "method": "handleKeydown",
+                "target": "document",
+                "capture": false,
+                "passive": true
+            }, {
+                "name": "mouseover",
+                "method": "handleMouseover",
+                "target": undefined,
+                "capture": false,
+                "passive": true
+            }, {
+                "name": "mouseout",
+                "method": "handleMouseout",
+                "target": undefined,
+                "capture": false,
+                "passive": true
+            }, {
+                "name": "focusout",
+                "method": "handleFocusout",
+                "target": undefined,
+                "capture": false,
+                "passive": true
+            }];
+    }
+}
+//# sourceMappingURL=menubar.js.map

package/dist/collection/components/menubar/menubar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menubar.js","sourceRoot":"","sources":["../../../src/components/menubar/menubar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAe,cAAc,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAErD;;;;GAIG;AAQH,MAAM,OAAO,YAAY;IACZ,IAAI,CAA0B;IAEzC,2CAA2C;IAE3C,KAAK,GAAkB,EAAE,CAAC;IAE1B,qCAAqC;IAErC,QAAQ,GAAuB,SAAS,CAAC;IAEzC,sDAAsD;IAEtD,UAAU,GAAuB,SAAS,CAAC;IAE3C,8BAA8B;IAE9B,WAAW,GAAa,EAAE,CAAC;IAG3B,QAAQ,GAAY,KAAK,CAAC;IAG1B,OAAO,GAAY,KAAK,CAAC;IAEzB,oHAAoH;IAEpH,IAAI,CAAwD;IAE5D,gCAAgC;IAEhC,OAAO,GAAuB,SAAS,CAAC;IAExC,4BAA4B;IAE5B,WAAW,GAAuB,SAAS,CAAC;IAE5C,yCAAyC;IACjC,SAAS,GAAc,SAAS,CAAC,IAAI,CAAC;IAE9C,+DAA+D;IACvD,UAAU,CAAsB;IAEhC,OAAO,CAAS;IAExB,+BAA+B;IAE/B,KAAK,CAAC,SAAS,CAAC,IAAsB;QACpC,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,OAAO;QACT,CAAC;QAED,IAAI,IAAI,YAAY,GAAG,EAAE,CAAC;YACxB,IAAI,CAAC,KAAK,GAAG,MAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAC1C,CAAC;aAAM,IAAI,IAAI,YAAY,OAAO,EAAE,CAAC;YACnC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,IAAI,CAAC,KAAK,GAAG,MAAM,IAAI,CAAC;YACxB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACvB,CAAC;aAAM,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE,CAAC;YACpC,IAAI,CAAC;gBACH,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;gBAC9B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAA0B,CAAC,EAAE,CAAC;oBAC3F,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;gBAC/D,CAAC;YACH,CAAC;YAAC,MAAM,CAAC;gBACP,IAAI,GAAQ,CAAC;gBACb,IAAI,CAAC;oBACH,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;gBACtB,CAAC;gBAAC,MAAM,CAAC;oBACP,MAAM,IAAI,KAAK,CAAC,uEAAuE,CAAC,CAAC;gBAC3F,CAAC;gBAED,IAAI,CAAC,KAAK,GAAG,MAAM,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;YACzC,CAAC;QACH,CAAC;aAAM,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAA0B,CAAC,EAAE,CAAC;YACnF,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QACpB,CAAC;aAAM,CAAC;YACN,MAAM,IAAI,KAAK,CACb,oGAAoG,CACrG,CAAC;QACJ,CAAC;IACH,CAAC;IAGD,aAAa;QACX,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAGD,eAAe;QACb,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACpE,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;QAC9D,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,OAAO,CAAC;QACzC,gBAAgB,CAAC,QAAQ,GAAG,CAAC,GAAG,EAAE,EAAE;YAClC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC;YAC5B,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC5B,CAAC,CAAC;QACF,MAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAChC,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,iDAAiD;IAEjD,kBAAkB,CAAC,KAAiB;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;YACvD,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED;;OAEG;IAEH,aAAa,CAAC,KAAoB;QAChC,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,QAAQ,CAAC,CAAC,CAAC;gBACd,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;oBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,iDAAiD;oBACjD,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC;oBACpC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;oBAC1B,gFAAgF;oBAChF,UAAU,CAAC,GAAG,EAAE;wBACd,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;wBACvE,IAAI,WAAW,EAAE,CAAC;4BAChB,WAAW,CAAC,KAAK,EAAE,CAAC;wBACtB,CAAC;oBACH,CAAC,EAAE,CAAC,CAAC,CAAC;gBACR,CAAC;gBACD,MAAM;YACR,CAAC;YACD,KAAK,KAAK;gBACR,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;gBAC1B,MAAM;QACV,CAAC;IACH,CAAC;IAGD,eAAe;QACb,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAC7B,CAAC;IAED;;;OAGG;IAEH,cAAc,CAAC,KAAiB;QAC9B,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACpC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;gBACvD,OAAO;YACT,CAAC;YAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;QAC5B,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAED,0CAA0C;IAE1C,cAAc,CAAC,KAAiB;QAC9B,MAAM,aAAa,GAAG,KAAK,CAAC,aAA4B,CAAC;QACzD,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;YAC3F,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,kCAAkC;IAC1B,KAAK,CAAC,SAAS,CAAC,GAAQ;QAC9B,IAAI,CAAC;YACH,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;YAC7C,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YACrB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAA0B,CAAC,EAAE,CAAC;gBAC9E,MAAM,IAAI,KAAK,CAAC,gEAAgE,CAAC,CAAC;YACpF,CAAC;YAED,OAAO,IAAqB,CAAC;QAC/B,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YACrB,OAAO,CAAC,KAAK,CAAC,8BAA8B,EAAE,KAAK,CAAC,CAAC;YACrD,MAAM,IAAI,KAAK,CAAC,qDAAqD,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;QAC3F,CAAC;IACH,CAAC;IAED,yFAAyF;IACjF,YAAY;QAClB,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;gBAC7E,OAAO;qBACJ,gBAAgB,CAAC,mBAAmB,CAAC;oBACtC,EAAE,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;YACxF,CAAC,CAAC,CAAC;QACL,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAED,iIAAiI;IACzH,QAAQ,CAAC,IAAiB;QAChC,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAClC,OAAO,KAAK,CAAC;QACf,CAAC;QAED,IAAI,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;YACvC,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;YAC3B,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;QACzE,CAAC;QAED,IAAI,IAAI,CAAC,WAAW,EAAE,MAAM,EAAE,CAAC;YAC7B,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC;YAClF,IAAI,QAAQ,EAAE,CAAC;gBACb,OAAO,IAAI,CAAC;YACd,CAAC;QACH,CAAC;QAED,OAAO,KAAK,CAAC;IACf,CAAC;IAED,iEAAiE;IACzD,QAAQ,CAAC,IAAiB;QAChC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,CAAC,4BAA4B;QACvD,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;YAC5B,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC;IAC1B,CAAC;IAED,yEAAyE;IACjE,wBAAwB,CAAC,MAAmB;QAClD,OAAO,KAAK,CAAC,IAAI,CACf,MAAM,EAAE,OAAO,CAAC,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gCAAgC,CAAC,IAAI,EAAE,CAC7E,CAAC;IACrB,CAAC;IAED,mHAAmH;IAC3G,iBAAiB,CAAC,MAAmB;QAC3C,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,CAAC,4BAA4B;QACvD,MAAM,eAAe,GAAG,IAAI,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC;QAC9D,MAAM,YAAY,GAAG,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,eAAe,CAAC,CAAC,YAAY,GAAG,CAAC,GAAG,eAAe,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,gCAAgC;QACxI,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAC5B,kDAAkD;QAClD,IAAI,QAAQ,CAAC,YAAY,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACtD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,gHAAgH;IACxG,aAAa,CAAC,MAAmB;QACvC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,CAAC,4BAA4B;QACvD,MAAM,eAAe,GAAG,IAAI,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC;QAC9D,MAAM,YAAY,GAAG,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,eAAe,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,6BAA6B;QAC5G,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAC5B,kDAAkD;QAClD,IAAI,QAAQ,CAAC,YAAY,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACtD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,oDAAoD;IAC5C,iBAAiB,CAAC,KAAoB,EAAE,IAAiB;QAC/D,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAC3C,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,MAAM,CAAC,CAAC,CAAC;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC3D,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;gBAC7B,MAAM;YACR,CAAC;YACD,KAAK,KAAK,CAAC,CAAC,CAAC;gBACX,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,QAAQ,GAAG,IAAI,CAAC,wBAAwB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC;gBAC7D,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;gBAC5B,MAAM;YACR,CAAC;YACD,KAAK,SAAS,CAAC,CAAC,CAAC;gBACf,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;oBAC5B,MAAM;gBACR,CAAC;gBACD,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC;gBACxB,8BAA8B;gBAC9B,UAAU,CAAC,GAAG,EAAE;oBACd,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAC1B,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,oBAAoB,IAAI,CAAC,EAAE,qBAAqB,CAAC,CACvE,CAAC;oBACnB,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;gBACrD,CAAC,EAAE,GAAG,CAAC,CAAC;gBACR,MAAM;YACR,CAAC;YACD,KAAK,YAAY,CAAC,CAAC,CAAC;gBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;gBAC3B,MAAM;YACR,CAAC;YACD,KAAK,WAAW,CAAC,CAAC,CAAC;gBACjB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;oBAC5B,MAAM;gBACR,CAAC;gBAED,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;gBACxB,MAAM;YACR,CAAC;YACD,KAAK,WAAW,CAAC,CAAC,CAAC;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;gBAC/B,MAAM;YACR,CAAC;YACD,KAAK,GAAG,CAAC,CAAC,CAAC;gBACT,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,EAAE,CAAC;oBAC9B,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;oBAC1B,MAAM;gBACR,CAAC;qBAAM,IAAI,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;oBAClC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;oBACxB,MAAM;gBACR,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,kDAAkD;IAC1C,gBAAgB,CAAC,cAA2B;QAClD,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CACvB,cAAc,EAAE,OAAO,CAAC,eAAe,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAClE,CAAC;QACnB,MAAM,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAEpD,OAAO,MAAM,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;IAClC,CAAC;IAED,8CAA8C;IACtC,YAAY,CAAC,cAA2B;QAC9C,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CACvB,cAAc,EAAE,OAAO,CAAC,eAAe,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAClE,CAAC;QACnB,MAAM,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAEpD,OAAO,MAAM,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;IAClC,CAAC;IAEO,YAAY,CAAC,IAAiB;QACpC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC;QACxB,UAAU,CAAC,GAAG,EAAE;YACd,+BAA+B;YAC/B,MAAM,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CACtD,oBAAoB,IAAI,CAAC,EAAE,qBAAqB,CAClC,CAAC;YACjB,aAAa,CAAC,QAAQ,GAAG,CAAC,CAAC;YAC3B,aAAa,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;QAC/C,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAED,gEAAgE;IACxD,iBAAiB,CAAC,KAAoB;QAC5C,MAAM,WAAW,GAAG,KAAK,CAAC,MAAqB,CAAC;QAChD,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CACtB,WAAW,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,gBAAgB,CAAC,mBAAmB,CAAC,IAAI,EAAE,CACjE,CAAC;QACnB,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QAChD,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,SAAS,CAAC,CAAC,CAAC;gBACf,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,QAAQ,GAAG,KAAK,CAAC,YAAY,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBACpE,SAAS,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;gBACjC,MAAM;YACR,CAAC;YACD,wGAAwG;YACxG,KAAK,YAAY,CAAC,CAAC,CAAC;gBAClB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,cAAc,CAAgB,CAAC;gBACxE,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;gBAClD,IAAI,CAAC,SAAS,EAAE,CAAC;oBACf,WAAW,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;oBAC1B,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,gCAAgC,CAAC,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;oBAC5G,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;oBACvE,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;oBAChC,MAAM;gBACR,CAAC;gBAED,MAAM,cAAc,GAAG,CAAC,SAAS,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAkB,CAAC;gBAChG,SAAS,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC1C,MAAM;YACR,CAAC;YACD,KAAK,WAAW,CAAC,CAAC,CAAC;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,QAAQ,GAAG,KAAK,CAAC,YAAY,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;gBACrD,SAAS,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;gBACjC,MAAM;YACR,CAAC;YACD,gHAAgH;YAChH,KAAK,WAAW,CAAC,CAAC,CAAC;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,cAAc,CAAgB,CAAC;gBACxE,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;gBACtD,IAAI,CAAC,SAAS,EAAE,CAAC;oBACf,WAAW,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;oBAC1B,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,gCAAgC,CAAC,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;oBAC5G,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;oBACvE,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;oBACpC,MAAM;gBACR,CAAC;gBAED,MAAM,cAAc,GAAG,CAAC,SAAS,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAkB,CAAC;gBAChG,SAAS,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC1C,MAAM;YACR,CAAC;YACD,KAAK,MAAM;gBACT,8BAA8B;gBAC9B,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;gBACjC,MAAM;YACR,KAAK,KAAK;gBACR,6BAA6B;gBAC7B,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;gBAChD,MAAM;QACV,CAAC;IACH,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,OAAO,CACL,4BACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,SAAS,EAAE,IAAI,CAAC,SAAS,GACzB,CACH,CAAC;QACJ,CAAC;QAED,OAAO,CACL,yBAAgB,eAAe;YAC7B,WAAK,KAAK,EAAC,gBAAgB;gBACzB,WAAK,KAAK,EAAC,eAAe;oBACxB,UACE,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,SAAS,gBACH,eAAe;wBAEzB,IAAI,CAAC,OAAO;4BACX,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,EAAC,QAAQ;gCACP,UAAI,IAAI,EAAC,MAAM;oCACb,WAAK,KAAK,EAAC,cAAc;wCACvB,0BAAmC,CAC/B,CACH;gCACJ,KAAK,GAAG,CAAC,IAAI,UAAI,IAAI,EAAC,WAAW,GAAM,CAC/B,CACZ,CAAC;wBACH,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAChC,EAAC,QAAQ;4BACP,UAAI,IAAI,EAAC,MAAM;gCACb,SACE,KAAK,EAAE;wCACL,cAAc,EAAE,IAAI;wCACpB,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;qCAC9B,EACD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,mBAEV,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,mBAEtE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,kBAC1C,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC/D,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EACxC,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM;oCAEnB,yBAAiB,IAAI,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAQ;oCAC/C,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,CAAC,IAAI,CAC7B,cACE,IAAI,EAAE,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAC/D,KAAK,EAAC,UAAU,EAChB,MAAM,EAAC,UAAU,GACjB,CACH,CACC,CACD;4BACJ,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,IAAI,UAAI,IAAI,EAAC,WAAW,GAAM,CACpD,CACZ,CAAC,CACC;oBACL,yBACE,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC,GACnD,CACE;gBAEL,IAAI,CAAC,KAAK,CAAC,GAAG,CACb,CAAC,IAAI,EAAE,EAAE,CACP,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,IAAI,CAC3B,EAAC,IAAI,IACH,YAAY,EAAE,IAAI,CAAC,EAAE,EACrB,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GACvD,CACH,CACJ,CACG;YAEL,IAAI,CAAC,KAAK;gBACT,EAAE,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;iBACtC,GAAG,CACF,CAAC,IAAI,EAAE,EAAE,CACP,IAAI,CAAC,WAAW,EAAE,MAAM,IAAI,CAC1B,WACE,KAAK,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE,gBAAgB,EAAE,IAAI,EAAE,gBAC1C,YAAY,IAAI,CAAC,KAAK,EAAE;gBAEpC,UAAI,IAAI,EAAC,SAAS,IACf,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACjC,EAAC,QAAQ;oBACP,UAAI,IAAI,EAAC,MAAM;wBACb,SACE,KAAK,EAAE;gCACL,cAAc,EAAE,IAAI;gCACpB,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;6BACjC,EACD,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,EAAE,EAAE,OAAO,CAAC,EAAE,EACd,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,mBACG,OAAO,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,mBAEzD,OAAO,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,kBAE7E,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAClE,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAC3C,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,EAC5D,MAAM,EAAE,IAAI,CAAC,MAAM;4BAEnB,gBAAO,OAAO,CAAC,KAAK,CAAQ;4BAC3B,OAAO,CAAC,SAAS,EAAE,MAAM,GAAG,CAAC,IAAI,CAChC,cACE,IAAI,EAAE,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAClE,KAAK,EAAC,SAAS,EACf,MAAM,EAAC,SAAS,GAChB,CACH,CACC,CACD,CACI,CACZ,CAAC,CACC;gBACJ,IAAI,CAAC,WAAW,CAAC,GAAG,CACnB,CAAC,OAAO,EAAE,EAAE,CACV,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC,EAAE,IAAI,CAC9B,EAAC,IAAI,IACH,YAAY,EAAE,OAAO,CAAC,EAAE,EACxB,KAAK,EAAE,OAAO,CAAC,SAAS,EACxB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GACvD,CACH,CACJ,CACG,CACP,CACJ,CACC,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Fragment, Listen, Prop, State, Watch, h } from '@stencil/core';\nimport { MenubarItem, containsTarget, moveFocus } from '../../utils';\nimport { Menu } from './menu/menu';\nimport { SearchEnv } from '../../utils/subjects.api';\n\n/**\n * Main menubar component. Each item can have a menu with subitems\n * When a main menubar item is the current active one, a sub-menubar is shown and each subitem can have a menu with subitems.\n * @cssprop {--zanit-menubar-max-width} Maximum width of the menubar.\n */\n@Component({\n  tag: 'zanit-menubar',\n  styleUrls: ['menubar.css', 'menu/menu.css'],\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class ZanitMenubar {\n  @Element() host: HTMLZanitMenubarElement;\n\n  /** Menubar items extracted from `data`. */\n  @State()\n  items: MenubarItem[] = [];\n\n  /** ID of the currently open menu. */\n  @State()\n  openMenu: string | undefined = undefined;\n\n  /** ID of the item to show the subitems navbar for. */\n  @State()\n  openNavbar: string | undefined = undefined;\n\n  /** IDs of the current prop */\n  @State()\n  currentPath: string[] = [];\n\n  @State()\n  isMobile: boolean = false;\n\n  @State()\n  loading: boolean = false;\n\n  /** The data to build the menu (as an array of `MenubarItem` or a JSON array) or the url to fetch to retrieve it. */\n  @Prop()\n  data: Promise<MenubarItem[]> | MenubarItem[] | URL | string;\n\n  /** Path of the current item. */\n  @Prop()\n  current: string | undefined = undefined;\n\n  /** Initial search query. */\n  @Prop({ mutable: true })\n  searchQuery: string | undefined = undefined;\n\n  /** Environment for search suggestions */\n  @Prop() searchEnv: SearchEnv = SearchEnv.PROD;\n\n  /** Search area (e.g. \"SCUOLA\", \"UNIVERSITÀ\", \"DIZIONARI\").  */\n  @Prop() searchArea?: string | undefined;\n\n  private timerId: number;\n\n  /** Setup the list of items. */\n  @Watch('data')\n  async parseData(data: typeof this.data) {\n    if (!data) {\n      return;\n    }\n\n    if (data instanceof URL) {\n      this.items = await this.fetchData(data);\n    } else if (data instanceof Promise) {\n      this.loading = true;\n      this.items = await data;\n      this.loading = false;\n    } else if (typeof data === 'string') {\n      try {\n        this.items = JSON.parse(data);\n        if (!Array.isArray(this.items) || !this.items?.every((item) => item satisfies MenubarItem)) {\n          throw new Error('Expected an array of MenubarItem objects.');\n        }\n      } catch {\n        let url: URL;\n        try {\n          url = new URL(data);\n        } catch {\n          throw new Error('Invalid string provided for `data` property: not a valid url or JSON.');\n        }\n\n        this.items = await this.fetchData(url);\n      }\n    } else if (Array.isArray(data) && data.every((item) => item satisfies MenubarItem)) {\n      this.items = data;\n    } else {\n      throw new Error(\n        'Invalid `data` property value. Expected an url, a JSON or an array/promise of MenubarItem objects.'\n      );\n    }\n  }\n\n  @Watch('items')\n  onItemsChange() {\n    this.initTabindex();\n  }\n\n  @Watch('current')\n  onCurrentChange() {\n    this.currentPath = this.current?.split('/').filter(Boolean) || [];\n  }\n\n  async connectedCallback() {\n    const mobileMediaQuery = window.matchMedia('(width < 768px)');\n    this.isMobile = mobileMediaQuery.matches;\n    mobileMediaQuery.onchange = (mql) => {\n      this.isMobile = mql.matches;\n      this.initTabindex();\n      this.openMenu = undefined;\n    };\n    await this.parseData(this.data);\n    this.onCurrentChange();\n    this.initTabindex();\n  }\n\n  /** Close any open menu when clicking outside. */\n  @Listen('click', { target: 'document', passive: true })\n  handleOutsideClick(event: MouseEvent) {\n    if (!this.openMenu || containsTarget(this.host, event)) {\n      return;\n    }\n\n    this.openMenu = undefined;\n  }\n\n  /** Close any open menu when pressing Escape or Tab.\n   * Uses document-level listener to ensure Escape works from any focus location within the menu.\n   */\n  @Listen('keydown', { target: 'document', passive: true })\n  handleKeydown(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Escape': {\n        if (this.openMenu) {\n          event.preventDefault();\n          // Return focus to the menu trigger after closing\n          const menuTriggerId = this.openMenu;\n          this.openMenu = undefined;\n          // Use setTimeout(0) to defer focus until after Stencil's render cycle completes\n          setTimeout(() => {\n            const menuTrigger = this.host.shadowRoot.getElementById(menuTriggerId);\n            if (menuTrigger) {\n              menuTrigger.focus();\n            }\n          }, 0);\n        }\n        break;\n      }\n      case 'Tab':\n        this.openMenu = undefined;\n        break;\n    }\n  }\n\n  @Listen('mouseover', { passive: true })\n  handleMouseover() {\n    clearTimeout(this.timerId);\n  }\n\n  /**\n   * Automatically close any open menu on mouseout after with a little delay.\n   * The delay is useful to avoid immediate closing when the pointer briefly leaves the component.\n   */\n  @Listen('mouseout', { passive: true })\n  handleMouseout(event: MouseEvent) {\n    this.timerId = window.setTimeout(() => {\n      if (!this.openMenu || containsTarget(this.host, event)) {\n        return;\n      }\n\n      this.openMenu = undefined;\n    }, 500);\n  }\n\n  /** Close the menu when it loses focus. */\n  @Listen('focusout', { passive: true })\n  handleFocusout(event: FocusEvent) {\n    const relatedTarget = event.relatedTarget as HTMLElement;\n    if (!this.openMenu || this.host.shadowRoot.querySelector('.menu')?.contains(relatedTarget)) {\n      return;\n    }\n\n    this.openMenu = undefined;\n  }\n\n  /** Fetch data from passed URL. */\n  private async fetchData(url: URL) {\n    try {\n      this.loading = true;\n      const data = await (await fetch(url)).json();\n      this.loading = false;\n      if (!Array.isArray(data) || !data.every((item) => item satisfies MenubarItem)) {\n        throw new Error('Invalid data structure. Expected an array of MenuItem objects.');\n      }\n\n      return data as MenubarItem[];\n    } catch (error) {\n      this.loading = false;\n      console.error('Error fetching menubar data:', error);\n      throw new Error('Failed to fetch menubar data from the provided URL.', { cause: error });\n    }\n  }\n\n  /** Initialize tabindex on menuitems of menubars, setting -1 to all but the first one. */\n  private initTabindex() {\n    setTimeout(() => {\n      this.host.shadowRoot.querySelectorAll('[role=\"menubar\"]')?.forEach((menubar) => {\n        menubar\n          .querySelectorAll('[role=\"menuitem\"]')\n          ?.forEach((item, index) => item.setAttribute('tabindex', index === 0 ? '0' : '-1'));\n      });\n    }, 100);\n  }\n\n  /** Indicates whether the element has to be highlighted by checking whether it is set as current or one of its descendants is. */\n  private isActive(item: MenubarItem) {\n    if (this.currentPath.length === 0) {\n      return false;\n    }\n\n    if (this.currentPath.includes(item.id)) {\n      return true;\n    }\n\n    if (item.menuItems?.length) {\n      return item.menuItems.some((menuItem) => menuItem.id === this.current);\n    }\n\n    if (item.navbarItems?.length) {\n      const isActive = item.navbarItems.some((navbarItem) => this.isActive(navbarItem));\n      if (isActive) {\n        return true;\n      }\n    }\n\n    return false;\n  }\n\n  /** Opens the menu associated with the menubar `item`, if any. */\n  private showMenu(item: MenubarItem) {\n    this.openMenu = undefined; // close any open menu first\n    if (!item.menuItems?.length) {\n      return;\n    }\n\n    this.openMenu = item.id;\n  }\n\n  /** Get all elements with `menuitem` role inside parent's `menubar`. * */\n  private getParentMenubarElements(itemEl: HTMLElement) {\n    return Array.from(\n      itemEl?.closest('[role=\"menubar\"]')?.querySelectorAll(':scope > li a[role=\"menuitem\"]') ?? []\n    ) as HTMLElement[];\n  }\n\n  /** Move the focus to the previous menubar item, or the last one. Then open its menu if any other menu was open. */\n  private focusPreviousItem(itemEl: HTMLElement) {\n    this.openMenu = undefined; // close any open menu first\n    const menubarElements = this.getParentMenubarElements(itemEl);\n    const currentIndex = menubarElements.indexOf(itemEl);\n    const prevItem = menubarElements[(currentIndex - 1 + menubarElements.length) % menubarElements.length]; // get previous item or last one\n    moveFocus(itemEl, prevItem);\n    // open the item's menu if any other menu was open\n    if (prevItem.ariaHasPopup === 'true' && this.openMenu) {\n      this.openMenu = prevItem.id;\n    }\n  }\n\n  /** Move the focus to the next menubar item, or the first one. Then open its menu if any other menu was open. */\n  private focusNextItem(itemEl: HTMLElement) {\n    this.openMenu = undefined; // close any open menu first\n    const menubarElements = this.getParentMenubarElements(itemEl);\n    const currentIndex = menubarElements.indexOf(itemEl);\n    const nextItem = menubarElements[(currentIndex + 1) % menubarElements.length]; // get next item or first one\n    moveFocus(itemEl, nextItem);\n    // open the item's menu if any other menu was open\n    if (nextItem.ariaHasPopup === 'true' && this.openMenu) {\n      this.openMenu = nextItem.id;\n    }\n  }\n\n  /** Handles keyboard navigation on menubar items. */\n  private handleItemKeydown(event: KeyboardEvent, item: MenubarItem) {\n    const target = event.target as HTMLElement;\n    switch (event.key) {\n      case 'Home': {\n        event.preventDefault();\n        event.stopPropagation();\n        const firstItem = this.getParentMenubarElements(target)[0];\n        moveFocus(target, firstItem);\n        break;\n      }\n      case 'End': {\n        event.preventDefault();\n        event.stopPropagation();\n        const lastItem = this.getParentMenubarElements(target).pop();\n        moveFocus(target, lastItem);\n        break;\n      }\n      case 'ArrowUp': {\n        if (!item.menuItems?.length) {\n          break;\n        }\n        event.preventDefault();\n        event.stopPropagation();\n        this.openMenu = item.id;\n        // focus last item of the menu\n        setTimeout(() => {\n          const menuItems = Array.from(\n            this.host.shadowRoot.querySelectorAll(`[aria-labelledby=${item.id}] [role=\"menuitem\"]`)\n          ) as HTMLElement[];\n          moveFocus(target, menuItems[menuItems.length - 1]);\n        }, 100);\n        break;\n      }\n      case 'ArrowRight': {\n        event.preventDefault();\n        event.stopPropagation();\n        this.focusNextItem(target);\n        break;\n      }\n      case 'ArrowDown': {\n        if (!item.menuItems?.length) {\n          break;\n        }\n\n        this.openItemMenu(item);\n        break;\n      }\n      case 'ArrowLeft': {\n        event.preventDefault();\n        event.stopPropagation();\n        this.focusPreviousItem(target);\n        break;\n      }\n      case ' ': {\n        event.preventDefault();\n        event.stopPropagation();\n        if (this.openMenu === item.id) {\n          this.openMenu = undefined;\n          break;\n        } else if (item.menuItems?.length) {\n          this.openItemMenu(item);\n          break;\n        }\n      }\n    }\n  }\n\n  /** Get the previous element with `role=group`. */\n  private getPreviousGroup(groupContainer: HTMLElement) {\n    const groups = Array.from(\n      groupContainer?.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"group\"]') ?? []\n    ) as HTMLElement[];\n    const currentIndex = groups.indexOf(groupContainer);\n\n    return groups[currentIndex - 1];\n  }\n\n  /** Get the next element with `role=group`. */\n  private getNextGroup(groupContainer: HTMLElement) {\n    const groups = Array.from(\n      groupContainer?.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"group\"]') ?? []\n    ) as HTMLElement[];\n    const currentIndex = groups.indexOf(groupContainer);\n\n    return groups[currentIndex + 1];\n  }\n\n  private openItemMenu(item: MenubarItem) {\n    this.openMenu = item.id;\n    setTimeout(() => {\n      // focus first item of the menu\n      const firstMenuItem = this.host.shadowRoot.querySelector(\n        `[aria-labelledby=${item.id}] [role=\"menuitem\"]`\n      ) as HTMLElement;\n      firstMenuItem.tabIndex = 0;\n      firstMenuItem.focus({ preventScroll: true });\n    }, 100);\n  }\n\n  /** Handles keyboard navigation events from `Menu` component. */\n  private handleMenuKeydown(event: KeyboardEvent) {\n    const itemElement = event.target as HTMLElement;\n    const items = Array.from(\n      itemElement.closest('[role=\"menu\"]')?.querySelectorAll('[role=\"menuitem\"]') ?? []\n    ) as HTMLElement[];\n    const currentIndex = items.indexOf(itemElement);\n    switch (event.key) {\n      case 'ArrowUp': {\n        event.preventDefault();\n        event.stopPropagation();\n        const prevItem = items[currentIndex - 1] || items[items.length - 1];\n        moveFocus(itemElement, prevItem);\n        break;\n      }\n      // Move the focus to the first item of the next group if any, otherwise move it to the next menubar item\n      case 'ArrowRight': {\n        event.preventDefault();\n        event.stopPropagation();\n        const currentGroup = itemElement.closest('[role=group]') as HTMLElement;\n        const nextGroup = this.getNextGroup(currentGroup);\n        if (!nextGroup) {\n          itemElement.tabIndex = -1;\n          const menuTriggerId = itemElement.closest('[role=\"menu\"][aria-labelledby]').getAttribute('aria-labelledby');\n          const focusedItem = this.host.shadowRoot.getElementById(menuTriggerId);\n          this.focusNextItem(focusedItem);\n          break;\n        }\n\n        const nextGroupItems = (nextGroup.querySelectorAll('[role=\"menuitem\"]') ?? []) as HTMLElement[];\n        moveFocus(itemElement, nextGroupItems[0]);\n        break;\n      }\n      case 'ArrowDown': {\n        event.preventDefault();\n        event.stopPropagation();\n        const nextItem = items[currentIndex + 1] || items[0];\n        moveFocus(itemElement, nextItem);\n        break;\n      }\n      // Move the focus to the first item of the previous group if any, otherwise move it to the previous menubar item\n      case 'ArrowLeft': {\n        event.preventDefault();\n        event.stopPropagation();\n        const currentGroup = itemElement.closest('[role=group]') as HTMLElement;\n        const prevGroup = this.getPreviousGroup(currentGroup);\n        if (!prevGroup) {\n          itemElement.tabIndex = -1;\n          const menuTriggerId = itemElement.closest('[role=\"menu\"][aria-labelledby]').getAttribute('aria-labelledby');\n          const focusedItem = this.host.shadowRoot.getElementById(menuTriggerId);\n          this.focusPreviousItem(focusedItem);\n          break;\n        }\n\n        const prevGroupItems = (prevGroup.querySelectorAll('[role=\"menuitem\"]') ?? []) as HTMLElement[];\n        moveFocus(itemElement, prevGroupItems[0]);\n        break;\n      }\n      case 'Home':\n        // Move to the first menu item\n        event.preventDefault();\n        event.stopPropagation();\n        moveFocus(itemElement, items[0]);\n        break;\n      case 'End':\n        // Move to the last menu item\n        event.preventDefault();\n        event.stopPropagation();\n        moveFocus(itemElement, items[items.length - 1]);\n        break;\n    }\n  }\n\n  render() {\n    if (this.isMobile) {\n      return (\n        <zanit-mobile-menubar\n          items={this.items}\n          currentPath={this.currentPath}\n          searchQuery={this.searchQuery}\n          loading={this.loading}\n          searchArea={this.searchArea}\n          searchEnv={this.searchEnv}\n        />\n      );\n    }\n\n    return (\n      <nav aria-label=\"Zanichelli.it\">\n        <div class=\"shadow-wrapper\">\n          <div class=\"width-limiter\">\n            <ul\n              class=\"menubar\"\n              role=\"menubar\"\n              aria-label=\"Zanichelli.it\"\n            >\n              {this.loading &&\n                [...new Array(4)].map((_, index) => (\n                  <Fragment>\n                    <li role=\"none\">\n                      <div class=\"menubar-item\">\n                        <z-ghost-loading></z-ghost-loading>\n                      </div>\n                    </li>\n                    {index < 3 && <li role=\"separator\"></li>}\n                  </Fragment>\n                ))}\n              {this.items?.map((item, index) => (\n                <Fragment>\n                  <li role=\"none\">\n                    <a\n                      class={{\n                        'menubar-item': true,\n                        'active': this.isActive(item),\n                      }}\n                      href={item.href}\n                      id={item.id}\n                      role=\"menuitem\"\n                      tabIndex={-1}\n                      aria-expanded={\n                        item.menuItems?.length ? (this.openMenu === item.id ? 'true' : 'false') : undefined\n                      }\n                      aria-haspopup={item.menuItems?.length ? 'true' : 'false'}\n                      aria-current={this.current.includes(item.id) ? 'page' : 'false'}\n                      onPointerOver={() => this.showMenu(item)}\n                      onKeyDown={(event) => this.handleItemKeydown(event, item)}\n                      target={item.target}\n                    >\n                      <span data-text={item.label}>{item.label}</span>\n                      {item.menuItems?.length > 0 && (\n                        <z-icon\n                          name={this.openMenu === item.id ? 'chevron-up' : 'chevron-down'}\n                          width=\"0.875rem\"\n                          height=\"0.875rem\"\n                        />\n                      )}\n                    </a>\n                  </li>\n                  {index < this.items?.length - 1 && <li role=\"separator\"></li>}\n                </Fragment>\n              ))}\n            </ul>\n            <zanit-search-form\n              searchQuery={this.searchQuery}\n              searchArea={this.searchArea}\n              searchEnv={this.searchEnv}\n              onResetSearch={() => (this.searchQuery = undefined)}\n            />\n          </div>\n\n          {this.items.map(\n            (item) =>\n              this.openMenu === item.id && (\n                <Menu\n                  controlledBy={item.id}\n                  items={item.menuItems}\n                  currentPath={this.currentPath}\n                  onItemKeyDown={(event) => this.handleMenuKeydown(event)}\n                />\n              )\n          )}\n        </div>\n\n        {this.items\n          ?.filter((item) => this.isActive(item))\n          .map(\n            (item) =>\n              item.navbarItems?.length && (\n                <nav\n                  class={{ 'sub-menubar': true, 'shadow-wrapper': true }}\n                  aria-label={`Sezioni: ${item.label}`}\n                >\n                  <ul role=\"menubar\">\n                    {item.navbarItems.map((subitem) => (\n                      <Fragment>\n                        <li role=\"none\">\n                          <a\n                            class={{\n                              'menubar-item': true,\n                              'active': this.isActive(subitem),\n                            }}\n                            href={subitem.href}\n                            id={subitem.id}\n                            role=\"menuitem\"\n                            tabIndex={-1}\n                            aria-haspopup={subitem.menuItems?.length ? 'true' : 'false'}\n                            aria-expanded={\n                              subitem.menuItems?.length ? (this.openMenu === subitem.id ? 'true' : 'false') : undefined\n                            }\n                            aria-current={this.current.includes(subitem.id) ? 'page' : 'false'}\n                            onPointerOver={() => this.showMenu(subitem)}\n                            onKeyDown={(event) => this.handleItemKeydown(event, subitem)}\n                            target={item.target}\n                          >\n                            <span>{subitem.label}</span>\n                            {subitem.menuItems?.length > 0 && (\n                              <z-icon\n                                name={this.openMenu === subitem.id ? 'chevron-up' : 'chevron-down'}\n                                width=\"0.75rem\"\n                                height=\"0.75rem\"\n                              />\n                            )}\n                          </a>\n                        </li>\n                      </Fragment>\n                    ))}\n                  </ul>\n                  {item.navbarItems.map(\n                    (subitem) =>\n                      this.openMenu === subitem.id && (\n                        <Menu\n                          controlledBy={subitem.id}\n                          items={subitem.menuItems}\n                          currentPath={this.currentPath}\n                          onItemKeyDown={(event) => this.handleMenuKeydown(event)}\n                        />\n                      )\n                  )}\n                </nav>\n              )\n          )}\n      </nav>\n    );\n  }\n}\n"]}

package/dist/collection/components/menubar/mobile-menubar/mobile-menubar.css

@@ -0,0 +1,122 @@
+:host {
+  position: relative;
+  z-index: 2;
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  height: 3rem;
+  background-color: #fff;
+  color: var(--gray900);
+  fill: var(--gray900);
+  font-family: var(--font-family-sans);
+}
+
+:host,
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+*:focus:focus-visible {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none;
+}
+
+ul {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+
+a {
+  color: var(--gray900);
+  cursor: pointer;
+  text-decoration: none;
+}
+
+button {
+  all: unset;
+  cursor: pointer;
+}
+
+nav {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding-left: var(--grid-margin);
+  gap: 8px;
+}
+
+nav::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  background: transparent;
+  box-shadow: var(--shadow-1);
+  content: '';
+  pointer-events: none;
+}
+
+z-logo {
+  margin: 8px 0;
+}
+
+.mobile-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  display: flex;
+  overflow: auto;
+  width: 100%;
+  max-height: calc(100vh - 48px - var(--zanit-menubar-top-offset, 0px));
+  flex-direction: column;
+  padding: 16px var(--grid-margin) 32px;
+  background-color: #fff;
+  box-shadow: var(--shadow-2);
+  gap: 8px;
+}
+
+.mobile-menu li {
+  width: 100%;
+}
+
+.mobile-menu .items-container {
+  display: flex;
+  min-height: 256px;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.mobile-menu .items-container z-ghost-loading {
+  width: 40%;
+  height: 1.2rem;
+}
+
+.mobile-menu .items-container .menubar-item {
+  display: block;
+  width: 100%;
+  padding: 8px 0;
+  font-size: 1rem;
+  text-align: left;
+}
+
+.mobile-menu .items-container li:not(:last-child) .menubar-item {
+  border-bottom: 1px solid #000;
+}
+
+[role='menuitem'].parent {
+  display: flex;
+  width: fit-content;
+  align-items: center;
+  padding: 0;
+  border: none;
+  font-size: 0.875rem;
+  gap: 8px;
+}
+
+zanit-search-form {
+  margin-left: auto;
+}