@zanichelli/albe-web-components 21.0.0-RC4 → 21.0.0-RC5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/z-app-header_12.cjs.entry.js +7 -2
- package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -1
- package/dist/collection/components/z-app-header/index.js +35 -2
- package/dist/collection/components/z-app-header/index.js.map +1 -1
- package/dist/components/z-app-header.js +1 -1
- package/dist/components/z-app-header.js.map +1 -1
- package/dist/esm/z-app-header_12.entry.js +7 -2
- package/dist/esm/z-app-header_12.entry.js.map +1 -1
- package/dist/types/components/z-app-header/index.d.ts +8 -0
- package/dist/types/components.d.ts +10 -0
- package/dist/web-components-library/p-368f7af9.entry.js +2 -0
- package/dist/web-components-library/p-368f7af9.entry.js.map +1 -0
- package/dist/web-components-library/web-components-library.esm.js +1 -1
- package/package.json +1 -1
- package/react/z-app-header.d.ts +2 -0
- package/react/z-app-header.js +5 -1
- package/www/build/{p-d1812914.js → p-12d5cd09.js} +1 -1
- package/www/build/p-368f7af9.entry.js +2 -0
- package/www/build/p-368f7af9.entry.js.map +1 -0
- package/www/build/web-components-library.esm.js +1 -1
- package/www/index.html +1 -1
- package/dist/web-components-library/p-e2eea612.entry.js +0 -2
- package/dist/web-components-library/p-e2eea612.entry.js.map +0 -1
- package/www/build/p-e2eea612.entry.js +0 -2
- package/www/build/p-e2eea612.entry.js.map +0 -1
|
@@ -192,7 +192,10 @@ const ZAppHeader = class {
|
|
|
192
192
|
if (this.searchPageUrl && (this.isMobile || this.isTablet)) {
|
|
193
193
|
return (index$1.h("z-button", { class: "search-page-button", variant: index.ButtonVariant.SECONDARY, href: this.searchPageUrl, icon: "search", size: index.ControlSize.X_SMALL }));
|
|
194
194
|
}
|
|
195
|
-
return (index$1.h("z-searchbar", { class: { "has-label": !!this.searchLabel }, value: this.searchString, placeholder: this.searchPlaceholder, label: this.searchLabel, showSearchButton: true, searchButtonIconOnly: this.isMobile || this.isTablet, searchButtonLabel: this.isMobile || this.isTablet ? undefined : this.searchButtonLabel, size: index.ControlSize.X_SMALL, variant: index.ButtonVariant.SECONDARY, preventSubmit: this.searchString.length < 3, onSearchTyping: (e) =>
|
|
195
|
+
return (index$1.h("z-searchbar", { class: { "has-label": !!this.searchLabel }, value: this.searchString, placeholder: this.searchPlaceholder, label: this.searchLabel, showSearchButton: true, searchButtonIconOnly: this.isMobile || this.isTablet, searchButtonLabel: this.isMobile || this.isTablet ? undefined : this.searchButtonLabel, size: index.ControlSize.X_SMALL, variant: index.ButtonVariant.SECONDARY, preventSubmit: this.searchString.length < 3, onSearchTyping: (e) => {
|
|
196
|
+
this.searchString = e.detail;
|
|
197
|
+
this.searchTyping.emit(e.detail);
|
|
198
|
+
}, onSearchSubmit: (e) => this.searchSubmit.emit(e.detail) }));
|
|
196
199
|
}
|
|
197
200
|
renderProductLogos() {
|
|
198
201
|
return (index$1.h(index$1.Fragment, null, this.enableZLogo && (index$1.h("span", { class: "z-logo" }, index$1.h("img", { alt: "Logo Zanichelli" }))), this.hostElement.querySelector("[slot='product-logo']") && (index$1.h("span", { class: "product-logo" }, index$1.h("slot", { name: "product-logo" })))));
|
|
@@ -210,6 +213,8 @@ const ZAppHeader = class {
|
|
|
210
213
|
constructor(hostRef) {
|
|
211
214
|
index$1.registerInstance(this, hostRef);
|
|
212
215
|
this.sticking = index$1.createEvent(this, "sticking", 7);
|
|
216
|
+
this.searchSubmit = index$1.createEvent(this, "searchSubmit", 7);
|
|
217
|
+
this.searchTyping = index$1.createEvent(this, "searchTyping", 7);
|
|
213
218
|
/**
|
|
214
219
|
* Stuck mode for the header.
|
|
215
220
|
* You can programmatically set it using an IntersectionObserver.
|
|
@@ -276,7 +281,7 @@ const ZAppHeader = class {
|
|
|
276
281
|
}
|
|
277
282
|
render() {
|
|
278
283
|
const hasTopSubtitle = this.hasSlot("top-subtitle");
|
|
279
|
-
return (index$1.h(index$1.Host, { key: '
|
|
284
|
+
return (index$1.h(index$1.Host, { key: '1da213ad3c3bde9d41d2fb801c485a43c069a7ab', "menu-length": this.menuLength }, index$1.h("div", { key: 'f795c08d7dba5cb9c0a94f133a016ddf7fec274c', class: { "heading-panel": true, "has-menubar": this.menuLength > 0 && !this.enableOffcanvas }, ref: (el) => (this.container = el) }, index$1.h("div", { key: '54664f024e256d94deb660345b34b358dfd3eb38', class: { "heading-container": true, "has-top-subtitle": hasTopSubtitle } }, ((!this.enableSearch && this.isMobile) || !this.isMobile) && (index$1.h("div", { key: '084c42062cef0ae417ba2bc6d1ee38a4eaacaa63', class: { "top-subtitle": true, "has-product-logo": hasTopSubtitle && this.hasSlot("product-logo") } }, index$1.h("slot", { key: '5909e3ddf15e1ce73f0dfce136ab56d6d3a96398', name: "top-subtitle" }))), index$1.h("div", { key: '85db84ddc7d98c3345b12406e11249901b15f83a', class: "heading-title" }, index$1.h("slot", { key: 'f7f2da007d18ef08985d21643a0ba84b6cc00535', name: "menu-button" }, this.renderMenuButton()), !this._stuck && this.renderProductLogos(), index$1.h("slot", { key: '23d40c33c07fac7800eaebeffab0425e7a0f64c2', name: "title" }), this.enableSearch && !this.isMobile && this.renderSeachbar()), this.enableSearch && this.isMobile && this.renderSeachbar()), index$1.h("nav", { key: '7a1a6d02bc21d66101d7eeb2ca8404d9cea785d5', class: "menu-container", "aria-label": this.title || undefined }, this.canShowMenu && (index$1.h("div", { key: 'd4a8165445f738370309bc7e9319454fef2ce02d', role: "menubar", "aria-label": this.title || undefined }, index$1.h("slot", { key: '4e8557fa5ff1a35e0613ef3dd498c511e20a9316', name: "menu", onSlotchange: this.collectMenuElements }))))), this.renderOffcanvas(), this._stuck && this.renderStuck()));
|
|
280
285
|
}
|
|
281
286
|
get hostElement() { return index$1.getElement(this); }
|
|
282
287
|
static get watchers() { return {
|