npm - @zanichelli/albe-web-components - Versions diffs - 14.5.0 → 14.5.2-rc-anchor-navigation - Mend

@zanichelli/albe-web-components 14.5.0 → 14.5.2-rc-anchor-navigation

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 (1749) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-aria-alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,~~CAAC~~,EAAE,~~IAAI~~,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAM3C,MAAM,OAAO,UAAU;;oBAGE,cAAc,CAAC,MAAM;;IAE5C,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,kEACQ,IAAI,CAAC,IAAI,iBACR,MAAM,mBACJ,WAAW;YAEzB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h~~, Host~~} from \"@stencil/core\";\nimport {ZAriaAlertMode} from \"../../beans\";\n\n@Component({\n tag: \"z-aria-alert\",\n shadow: false,\n})\nexport class ZAriaAlert {\n /** Aria live mode */\n @Prop()\n mode: ZAriaAlertMode = ZAriaAlertMode.POLITE;\n\n render(): HTMLZAriaAlertElement {\n return (\n <Host\n aria-live={this.mode}\n aria-atomic=\"true\"\n aria-relevant=\"additions\"\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-aria-alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAM3C,MAAM,OAAO,UAAU;;oBAGE,cAAc,CAAC,MAAM;;IAE5C,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,kEACQ,IAAI,CAAC,IAAI,iBACR,MAAM,mBACJ,WAAW;YAEzB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ZAriaAlertMode} from \"../../beans\";\n\n@Component({\n tag: \"z-aria-alert\",\n shadow: false,\n})\nexport class ZAriaAlert {\n /** Aria live mode */\n @Prop()\n mode: ZAriaAlertMode = ZAriaAlertMode.POLITE;\n\n render(): HTMLZAriaAlertElement {\n return (\n <Host\n aria-live={this.mode}\n aria-atomic=\"true\"\n aria-relevant=\"additions\"\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/z-aria-alert/index.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["~~../../../~~src/components/z-aria-alert/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AAEnC,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACtC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAC3B;;uBAEiB,CAClB,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZAriaAlert} from \"./index\";\n\ndescribe(\"Suite test ZAriaAlert\", () => {\n it(\"Test render ZAriaAlert\", async () => {\n const page = await newSpecPage({\n components: [ZAriaAlert],\n html: `<z-aria-alert>testo</z-aria-alert>`,\n });\n\n expect(page.root).toEqualHtml(\n `<z-aria-alert aria-atomic=\"true\" aria-live=\"polite\" aria-relevant=\"additions\">\n testo\n </z-aria-alert>`\n );\n });\n});\n"]}
1	+ {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/z-aria-alert/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,UAAU,EAAC,MAAM,SAAS,CAAC;AAEnC,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACtC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAC3B;;uBAEiB,CAClB,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZAriaAlert} from \"./index\";\n\ndescribe(\"Suite test ZAriaAlert\", () => {\n it(\"Test render ZAriaAlert\", async () => {\n const page = await newSpecPage({\n components: [ZAriaAlert],\n html: `<z-aria-alert>testo</z-aria-alert>`,\n });\n\n expect(page.root).toEqualHtml(\n `<z-aria-alert aria-atomic=\"true\" aria-live=\"polite\" aria-relevant=\"additions\">\n testo\n </z-aria-alert>`\n );\n });\n});\n"]}

package/dist/collection/components/z-aria-alert/index.stories.js ADDED Viewed

@@ -0,0 +1,76 @@
+import { html } from "lit";
+import { ZAriaAlertMode } from "../../beans";
+import "../z-button/index";
+import "../z-visually-hidden/index";
+import "./index";
+const StoryMeta = {
+    title: "ZAriaAlert",
+    component: "z-aria-alert",
+    argTypes: {
+        mode: {
+            control: {
+                type: "select",
+            },
+            options: Object.values(ZAriaAlertMode),
+        },
+    },
+    args: {
+        mode: ZAriaAlertMode.POLITE,
+    },
+};
+export default StoryMeta;
+export const Default = {
+    render: (args) => html `<script>
+        function myFunction() {
+          const myTimeout = setTimeout(myDelayedFunction, 3000);
+        }
+        function myDelayedFunction() {
+          var myalert = document.getElementById("idAlert");
+          myalert.innerHTML = "Ecco un numero a caso: " + Math.random();
+        }
+      </script>
+      <div>
+        <h2 class="heading-2">ZAriaAlert deafult</h2>
+        <span>
+          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message
+        </span>
+        <z-button onclick="myFunction()">Click to say something</z-button>
+        <z-aria-alert
+          id="idAlert"
+          mode="${args.mode}"
+        >
+          Testo NON nascosto
+        </z-aria-alert>
+      </div>`,
+};
+export const VisuallyHidden = {
+    render: (args) => html `<script>
+        function myFunction2() {
+          const myTimeout = setTimeout(myDelayedFunction2, 3000);
+        }
+        function myDelayedFunction2() {
+          var myalert = document.getElementById("idAlert2");
+          myalert.innerHTML = "Ecco un numero a caso: " + Math.random();
+        }
+      </script>
+      <div>
+        <h2 class="heading-2">ZAriaAlert with VisuallyHidden</h2>
+        <span>
+          You can also wrap your <code>z-aria-alert</code> with a <code>z-visually-hidden</code> tag in order to
+          visually hide the text.
+        </span>
+        <span>
+          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message
+        </span>
+        <z-button onclick="myFunction2()">Click to say something but visually hidden</z-button>
+        <z-visually-hidden>
+          <z-aria-alert
+            id="idAlert2"
+            mode="${args.mode}"
+          >
+            Testo qua
+          </z-aria-alert>
+        </z-visually-hidden>
+      </div>`,
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-aria-alert/index.stories.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-aria-alert/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAC3B,OAAO,4BAA4B,CAAC;AACpC,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,cAAc;IACzB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC;SACvC;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,cAAc,CAAC,MAAM;KAC5B;CACyB,CAAC;AAC7B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;;;;;;;;;;;;;;;;kBAiBU,IAAI,CAAC,IAAI;;;;aAId;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;oBAsBY,IAAI,CAAC,IAAI;;;;;aAKhB;CACZ,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZAriaAlert} from \".\";\nimport {ZAriaAlertMode} from \"../../beans\";\nimport \"../z-button/index\";\nimport \"../z-visually-hidden/index\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZAriaAlert\",\n component: \"z-aria-alert\",\n argTypes: {\n mode: {\n control: {\n type: \"select\",\n },\n options: Object.values(ZAriaAlertMode),\n },\n },\n args: {\n mode: ZAriaAlertMode.POLITE,\n },\n} satisfies Meta<ZAriaAlert>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<script>\n function myFunction() {\n const myTimeout = setTimeout(myDelayedFunction, 3000);\n }\n function myDelayedFunction() {\n var myalert = document.getElementById(\"idAlert\");\n myalert.innerHTML = \"Ecco un numero a caso: \" + Math.random();\n }\n </script>\n <div>\n <h2 class=\"heading-2\">ZAriaAlert deafult</h2>\n <span>\n Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message\n </span>\n <z-button onclick=\"myFunction()\">Click to say something</z-button>\n <z-aria-alert\n id=\"idAlert\"\n mode=\"${args.mode}\"\n >\n Testo NON nascosto\n </z-aria-alert>\n </div>`,\n};\n\nexport const VisuallyHidden = {\n render: (args) =>\n html`<script>\n function myFunction2() {\n const myTimeout = setTimeout(myDelayedFunction2, 3000);\n }\n function myDelayedFunction2() {\n var myalert = document.getElementById(\"idAlert2\");\n myalert.innerHTML = \"Ecco un numero a caso: \" + Math.random();\n }\n </script>\n <div>\n <h2 class=\"heading-2\">ZAriaAlert with VisuallyHidden</h2>\n <span>\n You can also wrap your <code>z-aria-alert</code> with a <code>z-visually-hidden</code> tag in order to\n visually hide the text.\n </span>\n <span>\n Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message\n </span>\n <z-button onclick=\"myFunction2()\">Click to say something but visually hidden</z-button>\n <z-visually-hidden>\n <z-aria-alert\n id=\"idAlert2\"\n mode=\"${args.mode}\"\n >\n Testo qua\n </z-aria-alert>\n </z-visually-hidden>\n </div>`,\n};\n"]}

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

@@ -1,4 +1,4 @@
-import { h, Host } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 import { AvatarSize } from "../../beans";
 export class ZAvatar {
     constructor() {
@@ -24,10 +24,10 @@ export class ZAvatar {
         }
     }
     render() {
-        return (h(Host, { key: '17a097738ce186c791794f5f8192cd46845df2a6', class: { [this.size]: true, [`body-${this.getTextSize()}-sb`]: true }, style: {
+        return (h(Host, { key: '63564a1499f36b406dcece1fd47bb0aa8e06ed6d', class: { [this.size]: true, [`body-${this.getTextSize()}-sb`]: true }, style: {
                 color: `var(--${this.textColor})`,
                 backgroundColor: `var(--${this.backgroundColor})`,
-            } }, this.text && !this.image && h("span", null, this.text.substring(0, 2)), this.image && (h("img", { src: this.image, onError: () => (this.image = "") }))));
+            } }, this.text && !this.image && h("span", { key: '9813952059608df9a5cdf74db7038aec2751dfa8' }, this.text.substring(0, 2)), this.image && (h("img", { key: 'd918f83b5212cb7618e30a0dc040f0c312341386', src: this.image, onError: () => (this.image = "") }))));
     }
     static get is() { return "z-avatar"; }
     static get encapsulation() { return "shadow"; }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-avatar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,~~CAAC~~,EAAE,~~IAAI~~,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,UAAU,EAAC,MAAM,aAAa,CAAC;AAOvC,MAAM,OAAO,OAAO;IAqBlB;;oBAlBoB,UAAU,CAAC,MAAM;;yBAQhB,aAAa;+BAIP,SAAS;;QAOlC,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,MAAK,CAAC,IAAI,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,MAAK,CAAC,EAAE,CAAC;YACxD,OAAO,CAAC,IAAI,CAAC,gEAAgE,CAAC,CAAC;QACjF,CAAC;KACF;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YACnC,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,MAAM,EAAE,CAAC;YAC3C,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YAC1C,OAAO,GAAG,CAAC;QACb,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,EAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,QAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,IAAI,EAAC,EACnE,KAAK,EAAE;gBACL,KAAK,EAAE,SAAS,IAAI,CAAC,SAAS,GAAG;gBACjC,eAAe,EAAE,SAAS,IAAI,CAAC,eAAe,GAAG;aAClD;YAEA,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,~~gBAAO,~~IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAQ;YACpE,IAAI,CAAC,KAAK,IAAI,CACb,~~WACE~~,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,GAChC,CACH,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h~~, Host~~} from \"@stencil/core\";\nimport {AvatarSize} from \"../../beans\";\n\n@Component({\n tag: \"z-avatar\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZAvatar {\n /** [optional] Avatar size /\n @Prop()\n size?: AvatarSize = AvatarSize.MEDIUM;\n\n /* [optional] Avatar text /\n @Prop()\n text?: string;\n\n /* [optional] Avatar text color /\n @Prop()\n textColor?: string = \"color-white\";\n\n /* [optional] Avatar background color /\n @Prop()\n backgroundColor?: string = \"gray700\";\n\n /* [optional] Avatar image */\n @Prop({mutable: true})\n image?: string;\n\n constructor() {\n if (this.text?.length === 0 && this.image?.length === 0) {\n console.warn(\"z-avatar must contain at least one prop between text and image\");\n }\n }\n\n private getTextSize(): string {\n if (this.size === AvatarSize.SMALL) {\n return \"5\";\n } else if (this.size === AvatarSize.MEDIUM) {\n return \"4\";\n } else if (this.size === AvatarSize.LARGE) {\n return \"2\";\n }\n }\n\n render(): HTMLZAvatarElement {\n return (\n <Host\n class={{[this.size]: true, [`body-${this.getTextSize()}-sb`]: true}}\n style={{\n color: `var(--${this.textColor})`,\n backgroundColor: `var(--${this.backgroundColor})`,\n }}\n >\n {this.text && !this.image && <span>{this.text.substring(0, 2)}</span>}\n {this.image && (\n <img\n src={this.image}\n onError={() => (this.image = \"\")}\n />\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-avatar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,UAAU,EAAC,MAAM,aAAa,CAAC;AAOvC,MAAM,OAAO,OAAO;IAqBlB;;oBAlBoB,UAAU,CAAC,MAAM;;yBAQhB,aAAa;+BAIP,SAAS;;QAOlC,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,MAAK,CAAC,IAAI,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,MAAK,CAAC,EAAE,CAAC;YACxD,OAAO,CAAC,IAAI,CAAC,gEAAgE,CAAC,CAAC;QACjF,CAAC;KACF;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YACnC,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,MAAM,EAAE,CAAC;YAC3C,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YAC1C,OAAO,GAAG,CAAC;QACb,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,EAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,QAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,IAAI,EAAC,EACnE,KAAK,EAAE;gBACL,KAAK,EAAE,SAAS,IAAI,CAAC,SAAS,GAAG;gBACjC,eAAe,EAAE,SAAS,IAAI,CAAC,eAAe,GAAG;aAClD;YAEA,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,+DAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAQ;YACpE,IAAI,CAAC,KAAK,IAAI,CACb,4DACE,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,GAChC,CACH,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {AvatarSize} from \"../../beans\";\n\n@Component({\n tag: \"z-avatar\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZAvatar {\n /** [optional] Avatar size /\n @Prop()\n size?: AvatarSize = AvatarSize.MEDIUM;\n\n /* [optional] Avatar text /\n @Prop()\n text?: string;\n\n /* [optional] Avatar text color /\n @Prop()\n textColor?: string = \"color-white\";\n\n /* [optional] Avatar background color /\n @Prop()\n backgroundColor?: string = \"gray700\";\n\n /* [optional] Avatar image */\n @Prop({mutable: true})\n image?: string;\n\n constructor() {\n if (this.text?.length === 0 && this.image?.length === 0) {\n console.warn(\"z-avatar must contain at least one prop between text and image\");\n }\n }\n\n private getTextSize(): string {\n if (this.size === AvatarSize.SMALL) {\n return \"5\";\n } else if (this.size === AvatarSize.MEDIUM) {\n return \"4\";\n } else if (this.size === AvatarSize.LARGE) {\n return \"2\";\n }\n }\n\n render(): HTMLZAvatarElement {\n return (\n <Host\n class={{[this.size]: true, [`body-${this.getTextSize()}-sb`]: true}}\n style={{\n color: `var(--${this.textColor})`,\n backgroundColor: `var(--${this.backgroundColor})`,\n }}\n >\n {this.text && !this.image && <span>{this.text.substring(0, 2)}</span>}\n {this.image && (\n <img\n src={this.image}\n onError={() => (this.image = \"\")}\n />\n )}\n </Host>\n );\n }\n}\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["~~../../../~~src/components/z-avatar/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,OAAO,EAAC,MAAM,SAAS,CAAC;AAEhC,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;IAClC,EAAE,CAAC,6BAA6B,EAAE,KAAK,IAAI,EAAE;QAC3C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,uBAAuB;SAC9B,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;KAQ7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,sEAAsE;SAC7E,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;KAa7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QACzD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,4EAA4E;SACnF,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;KAa7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,iFAAiF;SACxF,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;KAS7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZAvatar} from \"./index\";\n\ndescribe(\"Suite test ZAvatar\", () => {\n it(\"Test render ZAvatar default\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-4-sb medium\" style=\"color: var(--color-white); background-color: var(--gray700)\">\n <mock:shadow-root></mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar size prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar size=\"small\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-5-sb small\" style=\"color: var(--color-white); background-color: var(--gray700)\" size=\"small\">\n <mock:shadow-root></mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar text prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-4-sb medium\" style=\"color: var(--color-white); background-color: var(--gray700)\" text=\"ABCDE\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar text-color prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\" text-color=\"blue500\" size=\"small\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-5-sb small\"\n style=\"color: var(--blue500); background-color: var(--gray700)\"\n text-color=\"blue500\"\n text=\"ABCDE\"\n size=\"small\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar background-color prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\" background-color=\"blue500\" size=\"large\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-2-sb large\"\n style=\"color: var(--color-white); background-color: var(--blue500)\"\n background-color=\"blue500\"\n text=\"ABCDE\"\n size=\"large\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar image prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar image=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-4-sb medium\"\n style=\"color: var(--color-white); background-color: var(--gray700)\"\n image=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\">\n <mock:shadow-root>\n <img src=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\">\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n});\n"]}
1	+ {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/z-avatar/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,OAAO,EAAC,MAAM,SAAS,CAAC;AAEhC,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;IAClC,EAAE,CAAC,6BAA6B,EAAE,KAAK,IAAI,EAAE;QAC3C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,uBAAuB;SAC9B,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;KAQ7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,sEAAsE;SAC7E,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;KAa7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QACzD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,4EAA4E;SACnF,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;KAa7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,iFAAiF;SACxF,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;KAS7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZAvatar} from \"./index\";\n\ndescribe(\"Suite test ZAvatar\", () => {\n it(\"Test render ZAvatar default\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-4-sb medium\" style=\"color: var(--color-white); background-color: var(--gray700)\">\n <mock:shadow-root></mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar size prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar size=\"small\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-5-sb small\" style=\"color: var(--color-white); background-color: var(--gray700)\" size=\"small\">\n <mock:shadow-root></mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar text prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar class=\"body-4-sb medium\" style=\"color: var(--color-white); background-color: var(--gray700)\" text=\"ABCDE\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar text-color prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\" text-color=\"blue500\" size=\"small\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-5-sb small\"\n style=\"color: var(--blue500); background-color: var(--gray700)\"\n text-color=\"blue500\"\n text=\"ABCDE\"\n size=\"small\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar background-color prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar text=\"ABCDE\" background-color=\"blue500\" size=\"large\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-2-sb large\"\n style=\"color: var(--color-white); background-color: var(--blue500)\"\n background-color=\"blue500\"\n text=\"ABCDE\"\n size=\"large\">\n <mock:shadow-root>\n <span>\n AB\n </span>\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n\n it(\"Test render ZAvatar image prop\", async () => {\n const page = await newSpecPage({\n components: [ZAvatar],\n html: `<z-avatar image=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\"></z-avatar>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-avatar\n class=\"body-4-sb medium\"\n style=\"color: var(--color-white); background-color: var(--gray700)\"\n image=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\">\n <mock:shadow-root>\n <img src=\"https://cdn.eso.org/images/thumb700x/eso1907a.jpg\">\n </mock:shadow-root>\n </z-avatar>\n `);\n });\n});\n"]}

package/dist/collection/components/z-avatar/index.stories.js ADDED Viewed

@@ -0,0 +1,51 @@
+import { html } from "lit";
+import { AvatarSize } from "../../beans";
+import { getColorTokens } from "../../utils/storybook-utils";
+import "./index";
+const colorTokens = getColorTokens().map((token) => token.replace("--", ""));
+/**
+ * Pass at least one prop between `text` and `image`.
+ * If prop `image` contains a broken URL, the component will show `text` prop, if given.
+ */
+const StoryMeta = {
+    title: "ZAvatar",
+    component: "z-avatar",
+    argTypes: {
+        size: {
+            options: Object.values(AvatarSize),
+            control: {
+                type: "inline-radio",
+            },
+        },
+        textColor: {
+            options: colorTokens,
+            control: {
+                type: "select",
+            },
+        },
+        backgroundColor: {
+            options: colorTokens,
+            control: {
+                type: "select",
+            },
+        },
+    },
+    args: {
+        size: AvatarSize.MEDIUM,
+        text: "Avatar",
+        textColor: "color-white",
+        backgroundColor: "gray700",
+        image: "https://www.cinematographe.it/wp-content/uploads/2019/04/Avatar.jpg",
+    },
+};
+export default StoryMeta;
+export const Default = {
+    render: (args) => html `<z-avatar
+      size="${args.size}"
+      text="${args.text}"
+      text-color="${args.textColor}"
+      background-color="${args.backgroundColor}"
+      image="${args.image}"
+    ></z-avatar>`,
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-avatar/index.stories.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-avatar/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,UAAU,EAAC,MAAM,aAAa,CAAC;AACvC,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;AAE7E;;;GAGG;AACH,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC;YAClC,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE,WAAW;YACpB,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE,WAAW;YACpB,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU,CAAC,MAAM;QACvB,IAAI,EAAE,QAAQ;QACd,SAAS,EAAE,aAAa;QACxB,eAAe,EAAE,SAAS;QAC1B,KAAK,EAAE,qEAAqE;KAC7E;CACsB,CAAC;AAE1B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;cACT,IAAI,CAAC,IAAI;oBACH,IAAI,CAAC,SAAS;0BACR,IAAI,CAAC,eAAe;eAC/B,IAAI,CAAC,KAAK;iBACR;CACY,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZAvatar} from \".\";\nimport {AvatarSize} from \"../../beans\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nconst colorTokens = getColorTokens().map((token) => token.replace(\"--\", \"\"));\n\n/**\n * Pass at least one prop between `text` and `image`.\n * If prop `image` contains a broken URL, the component will show `text` prop, if given.\n */\nconst StoryMeta = {\n title: \"ZAvatar\",\n component: \"z-avatar\",\n argTypes: {\n size: {\n options: Object.values(AvatarSize),\n control: {\n type: \"inline-radio\",\n },\n },\n textColor: {\n options: colorTokens,\n control: {\n type: \"select\",\n },\n },\n backgroundColor: {\n options: colorTokens,\n control: {\n type: \"select\",\n },\n },\n },\n args: {\n size: AvatarSize.MEDIUM,\n text: \"Avatar\",\n textColor: \"color-white\",\n backgroundColor: \"gray700\",\n image: \"https://www.cinematographe.it/wp-content/uploads/2019/04/Avatar.jpg\",\n },\n} satisfies Meta<ZAvatar>;\n\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<z-avatar\n size=\"${args.size}\"\n text=\"${args.text}\"\n text-color=\"${args.textColor}\"\n background-color=\"${args.backgroundColor}\"\n image=\"${args.image}\"\n ></z-avatar>`,\n} satisfies StoryObj<ZAvatar>;\n"]}

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

@@ -124,7 +124,7 @@ export class ZBookCard {
         return (h("div", { class: "action-container" }, h("slot", { name: "footer-cta" })));
     }
     render() {
-        return (h("article", { key: '5bdf53790a65a448b54994ac6d88bb333f23db33', class: {
+        return (h("article", { key: '93b847b7f5067c69880ea8ba283a207c8b691a2a', class: {
                 [this.variant]: true,
                 borderless: !!this.borderless,
             } }, this.renderCard()));

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/z-book-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Prop, State, h, Event, EventEmitter} from \"@stencil/core\";\nimport {BookCardVariant} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\nimport {randomId} from \"../../utils/utils\";\n\n/*\n @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n /\n@Component({\n tag: \"z-book-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /\n Card variant: expanded, compact, search\n /\n @Prop()\n variant: BookCardVariant;\n\n /\n Cover URL\n /\n @Prop()\n cover: string;\n\n /\n Card main title\n /\n @Prop()\n operaTitle: string;\n\n /\n [optional] Card subtitle\n /\n @Prop()\n volumeTitle?: string;\n\n /\n [optional] Authors\n /\n @Prop()\n authors?: string;\n\n /\n [optional] Main ISBN\n /\n @Prop()\n isbn?: string;\n\n /\n [optional] ISBN label\n /\n @Prop()\n isbnLabel = \"\";\n\n /\n [optional] Ribbon label - expanded and search variant only\n /\n @Prop()\n ribbon?: string;\n\n /\n [optional] Ribbon icon - expanded and search variant only\n /\n @Prop()\n ribbonIcon?: string;\n\n /\n [optional] Ribbon interactive - expanded and search variant only\n /\n @Prop()\n ribbonInteractive?: boolean;\n\n /\n [optional] Borderless card - compact variant only\n /\n @Prop()\n borderless?: boolean;\n\n /\n [optional] Fallback cover URL\n /\n @Prop()\n fallbackCover?: string;\n\n /\n [optional] [accessibility] Card title HTML tag\n /\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /* click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardVariant.EXPANDED \|\| !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\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 </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-book-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {BookCardVariant} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\nimport {randomId} from \"../../utils/utils\";\n\n/*\n @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n /\n@Component({\n tag: \"z-book-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /\n Card variant: expanded, compact, search\n /\n @Prop()\n variant: BookCardVariant;\n\n /\n Cover URL\n /\n @Prop()\n cover: string;\n\n /\n Card main title\n /\n @Prop()\n operaTitle: string;\n\n /\n [optional] Card subtitle\n /\n @Prop()\n volumeTitle?: string;\n\n /\n [optional] Authors\n /\n @Prop()\n authors?: string;\n\n /\n [optional] Main ISBN\n /\n @Prop()\n isbn?: string;\n\n /\n [optional] ISBN label\n /\n @Prop()\n isbnLabel = \"\";\n\n /\n [optional] Ribbon label - expanded and search variant only\n /\n @Prop()\n ribbon?: string;\n\n /\n [optional] Ribbon icon - expanded and search variant only\n /\n @Prop()\n ribbonIcon?: string;\n\n /\n [optional] Ribbon interactive - expanded and search variant only\n /\n @Prop()\n ribbonInteractive?: boolean;\n\n /\n [optional] Borderless card - compact variant only\n /\n @Prop()\n borderless?: boolean;\n\n /\n [optional] Fallback cover URL\n /\n @Prop()\n fallbackCover?: string;\n\n /\n [optional] [accessibility] Card title HTML tag\n /\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /* click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardVariant.EXPANDED \|\| !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\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 </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../src/components/z-book-card/index.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZBookCard} from \"./index\";\n\ndescribe(\"Suite test ZBookCard\", () => {\n it(\"Test render ZBookCard - EXPANDED - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"title\"></div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <button class=\"ribbon interactive\"><z-icon fill=\"color-inverse-icon\" height=\"16\" name=\"info\" width=\"16\"></z-icon><span>ADOTTATO</span></button>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\">\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"title\"></div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with props\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"ribbon\"><span>ADOTTATO</span></div>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with resources - close\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">Matematica.azzurro</div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"footer close\">\n <button\n class=\"show-resources\"\n aria-label=\"Risorse del libro Matematica.azzurro\"\n aria-expanded=\"false\"\n aria-controls=\"resources-${page.rootInstance.id}\"\n >\n Vedi tutto\n <z-icon name=\"chevron-down\"></z-icon>\n </button>\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <a class=\"z-link\"slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with resources - open\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n page.rootInstance.showResources = true;\n await page.waitForChanges();\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">Matematica.azzurro</div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"footer open\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n <button\n class=\"show-resources\"\n aria-label=\"Risorse del libro Matematica.azzurro\"\n aria-expanded=\"true\"\n aria-controls=\"resources-${page.rootInstance.id}\"\n >\n Chiudi\n <z-icon name=\"chevron-up\"></z-icon>\n </button>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"search\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"search\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"search\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\" cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" isbn=\"9788808930552\" isbn-label=\"(ed. cartacea)\" opera-title=\"Matematica.azzurro\" opera-title-tag=\"h1\" ribbon=\"ADOTTATO\" variant=\"search\" volume-title=\"Volume 3 con Tutor\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">\n <h1>Matematica.azzurro</h1>\n </div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"ribbon\">\n <span>ADOTTATO</span>\n </div>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"/>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n <div aria-description=\"Autori\" class=\"authors\">\n Massimo Bergamini, Anna Trifone, Graziella Barozzi\n </div>\n <div class=\"subtitle\">\n Volume 3 con Tutor\n </div>\n <div class=\"isbn\">\n <span aria-description=\"ISBN (ed. cartacea)\" class=\"code\">\n 9788808930552\n </span>\n <span class=\"label\">\n (ed. cartacea)\n </span>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"search\">\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <div slot=\"footer-cta\">\n <z-button href=\"http://dizionari.zanichelli.it\" target=\"_blank\" variant=\"secondary\" size=\"small\">\n Leggi il libro online\n </z-button>\n </div>\n </z-book-card>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"search\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-icon name=\"star-empty\" slot=\"header-cta\"></z-icon>\n <z-tag slot=\"tags\">\n EDI\n </z-tag>\n <div slot=\"footer-cta\">\n <z-button href=\"http://dizionari.zanichelli.it\" size=\"small\" target=\"_blank\" variant=\"secondary\">\n Leggi il libro online\n </z-button>\n </div>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"compact\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"compact\">\n <mock:shadow-root>\n <article class=\"compact\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"title\"></div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"compact\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n opera-title-tag=\"h1\"\n borderless=\"true\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"compact\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n opera-title-tag=\"h1\"\n borderless=\"true\"\n >\n <mock:shadow-root>\n <article class=\"compact borderless\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"compact\">\n <z-button slot=\"footer-cta\">cta 1</z-button>\n <z-button slot=\"footer-cta\">cta 2</z-button>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"compact\">\n <mock:shadow-root>\n <article class=\"compact\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"title\"></div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-button slot=\"footer-cta\">cta 1</z-button>\n <z-button slot=\"footer-cta\">cta 2</z-button>\n </z-book-card>\n `);\n });\n});\n\nconst mockMatchMedia = (matches: boolean = false) => {\n Object.defineProperty(window, \"matchMedia\", {\n writable: true,\n value: jest.fn().mockImplementation((query) => ({\n matches: matches,\n media: query,\n onchange: null,\n addListener: jest.fn(), // deprecated\n removeListener: jest.fn(), // deprecated\n addEventListener: jest.fn(),\n removeEventListener: jest.fn(),\n dispatchEvent: jest.fn(),\n })),\n });\n};\n"]}
1	+ {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/z-book-card/index.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZBookCard} from \"./index\";\n\ndescribe(\"Suite test ZBookCard\", () => {\n it(\"Test render ZBookCard - EXPANDED - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"title\"></div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <button class=\"ribbon interactive\"><z-icon fill=\"color-inverse-icon\" height=\"16\" name=\"info\" width=\"16\"></z-icon><span>ADOTTATO</span></button>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon-icon=\"info\"\n ribbon-interactive=\"true\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\">\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n <div class=\"title\"></div>\n </div>\n <div class=\"right\">\n <slot name=\"header-cta\"></slot>\n </div>\n </div>\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"bottom\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with props\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"expanded\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n >\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"ribbon\"><span>ADOTTATO</span></div>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with resources - close\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">Matematica.azzurro</div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"footer close\">\n <button\n class=\"show-resources\"\n aria-label=\"Risorse del libro Matematica.azzurro\"\n aria-expanded=\"false\"\n aria-controls=\"resources-${page.rootInstance.id}\"\n >\n Vedi tutto\n <z-icon name=\"chevron-down\"></z-icon>\n </button>\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <a class=\"z-link\"slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - EXPANDED - MOBILE - with resources - open\", async () => {\n mockMatchMedia(true);\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>`,\n });\n page.rootInstance.showResources = true;\n await page.waitForChanges();\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"expanded\" opera-title=\"Matematica.azzurro\">\n <mock:shadow-root>\n <article class=\"expanded\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">Matematica.azzurro</div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n <div class=\"footer open\">\n <div class=\"resources\" id=\"resources-${page.rootInstance.id}\">\n <slot name=\"resources\"></slot>\n </div>\n <button\n class=\"show-resources\"\n aria-label=\"Risorse del libro Matematica.azzurro\"\n aria-expanded=\"true\"\n aria-controls=\"resources-${page.rootInstance.id}\"\n >\n Chiudi\n <z-icon name=\"chevron-up\"></z-icon>\n </button>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <a class=\"z-link\" slot=\"resources\">Resource link</a>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"search\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"search\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"search\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n ribbon=\"ADOTTATO\"\n opera-title-tag=\"h1\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\" cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" isbn=\"9788808930552\" isbn-label=\"(ed. cartacea)\" opera-title=\"Matematica.azzurro\" opera-title-tag=\"h1\" ribbon=\"ADOTTATO\" variant=\"search\" volume-title=\"Volume 3 con Tutor\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\">\n <h1>Matematica.azzurro</h1>\n </div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"ribbon\">\n <span>ADOTTATO</span>\n </div>\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"/>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n <div aria-description=\"Autori\" class=\"authors\">\n Massimo Bergamini, Anna Trifone, Graziella Barozzi\n </div>\n <div class=\"subtitle\">\n Volume 3 con Tutor\n </div>\n <div class=\"isbn\">\n <span aria-description=\"ISBN (ed. cartacea)\" class=\"code\">\n 9788808930552\n </span>\n <span class=\"label\">\n (ed. cartacea)\n </span>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - SEARCH - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"search\">\n <z-icon slot=\"header-cta\" name=\"star-empty\"></z-icon>\n <z-tag slot=\"tags\">EDI</z-tag>\n <div slot=\"footer-cta\">\n <z-button href=\"http://dizionari.zanichelli.it\" target=\"_blank\" variant=\"secondary\" size=\"small\">\n Leggi il libro online\n </z-button>\n </div>\n </z-book-card>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"search\">\n <mock:shadow-root>\n <article class=\"search\">\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n <div class=\"title\"></div>\n <slot name=\"header-cta\"></slot>\n </div>\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"tags\">\n <slot name=\"tags\"></slot>\n </div>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-icon name=\"star-empty\" slot=\"header-cta\"></z-icon>\n <z-tag slot=\"tags\">\n EDI\n </z-tag>\n <div slot=\"footer-cta\">\n <z-button href=\"http://dizionari.zanichelli.it\" size=\"small\" target=\"_blank\" variant=\"secondary\">\n Leggi il libro online\n </z-button>\n </div>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - empty\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"compact\"></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"compact\">\n <mock:shadow-root>\n <article class=\"compact\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"title\"></div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - with props\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card\n variant=\"compact\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n opera-title-tag=\"h1\"\n borderless=\"true\"\n ></z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card\n variant=\"compact\"\n cover=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\"\n opera-title=\"Matematica.azzurro\"\n volume-title=\"Volume 3 con Tutor\"\n authors=\"Massimo Bergamini, Anna Trifone, Graziella Barozzi\"\n isbn=\"9788808930552\"\n isbn-label=\"(ed. cartacea)\"\n opera-title-tag=\"h1\"\n borderless=\"true\"\n >\n <mock:shadow-root>\n <article class=\"compact borderless\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" src=\"https://s3-eu-west-1.amazonaws.com/staticmy.zanichelli.it/copertine/dashboard/m40066.9788808930552.jpg\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"authors\" aria-description=\"Autori\">Massimo Bergamini, Anna Trifone, Graziella Barozzi</div>\n <div class=\"title\"><h1>Matematica.azzurro</h1></div>\n <div class=\"subtitle\">Volume 3 con Tutor</div>\n <div class=\"isbn\">\n <span class=\"code\" aria-description=\"ISBN (ed. cartacea)\">9788808930552</span>\n <span class=\"label\"> (ed. cartacea)</span>\n </div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n </z-book-card>\n `);\n });\n\n it(\"Test render ZBookCard - COMPACT - with slots\", async () => {\n mockMatchMedia();\n const page = await newSpecPage({\n components: [ZBookCard],\n html: `<z-book-card variant=\"compact\">\n <z-button slot=\"footer-cta\">cta 1</z-button>\n <z-button slot=\"footer-cta\">cta 2</z-button>\n </z-book-card>`,\n });\n expect(page.root).toEqualHtml(`\n <z-book-card variant=\"compact\">\n <mock:shadow-root>\n <article class=\"compact\">\n <div class=\"wrapper\">\n <div class=\"cover\">\n <div class=\"img-wrapper\">\n <img aria-hidden=\"true\" />\n </div>\n </div>\n <div class=\"content\">\n <div class=\"title\"></div>\n </div>\n <div class=\"action-container\">\n <slot name=\"footer-cta\"></slot>\n </div>\n </div>\n </article>\n </mock:shadow-root>\n <z-button slot=\"footer-cta\">cta 1</z-button>\n <z-button slot=\"footer-cta\">cta 2</z-button>\n </z-book-card>\n `);\n });\n});\n\nconst mockMatchMedia = (matches: boolean = false) => {\n Object.defineProperty(window, \"matchMedia\", {\n writable: true,\n value: jest.fn().mockImplementation((query) => ({\n matches: matches,\n media: query,\n onchange: null,\n addListener: jest.fn(), // deprecated\n removeListener: jest.fn(), // deprecated\n addEventListener: jest.fn(),\n removeEventListener: jest.fn(),\n dispatchEvent: jest.fn(),\n })),\n });\n};\n"]}