@zanichelli/zanichelli-it-frontend-kit 1.3.0-RC3 → 1.3.0-RC4

package/dist/collection/components/menubar/search-form/search-form.js

@@ -1,80 +1,45 @@
-import { h, Host } from "@stencil/core";
-import { containsTarget, isArrowDownKey, isArrowUpKey, isEscKey, isTabKey } from "../../../utils";
-import { getSubjectsByArea, SearchEnv } from "../../../utils/subjects.api";
-import { buildSuggestions } from "./suggestions";
+import { h } from "@stencil/core";
+import { containsTarget } from "../../../utils";
 export class ZanitSearchForm {
     formElement;
-    subjectsByArea = {};
-    timer;
     host;
     /** Indicates whether the searchbar is visible and usable. */
     showSearchbar = false;
     /** Search query to apply. */
     _searchQuery = undefined;
-    /** Search suggestions to show in the autocomplete dropdown. */
-    suggestions = [];
-    /** Active suggestion - used for keyboard navigation */
-    activeSuggestion = '';
-    /** Show suggestions list */
-    showSuggestions = false;
     /** Initial search query */
     searchQuery = undefined;
-    /** Environment for search suggestions */
-    searchEnv = SearchEnv.PROD;
-    /** Search area (e.g. "SCUOLA", "UNIVERSITÀ", "DIZIONARI").  */
-    searchArea;
     onSearchQueryChange() {
         this._searchQuery = this.searchQuery;
         if (this.searchQuery) {
             this.openSearchbar();
         }
-        this.resetSuggestions();
-    }
-    onSearchAreaChange() {
-        this.resetSuggestions();
-    }
-    onShowSearchbarChange() {
-        if (!this.showSearchbar) {
-            this.showSuggestions = false;
-        }
-    }
-    onShowSuggestionsChange() {
-        this.activeSuggestion = '';
     }
     /** Emitted on search form submission. */
     search;
     resetSearch;
     async connectedCallback() {
-        this.subjectsByArea = await getSubjectsByArea(this.searchEnv);
         this.showSearchbar = !!this.searchQuery;
         this._searchQuery = this.searchQuery;
     }
     /** Close open searchbar when clicking outside. */
     handleOutsideClick(event) {
-        if (this.showSearchbar && this.host && !containsTarget(this.host, event)) {
+        if (this.showSearchbar && this.formElement && !containsTarget(this.formElement, event)) {
             this.showSearchbar = false;
         }
     }
-    /** Close the searchbar/suggestions when pressing Escape. */
-    handleEsc(event) {
-        if (!isEscKey(event)) {
-            return;
-        }
-        if (this.showSuggestions) {
-            this.showSuggestions = false;
-        }
-        else {
-            this.showSearchbar = false;
-        }
-    }
-    /** Close the searchbar/suggestions when pressing Tab. */
-    handleTab(event) {
-        if (!isTabKey(event)) {
-            return;
-        }
-        this.showSuggestions = false;
-        if (!containsTarget(this.host, event)) {
-            this.showSearchbar = false;
+    /** Close the menu when pressing Escape or Tab. */
+    handleKeydown(event) {
+        switch (event.key) {
+            case 'Escape':
+                this.showSearchbar = false;
+                break;
+            case 'Tab':
+                if (containsTarget(this.host, event)) {
+                    break;
+                }
+                this.showSearchbar = false;
+                break;
         }
     }
     openSearchbar() {
@@ -88,108 +53,27 @@ export class ZanitSearchForm {
         this.searchQuery = undefined;
         this.resetSearch.emit();
     }
-    resetSuggestions() {
-        this.suggestions = [];
-        this.showSuggestions = false;
-    }
     handleInputChange(event) {
         this._searchQuery = event.target.value;
         if (!this._searchQuery) {
             this.searchQuery = undefined;
         }
-        this.updateSuggestions();
-    }
-    updateSuggestions() {
-        clearTimeout(this.timer);
-        const query = (this._searchQuery || '').trim();
-        if (query.length < 3) {
-            this.resetSuggestions();
-            return;
-        }
-        this.timer = setTimeout(() => {
-            this.resetSuggestions();
-            this.suggestions = buildSuggestions(query, this.subjectsByArea, this.searchArea?.toUpperCase());
-            this.showSuggestions = true;
-        }, 300);
     }
     onSearchSubmit(event) {
         event.preventDefault();
         if (!this._searchQuery) {
             return;
         }
-        if (this.activeSuggestion) {
-            const suggestion = this.suggestions.find((s) => s.id === this.activeSuggestion);
-            if (suggestion) {
-                this.submitSuggestionSearch(suggestion);
-                this.showSuggestions = false;
-                return;
-            }
-        }
         this.showSearchbar = false;
-        const searchEv = this.search.emit({ query: this._searchQuery, area: this.searchArea });
+        const searchEv = this.search.emit({ query: this._searchQuery });
         // do not submit the form if the event default behavior was prevented
         if (searchEv.defaultPrevented) {
             return;
         }
         this.formElement.submit();
     }
-    submitSuggestionSearch(suggestion) {
-        const ev = this.search.emit({
-            user_query: suggestion.user_query,
-            query: suggestion.query,
-            area: suggestion.area,
-            subject: suggestion.subject,
-        });
-        if (!ev.defaultPrevented) {
-            window.location.href = suggestion.url;
-        }
-    }
-    handleSuggestionsNav(event) {
-        if (!isArrowDownKey(event) && !isArrowUpKey(event)) {
-            return;
-        }
-        if (!this.suggestions.length) {
-            return;
-        }
-        const options = this.suggestions.map((o) => o.id);
-        if (!options.length) {
-            return;
-        }
-        event.preventDefault();
-        event.stopPropagation();
-        if (!this.showSuggestions) {
-            this.showSuggestions = true;
-        }
-        let nextId = null;
-        const firstId = options[0];
-        const lastId = options[options.length - 1];
-        const currOption = options.indexOf(this.activeSuggestion);
-        if (currOption < 0) {
-            nextId = isArrowDownKey(event) ? firstId : lastId;
-        }
-        else {
-            if (isArrowDownKey(event)) {
-                nextId = options[currOption + 1] || lastId;
-            }
-            else {
-                nextId = options[currOption - 1] || firstId;
-            }
-        }
-        this.activeSuggestion = nextId;
-    }
-    renderSuggestions() {
-        return (h("div", { class: { 'suggestions-wrapper': true, 'hidden': !this.showSuggestions || !this.suggestions.length }, onPointerOver: (e) => e.preventDefault() }, h("div", { id: "search-suggestions", class: "suggestions", role: "listbox", "aria-label": "Seleziona tra i suggerimenti" }, this.suggestions.map((suggestion, k) => {
-            return (h("span", { key: k, innerHTML: suggestion.html_label, id: suggestion.id, class: "suggestion", role: "option", "aria-label": suggestion.label, "aria-selected": this.activeSuggestion === suggestion.id ? 'true' : undefined, onClick: () => this.submitSuggestionSearch(suggestion) }));
-        }))));
-    }
     render() {
-        return (h(Host, { key: '7ac06128ddbb7b5eed2d579d615607f725a3d922' }, h("form", { key: '238b35f0aa41c95b3329da5fc80e17f3a47dfff6', class: { 'searchbar': true, 'searchbar-open': this.showSearchbar }, ref: (el) => (this.formElement = el), role: "search", "aria-label": "Cerca nel sito", method: "get", action: "/ricerca", onSubmit: (event) => this.onSearchSubmit(event), onReset: () => this.resetSearchQuery() }, !!this.searchArea && (h("input", { key: 'bdd71f66a0947eeae7f657298cc2397f512884ab', type: "hidden", name: "area", value: this.searchArea })), h("div", { key: '9e40abc78a5d1910ace9bc628f10035696df7e7f', class: "input-wrapper", role: "none" }, this.searchQuery && (h("button", { key: 'f84706b7c06dabb0b6a81eae6530e26eddc95a04', type: "reset", "aria-label": "Svuota campo di ricerca", disabled: !this.showSearchbar, "aria-hidden": !this.showSearchbar ? 'true' : undefined, tabIndex: !this.showSearchbar ? -1 : 0 }, h("z-icon", { key: '6ff774cf791dc2f7ebb1861a5697e27ae040206f', name: "multiply-circled" }))), h("input", { key: 'e53291d60e203c72a79af09eb9072dde62b6a916', id: "searchbar-input", name: "q", type: "search", disabled: !this.showSearchbar, placeholder: "Cerca per parola chiave o ISBN", value: this.searchQuery, required: true, autocomplete: "off", role: "combobox", "aria-autocomplete": "list", "aria-expanded": this.showSuggestions ? 'true' : 'false', "aria-controls": "search-suggestions", "aria-activedescendant": this.activeSuggestion, "aria-label": "Cerca per parola chiave o ISBN", "aria-hidden": !this.showSearchbar ? 'true' : undefined, tabIndex: !this.showSearchbar ? -1 : 0, onInput: (event) => this.handleInputChange(event), onKeyDown: (e) => {
-                // INFO: prevent ESC from clearing input
-                if (isEscKey(e)) {
-                    e.preventDefault();
-                }
-                this.handleSuggestionsNav(e);
-            } })), h("button", { key: '836604e75ca90d451cba93236509f20a3a22cf16', class: "searchbar-button", "aria-label": this.showSearchbar ? 'Esegui ricerca' : 'Apri il campo di ricerca', "aria-controls": "searchbar-input", type: this.showSearchbar ? 'submit' : 'button', onClick: () => this.openSearchbar() }, this.showSearchbar ? null : h("span", { class: "searchbar-button-label" }, "Cerca"), h("z-icon", { key: '1616128d97c04a1e4768f163fcc20a21664daca4', name: "search" }))), this.renderSuggestions()));
+        return (h("form", { key: 'fe6f284342dbd746e36d5cb3c5707dcce305c161', class: { 'searchbar': true, 'searchbar-open': this.showSearchbar }, ref: (el) => (this.formElement = el), role: "search", "aria-label": "Cerca nel sito", method: "get", action: "/ricerca", onSubmit: (event) => this.onSearchSubmit(event), onReset: () => this.resetSearchQuery() }, h("div", { key: '593b2cccc1d01244e4d9dbf5a1cc90cf1e9075f2', class: "input-wrapper", role: "none" }, this.searchQuery && (h("button", { key: '2dbf7c03d16d83cc75e10f6931c2f55131794ca3', type: "reset", "aria-label": "Svuota campo di ricerca", disabled: !this.showSearchbar, "aria-hidden": !this.showSearchbar ? 'true' : undefined, tabIndex: !this.showSearchbar ? -1 : 0 }, h("z-icon", { key: 'dd4efe874001e675b31317e914b8c0e95dad4a0b', name: "multiply-circled" }))), h("input", { key: '8030e45506f54d7478658829dcea62953b0b4659', id: "searchbar-input", name: "q", type: "search", disabled: !this.showSearchbar, placeholder: "Cerca per parola chiave o ISBN", onInput: (event) => this.handleInputChange(event), value: this.searchQuery, required: true, "aria-label": "Cerca per parola chiave o ISBN", "aria-hidden": !this.showSearchbar ? 'true' : undefined, tabIndex: !this.showSearchbar ? -1 : 0 })), h("button", { key: 'f9f28df512a832c6ee1327e5dbeb5bd4648e44b7', class: "searchbar-button", "aria-label": this.showSearchbar ? 'Esegui ricerca' : 'Apri il campo di ricerca', "aria-controls": "searchbar-input", type: this.showSearchbar ? 'submit' : 'button', onClick: () => this.openSearchbar() }, this.showSearchbar ? null : h("span", { class: "searchbar-button-label" }, "Cerca"), h("z-icon", { key: '2b0f78db129b77e011be643da542f392d521dfc8', name: "search" }))));
     }
     static get is() { return "zanit-search-form"; }
     static get encapsulation() { return "shadow"; }
@@ -224,61 +108,13 @@ export class ZanitSearchForm {
                 "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 {
             "showSearchbar": {},
-            "_searchQuery": {},
-            "suggestions": {},
-            "activeSuggestion": {},
-            "showSuggestions": {}
+            "_searchQuery": {}
         };
     }
     static get events() {
@@ -293,15 +129,9 @@ export class ZanitSearchForm {
                     "text": "Emitted on search form submission."
                 },
                 "complexType": {
-                    "original": "SearchEvent",
-                    "resolved": "{ query?: string; area?: string; subject?: string; user_query?: string; }",
-                    "references": {
-                        "SearchEvent": {
-                            "location": "import",
-                            "path": "../../../utils",
-                            "id": "src/utils/index.ts::SearchEvent"
-                        }
-                    }
+                    "original": "{ query: string }",
+                    "resolved": "{ query: string; }",
+                    "references": {}
                 }
             }, {
                 "method": "resetSearch",
@@ -325,15 +155,6 @@ export class ZanitSearchForm {
         return [{
                 "propName": "searchQuery",
                 "methodName": "onSearchQueryChange"
-            }, {
-                "propName": "searchArea",
-                "methodName": "onSearchAreaChange"
-            }, {
-                "propName": "showSearchbar",
-                "methodName": "onShowSearchbarChange"
-            }, {
-                "propName": "showSuggestions",
-                "methodName": "onShowSuggestionsChange"
             }];
     }
     static get listeners() {
@@ -345,16 +166,10 @@ export class ZanitSearchForm {
                 "passive": true
             }, {
                 "name": "keydown",
-                "method": "handleEsc",
+                "method": "handleKeydown",
                 "target": undefined,
                 "capture": false,
                 "passive": true
-            }, {
-                "name": "keyup",
-                "method": "handleTab",
-                "target": "document",
-                "capture": false,
-                "passive": true
             }];
     }
 }

package/dist/collection/components/menubar/search-form/search-form.js.map

@@ -1 +1 @@
-{"version":3,"file":"search-form.js","sourceRoot":"","sources":["../../../../src/components/menubar/search-form/search-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\nimport { containsTarget, isArrowDownKey, isArrowUpKey, isEscKey, isTabKey, SearchEvent } from '../../../utils';\nimport { getSubjectsByArea, SearchEnv } from '../../../utils/subjects.api';\nimport { buildSuggestions, SearchSuggestion } from './suggestions';\n\n@Component({\n  tag: 'zanit-search-form',\n  styleUrl: 'search-form.css',\n  shadow: true,\n})\nexport class ZanitSearchForm {\n  private formElement: HTMLFormElement;\n  private subjectsByArea: Record<string, string[]> = {};\n  private timer: NodeJS.Timeout;\n\n  @Element() host: HTMLZanitSearchFormElement;\n\n  /** Indicates whether the searchbar is visible and usable. */\n  @State()\n  showSearchbar: boolean = false;\n\n  /** Search query to apply. */\n  @State()\n  _searchQuery: string | undefined = undefined;\n\n  /** Search suggestions to show in the autocomplete dropdown. */\n  @State() suggestions: SearchSuggestion[] = [];\n\n  /** Active suggestion - used for keyboard navigation */\n  @State() activeSuggestion: string = '';\n\n  /** Show suggestions list */\n  @State() showSuggestions: boolean = false;\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  @Watch('searchQuery')\n  onSearchQueryChange() {\n    this._searchQuery = this.searchQuery;\n    if (this.searchQuery) {\n      this.openSearchbar();\n    }\n    this.resetSuggestions();\n  }\n\n  @Watch('searchArea')\n  onSearchAreaChange() {\n    this.resetSuggestions();\n  }\n\n  @Watch('showSearchbar')\n  onShowSearchbarChange() {\n    if (!this.showSearchbar) {\n      this.showSuggestions = false;\n    }\n  }\n\n  @Watch('showSuggestions')\n  onShowSuggestionsChange() {\n    this.activeSuggestion = '';\n  }\n\n  /** Emitted on search form submission. */\n  @Event({ cancelable: true }) search: EventEmitter<SearchEvent>;\n\n  @Event() resetSearch: EventEmitter<void>;\n\n  async connectedCallback() {\n    this.subjectsByArea = await getSubjectsByArea(this.searchEnv);\n    this.showSearchbar = !!this.searchQuery;\n    this._searchQuery = this.searchQuery;\n  }\n\n  /** Close open searchbar when clicking outside. */\n  @Listen('click', { target: 'document', passive: true })\n  handleOutsideClick(event: MouseEvent) {\n    if (this.showSearchbar && this.host && !containsTarget(this.host, event)) {\n      this.showSearchbar = false;\n    }\n  }\n\n  /** Close the searchbar/suggestions when pressing Escape. */\n  @Listen('keydown', { passive: true })\n  handleEsc(event: KeyboardEvent) {\n    if (!isEscKey(event)) {\n      return;\n    }\n\n    if (this.showSuggestions) {\n      this.showSuggestions = false;\n    } else {\n      this.showSearchbar = false;\n    }\n  }\n\n  /** Close the searchbar/suggestions when pressing Tab. */\n  @Listen('keyup', { target: 'document', passive: true })\n  handleTab(event: KeyboardEvent) {\n    if (!isTabKey(event)) {\n      return;\n    }\n\n    this.showSuggestions = false;\n\n    if (!containsTarget(this.host, event)) {\n      this.showSearchbar = false;\n    }\n  }\n\n  private openSearchbar() {\n    this.showSearchbar = true;\n    setTimeout(() => {\n      const searchbarInput = this.host.shadowRoot.querySelector('#searchbar-input') as HTMLInputElement;\n      searchbarInput.focus({ preventScroll: true });\n    }, 500);\n  }\n\n  private resetSearchQuery() {\n    this.searchQuery = undefined;\n    this.resetSearch.emit();\n  }\n\n  private resetSuggestions() {\n    this.suggestions = [];\n    this.showSuggestions = false;\n  }\n\n  private handleInputChange(event: InputEvent) {\n    this._searchQuery = (event.target as HTMLInputElement).value;\n    if (!this._searchQuery) {\n      this.searchQuery = undefined;\n    }\n\n    this.updateSuggestions();\n  }\n\n  private updateSuggestions() {\n    clearTimeout(this.timer);\n\n    const query = (this._searchQuery || '').trim();\n\n    if (query.length < 3) {\n      this.resetSuggestions();\n      return;\n    }\n\n    this.timer = setTimeout(() => {\n      this.resetSuggestions();\n      this.suggestions = buildSuggestions(query, this.subjectsByArea, this.searchArea?.toUpperCase());\n      this.showSuggestions = true;\n    }, 300);\n  }\n\n  private onSearchSubmit(event: Event) {\n    event.preventDefault();\n    if (!this._searchQuery) {\n      return;\n    }\n\n    if (this.activeSuggestion) {\n      const suggestion = this.suggestions.find((s) => s.id === this.activeSuggestion);\n      if (suggestion) {\n        this.submitSuggestionSearch(suggestion);\n        this.showSuggestions = false;\n        return;\n      }\n    }\n\n    this.showSearchbar = false;\n\n    const searchEv = this.search.emit({ query: this._searchQuery, area: this.searchArea });\n    // do not submit the form if the event default behavior was prevented\n    if (searchEv.defaultPrevented) {\n      return;\n    }\n\n    this.formElement.submit();\n  }\n\n  private submitSuggestionSearch(suggestion: SearchSuggestion) {\n    const ev = this.search.emit({\n      user_query: suggestion.user_query,\n      query: suggestion.query,\n      area: suggestion.area,\n      subject: suggestion.subject,\n    });\n    if (!ev.defaultPrevented) {\n      window.location.href = suggestion.url;\n    }\n  }\n\n  private handleSuggestionsNav(event: KeyboardEvent) {\n    if (!isArrowDownKey(event) && !isArrowUpKey(event)) {\n      return;\n    }\n\n    if (!this.suggestions.length) {\n      return;\n    }\n\n    const options = this.suggestions.map((o) => o.id);\n\n    if (!options.length) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n\n    if (!this.showSuggestions) {\n      this.showSuggestions = true;\n    }\n\n    let nextId = null;\n    const firstId = options[0];\n    const lastId = options[options.length - 1];\n    const currOption = options.indexOf(this.activeSuggestion);\n    if (currOption < 0) {\n      nextId = isArrowDownKey(event) ? firstId : lastId;\n    } else {\n      if (isArrowDownKey(event)) {\n        nextId = options[currOption + 1] || lastId;\n      } else {\n        nextId = options[currOption - 1] || firstId;\n      }\n    }\n    this.activeSuggestion = nextId;\n  }\n\n  private renderSuggestions() {\n    return (\n      <div\n        class={{ 'suggestions-wrapper': true, 'hidden': !this.showSuggestions || !this.suggestions.length }}\n        onPointerOver={(e) => e.preventDefault()}\n      >\n        <div\n          id=\"search-suggestions\"\n          class=\"suggestions\"\n          role=\"listbox\"\n          aria-label=\"Seleziona tra i suggerimenti\"\n        >\n          {this.suggestions.map((suggestion, k) => {\n            return (\n              <span\n                key={k}\n                innerHTML={suggestion.html_label}\n                id={suggestion.id}\n                class=\"suggestion\"\n                role=\"option\"\n                aria-label={suggestion.label}\n                aria-selected={this.activeSuggestion === suggestion.id ? 'true' : undefined}\n                onClick={() => this.submitSuggestionSearch(suggestion)}\n              />\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        <form\n          class={{ 'searchbar': true, 'searchbar-open': this.showSearchbar }}\n          ref={(el) => (this.formElement = el)}\n          role=\"search\"\n          aria-label=\"Cerca nel sito\"\n          method=\"get\"\n          action=\"/ricerca\"\n          onSubmit={(event) => this.onSearchSubmit(event)}\n          onReset={() => this.resetSearchQuery()}\n        >\n          {!!this.searchArea && (\n            <input\n              type=\"hidden\"\n              name=\"area\"\n              value={this.searchArea}\n            />\n          )}\n\n          <div\n            class=\"input-wrapper\"\n            role=\"none\"\n          >\n            {this.searchQuery && (\n              <button\n                type=\"reset\"\n                aria-label=\"Svuota campo di ricerca\"\n                disabled={!this.showSearchbar}\n                aria-hidden={!this.showSearchbar ? 'true' : undefined}\n                tabIndex={!this.showSearchbar ? -1 : 0}\n              >\n                <z-icon name=\"multiply-circled\" />\n              </button>\n            )}\n            <input\n              id=\"searchbar-input\"\n              name=\"q\"\n              type=\"search\"\n              disabled={!this.showSearchbar}\n              placeholder=\"Cerca per parola chiave o ISBN\"\n              value={this.searchQuery}\n              required\n              autocomplete=\"off\"\n              role=\"combobox\"\n              aria-autocomplete=\"list\"\n              aria-expanded={this.showSuggestions ? 'true' : 'false'}\n              aria-controls=\"search-suggestions\"\n              aria-activedescendant={this.activeSuggestion}\n              aria-label=\"Cerca per parola chiave o ISBN\"\n              aria-hidden={!this.showSearchbar ? 'true' : undefined}\n              tabIndex={!this.showSearchbar ? -1 : 0}\n              onInput={(event) => this.handleInputChange(event)}\n              onKeyDown={(e) => {\n                // INFO: prevent ESC from clearing input\n                if (isEscKey(e)) {\n                  e.preventDefault();\n                }\n\n                this.handleSuggestionsNav(e);\n              }}\n            />\n          </div>\n\n          <button\n            class=\"searchbar-button\"\n            aria-label={this.showSearchbar ? 'Esegui ricerca' : 'Apri il campo di ricerca'}\n            aria-controls=\"searchbar-input\"\n            type={this.showSearchbar ? 'submit' : 'button'}\n            onClick={() => this.openSearchbar()}\n          >\n            {this.showSearchbar ? null : <span class=\"searchbar-button-label\">Cerca</span>}\n            <z-icon name=\"search\"></z-icon>\n          </button>\n        </form>\n\n        {this.renderSuggestions()}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"search-form.js","sourceRoot":"","sources":["../../../../src/components/menubar/search-form/search-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\nimport { containsTarget } from '../../../utils';\n\n@Component({\n  tag: 'zanit-search-form',\n  styleUrl: 'search-form.css',\n  shadow: true,\n})\nexport class ZanitSearchForm {\n  private formElement: HTMLFormElement;\n\n  @Element() host: HTMLZanitSearchFormElement;\n\n  /** Indicates whether the searchbar is visible and usable. */\n  @State()\n  showSearchbar: boolean = false;\n\n  /** Search query to apply. */\n  @State()\n  _searchQuery: string | undefined = undefined;\n\n  /** Initial search query */\n  @Prop({ mutable: true })\n  searchQuery: string | undefined = undefined;\n\n  @Watch('searchQuery')\n  onSearchQueryChange() {\n    this._searchQuery = this.searchQuery;\n    if (this.searchQuery) {\n      this.openSearchbar();\n    }\n  }\n\n  /** Emitted on search form submission. */\n  @Event({ cancelable: true }) search: EventEmitter<{ query: string }>;\n\n  @Event() resetSearch: EventEmitter<void>;\n\n  async connectedCallback() {\n    this.showSearchbar = !!this.searchQuery;\n    this._searchQuery = this.searchQuery;\n  }\n\n  /** Close open searchbar when clicking outside. */\n  @Listen('click', { target: 'document', passive: true })\n  handleOutsideClick(event: MouseEvent) {\n    if (this.showSearchbar && this.formElement && !containsTarget(this.formElement, event)) {\n      this.showSearchbar = false;\n    }\n  }\n\n  /** Close the menu when pressing Escape or Tab. */\n  @Listen('keydown', { passive: true })\n  handleKeydown(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Escape':\n        this.showSearchbar = false;\n        break;\n      case 'Tab':\n        if (containsTarget(this.host, event)) {\n          break;\n        }\n\n        this.showSearchbar = false;\n        break;\n    }\n  }\n\n  private openSearchbar() {\n    this.showSearchbar = true;\n    setTimeout(() => {\n      const searchbarInput = this.host.shadowRoot.querySelector('#searchbar-input') as HTMLInputElement;\n      searchbarInput.focus({ preventScroll: true });\n    }, 500);\n  }\n\n  private resetSearchQuery() {\n    this.searchQuery = undefined;\n    this.resetSearch.emit();\n  }\n\n  private handleInputChange(event: Event) {\n    this._searchQuery = (event.target as HTMLInputElement).value;\n    if (!this._searchQuery) {\n      this.searchQuery = undefined;\n    }\n  }\n\n  private onSearchSubmit(event: Event) {\n    event.preventDefault();\n    if (!this._searchQuery) {\n      return;\n    }\n\n    this.showSearchbar = false;\n    const searchEv = this.search.emit({ query: this._searchQuery });\n    // do not submit the form if the event default behavior was prevented\n    if (searchEv.defaultPrevented) {\n      return;\n    }\n\n    this.formElement.submit();\n  }\n\n  render() {\n    return (\n      <form\n        class={{ 'searchbar': true, 'searchbar-open': this.showSearchbar }}\n        ref={(el) => (this.formElement = el)}\n        role=\"search\"\n        aria-label=\"Cerca nel sito\"\n        method=\"get\"\n        action=\"/ricerca\"\n        onSubmit={(event) => this.onSearchSubmit(event)}\n        onReset={() => this.resetSearchQuery()}\n      >\n        <div\n          class=\"input-wrapper\"\n          role=\"none\"\n        >\n          {this.searchQuery && (\n            <button\n              type=\"reset\"\n              aria-label=\"Svuota campo di ricerca\"\n              disabled={!this.showSearchbar}\n              aria-hidden={!this.showSearchbar ? 'true' : undefined}\n              tabIndex={!this.showSearchbar ? -1 : 0}\n            >\n              <z-icon name=\"multiply-circled\" />\n            </button>\n          )}\n          <input\n            id=\"searchbar-input\"\n            name=\"q\"\n            type=\"search\"\n            disabled={!this.showSearchbar}\n            placeholder=\"Cerca per parola chiave o ISBN\"\n            onInput={(event) => this.handleInputChange(event)}\n            value={this.searchQuery}\n            required\n            aria-label=\"Cerca per parola chiave o ISBN\"\n            aria-hidden={!this.showSearchbar ? 'true' : undefined}\n            tabIndex={!this.showSearchbar ? -1 : 0}\n          ></input>\n        </div>\n\n        <button\n          class=\"searchbar-button\"\n          aria-label={this.showSearchbar ? 'Esegui ricerca' : 'Apri il campo di ricerca'}\n          aria-controls=\"searchbar-input\"\n          type={this.showSearchbar ? 'submit' : 'button'}\n          onClick={() => this.openSearchbar()}\n        >\n          {this.showSearchbar ? null : <span class=\"searchbar-button-label\">Cerca</span>}\n          <z-icon name=\"search\"></z-icon>\n        </button>\n      </form>\n    );\n  }\n}\n"]}

package/dist/collection/utils/utils.js

@@ -14,12 +14,4 @@ export const moveFocus = (current, next) => {
     next.tabIndex = 0;
     next.focus({ preventScroll: true });
 };
-/** Check if event key is ArrowUp */
-export const isArrowUpKey = (event) => event.key === 'ArrowUp';
-/** Check if event key is ArrowDown */
-export const isArrowDownKey = (event) => event.key === 'ArrowDown';
-/** Check if event key is Tab */
-export const isTabKey = (event) => event.key === 'Tab';
-/** Check if event key is Escape */
-export const isEscKey = (event) => event.key === 'Escape';
 //# sourceMappingURL=utils.js.map

package/dist/collection/utils/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAqB,EAAE,KAAY,EAAE,EAAE;IACpE,OAAO,KAAK;SACT,YAAY,EAAE;SACd,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,QAAQ,IAAI,EAAE,KAAK,MAAM,CAAC,MAAM,CAAC;SACvD,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAiB,CAAC,CAAC,CAAC;AACxD,CAAC,CAAC;AAEF,0FAA0F;AAC1F,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,OAAoB,EAAE,IAAiB,EAAE,EAAE;IACnE,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;IACtB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IAClB,IAAI,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;AACtC,CAAC,CAAC;AAEF,oCAAoC;AACpC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,SAAS,CAAC;AAE9E,sCAAsC;AACtC,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC;AAElF,gCAAgC;AAChC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,KAAK,CAAC;AAEtE,mCAAmC;AACnC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,QAAQ,CAAC","sourcesContent":["/**\n * Check if an element contains an event target by checking its composedPath.\n * Useful when an event target may come from a component's shadow DOM.\n */\nexport const containsTarget = (ancestor: HTMLElement, event: Event) => {\n  return event\n    .composedPath()\n    .filter((el) => el !== document && el !== window.window)\n    .some((el) => ancestor.contains(el as HTMLElement));\n};\n\n/** Move the focus to `next` element, set tabindex to 0 for `next` and -1 to `current`. */\nexport const moveFocus = (current: HTMLElement, next: HTMLElement) => {\n  current.tabIndex = -1;\n  next.tabIndex = 0;\n  next.focus({ preventScroll: true });\n};\n\n/** Check if event key is ArrowUp */\nexport const isArrowUpKey = (event: KeyboardEvent) => event.key === 'ArrowUp';\n\n/** Check if event key is ArrowDown */\nexport const isArrowDownKey = (event: KeyboardEvent) => event.key === 'ArrowDown';\n\n/** Check if event key is Tab */\nexport const isTabKey = (event: KeyboardEvent) => event.key === 'Tab';\n\n/** Check if event key is Escape */\nexport const isEscKey = (event: KeyboardEvent) => event.key === 'Escape';\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAqB,EAAE,KAAY,EAAE,EAAE;IACpE,OAAO,KAAK;SACT,YAAY,EAAE;SACd,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,QAAQ,IAAI,EAAE,KAAK,MAAM,CAAC,MAAM,CAAC;SACvD,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAiB,CAAC,CAAC,CAAC;AACxD,CAAC,CAAC;AAEF,0FAA0F;AAC1F,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,OAAoB,EAAE,IAAiB,EAAE,EAAE;IACnE,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;IACtB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IAClB,IAAI,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;AACtC,CAAC,CAAC","sourcesContent":["/**\n * Check if an element contains an event target by checking its composedPath.\n * Useful when an event target may come from a component's shadow DOM.\n */\nexport const containsTarget = (ancestor: HTMLElement, event: Event) => {\n  return event\n    .composedPath()\n    .filter((el) => el !== document && el !== window.window)\n    .some((el) => ancestor.contains(el as HTMLElement));\n};\n\n/** Move the focus to `next` element, set tabindex to 0 for `next` and -1 to `current`. */\nexport const moveFocus = (current: HTMLElement, next: HTMLElement) => {\n  current.tabIndex = -1;\n  next.tabIndex = 0;\n  next.focus({ preventScroll: true });\n};\n"]}

package/dist/components/index.js

@@ -149,6 +149,9 @@ var getAssetPath = (path) => {
   return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
 };
 var setAssetPath = (path) => plt.$resourcesUrl$ = path;
+
+// src/utils/helpers.ts
+var isDef = (v) => v != null && v !== void 0;
 var isComplexType = (o) => {
   o = typeof o;
   return o === "object" || o === "function";
@@ -349,6 +352,9 @@ var parsePropertyValue = (propValue, propType) => {
     if (propType & 4 /* Boolean */) {
       return propValue === "false" ? false : propValue === "" || !!propValue;
     }
+    if (propType & 2 /* Number */) {
+      return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
+    }
     if (propType & 1 /* String */) {
       return String(propValue);
     }
@@ -594,6 +600,9 @@ function sortedAttrNames(attrNames) {
     attrNames
   );
 }
+
+// src/runtime/vdom/vdom-render.ts
+var scopeId;
 var hostTagName;
 var isSvgMode = false;
 var createElm = (oldParentVNode, newParentVNode, childIndex) => {
@@ -615,6 +624,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
     {
       updateElement(null, newVNode2, isSvgMode);
     }
+    if (isDef(scopeId) && elm["s-si"] !== scopeId) {
+      elm.classList.add(elm["s-si"] = scopeId);
+    }
     if (newVNode2.$children$) {
       for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
         childNode = createElm(oldParentVNode, newVNode2, i2);
@@ -784,10 +796,34 @@ var nullifyVNodeRefs = (vNode) => {
   }
 };
 var insertBefore = (parent, newNode, reference) => {
+  if (typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) {
+    addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
+  }
   {
     return parent == null ? void 0 : parent.insertBefore(newNode, reference);
   }
 };
+function addRemoveSlotScopedClass(reference, slotNode, newParent, oldParent) {
+  var _a, _b;
+  let scopeId2;
+  if (reference && typeof slotNode["s-sn"] === "string" && !!slotNode["s-sr"] && reference.parentNode && reference.parentNode["s-sc"] && (scopeId2 = slotNode["s-si"] || reference.parentNode["s-sc"])) {
+    const scopeName = slotNode["s-sn"];
+    const hostName = slotNode["s-hn"];
+    (_a = newParent.classList) == null ? void 0 : _a.add(scopeId2 + "-s");
+    if (oldParent && ((_b = oldParent.classList) == null ? void 0 : _b.contains(scopeId2 + "-s"))) {
+      let child = (oldParent.__childNodes || oldParent.childNodes)[0];
+      let found = false;
+      while (child) {
+        if (child["s-sn"] !== scopeName && child["s-hn"] === hostName && !!child["s-sr"]) {
+          found = true;
+          break;
+        }
+        child = child.nextSibling;
+      }
+      if (!found) oldParent.classList.remove(scopeId2 + "-s");
+    }
+  }
+}
 var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   const hostElm = hostRef.$hostElement$;
   const oldVNode = hostRef.$vnode$ || newVNode(null, null);
@@ -805,6 +841,9 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   rootVnode.$flags$ |= 4 /* isHost */;
   hostRef.$vnode$ = rootVnode;
   rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
+  {
+    scopeId = hostElm["s-sc"];
+  }
   patch(oldVNode, rootVnode, isInitialLoad);
 };
 
@@ -1266,6 +1305,9 @@ var getHostListenerTarget = (doc, elm, flags) => {
   if (flags & 4 /* TargetDocument */) {
     return doc;
   }
+  if (flags & 8 /* TargetWindow */) {
+    return win;
+  }
   return elm;
 };
 var hostListenerOpts = (flags) => supportsListenerOptions ? {