@zanichelli/albe-web-components 17.3.0-RC1 → 18.0.1

package/dist/esm/z-toggle-button.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-c8ceadeb.js';
 
-const stylesCss = "button{display:flex;height:36px;align-items:center;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--color-surface01);border-radius:var(--border-radius);box-shadow:0 0 4px 0 rgb(0 0 0 / 20%);color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase}button::-moz-focus-inner{border:0}button:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary)}button:focus{box-shadow:var(--shadow-focus-primary)}button:active{border-color:var(--color-pressed-primary);box-shadow:var(--shadow-2);color:var(--color-pressed-primary);fill:var(--color-pressed-primary)}button:disabled{color:var(--color-disabled03);fill:var(--color-disabled03)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";
+const stylesCss = "button{display:flex;height:36px;align-items:center;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--color-surface01);border-radius:var(--border-radius);box-shadow:var(--shadow-2);color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase}button::-moz-focus-inner{border:0}button:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary)}button:focus{box-shadow:var(--shadow-focus-primary)}button:active{border-color:var(--color-pressed-primary);box-shadow:var(--shadow-2);color:var(--color-pressed-primary);fill:var(--color-pressed-primary)}button:disabled{color:var(--color-disabled03);fill:var(--color-disabled03)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";
 const ZToggleButtonStyle0 = stylesCss;
 
 const ZToggleButton = class {
@@ -21,10 +21,10 @@ const ZToggleButton = class {
         this.toggleClick.emit(this.opened);
     }
     render() {
-        return (h("button", { key: '6df0aee8dfd4785cd9787b2940c12cc3d680ef0c', tabindex: this.avoidclick ? "-1" : "0", class: {
+        return (h("button", { key: '40e03296813c2e590c4dac11949d96f1dbb124eb', tabindex: this.avoidclick ? "-1" : "0", class: {
                 "isopen": this.opened,
                 "avoid-clicks": this.avoidclick,
-            }, disabled: this.isdisabled, "aria-expanded": this.opened ? "true" : "false", "aria-label": this.ariaLabel, onClick: () => this.emitToggleClick() }, h("z-icon", { key: 'ab52cd6023b492b5bba8086fd189112e5329c3ad', name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
+            }, disabled: this.isdisabled, "aria-expanded": this.opened ? "true" : "false", "aria-label": this.ariaLabel, onClick: () => this.emitToggleClick() }, h("z-icon", { key: 'fca73c6711943889a68d97d4fb8904907565968f', name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
     }
 };
 ZToggleButton.style = ZToggleButtonStyle0;

package/dist/esm/z-toggle-button.entry.js.map

@@ -1 +1 @@
-{"file":"z-toggle-button.entry.js","mappings":";;AAAA,MAAM,SAAS,GAAG,4iCAA4iC,CAAC;AAC/jC,4BAAe,SAAS;;MCMX,aAAa;;;;;0BAOD,KAAK;;sBAQT,KAAK;yBAIZ,EAAE;;IAMN,eAAe;QACrB,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,OAAO;SACR;QAED,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACpC;IAED,MAAM;QACJ,QACE,+DACE,QAAQ,EAAE,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,GAAG,EACtC,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,MAAM;gBACrB,cAAc,EAAE,IAAI,CAAC,UAAU;aAChC,EACD,QAAQ,EAAE,IAAI,CAAC,UAAU,mBACV,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,gBACjC,IAAI,CAAC,SAAS,EAC1B,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,IAErC,+DACE,IAAI,EAAE,IAAI,CAAC,MAAM,GAAG,cAAc,GAAG,YAAY,EACjD,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,EACD,IAAI,CAAC,KAAK,CACJ,EACT;KACH;;;;;;","names":[],"sources":["src/components/z-toggle-button/styles.css?tag=z-toggle-button&encapsulation=shadow","src/components/z-toggle-button/index.tsx"],"sourcesContent":["button {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  padding-right: calc(var(--space-unit) * 2);\n  padding-left: 0;\n  border: var(--border-size-medium) solid;\n  border-color: transparent;\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n  box-shadow: 0 0 4px 0 rgb(0 0 0 / 20%);\n  color: var(--color-primary01);\n  cursor: pointer;\n  fill: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  outline: none;\n  text-transform: uppercase;\n}\n\nbutton::-moz-focus-inner {\n  border: 0;\n}\n\nbutton:hover {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary);\n}\n\nbutton:focus {\n  box-shadow: var(--shadow-focus-primary);\n}\n\nbutton:active {\n  border-color: var(--color-pressed-primary);\n  box-shadow: var(--shadow-2);\n  color: var(--color-pressed-primary);\n  fill: var(--color-pressed-primary);\n}\n\nbutton:disabled {\n  color: var(--color-disabled03);\n  fill: var(--color-disabled03);\n}\n\nz-icon {\n  display: inline-block;\n  margin: 0 var(--space-unit) 0 calc(var(--space-unit) * 2);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\nbutton.isopen {\n  top: -20px;\n}\n\nbutton.avoid-clicks {\n  pointer-events: none;\n}\n","import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-toggle-button\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZToggleButton {\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** disabled status flag (optional) */\n  @Prop()\n  isdisabled?: boolean = false;\n\n  /** avoidclick status flag */\n  @Prop()\n  avoidclick: boolean;\n\n  /** open by default (optional) */\n  @Prop({mutable: true})\n  opened?: boolean = false;\n\n  /**  aria-label for the button */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** emitted on toggle button click, returns isOpen */\n  @Event()\n  toggleClick: EventEmitter;\n\n  private emitToggleClick(): void {\n    if (this.isdisabled) {\n      return;\n    }\n\n    this.opened = !this.opened;\n    this.toggleClick.emit(this.opened);\n  }\n\n  render(): HTMLButtonElement {\n    return (\n      <button\n        tabindex={this.avoidclick ? \"-1\" : \"0\"}\n        class={{\n          \"isopen\": this.opened,\n          \"avoid-clicks\": this.avoidclick,\n        }}\n        disabled={this.isdisabled}\n        aria-expanded={this.opened ? \"true\" : \"false\"}\n        aria-label={this.ariaLabel}\n        onClick={() => this.emitToggleClick()}\n      >\n        <z-icon\n          name={this.opened ? \"chevron-down\" : \"chevron-up\"}\n          width={16}\n          height={16}\n        />\n        {this.label}\n      </button>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-toggle-button.entry.js","mappings":";;AAAA,MAAM,SAAS,GAAG,iiCAAiiC,CAAC;AACpjC,4BAAe,SAAS;;MCMX,aAAa;;;;;0BAOD,KAAK;;sBAQT,KAAK;yBAIZ,EAAE;;IAMN,eAAe;QACrB,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,OAAO;SACR;QAED,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACpC;IAED,MAAM;QACJ,QACE,+DACE,QAAQ,EAAE,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,GAAG,EACtC,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,MAAM;gBACrB,cAAc,EAAE,IAAI,CAAC,UAAU;aAChC,EACD,QAAQ,EAAE,IAAI,CAAC,UAAU,mBACV,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,gBACjC,IAAI,CAAC,SAAS,EAC1B,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,IAErC,+DACE,IAAI,EAAE,IAAI,CAAC,MAAM,GAAG,cAAc,GAAG,YAAY,EACjD,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,EACD,IAAI,CAAC,KAAK,CACJ,EACT;KACH;;;;;;","names":[],"sources":["src/components/z-toggle-button/styles.css?tag=z-toggle-button&encapsulation=shadow","src/components/z-toggle-button/index.tsx"],"sourcesContent":["button {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  padding-right: calc(var(--space-unit) * 2);\n  padding-left: 0;\n  border: var(--border-size-medium) solid;\n  border-color: transparent;\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n  box-shadow: var(--shadow-2);\n  color: var(--color-primary01);\n  cursor: pointer;\n  fill: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  outline: none;\n  text-transform: uppercase;\n}\n\nbutton::-moz-focus-inner {\n  border: 0;\n}\n\nbutton:hover {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary);\n}\n\nbutton:focus {\n  box-shadow: var(--shadow-focus-primary);\n}\n\nbutton:active {\n  border-color: var(--color-pressed-primary);\n  box-shadow: var(--shadow-2);\n  color: var(--color-pressed-primary);\n  fill: var(--color-pressed-primary);\n}\n\nbutton:disabled {\n  color: var(--color-disabled03);\n  fill: var(--color-disabled03);\n}\n\nz-icon {\n  display: inline-block;\n  margin: 0 var(--space-unit) 0 calc(var(--space-unit) * 2);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\nbutton.isopen {\n  top: -20px;\n}\n\nbutton.avoid-clicks {\n  pointer-events: none;\n}\n","import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-toggle-button\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZToggleButton {\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** disabled status flag (optional) */\n  @Prop()\n  isdisabled?: boolean = false;\n\n  /** avoidclick status flag */\n  @Prop()\n  avoidclick: boolean;\n\n  /** open by default (optional) */\n  @Prop({mutable: true})\n  opened?: boolean = false;\n\n  /**  aria-label for the button */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** emitted on toggle button click, returns isOpen */\n  @Event()\n  toggleClick: EventEmitter;\n\n  private emitToggleClick(): void {\n    if (this.isdisabled) {\n      return;\n    }\n\n    this.opened = !this.opened;\n    this.toggleClick.emit(this.opened);\n  }\n\n  render(): HTMLButtonElement {\n    return (\n      <button\n        tabindex={this.avoidclick ? \"-1\" : \"0\"}\n        class={{\n          \"isopen\": this.opened,\n          \"avoid-clicks\": this.avoidclick,\n        }}\n        disabled={this.isdisabled}\n        aria-expanded={this.opened ? \"true\" : \"false\"}\n        aria-label={this.ariaLabel}\n        onClick={() => this.emitToggleClick()}\n      >\n        <z-icon\n          name={this.opened ? \"chevron-down\" : \"chevron-up\"}\n          width={16}\n          height={16}\n        />\n        {this.label}\n      </button>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/z-toggle-switch.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, a as Host } from './index-c8ceadeb.js';
-import { k as LabelPosition } from './index-c9fd4a10.js';
-import { r as randomId } from './utils-cd97a95b.js';
+import { k as LabelPosition } from './index-fe87283d.js';
+import { r as randomId } from './utils-c7062cf7.js';
 import './breakpoints-d148bfde.js';
 
 const stylesCss = ".sc-z-toggle-switch-h{position:relative;display:inline-flex;font-family:var(--font-family-sans);font-weight:var(--font-rg)}label.sc-z-toggle-switch{display:flex;flex-direction:row;align-items:center;cursor:pointer}label.disabled.sc-z-toggle-switch{cursor:default}label.right.sc-z-toggle-switch{flex-direction:row-reverse}label.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{color:var(--color-default-text);letter-spacing:0}label.left.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-right:var(--space-unit)}label.right.sc-z-toggle-switch>span.sc-z-toggle-switch:first-child{margin-left:var(--space-unit)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch{position:relative;top:1px;left:1px;display:flex;width:calc(var(--space-unit) * 4);height:18px;align-items:center;background-color:var(--gray500);border-radius:var(--space-unit);color:var(--gray500);cursor:pointer}label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch,label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch{background-color:var(--color-disabled01);cursor:default}label.sc-z-toggle-switch>span.container.checked.disabled.sc-z-toggle-switch>span.circle.sc-z-toggle-switch>z-icon.sc-z-toggle-switch{fill:var(--color-disabled01)}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch{background-color:var(--color-primary01);fill:var(--color-primary01)}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled){box-shadow:var(--shadow-focus-primary);outline:none}input.sc-z-toggle-switch:focus:focus-visible+label.sc-z-toggle-switch>span.container.disabled.sc-z-toggle-switch{outline:none}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch:not(.disabled):hover{background-color:var(--color-hover-primary);fill:var(--color-hover-primary)}label.sc-z-toggle-switch>span.container.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{position:absolute;top:1px;left:1px;display:flex;width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);align-items:center;justify-content:center;margin:0;background-color:var(--color-white);border-radius:7px;box-shadow:var(--shadow-1);transition:transform 0.3s ease}label.sc-z-toggle-switch>span.container.checked.sc-z-toggle-switch>span.circle.sc-z-toggle-switch{transform:translateX(calc(100% - 2px))}input[type=\"checkbox\"].sc-z-toggle-switch{position:absolute;z-index:-1;opacity:0;pointer-events:none}";
@@ -29,14 +29,14 @@ const ZToggleSwitch = class {
         this.emitToggleClick();
     }
     render() {
-        return (h(Host, { key: 'b572a91e4ed2f91cbe0b7a393371425a5b9b896a' }, h("input", { key: 'acff3447044eba6dd7622feb954a03d5503111f1', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), h("label", { key: '58b70932d34e39bb1c078947eea614d6384b9660', htmlFor: this.htmlid, class: {
+        return (h(Host, { key: '38db5de3b72a6f9758e659de273cd442e3682489' }, h("input", { key: '0cb35639d2d30db6b9c29e8f96a9bd067a1d3d75', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), h("label", { key: 'c92a2feeca5da867b316c5f5c27704f6ac3bfdac', htmlFor: this.htmlid, class: {
                 [this.labelPosition]: true,
                 disabled: this.disabled,
-            } }, h("span", { key: '824e029aeb434813b35f72891d991f19a90daded' }, h("slot", { key: '37e8bad4378c65f4a3411fee47a960b9220af5d3' })), h("span", { key: '55eaf2b824ce8e91b77b5f8f2677724b2834fad6', class: {
+            } }, h("span", { key: 'baddbf963a2ba64b1768b93e2791a01d3bbacc47' }, h("slot", { key: '7cac9769b322655101a15e746921e103a4569a07' })), h("span", { key: 'e1747bdce3b7ad3ad0b354f9d864e7fcace42d26', class: {
                 container: true,
                 disabled: this.disabled,
                 checked: this.checked,
-            } }, h("span", { key: '41b7660f89b5ba9829782d3e6b041323357fdefa', class: "circle" }, this.checked && (h("z-icon", { key: 'ae68c35e2765c6eece7dcee8f7ad570a6fc0aa34', width: 12, height: 12, name: "checkmark" })))))));
+            } }, h("span", { key: '47814a2f975086f4044f6f50d1f7402aece53c15', class: "circle" }, this.checked && (h("z-icon", { key: '56ca84b760f4cc1abbb2a5e8a4eb44a07a5d0f91', width: 12, height: 12, name: "checkmark" })))))));
     }
 };
 ZToggleSwitch.style = ZToggleSwitchStyle0;

package/dist/esm/z-tooltip.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h } from './index-c8ceadeb.js';
-import { P as PopoverPosition } from './index-c9fd4a10.js';
+import { P as PopoverPosition } from './index-fe87283d.js';
 
 const stylesCss = ":host{--z-tooltip-theme--surface:var(--color-surface01);--z-tooltip-theme--text:var(--color-default-text);--z-tooltip-shadow-filter:drop-shadow(0 1px 2px var(--shadow-color-base))}:host([dark]) z-popover{--z-popover-theme--surface:var(--color-surface05);--z-popover-theme--text:var(--color-text-inverse)}z-popover{--z-popover-padding:var(--space-unit);--z-popover-theme--surface:var(--z-tooltip-theme--surface);--z-popover-theme--text:var(--z-tooltip-theme--text);--z-popover-shadow-filter:var(--z-tooltip-shadow-filter)}";
 const ZTooltipStyle0 = stylesCss;
@@ -17,7 +17,7 @@ const ZTooltip = class {
         this.open = this.popoverEl.open;
     }
     render() {
-        return (h("z-popover", { key: 'fdca98f95640bac81d7cf60e1fc0f8c4536f7021', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true }, h("slot", { key: 'd2143919460695e98cf114c4cb07ae75108c9f1d' })));
+        return (h("z-popover", { key: 'd7f54583b5632dc53433087925034a82c80cefa5', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true }, h("slot", { key: 'e478ae3573617a2f6653b8fc7d71a453f1a498f2' })));
     }
 };
 ZTooltip.style = ZTooltipStyle0;

package/dist/esm/z-tr.entry.js

@@ -1,9 +1,9 @@
-export { Z as z_tr } from './index-678ea09c.js';
+export { Z as z_tr } from './index-7ff7476c.js';
 import './index-c8ceadeb.js';
-import './utils-cd97a95b.js';
-import './index-c9fd4a10.js';
+import './utils-c7062cf7.js';
+import './index-fe87283d.js';
 import './breakpoints-d148bfde.js';
-import './index-5c567adb.js';
-import './index-dac83244.js';
+import './index-f87879d9.js';
+import './index-f75609c5.js';
 
 //# sourceMappingURL=z-tr.entry.js.map

package/dist/esm/z-visually-hidden.entry.js

@@ -8,7 +8,7 @@ const ZVisuallyHidden = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return h("slot", { key: '7c7caddb01b7e2278f956face2065ac1c843ddc5' });
+        return h("slot", { key: '3621cee7a23fe68812b92d58a239dce03caf4724' });
     }
 };
 ZVisuallyHidden.style = ZVisuallyHiddenStyle0;

package/dist/types/beans/index.d.ts

@@ -402,18 +402,6 @@ export declare enum BookCardDeprecatedVariant {
     COMPACT = "compact",
     SEARCH = "search"
 }
-export type BookCardTag = {
-    status: BookCardTagStatus;
-    interactive: boolean;
-};
-export declare enum BookCardTagStatus {
-    ACTIVE = "active",
-    DISABLED = "disabled"
-}
-export type BookCardTagEvent = {
-    tag: string;
-    state: string;
-};
 export declare enum AccordionVariant {
     DEFAULT = "default",
     BACKGROUND = "background"

package/dist/types/components/book-card/z-book-card/index.d.ts

@@ -1,10 +1,19 @@
 import { EventEmitter } from "../../../stencil-public-runtime";
-import { BookCardTag, BookCardVariant } from "../../../beans";
+import { BookCardVariant } from "../../../beans";
 /**
- * @slot cta - to the right of authors and title (e.g. bookmark icon)
- * @slot ebook - main action slot on the card (as default, it shows laZ ebook link)
- * @slot apps - list of card-related apps
- * @slot coverOverlay - to be shown on top of book cover
+ * @slot cta - top right cta (e.g. bookmark icon)
+ * @slot ebook - as default, it shows laZ ebook link
+ * @slot tags - tags section, default empty
+ * @slot data - external link and pill, default empty
+ * @slot apps - list of card-related apps, default empty
+ * @slot coverOverlay - purple layer on top of book cover
+ * @cssprop --z-book-card-portrait-cover-height - set custom cover height for portrait variant - default 378px
+ * @cssprop --z-book-card-title-lines - set title avilable lines - default 2
+ * @cssprop --z-book-card-title-word-break - set title word-break rule - default initial
+ * @cssprop --z-book-card-subtitle-lines - set subtitle available lines - default 1
+ * @cssprop --z-book-card-subtitle-word-break - set subtitle word-break rule - default break-all
+ * @cssprop --z-book-card-authors-lines - set authors available lines - default 1
+ * @cssprop --z-book-card-authors-word-break - set authors word-break rule - default break-all
  */
 export declare class ZBookCard {
     hostElement: HTMLZBookCardElement;
@@ -12,57 +21,34 @@ export declare class ZBookCard {
     variant: BookCardVariant;
     /** Cover URL */
     cover: string;
+    /** Opera title (card title) */
+    operaTitle: string;
+    /** [optional] Volume title (card subvolume) */
+    volumeTitle?: string;
     /** [optional] Authors */
     authors?: string;
-    /** [optional] Opera title */
-    operaTitle?: string;
-    /** [optional] Volume title */
-    volumeTitle?: string;
     /** [optional] Main ISBN */
     isbn?: string;
     /** [optional] ISBN label */
     isbnLabel: string;
-    /** [optional] EDI tag */
-    edi?: BookCardTag | string;
-    /** [optional] Annotated tag */
-    annotated?: BookCardTag | string;
-    /** [optional] Teacher version tag */
-    teacherVersion?: BookCardTag | string;
-    /** [optional] Show reflowable description */
-    reflowable?: boolean;
-    /** [optional] Show adoption badge */
-    adoption?: boolean;
-    /** [optional] Show catalog link to correspondent resource */
-    catalogUrl?: string;
+    /** [optional] year */
+    year?: string;
     /** [optional] Show link to the ebook resource */
     ebookUrl?: string;
     /** [optional] Fallback cover URL */
     fallbackCover?: string;
     /** [optional] Set a specific h level as html tag for opera title */
-    operaTitleHtmlTag?: string;
-    ediTag: any;
-    annotatedTag: any;
-    teacherVersionTag: any;
-    /** click on tag */
-    tagClick: EventEmitter;
-    /** click on catalog link */
-    catalogClick: EventEmitter;
+    titleHtmlTag?: string;
     /** click on ebook link */
     ebookClick: EventEmitter;
-    /** click on immersive reader */
-    immersiveReaderClick: EventEmitter;
-    watchEdi(): void;
-    watchAnnotated(): void;
-    watchTeacherVersion(): void;
-    componentWillLoad(): void;
-    private emitTagClick;
-    private emitCatalogClick;
     private emitEbookClick;
-    private emitImmersiveReaderClick;
-    private renderOperaTitle;
-    private renderIsbnLabel;
-    private renderTag;
-    private renderTags;
     private renderCover;
+    private renderYear;
+    private renderAuthors;
+    private renderOperaTitle;
+    private renderVolumeTitle;
+    private renderIsbn;
+    private renderEbook;
+    private renderCtaSlot;
     render(): HTMLZBookCardElement;
 }

package/dist/types/components/book-card/z-book-card/index.stories.d.ts

@@ -1,13 +1,12 @@
 import { ZBookCard } from ".";
-import { BookCardTagStatus, BookCardVariant } from "../../../beans";
+import { BookCardVariant } from "../../../beans";
+import { CSSVarsArguments } from "../../../utils/storybook-utils";
 import "../../z-button/index";
 import "../../z-icon/index";
 import "../../z-tag/index";
 import "../z-book-card-app/index";
 import "./index";
-type ZBookCardStoriesArgs = ZBookCard & {
-    theme: "theme-default" | "theme-dark" | "theme-black-yellow";
-};
+type ZBookCardStoriesArgs = ZBookCard & CSSVarsArguments<"--z-book-card-portrait-cover-height" | "--z-book-card-title-lines" | "--z-book-card-title-word-break" | "--z-book-card-subtitle-lines" | "--z-book-card-subtitle-word-break" | "--z-book-card-authors-lines" | "--z-book-card-authors-word-break">;
 declare const StoryMeta: {
     title: string;
     component: string;
@@ -18,26 +17,40 @@ declare const StoryMeta: {
             };
             options: BookCardVariant[];
         };
-        edi: {
+        "--z-book-card-portrait-cover-height": {
             control: {
-                type: "object";
+                type: "text";
             };
         };
-        annotated: {
+        "--z-book-card-title-lines": {
             control: {
-                type: "object";
+                type: "text";
             };
         };
-        teacherVersion: {
+        "--z-book-card-title-word-break": {
             control: {
-                type: "object";
+                type: "text";
             };
         };
-        theme: {
+        "--z-book-card-subtitle-lines": {
             control: {
-                type: "inline-radio";
+                type: "text";
+            };
+        };
+        "--z-book-card-subtitle-word-break": {
+            control: {
+                type: "text";
+            };
+        };
+        "--z-book-card-authors-lines": {
+            control: {
+                type: "text";
+            };
+        };
+        "--z-book-card-authors-word-break": {
+            control: {
+                type: "text";
             };
-            options: string[];
         };
     };
     args: {
@@ -48,24 +61,17 @@ declare const StoryMeta: {
         authors: string;
         isbn: string;
         isbnLabel: string;
-        adoption: true;
-        edi: {
-            status: BookCardTagStatus.ACTIVE;
-            interactive: true;
-        };
-        annotated: {
-            status: BookCardTagStatus.DISABLED;
-            interactive: true;
-        };
-        teacherVersion: {
-            status: BookCardTagStatus.ACTIVE;
-            interactive: false;
-        };
-        catalogUrl: string;
+        year: string;
         ebookUrl: string;
         fallbackCover: string;
-        operaTitleHtmlTag: any;
-        theme: "theme-default";
+        titleHtmlTag: any;
+        "--z-book-card-portrait-cover-height": string;
+        "--z-book-card-title-lines": string;
+        "--z-book-card-title-word-break": string;
+        "--z-book-card-subtitle-lines": string;
+        "--z-book-card-subtitle-word-break": string;
+        "--z-book-card-authors-lines": string;
+        "--z-book-card-authors-word-break": string;
     };
 };
 export default StoryMeta;
@@ -75,6 +81,3 @@ export declare const Card: {
 export declare const WithSlottedContent: {
     render: (args: ZBookCardStoriesArgs) => import("lit-html").TemplateResult<1>;
 };
-export declare const WithCoverOverlaySlot: {
-    render: (args: ZBookCardStoriesArgs) => import("lit-html").TemplateResult<1>;
-};

package/dist/types/components/css-components/z-scrollbar/index.stories.d.ts

@@ -53,5 +53,5 @@ declare const StoryMeta: {
 };
 export default StoryMeta;
 export declare const Default: {
-    render: (args: any) => import("lit-html").TemplateResult<1>;
+    render: () => import("lit-html").TemplateResult<1>;
 };

package/dist/types/components/deprecated/z-book-card-deprecated/index.stories.d.ts

@@ -5,9 +5,7 @@ import "../../z-button/index";
 import "../../z-icon/index";
 import "../../z-tag/index";
 import "./index";
-type ZBookCardStoriesArgs = ZBookCardDeprecated & {
-    theme: "theme-default" | "theme-dark" | "theme-black-yellow";
-} & CSSVarsArguments<"z-book-card-ribbon-background-color" | "z-book-card-ribbon-shadow-color" | "z-book-card-compact-width" | "z-book-card-compact-height">;
+type ZBookCardStoriesArgs = ZBookCardDeprecated & CSSVarsArguments<"z-book-card-ribbon-background-color" | "z-book-card-ribbon-shadow-color" | "z-book-card-compact-width" | "z-book-card-compact-height">;
 declare const StoryMeta: {
     title: string;
     component: string;
@@ -18,12 +16,6 @@ declare const StoryMeta: {
             };
             options: BookCardDeprecatedVariant[];
         };
-        theme: {
-            control: {
-                type: "inline-radio";
-            };
-            options: string[];
-        };
         "--z-book-card-ribbon-background-color": import("@storybook/csf").Args;
         "--z-book-card-ribbon-shadow-color": import("@storybook/csf").Args;
     };
@@ -41,7 +33,6 @@ declare const StoryMeta: {
         borderless: false;
         fallbackCover: string;
         operaTitleTag: string;
-        theme: "theme-default";
         "--z-book-card-ribbon-background-color": string;
         "--z-book-card-ribbon-shadow-color": string;
         "--z-book-card-compact-width": string;

package/dist/types/components/z-breadcrumb/index.stories.d.ts

@@ -10,7 +10,7 @@ import "./style.stories.css";
  * No slot is rendered inside the latter.
  * Like the other use case, don't pass a custom label to the first child because it will be overwritten by the default home value.
  * This mode can be also used by SEO non-relevant application.
- * @example```html
+ * @example```
  * <z-breadcrumb>
  *  <a href="./home_link"></a>
  *  <a href="./link1">link1</a>

package/dist/types/components/z-card/index.stories.d.ts

@@ -52,7 +52,7 @@ export declare const TextVariantPrimaryBackground: {
     };
     render: (args: ZCardStoriesArgs) => import("lit-html").TemplateResult<1>;
 };
-export declare const TextVariantWhiteBackgroundAndBordered: {
+export declare const TextVariantSurfaceBackgroundAndBordered: {
     args: {
         "--z-card--text-border": string;
         "--z-card--text-border-radius": string;

package/dist/types/components/z-modal/index.d.ts

@@ -1,8 +1,8 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 /**
- * @slot modalCloseButton - accept custom close button
- * @slot modalContent - set the content of the modal
- * @cssprop --z-modal-content-padding - set a default padding for the modal content slot to 16px
+ * @slot modalCloseButton - slot for custom close button
+ * @slot modalContent - slot for the content of the modal
+ * @cssprop --z-modal-content-padding - padding of the modal's content. The default is 16px (--space-unit * 2)
  */
 export declare class ZModal {
     /** unique id */

package/dist/types/components/z-popover/index.stories.d.ts

@@ -1,9 +1,11 @@
 import { type ZPopover } from ".";
 import { PopoverPosition } from "../../beans";
+import { CSSVarsArguments } from "../../utils/storybook-utils";
 import "../z-button/index";
 import "../z-icon/index";
 import "./index";
 import "./index.stories.css";
+type ZPopoverStoriesArgs = ZPopover & CSSVarsArguments<"--z-popover-theme--surface" | "--z-popover-theme--text">;
 /**
  * To be sure the AUTO algorithm finds the right container when calculating the position, set its container's position to `position: relative;`
  */
@@ -28,13 +30,14 @@ declare const StoryMeta: {
 export default StoryMeta;
 export declare const ContextualMenuLike: {
     args: {
+        "--z-popover-theme--surface": string;
         position: PopoverPosition.RIGHT_BOTTOM;
     };
-    render: (args: ZPopover) => import("lit-html").TemplateResult<1>;
+    render: (args: ZPopoverStoriesArgs) => import("lit-html").TemplateResult<1>;
 };
 export declare const TooltipLike: {
     args: {
         position: PopoverPosition.RIGHT;
     };
-    render: (args: ZPopover) => import("lit-html").TemplateResult<1>;
+    render: (args: ZPopoverStoriesArgs) => import("lit-html").TemplateResult<1>;
 };

package/dist/types/components/z-stepper/index.stories.d.ts

@@ -3,6 +3,9 @@ import "./index";
 declare const _default: {
     title: string;
     component: string;
+    decorators: ((Story: import("@storybook/csf").PartialStoryFn<import("@storybook/web-components").WebComponentsRenderer, {
+        render: () => HTMLSlotElement;
+    }>) => import("lit-html").TemplateResult<1>)[];
     subcomponents: {
         ZStepperItem: string;
     };