npm - @zanichelli/albe-web-components - Versions diffs - 18.7.1-RC3 → 18.7.2 - Mend

@zanichelli/albe-web-components 18.7.1-RC3 → 18.7.2

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.

Files changed (126) hide show

package/dist/collection/__mocks__/fileMock.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export default "test-file-stub";
2	+ //# sourceMappingURL=fileMock.js.map

package/dist/collection/__mocks__/fileMock.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"fileMock.js","sourceRoot":"","sources":["../../../src/__mocks__/fileMock.ts"],"names":[],"mappings":"AAAA,eAAe,gBAAgB,CAAC","sourcesContent":["export default \"test-file-stub\";\n"]}

package/dist/collection/components/book-card/z-book-card/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { Host, h } from "@stencil/core";
+import defaultFallbackCover from "../../../assets/images/png/placeholder-cover.png";
 import { BookCardVariant, ControlSize } from "../../../beans";
 /**
  * @slot cta - top right cta (e.g. bookmark icon)
@@ -43,6 +44,9 @@ export class ZBookCard {
                 if (this.fallbackCover) {
                     this.cover = this.fallbackCover;
                 }
+                else {
+                    this.cover = defaultFallbackCover;
+                }
             }, "aria-hidden": "true" }));
         return (h("div", { class: "cover" }, this.ebookUrl ? (h("a", { tabIndex: 0, class: "cover-link", href: this.ebookUrl, onClick: () => this.emitCoverClick(), target: "_blank" }, coverImg)) : (coverImg), h("slot", { name: "coverOverlay" })));
     }
@@ -84,7 +88,7 @@ export class ZBookCard {
         return h("slot", { name: "cta" });
     }
     render() {
-        return (h(Host, { key: '390282d1103ee34c1799ac6c3827ba735932d748' }, h("div", { key: '0498613fb827c04d69a8f3ae622b038a96f30f35', class: "main-content" }, this.renderCover(), h("div", { key: '7b548cf67997b7654ac115e7e0c8610ab0364774', class: "card-info" }, h("div", { key: '9cc219c999f12b7037b87dee93c6a4003451c532', class: "top" }, h("div", { key: '7e0fda8d8e4db8f739ab1fb84ee52113b4726289' }, this.renderYear(), this.renderAuthors(), this.renderOperaTitle(), this.renderVolumeTitle(), this.renderIsbn()), h("slot", { key: 'a111f6a3112733c7566613f1f91aae886c3664d2', name: "tags" }), h("slot", { key: '648c50aaae28a643bad13762cfa32c36e2f68f9a', name: "data" })), h("slot", { key: '5d531aae5e1b347b05186088a3362752625b58ed', name: "ebook" }, !!this.ebookUrl && h("div", { key: 'd35832672681fc37974fc5ddaa2f2c421bdafe99', class: "bottom" }, this.renderEbook())))), h("slot", { key: 'ffa28f796577b77ad006f223182b3742a3bc4197', name: "apps" })));
+        return (h(Host, { key: 'b8b37f10e4c09f1bd9314cf8fb1b8f752ae9c47e' }, h("div", { key: '70f04ae7125d557d2911a6ef4e44d1903128bde5', class: "main-content" }, this.renderCover(), h("div", { key: '96a357c922d91e09c31f0fdf4cd7283e8a1ed9a7', class: "card-info" }, h("div", { key: 'dd12a24cdc1fadaa877406b9662b91ba0de8aa27', class: "top" }, h("div", { key: '42a1245295cf5659f51b39516963e0104cba4cef' }, this.renderYear(), this.renderAuthors(), this.renderOperaTitle(), this.renderVolumeTitle(), this.renderIsbn()), h("slot", { key: 'b69e77dc77c971019ecf3bb30d0bf211ccc794f9', name: "tags" }), h("slot", { key: '53202f9466707bdafcc6882c563978b339e61335', name: "data" })), h("slot", { key: '646df6b2a349a30c2ab9cf0a3c30919157cced93', name: "ebook" }, !!this.ebookUrl && h("div", { key: 'a3707624b5e428a472ff91a32e03bd72be7e3f57', class: "bottom" }, this.renderEbook())))), h("slot", { key: 'a5d2a636f6848f46e1f48117efbdce91673c532b', name: "apps" })));
     }
     static get is() { return "z-book-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/book-card/z-book-card/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/book-card/z-book-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/*\n @slot cta - top right cta (e.g. bookmark icon)\n * @slot ebook - as default, it shows laZ ebook link\n * @slot tags - tags section, default empty\n * @slot data - external link and pill, default empty\n * @slot apps - list of card-related apps, default empty\n * @slot coverOverlay - purple layer on top of book cover\n * @cssprop --z-book-card-portrait-cover-height - set custom cover height for portrait variant - default 378px\n * @cssprop --z-book-card-title-lines - set title avilable lines - default 2\n * @cssprop --z-book-card-title-word-break - set title word-break rule - default initial\n * @cssprop --z-book-card-subtitle-lines - set subtitle available lines - default 1\n * @cssprop --z-book-card-subtitle-word-break - set subtitle word-break rule - default break-all\n * @cssprop --z-book-card-authors-lines - set authors available lines - default 1\n * @cssprop --z-book-card-authors-word-break - set authors word-break rule - default break-all\n /\n@Component({\n tag: \"z-book-card\",\n styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /* Card variant: landscape, portrait /\n @Prop({reflect: true})\n variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n /* Cover URL /\n @Prop()\n cover: string;\n\n /* Opera title (card title) /\n @Prop()\n operaTitle: string;\n\n /* [optional] Volume title (card subvolume) /\n @Prop()\n volumeTitle?: string;\n\n /* [optional] Authors /\n @Prop()\n authors?: string;\n\n /* [optional] Main ISBN /\n @Prop()\n isbn?: string;\n\n /* [optional] ISBN label /\n @Prop()\n isbnLabel = \"\";\n\n /* [optional] year /\n @Prop()\n year?: string;\n\n /* [optional] Show link to the ebook resource. Set title and cover as clickable, opening a new tab to the ebook resource /\n @Prop()\n ebookUrl?: string;\n\n /* [optional] Fallback cover URL /\n @Prop()\n fallbackCover?: string;\n\n /* [optional] Set a specific h level as html tag for opera title /\n @Prop()\n titleHtmlTag?: string;\n\n /* click on ebook link /\n @Event()\n ebookClick: EventEmitter;\n\n /* click on cover link /\n @Event()\n coverClick: EventEmitter;\n\n /* click on title link */\n @Event()\n titleClick: EventEmitter;\n\n private emitEbookClick(): void {\n this.ebookClick.emit();\n }\n\n private emitCoverClick(): void {\n this.coverClick.emit();\n }\n\n private emitTitleClick(): void {\n this.titleClick.emit();\n }\n\n private renderCover(): HTMLDivElement {\n const coverImg: HTMLImageElement = (\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n );\n\n return (\n <div class=\"cover\">\n {this.ebookUrl ? (\n <a\n tabIndex={0}\n class={\"cover-link\"}\n href={this.ebookUrl}\n onClick={() => this.emitCoverClick()}\n target=\"_blank\"\n >\n {coverImg}\n </a>\n ) : (\n coverImg\n )}\n <slot name=\"coverOverlay\"></slot>\n </div>\n );\n }\n\n private renderYear(): null \| HTMLDivElement {\n if (!this.year) {\n return null;\n }\n\n return (\n <div\n class=\"year ellipsis body-4\"\n aria-description=\"anno\"\n >\n {this.year}\n </div>\n );\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n if (!this.authors) {\n return null;\n }\n\n return (\n <div class=\"cta-wrapper\">\n <div\n class=\"authors ellipsis body-4\"\n aria-description=\"autori\"\n >\n {this.authors}\n </div>\n {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.titleHtmlTag\n ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n : this.operaTitle;\n\n const operaTitle = (\n <div\n class=\"opera-title ellipsis body-2-sb\"\n innerHTML={title}\n />\n );\n\n return (\n <div class=\"cta-wrapper\">\n {this.ebookUrl ? (\n <a\n class=\"z-link\"\n href={this.ebookUrl}\n onClick={() => this.emitTitleClick()}\n target=\"_blank\"\n >\n {operaTitle}\n </a>\n ) : (\n operaTitle\n )}\n {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n if (!this.volumeTitle) {\n return null;\n }\n\n return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n if (!this.isbn) {\n return null;\n }\n\n return (\n <div\n class=\"isbn ellipsis body-4-sb\"\n aria-description={`isbn ${this.isbnLabel}`}\n >\n {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n </div>\n );\n }\n\n private renderEbook(): HTMLDivElement {\n return (\n <div class=\"ebook\">\n <div>\n <div class=\"app-name\">\n <img\n class=\"ebook-logo\"\n aria-hidden=\"true\"\n />\n <div class=\"body-4-sb\">laZ Ebook</div>\n </div>\n </div>\n <z-button\n size={ControlSize.X_SMALL}\n href={this.ebookUrl}\n target=\"_blank\"\n onClick={() => this.emitEbookClick()}\n htmlrole=\"link\"\n aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n >\n leggi ebook\n </z-button>\n </div>\n );\n }\n\n private renderCtaSlot(): HTMLSlotElement {\n return <slot name=\"cta\"></slot>;\n }\n\n render(): HTMLZBookCardElement {\n return (\n <Host>\n <div class=\"main-content\">\n {this.renderCover()}\n <div class=\"card-info\">\n <div class=\"top\">\n <div>\n {this.renderYear()}\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <slot name=\"tags\"></slot>\n <slot name=\"data\"></slot>\n </div>\n <slot name=\"ebook\">{!!this.ebookUrl && <div class=\"bottom\">{this.renderEbook()}</div>}</slot>\n </div>\n </div>\n <slot name=\"apps\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/book-card/z-book-card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACrF,OAAO,oBAAoB,MAAM,kDAAkD,CAAC;AACpF,OAAO,EAAC,eAAe,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAE5D;;;;;;;;;;;;;;GAcG;AAMH,MAAM,OAAO,SAAS;;uBAKO,eAAe,CAAC,QAAQ;;;;;;yBAwBvC,EAAE;;;;;;IA8BN,cAAc;QACpB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAEO,WAAW;QACjB,MAAM,QAAQ,GAAqB,CACjC,WACE,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;oBACvB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;gBAClC,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,KAAK,GAAG,oBAAoB,CAAC;gBACpC,CAAC;YACH,CAAC,iBACW,MAAM,GAClB,CACH,CAAC;QAEF,OAAO,CACL,WAAK,KAAK,EAAC,OAAO;YACf,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,SACE,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,EACpC,MAAM,EAAC,QAAQ,IAEd,QAAQ,CACP,CACL,CAAC,CAAC,CAAC,CACF,QAAQ,CACT;YACD,YAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B,CACP,CAAC;IACJ,CAAC;IAEO,UAAU;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,CACL,WACE,KAAK,EAAC,sBAAsB,sBACX,MAAM,IAEtB,IAAI,CAAC,IAAI,CACN,CACP,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,CACL,WAAK,KAAK,EAAC,aAAa;YACtB,WACE,KAAK,EAAC,yBAAyB,sBACd,QAAQ,IAExB,IAAI,CAAC,OAAO,CACT;YACL,IAAI,CAAC,OAAO,KAAK,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,IAAI,CACrE,CACP,CAAC;IACJ,CAAC;IAEO,gBAAgB;QACtB,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY;YAC7B,CAAC,CAAC,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC,YAAY,GAAG;YACnE,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;QAEpB,MAAM,UAAU,GAAG,CACjB,WACE,KAAK,EAAC,gCAAgC,EACtC,SAAS,EAAE,KAAK,GAChB,CACH,CAAC;QAEF,OAAO,CACL,WAAK,KAAK,EAAC,aAAa;YACrB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,SACE,KAAK,EAAC,QAAQ,EACd,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,EACpC,MAAM,EAAC,QAAQ,IAEd,UAAU,CACT,CACL,CAAC,CAAC,CAAC,CACF,UAAU,CACX;YACA,IAAI,CAAC,OAAO,KAAK,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,IAAI,CACpE,CACP,CAAC;IACJ,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,WAAK,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,WAAW,CAAO,CAAC;IAC5E,CAAC;IAEO,UAAU;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,CACL,WACE,KAAK,EAAC,yBAAyB,sBACb,QAAQ,IAAI,CAAC,SAAS,EAAE;YAEzC,IAAI,CAAC,IAAI;;YAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,SAAS,CAAQ,CAAC,CAAC,CAAC,IAAI,CAC7E,CACP,CAAC;IACJ,CAAC;IAEO,WAAW;QACjB,OAAO,CACL,WAAK,KAAK,EAAC,OAAO;YAChB;gBACE,WAAK,KAAK,EAAC,UAAU;oBACnB,WACE,KAAK,EAAC,YAAY,iBACN,MAAM,GAClB;oBACF,WAAK,KAAK,EAAC,WAAW,gBAAgB,CAClC,CACF;YACN,gBACE,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE,EACpC,QAAQ,EAAC,MAAM,sBACG,iBAAiB,IAAI,CAAC,UAAU,eAAe,kBAGxD,CACP,CACP,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,OAAO,YAAM,IAAI,EAAC,KAAK,GAAQ,CAAC;IAClC,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,cAAc;gBACtB,IAAI,CAAC,WAAW,EAAE;gBACnB,4DAAK,KAAK,EAAC,WAAW;oBACpB,4DAAK,KAAK,EAAC,KAAK;wBACd;4BACG,IAAI,CAAC,UAAU,EAAE;4BACjB,IAAI,CAAC,aAAa,EAAE;4BACpB,IAAI,CAAC,gBAAgB,EAAE;4BACvB,IAAI,CAAC,iBAAiB,EAAE;4BACxB,IAAI,CAAC,UAAU,EAAE,CACd;wBACN,6DAAM,IAAI,EAAC,MAAM,GAAQ;wBACzB,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB;oBACN,6DAAM,IAAI,EAAC,OAAO,IAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,4DAAK,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,WAAW,EAAE,CAAO,CAAQ,CACzF,CACF;YACN,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACpB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport defaultFallbackCover from \"../../../assets/images/png/placeholder-cover.png\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/*\n @slot cta - top right cta (e.g. bookmark icon)\n * @slot ebook - as default, it shows laZ ebook link\n * @slot tags - tags section, default empty\n * @slot data - external link and pill, default empty\n * @slot apps - list of card-related apps, default empty\n * @slot coverOverlay - purple layer on top of book cover\n * @cssprop --z-book-card-portrait-cover-height - set custom cover height for portrait variant - default 378px\n * @cssprop --z-book-card-title-lines - set title avilable lines - default 2\n * @cssprop --z-book-card-title-word-break - set title word-break rule - default initial\n * @cssprop --z-book-card-subtitle-lines - set subtitle available lines - default 1\n * @cssprop --z-book-card-subtitle-word-break - set subtitle word-break rule - default break-all\n * @cssprop --z-book-card-authors-lines - set authors available lines - default 1\n * @cssprop --z-book-card-authors-word-break - set authors word-break rule - default break-all\n /\n@Component({\n tag: \"z-book-card\",\n styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /* Card variant: landscape, portrait /\n @Prop({reflect: true})\n variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n /* Cover URL /\n @Prop()\n cover: string;\n\n /* Opera title (card title) /\n @Prop()\n operaTitle: string;\n\n /* [optional] Volume title (card subvolume) /\n @Prop()\n volumeTitle?: string;\n\n /* [optional] Authors /\n @Prop()\n authors?: string;\n\n /* [optional] Main ISBN /\n @Prop()\n isbn?: string;\n\n /* [optional] ISBN label /\n @Prop()\n isbnLabel = \"\";\n\n /* [optional] year /\n @Prop()\n year?: string;\n\n /* [optional] Show link to the ebook resource. Set title and cover as clickable, opening a new tab to the ebook resource /\n @Prop()\n ebookUrl?: string;\n\n /* [optional] Fallback cover URL /\n @Prop()\n fallbackCover?: string;\n\n /* [optional] Set a specific h level as html tag for opera title /\n @Prop()\n titleHtmlTag?: string;\n\n /* click on ebook link /\n @Event()\n ebookClick: EventEmitter;\n\n /* click on cover link /\n @Event()\n coverClick: EventEmitter;\n\n /* click on title link */\n @Event()\n titleClick: EventEmitter;\n\n private emitEbookClick(): void {\n this.ebookClick.emit();\n }\n\n private emitCoverClick(): void {\n this.coverClick.emit();\n }\n\n private emitTitleClick(): void {\n this.titleClick.emit();\n }\n\n private renderCover(): HTMLDivElement {\n const coverImg: HTMLImageElement = (\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n } else {\n this.cover = defaultFallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n );\n\n return (\n <div class=\"cover\">\n {this.ebookUrl ? (\n <a\n tabIndex={0}\n class={\"cover-link\"}\n href={this.ebookUrl}\n onClick={() => this.emitCoverClick()}\n target=\"_blank\"\n >\n {coverImg}\n </a>\n ) : (\n coverImg\n )}\n <slot name=\"coverOverlay\"></slot>\n </div>\n );\n }\n\n private renderYear(): null \| HTMLDivElement {\n if (!this.year) {\n return null;\n }\n\n return (\n <div\n class=\"year ellipsis body-4\"\n aria-description=\"anno\"\n >\n {this.year}\n </div>\n );\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n if (!this.authors) {\n return null;\n }\n\n return (\n <div class=\"cta-wrapper\">\n <div\n class=\"authors ellipsis body-4\"\n aria-description=\"autori\"\n >\n {this.authors}\n </div>\n {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.titleHtmlTag\n ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n : this.operaTitle;\n\n const operaTitle = (\n <div\n class=\"opera-title ellipsis body-2-sb\"\n innerHTML={title}\n />\n );\n\n return (\n <div class=\"cta-wrapper\">\n {this.ebookUrl ? (\n <a\n class=\"z-link\"\n href={this.ebookUrl}\n onClick={() => this.emitTitleClick()}\n target=\"_blank\"\n >\n {operaTitle}\n </a>\n ) : (\n operaTitle\n )}\n {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n if (!this.volumeTitle) {\n return null;\n }\n\n return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n if (!this.isbn) {\n return null;\n }\n\n return (\n <div\n class=\"isbn ellipsis body-4-sb\"\n aria-description={`isbn ${this.isbnLabel}`}\n >\n {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n </div>\n );\n }\n\n private renderEbook(): HTMLDivElement {\n return (\n <div class=\"ebook\">\n <div>\n <div class=\"app-name\">\n <img\n class=\"ebook-logo\"\n aria-hidden=\"true\"\n />\n <div class=\"body-4-sb\">laZ Ebook</div>\n </div>\n </div>\n <z-button\n size={ControlSize.X_SMALL}\n href={this.ebookUrl}\n target=\"_blank\"\n onClick={() => this.emitEbookClick()}\n htmlrole=\"link\"\n aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n >\n leggi ebook\n </z-button>\n </div>\n );\n }\n\n private renderCtaSlot(): HTMLSlotElement {\n return <slot name=\"cta\"></slot>;\n }\n\n render(): HTMLZBookCardElement {\n return (\n <Host>\n <div class=\"main-content\">\n {this.renderCover()}\n <div class=\"card-info\">\n <div class=\"top\">\n <div>\n {this.renderYear()}\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <slot name=\"tags\"></slot>\n <slot name=\"data\"></slot>\n </div>\n <slot name=\"ebook\">{!!this.ebookUrl && <div class=\"bottom\">{this.renderEbook()}</div>}</slot>\n </div>\n </div>\n <slot name=\"apps\"></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/css-components/z-cover/styles.css CHANGED Viewed

@@ -41,7 +41,7 @@
 }
 .z-shadow-1 {
-  z-index: 1;
+  z-index: 0;
   top: var(--space-unit);
   right: 6px;
   border: var(--border-size-small) solid black;
@@ -56,7 +56,7 @@
 .z-cover-img {
   position: absolute;
-  z-index: 2;
+  z-index: 0;
   top: 0;
   right: 0;
   border: var(--border-size-small) solid black;

package/dist/collection/components/result-card/z-result-card/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { Host, h } from "@stencil/core";
+import defaultFallbackCover from "../../../assets/images/png/placeholder-cover.png";
 export class ZResultCard {
     constructor() {
         this.resizeHandler = () => {
@@ -7,7 +8,14 @@ export class ZResultCard {
             this.setTooltipTitle(this.subtitleRef);
         };
         this.renderOperaCard = () => {
-            return (h(Host, { tabIndex: 0 }, h("div", { class: `z-cover-container ${this.hasMultipleCovers ? "has-multiple" : ""}` }, h("div", { class: "z-cover-stack" }, this.hasMultipleCovers && (h("div", null, h("div", { class: "z-cover-shadow z-shadow-2" }), h("div", { class: "z-cover-shadow z-shadow-1" }))), h("img", { src: this.cover, alt: "Book Cover", class: "z-cover-img" }))), h("div", { class: "info-container" }, this.authors && (h("span", { class: "authors-label", ref: (el) => (this.authorsRef = el) }, this.authors)), h("span", { class: "card-title", ref: (el) => (this.titleRef = el) }, this.cardTitle), h("span", { class: "card-subtitle", ref: (el) => (this.subtitleRef = el) }, this.cardSubtitle), h("div", { class: "tags-container" }, h("slot", { name: "tags" })), h("div", { class: "volumes-label" }, h("slot", { name: "volumes" })))));
+            return (h(Host, { tabIndex: 0 }, h("div", { class: `z-cover-container ${this.hasMultipleCovers ? "has-multiple" : ""}` }, h("div", { class: "z-cover-stack" }, this.hasMultipleCovers && (h("div", null, h("div", { class: "z-cover-shadow z-shadow-2" }), h("div", { class: "z-cover-shadow z-shadow-1" }))), h("img", { src: this.cover, alt: "Book Cover", class: "z-cover-img", onError: () => {
+                    if (this.fallbackCover) {
+                        this.cover = this.fallbackCover;
+                    }
+                    else {
+                        this.cover = defaultFallbackCover;
+                    }
+                } }))), h("div", { class: "info-container" }, this.authors && (h("span", { class: "authors-label", ref: (el) => (this.authorsRef = el) }, this.authors)), h("span", { class: "card-title", ref: (el) => (this.titleRef = el) }, this.cardTitle), h("span", { class: "card-subtitle", ref: (el) => (this.subtitleRef = el) }, this.cardSubtitle), h("div", { class: "tags-container" }, h("slot", { name: "tags" })), h("div", { class: "volumes-label" }, h("slot", { name: "volumes" })))));
         };
         this.renderInfoCard = () => {
             return (h(Host, { tabIndex: 0, class: "info-card" }, h("div", { class: "info-icon-column" }, h("div", { class: "info-icon-container" }, h("z-icon", { class: "info-icon", name: "link", width: 18, height: 18 }))), h("div", { class: "info-container" }, h("span", { class: "card-title info-title", ref: (el) => (this.titleRef = el) }, this.cardTitle), h("span", { class: "card-subtitle info-subtitle", ref: (el) => (this.subtitleRef = el) }, this.cardSubtitle))));
@@ -16,6 +24,7 @@ export class ZResultCard {
         this.cardSubtitle = undefined;
         this.authors = undefined;
         this.cover = undefined;
+        this.fallbackCover = undefined;
         this.hasMultipleCovers = false;
         this.isInfoCard = false;
     }
@@ -141,6 +150,23 @@ export class ZResultCard {
                 "attribute": "cover",
                 "reflect": false
             },
+            "fallbackCover": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "[optional] Fallback cover URL"
+                },
+                "attribute": "fallback-cover",
+                "reflect": false
+            },
             "hasMultipleCovers": {
                 "type": "boolean",
                 "mutable": false,

package/dist/collection/components/result-card/z-result-card/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/result-card/z-result-card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;~~AAOhE~~,MAAM,OAAO,WAAW;;~~QAmFd~~,kBAAa,GAAG,GAAS,EAAE;YACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACtC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YACpC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACzC,CAAC,CAAC;QAUM,oBAAe,GAAG,GAA2B,EAAE;YACrD,OAAO,CACL,EAAC,IAAI,IAAC,QAAQ,EAAE,CAAC;gBACf,WAAK,KAAK,EAAE,qBAAqB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE;oBAC7E,WAAK,KAAK,EAAC,eAAe;wBACvB,IAAI,CAAC,iBAAiB,IAAI,CACzB;4BACE,WAAK,KAAK,EAAC,2BAA2B,GAAG;4BACzC,WAAK,KAAK,EAAC,2BAA2B,GAAG,CACrC,CACP;wBACD,WACE,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,GAAG,EAAC,YAAY,EAChB,KAAK,EAAC,aAAa,~~GACnB~~,CACE,CACF;gBACN,WAAK,KAAK,EAAC,gBAAgB;oBACxB,IAAI,CAAC,OAAO,IAAI,CACf,YACE,KAAK,EAAC,eAAe,EACrB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,EAAiB,CAAC,IAEjD,IAAI,CAAC,OAAO,CACR,CACR;oBACD,YACE,KAAK,EAAC,YAAY,EAClB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAiB,CAAC,IAE/C,IAAI,CAAC,SAAS,CACV;oBACP,YACE,KAAK,EAAC,eAAe,EACrB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,IAElD,IAAI,CAAC,YAAY,CACb;oBACP,WAAK,KAAK,EAAC,gBAAgB;wBACzB,YAAM,IAAI,EAAC,MAAM,GAAQ,CACrB;oBACN,WAAK,KAAK,EAAC,eAAe;wBACxB,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACD,CACR,CAAC;QACJ,CAAC,CAAC;QAEM,mBAAc,GAAG,GAA2B,EAAE;YACpD,OAAO,CACL,EAAC,IAAI,IACH,QAAQ,EAAE,CAAC,EACX,KAAK,EAAC,WAAW;gBAEjB,WAAK,KAAK,EAAC,kBAAkB;oBAC3B,WAAK,KAAK,EAAC,qBAAqB;wBAC9B,cACE,KAAK,EAAC,WAAW,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,CACE,CACF;gBACN,WAAK,KAAK,EAAC,gBAAgB;oBACzB,YACE,KAAK,EAAC,uBAAuB,EAC7B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAiB,CAAC,IAE/C,IAAI,CAAC,SAAS,CACV;oBACP,YACE,KAAK,EAAC,6BAA6B,EACnC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,IAElD,IAAI,CAAC,YAAY,CACb,CACH,CACD,CACR,CAAC;QACJ,CAAC,CAAC~~;;;;;iCAlJkB~~,KAAK;0BAOZ,KAAK;;IAQV,eAAe,CAAC,EAAe;QACrC,IAAI,CAAC,EAAE,EAAE,CAAC;YACR,OAAO;QACT,CAAC;QAED,mCAAmC;QACnC,MAAM,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;QAC1C,MAAM,YAAY,GAAG,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,KAAK,MAAM,CAAC;QAE7E,IAAI,WAAW,CAAC;QAChB,IAAI,YAAY,EAAE,CAAC;YACjB,kFAAkF;YAClF,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YAC9C,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,CAAC;YACxE,MAAM,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;YAExC,WAAW,GAAG,EAAE,CAAC,YAAY,GAAG,SAAS,CAAC;QAC5C,CAAC;aAAM,CAAC;YACN,iDAAiD;YACjD,WAAW,GAAG,EAAE,CAAC,WAAW,GAAG,EAAE,CAAC,WAAW,IAAI,EAAE,CAAC,YAAY,GAAG,EAAE,CAAC,YAAY,CAAC;QACrF,CAAC;QAED,IAAI,WAAW,EAAE,CAAC;YAChB,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC;QAClD,CAAC;aAAM,CAAC;YACN,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACtC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACpC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACzC,CAAC;IAQD,gBAAgB;QACd,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACxD,CAAC;IAED,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC3D,CAAC;~~IAsFD~~,MAAM;QACJ,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;IAC1E,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {Component, Element, Host, Prop, h} from \"@stencil/core\";\n\n@Component({\n tag: \"z-result-card\",\n styleUrls: [\"styles.css\", \"../../css-components/z-cover/styles.css\"],\n shadow: true,\n})\nexport class ZResultCard {\n @Element() hostElement: HTMLZResultCardElement;\n\n /*\n The title of the card.\n /\n @Prop()\n cardTitle: string;\n\n /\n The subtitle of the card.\n /\n @Prop()\n cardSubtitle: string;\n\n /\n The authors of the opera.\n /\n @Prop()\n authors?: string;\n\n /\n The URL of the cover image.\n * This is used to display the cover image of the opera.\n /\n @Prop()\n cover?: string;\n\n /\n Indicates whether the card has multiple covers.\n * This is used to apply specific styles when there are multiple covers.\n /\n @Prop()\n hasMultipleCovers = false;\n\n /\n Indicates whether the card is an info page.\n * This can be used to apply specific styles or behaviors for info pages.\n /\n @Prop()\n isInfoCard = false;\n\n private authorsRef: HTMLElement;\n\n private titleRef: HTMLElement;\n\n private subtitleRef: HTMLElement;\n\n private setTooltipTitle(el: HTMLElement): void {\n if (!el) {\n return;\n }\n\n // Check if element uses line-clamp\n const style = window.getComputedStyle(el);\n const hasLineClamp = style.getPropertyValue(\"-webkit-line-clamp\") !== \"none\";\n\n let isTruncated;\n if (hasLineClamp) {\n // For elements with line-clamp, check if content height exceeds line-clamp height\n const lineHeight = parseInt(style.lineHeight);\n const maxLines = parseInt(style.getPropertyValue(\"-webkit-line-clamp\"));\n const maxHeight = lineHeight maxLines;\n\n isTruncated = el.scrollHeight > maxHeight;\n } else {\n // Original check for elements without line-clamp\n isTruncated = el.scrollWidth > el.clientWidth \|\| el.scrollHeight > el.clientHeight;\n }\n\n if (isTruncated) {\n el.setAttribute(\"title\", el.textContent.trim());\n } else {\n el.removeAttribute(\"title\");\n }\n }\n\n componentDidRender(): void {\n this.setTooltipTitle(this.authorsRef);\n this.setTooltipTitle(this.titleRef);\n this.setTooltipTitle(this.subtitleRef);\n }\n\n private resizeHandler = (): void => {\n this.setTooltipTitle(this.authorsRef);\n this.setTooltipTitle(this.titleRef);\n this.setTooltipTitle(this.subtitleRef);\n };\n\n componentDidLoad(): void {\n window.addEventListener(\"resize\", this.resizeHandler);\n }\n\n disconnectedCallback(): void {\n window.removeEventListener(\"resize\", this.resizeHandler);\n }\n\n private renderOperaCard = (): HTMLZResultCardElement => {\n return (\n <Host tabIndex={0}>\n <div class={`z-cover-container ${this.hasMultipleCovers ? \"has-multiple\" : \"\"}`}>\n <div class=\"z-cover-stack\">\n {this.hasMultipleCovers && (\n <div>\n <div class=\"z-cover-shadow z-shadow-2\" />\n <div class=\"z-cover-shadow z-shadow-1\" />\n </div>\n )}\n <img\n src={this.cover}\n alt=\"Book Cover\"\n class=\"z-cover-img\"\n />\n </div>\n </div>\n <div class=\"info-container\">\n {this.authors && (\n <span\n class=\"authors-label\"\n ref={(el) => (this.authorsRef = el as HTMLElement)}\n >\n {this.authors}\n </span>\n )}\n <span\n class=\"card-title\"\n ref={(el) => (this.titleRef = el as HTMLElement)}\n >\n {this.cardTitle}\n </span>\n <span\n class=\"card-subtitle\"\n ref={(el) => (this.subtitleRef = el as HTMLElement)}\n >\n {this.cardSubtitle}\n </span>\n <div class=\"tags-container\">\n <slot name=\"tags\"></slot>\n </div>\n <div class=\"volumes-label\">\n <slot name=\"volumes\"></slot>\n </div>\n </div>\n </Host>\n );\n };\n\n private renderInfoCard = (): HTMLZResultCardElement => {\n return (\n <Host\n tabIndex={0}\n class=\"info-card\"\n >\n <div class=\"info-icon-column\">\n <div class=\"info-icon-container\">\n <z-icon\n class=\"info-icon\"\n name=\"link\"\n width={18}\n height={18}\n />\n </div>\n </div>\n <div class=\"info-container\">\n <span\n class=\"card-title info-title\"\n ref={(el) => (this.titleRef = el as HTMLElement)}\n >\n {this.cardTitle}\n </span>\n <span\n class=\"card-subtitle info-subtitle\"\n ref={(el) => (this.subtitleRef = el as HTMLElement)}\n >\n {this.cardSubtitle}\n </span>\n </div>\n </Host>\n );\n };\n\n render(): HTMLZResultCardElement {\n return this.isInfoCard ? this.renderInfoCard() : this.renderOperaCard();\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/result-card/z-result-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Host, Prop, h} from \"@stencil/core\";\nimport defaultFallbackCover from \"../../../assets/images/png/placeholder-cover.png\";\n\n@Component({\n tag: \"z-result-card\",\n styleUrls: [\"styles.css\", \"../../css-components/z-cover/styles.css\"],\n shadow: true,\n})\nexport class ZResultCard {\n @Element() hostElement: HTMLZResultCardElement;\n\n /*\n The title of the card.\n /\n @Prop()\n cardTitle: string;\n\n /\n The subtitle of the card.\n /\n @Prop()\n cardSubtitle: string;\n\n /\n The authors of the opera.\n /\n @Prop()\n authors?: string;\n\n /\n The URL of the cover image.\n * This is used to display the cover image of the opera.\n /\n @Prop()\n cover?: string;\n\n /* [optional] Fallback cover URL /\n @Prop()\n fallbackCover?: string;\n\n /\n Indicates whether the card has multiple covers.\n * This is used to apply specific styles when there are multiple covers.\n /\n @Prop()\n hasMultipleCovers = false;\n\n /\n Indicates whether the card is an info page.\n * This can be used to apply specific styles or behaviors for info pages.\n /\n @Prop()\n isInfoCard = false;\n\n private authorsRef: HTMLElement;\n\n private titleRef: HTMLElement;\n\n private subtitleRef: HTMLElement;\n\n private setTooltipTitle(el: HTMLElement): void {\n if (!el) {\n return;\n }\n\n // Check if element uses line-clamp\n const style = window.getComputedStyle(el);\n const hasLineClamp = style.getPropertyValue(\"-webkit-line-clamp\") !== \"none\";\n\n let isTruncated;\n if (hasLineClamp) {\n // For elements with line-clamp, check if content height exceeds line-clamp height\n const lineHeight = parseInt(style.lineHeight);\n const maxLines = parseInt(style.getPropertyValue(\"-webkit-line-clamp\"));\n const maxHeight = lineHeight maxLines;\n\n isTruncated = el.scrollHeight > maxHeight;\n } else {\n // Original check for elements without line-clamp\n isTruncated = el.scrollWidth > el.clientWidth \|\| el.scrollHeight > el.clientHeight;\n }\n\n if (isTruncated) {\n el.setAttribute(\"title\", el.textContent.trim());\n } else {\n el.removeAttribute(\"title\");\n }\n }\n\n componentDidRender(): void {\n this.setTooltipTitle(this.authorsRef);\n this.setTooltipTitle(this.titleRef);\n this.setTooltipTitle(this.subtitleRef);\n }\n\n private resizeHandler = (): void => {\n this.setTooltipTitle(this.authorsRef);\n this.setTooltipTitle(this.titleRef);\n this.setTooltipTitle(this.subtitleRef);\n };\n\n componentDidLoad(): void {\n window.addEventListener(\"resize\", this.resizeHandler);\n }\n\n disconnectedCallback(): void {\n window.removeEventListener(\"resize\", this.resizeHandler);\n }\n\n private renderOperaCard = (): HTMLZResultCardElement => {\n return (\n <Host tabIndex={0}>\n <div class={`z-cover-container ${this.hasMultipleCovers ? \"has-multiple\" : \"\"}`}>\n <div class=\"z-cover-stack\">\n {this.hasMultipleCovers && (\n <div>\n <div class=\"z-cover-shadow z-shadow-2\" />\n <div class=\"z-cover-shadow z-shadow-1\" />\n </div>\n )}\n <img\n src={this.cover}\n alt=\"Book Cover\"\n class=\"z-cover-img\"\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n } else {\n this.cover = defaultFallbackCover;\n }\n }}\n />\n </div>\n </div>\n <div class=\"info-container\">\n {this.authors && (\n <span\n class=\"authors-label\"\n ref={(el) => (this.authorsRef = el as HTMLElement)}\n >\n {this.authors}\n </span>\n )}\n <span\n class=\"card-title\"\n ref={(el) => (this.titleRef = el as HTMLElement)}\n >\n {this.cardTitle}\n </span>\n <span\n class=\"card-subtitle\"\n ref={(el) => (this.subtitleRef = el as HTMLElement)}\n >\n {this.cardSubtitle}\n </span>\n <div class=\"tags-container\">\n <slot name=\"tags\"></slot>\n </div>\n <div class=\"volumes-label\">\n <slot name=\"volumes\"></slot>\n </div>\n </div>\n </Host>\n );\n };\n\n private renderInfoCard = (): HTMLZResultCardElement => {\n return (\n <Host\n tabIndex={0}\n class=\"info-card\"\n >\n <div class=\"info-icon-column\">\n <div class=\"info-icon-container\">\n <z-icon\n class=\"info-icon\"\n name=\"link\"\n width={18}\n height={18}\n />\n </div>\n </div>\n <div class=\"info-container\">\n <span\n class=\"card-title info-title\"\n ref={(el) => (this.titleRef = el as HTMLElement)}\n >\n {this.cardTitle}\n </span>\n <span\n class=\"card-subtitle info-subtitle\"\n ref={(el) => (this.subtitleRef = el as HTMLElement)}\n >\n {this.cardSubtitle}\n </span>\n </div>\n </Host>\n );\n };\n\n render(): HTMLZResultCardElement {\n return this.isInfoCard ? this.renderInfoCard() : this.renderOperaCard();\n }\n}\n"]}

package/dist/collection/components/result-card/z-result-card/z-result-card.stories.js CHANGED Viewed

@@ -8,6 +8,7 @@ const StoryMeta = {
         cardSubtitle: { control: "text" },
         authors: { control: "text" },
         cover: { control: "text" },
+        fallbackCover: { control: "text" },
         hasMultipleCovers: { control: "boolean" },
         isInfoCard: { control: "boolean" },
     },
@@ -18,6 +19,7 @@ const args = {
     cardSubtitle: "Subtitle",
     authors: "John Doe",
     cover: "https://place.abh.ai/s3fs-public/placeholder/DSC_0199_400x400.JPG",
+    fallbackCover: "https://staticmy.zanichelli.it/copertine/dashboard/Dashboard_Book_Placeholder.jpg",
     hasMultipleCovers: false,
     isInfoCard: false,
 };
@@ -29,6 +31,7 @@ export const SingleCover = {
       .cardSubtitle=${args.cardSubtitle}
       .authors=${args.authors}
       .cover=${args.cover}
+      fallback-cover=${args.fallbackCover}
       .hasMultipleCovers=${args.hasMultipleCovers}
       .isInfoCard=${args.isInfoCard}
     >
@@ -45,6 +48,7 @@ export const MultipleCovers = {
       .cardSubtitle=${args.cardSubtitle}
       .authors=${args.authors}
       .cover=${args.cover}
+      fallback-cover=${args.fallbackCover}
       .hasMultipleCovers=${args.hasMultipleCovers}
       .isInfoCard=${args.isInfoCard}
     >
@@ -62,6 +66,7 @@ export const LongTitleAndSubtitle = {
       .cardSubtitle=${args.cardSubtitle}
       .authors=${args.authors}
       .cover=${args.cover}
+      fallback-cover=${args.fallbackCover}
       .hasMultipleCovers=${args.hasMultipleCovers}
       .isInfoCard=${args.isInfoCard}
     >
@@ -77,6 +82,7 @@ export const OnlyTitleAndSubtitle = {
       .cardTitle=${args.cardTitle}
       .cardSubtitle=${args.cardSubtitle}
       .cover=${args.cover}
+      fallback-cover=${args.fallbackCover}
       .hasMultipleCovers=${args.hasMultipleCovers}
       .isInfoCard=${args.isInfoCard}
     />
@@ -90,6 +96,7 @@ export const InfoCard = {
       .cardSubtitle=${args.cardSubtitle}
       .authors=${args.authors}
       .cover=${args.cover}
+      fallback-cover=${args.fallbackCover}
       .hasMultipleCovers=${args.hasMultipleCovers}
       .isInfoCard=${args.isInfoCard}
     />

package/dist/collection/components/result-card/z-result-card/z-result-card.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"z-result-card.stories.js","sourceRoot":"","sources":["../../../../../src/components/result-card/z-result-card/z-result-card.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAS;IACtB,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,eAAe;IAC1B,QAAQ,EAAE;QACR,SAAS,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC;QAC5B,YAAY,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC;QAC/B,OAAO,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC;QAC1B,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC;QACxB,iBAAiB,EAAE,EAAC,OAAO,EAAE,SAAS,EAAC;QACvC,UAAU,EAAE,EAAC,OAAO,EAAE,SAAS,EAAC;KACjC;CACF,CAAC;AAEF,eAAe,SAAS,CAAC;AAIzB,MAAM,IAAI,GAAG;IACX,SAAS,EAAE,OAAO;IAClB,YAAY,EAAE,UAAU;IACxB,OAAO,EAAE,UAAU;IACnB,KAAK,EAAE,mEAAmE;IAC1E,iBAAiB,EAAE,KAAK;IACxB,UAAU,EAAE,KAAK;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAChC,IAAI,oBACC,IAAI,CACR;IAED,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;mBAEL,IAAI,CAAC,SAAS;sBACX,IAAI,CAAC,YAAY;iBACtB,IAAI,CAAC,OAAO;eACd,IAAI,CAAC,KAAK;~~2BACE~~,IAAI,CAAC,iBAAiB;oBAC7B,IAAI,CAAC,UAAU;;;;;GAKhC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAU;IACnC,IAAI,kCACC,IAAI,KACP,iBAAiB,EAAE,IAAI,GACxB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;mBAEL,IAAI,CAAC,SAAS;sBACX,IAAI,CAAC,YAAY;iBACtB,IAAI,CAAC,OAAO;eACd,IAAI,CAAC,KAAK;~~2BACE~~,IAAI,CAAC,iBAAiB;oBAC7B,IAAI,CAAC,UAAU;;;;;;GAMhC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAU;IACzC,IAAI,kCACC,IAAI,KACP,SAAS,EACP,iKAAiK,EACnK,YAAY,EACV,uVAAuV,EACzV,iBAAiB,EAAE,IAAI,GACxB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;mBAEL,IAAI,CAAC,SAAS;sBACX,IAAI,CAAC,YAAY;iBACtB,IAAI,CAAC,OAAO;eACd,IAAI,CAAC,KAAK;~~2BACE~~,IAAI,CAAC,iBAAiB;oBAC7B,IAAI,CAAC,UAAU;;;;;GAKhC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAU;IACzC,IAAI,kCACC,IAAI,KACP,MAAM,EAAE,SAAS,GAClB;IAED,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;mBAEL,IAAI,CAAC,SAAS;sBACX,IAAI,CAAC,YAAY;eACxB,IAAI,CAAC,KAAK;~~2BACE~~,IAAI,CAAC,iBAAiB;oBAC7B,IAAI,CAAC,UAAU;;GAEhC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,kCACC,IAAI,KACP,SAAS,EAAE,iBAAiB,EAC5B,YAAY,EACV,2OAA2O,EAC7O,UAAU,EAAE,IAAI,GACjB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;mBAEL,IAAI,CAAC,SAAS;sBACX,IAAI,CAAC,YAAY;iBACtB,IAAI,CAAC,OAAO;eACd,IAAI,CAAC,KAAK;~~2BACE~~,IAAI,CAAC,iBAAiB;oBAC7B,IAAI,CAAC,UAAU;;GAEhC;CACF,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport \"./index\";\n\nconst StoryMeta: Meta = {\n title: \"ZResultCard\",\n component: \"z-result-card\",\n argTypes: {\n cardTitle: {control: \"text\"},\n cardSubtitle: {control: \"text\"},\n authors: {control: \"text\"},\n cover: {control: \"text\"},\n hasMultipleCovers: {control: \"boolean\"},\n isInfoCard: {control: \"boolean\"},\n },\n};\n\nexport default StoryMeta;\n\ntype Story = StoryObj;\n\nconst args = {\n cardTitle: \"Title\",\n cardSubtitle: \"Subtitle\",\n authors: \"John Doe\",\n cover: \"https://place.abh.ai/s3fs-public/placeholder/DSC_0199_400x400.JPG\",\n hasMultipleCovers: false,\n isInfoCard: false,\n};\n\nexport const SingleCover: Story = {\n args: {\n ...args,\n },\n\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const MultipleCovers: Story = {\n args: {\n ...args,\n hasMultipleCovers: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const LongTitleAndSubtitle: Story = {\n args: {\n ...args,\n cardTitle:\n \"This is a very long title that should wrap to the next line if it exceeds the width of the card, it goes on two rows for desktop devices and one row for mobile\",\n cardSubtitle:\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tincidunt maximus tellus, eget dapibus nulla blandit sed. Nullam augue ipsum, mattis sit amet diam ut, finibus posuere libero. Fusce nec erat eu risus fermentum mattis. Nunc volutpat viverra felis, eu iaculis ipsum tempus mattis. Phasellus euismod quam eget nisl pellentesque.\",\n hasMultipleCovers: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const OnlyTitleAndSubtitle: Story = {\n args: {\n ...args,\n author: undefined,\n },\n\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .cover=${args.cover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n />\n `,\n};\n\nexport const InfoCard: Story = {\n args: {\n ...args,\n cardTitle: \"Info Card Title\",\n cardSubtitle:\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tincidunt maximus tellus, eget dapibus nulla blandit sed. Nullam augue ipsum, mattis sit amet diam ut, finibus posuere libero. Fusce nec erat eu risus fermentum mattis.\",\n isInfoCard: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n />\n `,\n};\n"]}
1	+ {"version":3,"file":"z-result-card.stories.js","sourceRoot":"","sources":["../../../../../src/components/result-card/z-result-card/z-result-card.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport \"./index\";\n\nconst StoryMeta: Meta = {\n title: \"ZResultCard\",\n component: \"z-result-card\",\n argTypes: {\n cardTitle: {control: \"text\"},\n cardSubtitle: {control: \"text\"},\n authors: {control: \"text\"},\n cover: {control: \"text\"},\n fallbackCover: {control: \"text\"},\n hasMultipleCovers: {control: \"boolean\"},\n isInfoCard: {control: \"boolean\"},\n },\n};\n\nexport default StoryMeta;\n\ntype Story = StoryObj;\n\nconst args = {\n cardTitle: \"Title\",\n cardSubtitle: \"Subtitle\",\n authors: \"John Doe\",\n cover: \"https://place.abh.ai/s3fs-public/placeholder/DSC_0199_400x400.JPG\",\n fallbackCover: \"https://staticmy.zanichelli.it/copertine/dashboard/Dashboard_Book_Placeholder.jpg\",\n hasMultipleCovers: false,\n isInfoCard: false,\n};\n\nexport const SingleCover: Story = {\n args: {\n ...args,\n },\n\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n fallback-cover=${args.fallbackCover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const MultipleCovers: Story = {\n args: {\n ...args,\n hasMultipleCovers: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n fallback-cover=${args.fallbackCover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const LongTitleAndSubtitle: Story = {\n args: {\n ...args,\n cardTitle:\n \"This is a very long title that should wrap to the next line if it exceeds the width of the card, it goes on two rows for desktop devices and one row for mobile\",\n cardSubtitle:\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tincidunt maximus tellus, eget dapibus nulla blandit sed. Nullam augue ipsum, mattis sit amet diam ut, finibus posuere libero. Fusce nec erat eu risus fermentum mattis. Nunc volutpat viverra felis, eu iaculis ipsum tempus mattis. Phasellus euismod quam eget nisl pellentesque.\",\n hasMultipleCovers: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n fallback-cover=${args.fallbackCover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n >\n <span slot=\"tags\">Example tag</span>\n <span slot=\"volumes\">2 volumes</span>\n </z-result-card>\n `,\n};\n\nexport const OnlyTitleAndSubtitle: Story = {\n args: {\n ...args,\n author: undefined,\n },\n\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .cover=${args.cover}\n fallback-cover=${args.fallbackCover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n />\n `,\n};\n\nexport const InfoCard: Story = {\n args: {\n ...args,\n cardTitle: \"Info Card Title\",\n cardSubtitle:\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tincidunt maximus tellus, eget dapibus nulla blandit sed. Nullam augue ipsum, mattis sit amet diam ut, finibus posuere libero. Fusce nec erat eu risus fermentum mattis.\",\n isInfoCard: true,\n },\n render: (args) => html`\n <z-result-card\n .cardTitle=${args.cardTitle}\n .cardSubtitle=${args.cardSubtitle}\n .authors=${args.authors}\n .cover=${args.cover}\n fallback-cover=${args.fallbackCover}\n .hasMultipleCovers=${args.hasMultipleCovers}\n .isInfoCard=${args.isInfoCard}\n />\n `,\n};\n"]}

package/dist/collection/components/z-combobox/index.js CHANGED Viewed

@@ -228,7 +228,7 @@ export class ZCombobox {
         return h("ul", { role: "none" }, listGroups);
     }
     renderNoSearchResults() {
-        return (h("div", { class: "no-results" }, h("z-icon", { name: "multiply-circle" }), h("span", null, this.noresultslabel)));
+        return (h("div", { class: "no-results" }, h("span", null, this.noresultslabel)));
     }
     renderCloseButton() {
         return (h("div", { class: "close-search" }, h("a", { onClick: () => this.closeFilterItems(), onKeyUp: (e) => handleKeyboardSubmit(e, this.closeFilterItems), role: "button", tabindex: 0 }, this.closesearchtext)));
@@ -251,7 +251,7 @@ export class ZCombobox {
         return (h("div", { class: "check-all-wrapper" }, h("z-input", { type: InputType.CHECKBOX, checked: allChecked, htmlid: checkAllId, class: this.getCheckboxClass(), label: allChecked ? this.uncheckalltext : this.checkalltext, disabled: this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size, role: "option", "aria-selected": allChecked ? "true" : "false", onKeyDown: (e) => this.handleSelectArrowsNavigation(e, checkAllId), onInputCheck: (e) => this.checkAll(e.detail.checked), onInputFocus: (e) => this.handleCheckboxFocus(e.detail.id) })));
     }
     render() {
-        return (h("div", { key: 'c746599f1d5cef116c2319d365792288d6f0f34b', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
+        return (h("div", { key: '2bcce71a364e370b7c6aaca5a90320b8600e684a', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
     }
     static get is() { return "z-combobox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-combobox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-combobox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n @Element() element: HTMLZComboboxElement;\n\n /** input unique id /\n @Prop()\n inputid = `combo-${randomId()}`;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n @State()\n focusedItemId: string;\n\n @State()\n checkboxes: HTMLInputElement[] = [];\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n }\n\n @Watch(\"checkboxes\")\n watchCheckboxes(): void {\n this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n componentDidRender(): void {\n const checkboxes = this.getAllCheckboxes();\n if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n this.checkboxes = checkboxes;\n }\n }\n\n private getItemId(item: ComboItem): string {\n return `combo-checkbox-${this.inputid}-${item.id}`;\n }\n\n private getCheckboxClass(): string {\n return `combo-item-checkbox-input-${this.inputid}`;\n }\n\n private getAllCheckboxes(): HTMLInputElement[] {\n return Array.from(\n this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n ) as HTMLInputElement[];\n }\n\n private getControlToListSize(): ListSize {\n switch (this.size) {\n case ControlSize.X_SMALL:\n return ListSize.SMALL;\n case ControlSize.SMALL:\n return ListSize.MEDIUM;\n default:\n return ListSize.LARGE;\n }\n }\n\n private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) \|\| !this.isopen) {\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n\n const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n if (!currElem) {\n return;\n }\n\n const checkboxes = this.checkboxes;\n if (!checkboxes.length) {\n return;\n }\n\n const currElemIndex = checkboxes.indexOf(currElem);\n const firstElemIndex = 0;\n const lastElemIndex = checkboxes.length - 1;\n\n let nextElem = null;\n if (e.key === KeyboardCode.ARROW_DOWN) {\n nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n } else if (e.key === KeyboardCode.ARROW_UP) {\n nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n }\n\n this.focusComboboxItem(nextElem);\n }\n\n private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n }\n if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) \|\| (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n this.toggleComboBox();\n }\n }\n\n private handleCheckboxFocus(id: string): void {\n this.focusedItemId = id;\n }\n\n private focusComboboxItem(elem): void {\n this.checkboxes.forEach(function (item) {\n item.setAttribute(\"tabindex\", \"-1\");\n });\n\n elem.setAttribute(\"tabindex\", \"0\");\n elem.focus();\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n \"<strong>\" +\n item.name.substring(start, end) +\n \"</strong>\" +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n }\n\n private getComboboxA11yAttributes(): Record<string, string> {\n return {\n \"role\": \"combobox\",\n \"aria-label\": this.label,\n \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n \"aria-controls\": `${this.inputid}_list`,\n };\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n this.handleHeaderKeyboardEvent(ev);\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n aria-expanded={this.isopen ? \"true\" : \"false\"}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n <div\n role=\"listbox\"\n aria-label={this.label}\n aria-multiselectable={true}\n id={`${this.inputid}_list`}\n aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n >\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n return (\n <div class={this.searchValue && \"search\"}>\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): HTMLZListElement {\n return (\n <z-list-element\n id={item.id}\n htmlTabindex={null}\n dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n size={this.getControlToListSize()}\n >\n <z-input\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={this.getItemId(item)}\n label={item.name}\n class={this.getCheckboxClass()}\n disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={item.checked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n onInputCheck={(e: CustomEvent) => {\n this.itemsList = this.itemsList.map((i: ComboItem) => {\n if (item.id === i.id) {\n i.checked = e.detail.checked;\n }\n\n return i;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </z-list-element>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(items);\n }\n\n return (\n <ul role=\"none\">\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul role=\"none\">{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <div class=\"no-results\">\n <z-icon name=\"multiply-circle\" />\n <span>{this.noresultslabel}</span>\n </div>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div class=\"close-search\">\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private renderSearchInput(): ZInput {\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n aria-autocomplete=\"list\"\n {...this.getComboboxA11yAttributes()}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.key === KeyboardCode.ESC) {\n this.closeFilterItems();\n }\n }}\n onInputChange={(e: CustomEvent) => {\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={checkAllId}\n class={this.getCheckboxClass()}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={allChecked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-combobox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n @Element() element: HTMLZComboboxElement;\n\n /** input unique id /\n @Prop()\n inputid = `combo-${randomId()}`;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n @State()\n focusedItemId: string;\n\n @State()\n checkboxes: HTMLInputElement[] = [];\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n }\n\n @Watch(\"checkboxes\")\n watchCheckboxes(): void {\n this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n componentDidRender(): void {\n const checkboxes = this.getAllCheckboxes();\n if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n this.checkboxes = checkboxes;\n }\n }\n\n private getItemId(item: ComboItem): string {\n return `combo-checkbox-${this.inputid}-${item.id}`;\n }\n\n private getCheckboxClass(): string {\n return `combo-item-checkbox-input-${this.inputid}`;\n }\n\n private getAllCheckboxes(): HTMLInputElement[] {\n return Array.from(\n this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n ) as HTMLInputElement[];\n }\n\n private getControlToListSize(): ListSize {\n switch (this.size) {\n case ControlSize.X_SMALL:\n return ListSize.SMALL;\n case ControlSize.SMALL:\n return ListSize.MEDIUM;\n default:\n return ListSize.LARGE;\n }\n }\n\n private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) \|\| !this.isopen) {\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n\n const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n if (!currElem) {\n return;\n }\n\n const checkboxes = this.checkboxes;\n if (!checkboxes.length) {\n return;\n }\n\n const currElemIndex = checkboxes.indexOf(currElem);\n const firstElemIndex = 0;\n const lastElemIndex = checkboxes.length - 1;\n\n let nextElem = null;\n if (e.key === KeyboardCode.ARROW_DOWN) {\n nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n } else if (e.key === KeyboardCode.ARROW_UP) {\n nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n }\n\n this.focusComboboxItem(nextElem);\n }\n\n private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n }\n if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) \|\| (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n this.toggleComboBox();\n }\n }\n\n private handleCheckboxFocus(id: string): void {\n this.focusedItemId = id;\n }\n\n private focusComboboxItem(elem): void {\n this.checkboxes.forEach(function (item) {\n item.setAttribute(\"tabindex\", \"-1\");\n });\n\n elem.setAttribute(\"tabindex\", \"0\");\n elem.focus();\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n \"<strong>\" +\n item.name.substring(start, end) +\n \"</strong>\" +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n }\n\n private getComboboxA11yAttributes(): Record<string, string> {\n return {\n \"role\": \"combobox\",\n \"aria-label\": this.label,\n \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n \"aria-controls\": `${this.inputid}_list`,\n };\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n this.handleHeaderKeyboardEvent(ev);\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n aria-expanded={this.isopen ? \"true\" : \"false\"}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n <div\n role=\"listbox\"\n aria-label={this.label}\n aria-multiselectable={true}\n id={`${this.inputid}_list`}\n aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n >\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n return (\n <div class={this.searchValue && \"search\"}>\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): HTMLZListElement {\n return (\n <z-list-element\n id={item.id}\n htmlTabindex={null}\n dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n size={this.getControlToListSize()}\n >\n <z-input\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={this.getItemId(item)}\n label={item.name}\n class={this.getCheckboxClass()}\n disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={item.checked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n onInputCheck={(e: CustomEvent) => {\n this.itemsList = this.itemsList.map((i: ComboItem) => {\n if (item.id === i.id) {\n i.checked = e.detail.checked;\n }\n\n return i;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </z-list-element>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(items);\n }\n\n return (\n <ul role=\"none\">\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul role=\"none\">{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <div class=\"no-results\">\n <span>{this.noresultslabel}</span>\n </div>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div class=\"close-search\">\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private renderSearchInput(): ZInput {\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n aria-autocomplete=\"list\"\n {...this.getComboboxA11yAttributes()}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.key === KeyboardCode.ESC) {\n this.closeFilterItems();\n }\n }}\n onInputChange={(e: CustomEvent) => {\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={checkAllId}\n class={this.getCheckboxClass()}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={allChecked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/z-combobox/styles.css CHANGED Viewed

@@ -129,6 +129,8 @@
   overflow: auto;
   max-height: 235px;
   padding: 0;
+  padding-left: var(--space-unit); /* padding left and negative margin in order to enable focus */
+  margin-left: calc(var(--space-unit) * -1); /* padding left and negative margin in order to enable focus */
 }
 :host > div.open > div.open-combo-data > z-input {
@@ -138,7 +140,7 @@
 :host > div.open > div.open-combo-data > div > div > ul {
   max-height: 235px;
-  padding: 0 3px; /* needed for checkbox focus shadow */
+  padding: 0 calc(var(--space-unit) * 0.5); /* needed for checkbox focus shadow */
   margin: 0;
 }
@@ -217,9 +219,12 @@
 }
 :host > div.open > div.open-combo-data > div > div.check-all-wrapper {
-  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5);
+  /* padding left and negative margin in order to enable focus */
+  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2)
+    calc(var(--space-unit) * 1.5);
   border-bottom: var(--border-size-small) solid var(--gray800);
   margin-bottom: var(--space-unit);
+  margin-left: calc(var(--space-unit) * -1);
   text-align: left;
 }

package/dist/collection/components/z-popover/index.js CHANGED Viewed

@@ -62,18 +62,6 @@ export class ZPopover {
         cancelAnimationFrame(this.animationFrameRequestId);
         this.openChange.emit({ open: this.open });
         if (!this.open) {
-            Object.assign(this.host.style, {
-                // Reset all positioning properties
-                top: "auto",
-                right: "auto",
-                bottom: "auto",
-                left: "auto",
-                maxWidth: "",
-                maxHeight: "",
-                // Set initial visibility to hidden while calculating position...
-                visibility: "hidden",
-            });
-            this.currentPosition = undefined;
             return;
         }
         const updatePositionLoop = () => {
@@ -213,6 +201,7 @@ export class ZPopover {
                 return pos;
             }
         }
+        // If no position fits, find the best fallback based on available space
         return this.findBestFallbackPosition(availableSpace);
     }
     /** Find the best fallback position based on available space when no position fits perfectly. */
@@ -376,10 +365,8 @@ export class ZPopover {
         }
         if (getDevice() !== Device.MOBILE) {
             // Only force max sizes on non-mobile viewports
-            Object.assign(hostStyle, {
-                maxWidth: maxWidth ? `${maxWidth}px` : "",
-                maxHeight: maxHeight ? `${maxHeight}px` : "",
-            });
+            hostStyle.maxWidth = maxWidth ? `${maxWidth}px` : "";
+            hostStyle.maxHeight = maxHeight ? `${maxHeight}px` : "";
         }
     }
     /** Set the position of the popover. */
@@ -424,7 +411,7 @@ export class ZPopover {
         cancelAnimationFrame(this.animationFrameRequestId);
     }
     render() {
-        return (h(Host, { key: '2a5248b521455e8682038aaf42ca9020b6ffb68d', "current-position": this.currentPosition }, h("slot", { key: '4993c751c45e1ff683dc341f9445a30ff2647d44' })));
+        return (h(Host, { key: '1eafd1bd08aa31a81378354542b0e74edc4cb0ce', "current-position": this.currentPosition }, h("slot", { key: '2ad916cf0e13766e2e5f92f4f964a4fe909cdc7a' })));
     }
     static get is() { return "z-popover"; }
     static get encapsulation() { return "shadow"; }