@zanichelli/albe-web-components 20.0.0 → 20.0.2-RC

package/dist/cjs/z-td.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"z-td.cjs.entry.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,MAAM,CAAC,k9BAAk9B,CAAC;;ACAj/B,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCYvtD,GAAG,GAAA,MAAA;AALhB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAcE;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAEd;;;;AAIG;AAEH,QAAA,IAAA,CAAA,QAAQ,GAAwB,IAAI;AAEpC;;AAEG;AAEH,QAAA,IAAA,CAAA,eAAe,GAAqBA,uBAAe,CAAC,IAAI;AAExD;;AAEG;AAEH,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK;AAmEnB;IAnDW,aAAa,GAAA;AACrB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAA,KAAA,EAAQ,IAAI,CAAC,OAAO,CAAA,CAAE;;aAC9C;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;;QAG/C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC;;AAGpC,IAAA,iBAAiB,CAAC,EAAc,EAAA;QACtC,EAAE,CAAC,eAAe,EAAE;QACpB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI;;IAG5C,iBAAiB,GAAA;QACf,IAAI,CAAC,aAAa,EAAE;;IAGtB,MAAM,GAAA;QACJ,QACEC,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,MAAM,EAAA,WAAA,EACA,IAAI,CAAC,UAAU,EAAA,EAE1BD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,EACZ,IAAI,CAAC,QAAQ,KACZA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qCAAqC,EAAA,EAC9CA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAEE,qBAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAEC,mBAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,CAC1C,EACFH,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,cAAc,EACpB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAA,EAE9BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,iBAAiB,EAAA,CAAQ,CAC1B,CACR,CACP,CACG,CACD;;;;;;;;;;;;;","names":["PopoverPosition","h","Host","ButtonVariant","ControlSize"],"sources":["src/components/table/cells/z-table-cells.css?tag=z-td&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-td&encapsulation=shadow","src/components/table/cells/z-td/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  max-width: 100%;\n  align-items: center;\n  background-color: var(--color-surface01);\n  gap: calc(var(--space-unit) * 2) var(--space-unit);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  box-shadow: 8px 0 16px -8px var(--shadow-color-base);\n}\n\n:host([menu-open]) {\n  z-index: 2;\n}\n\n.cell--content {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  align-items: center;\n}\n\n:host([show-menu]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.cell--menu-container {\n  margin-left: auto;\n}\n\n:host(:not([show-menu])) .cell--menu-container {\n  opacity: 0;\n  pointer-events: none;\n}\n\n:host(:is([show-menu], [menu-open])) .cell--menu-container,\n:host([show-menu]) .cell--menu-container:focus-within {\n  z-index: 1;\n  opacity: 1;\n  pointer-events: all;\n}\n\n:host .cell-popover {\n  z-index: 100;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-menu=\"hover\"]) .cell--menu-container {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-menu=\"hover\"]:hover) .cell--menu-container {\n    z-index: 1;\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTd component.\n * @slot - ZTd content.\n */\n@Component({\n  tag: \"z-td\",\n  styleUrls: [\"../z-table-cells.css\", \"../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTd implements ComponentInterface {\n  @Element() host: HTMLZTdElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Set the popover position, the default is \"auto\".\n   */\n  @Prop()\n  popoverPosition?: PopoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  private menuTrigger: HTMLZButtonElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Emitted when the value of the `colspan` changes.\n   */\n  @Event({\n    bubbles: true,\n    cancelable: false,\n  })\n  colspanChange: EventEmitter<number>;\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n\n    this.colspanChange.emit(this.colspan || 1);\n  }\n\n  private onMenuButtonClick(ev: MouseEvent): void {\n    ev.stopPropagation();\n    this.popoverEl.open = !this.popoverEl.open;\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZTdElement {\n    return (\n      <Host\n        role=\"cell\"\n        menu-open={this.isMenuOpen}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showMenu && (\n            <div class=\"cell--menu-container prevent-expand\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLZButtonElement)}\n                onClick={this.onMenuButtonClick.bind(this)}\n              />\n              <z-popover\n                class=\"cell-popover\"\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger as HTMLElement}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-td.cjs.entry.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,MAAM,CAAC,k9BAAk9B,CAAC;;ACAj/B,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCYvtD,GAAG,GAAA,MAAA;AALhB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAcE;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAEd;;;;AAIG;AAEH,QAAA,IAAA,CAAA,QAAQ,GAAwB,IAAI;AAEpC;;AAEG;AAEH,QAAA,IAAA,CAAA,eAAe,GAAqBA,uBAAe,CAAC,IAAI;AAExD;;AAEG;AAEH,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK;AAmEnB;IAnDW,aAAa,GAAA;AACrB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAA,KAAA,EAAQ,IAAI,CAAC,OAAO,CAAA,CAAE;;aAC9C;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;;QAG/C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC;;AAGpC,IAAA,iBAAiB,CAAC,EAAc,EAAA;QACtC,EAAE,CAAC,eAAe,EAAE;QACpB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI;;IAG5C,iBAAiB,GAAA;QACf,IAAI,CAAC,aAAa,EAAE;;IAGtB,MAAM,GAAA;QACJ,QACEC,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,MAAM,EAAA,WAAA,EACA,IAAI,CAAC,UAAU,EAAA,EAE1BD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,EACZ,IAAI,CAAC,QAAQ,KACZA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qCAAqC,EAAA,EAC9CA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAEE,qBAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAEC,mBAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,CAC1C,EACFH,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,cAAc,EACpB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAA,EAE9BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,iBAAiB,EAAA,CAAQ,CAC1B,CACR,CACP,CACG,CACD;;;;;;;;;;;;;","names":["PopoverPosition","h","Host","ButtonVariant","ControlSize"],"sources":["src/components/deprecated/table/cells/z-table-cells.css?tag=z-td&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-td&encapsulation=shadow","src/components/deprecated/table/cells/z-td/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  max-width: 100%;\n  align-items: center;\n  background-color: var(--color-surface01);\n  gap: calc(var(--space-unit) * 2) var(--space-unit);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  box-shadow: 8px 0 16px -8px var(--shadow-color-base);\n}\n\n:host([menu-open]) {\n  z-index: 2;\n}\n\n.cell--content {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  align-items: center;\n}\n\n:host([show-menu]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.cell--menu-container {\n  margin-left: auto;\n}\n\n:host(:not([show-menu])) .cell--menu-container {\n  opacity: 0;\n  pointer-events: none;\n}\n\n:host(:is([show-menu], [menu-open])) .cell--menu-container,\n:host([show-menu]) .cell--menu-container:focus-within {\n  z-index: 1;\n  opacity: 1;\n  pointer-events: all;\n}\n\n:host .cell-popover {\n  z-index: 100;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-menu=\"hover\"]) .cell--menu-container {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-menu=\"hover\"]:hover) .cell--menu-container {\n    z-index: 1;\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, VisibilityCondition} from \"../../../../../beans\";\n\n/**\n * ZTd component.\n * @slot - ZTd content.\n */\n@Component({\n  tag: \"z-td\",\n  styleUrls: [\"../z-table-cells.css\", \"../../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTd implements ComponentInterface {\n  @Element() host: HTMLZTdElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Set the popover position, the default is \"auto\".\n   */\n  @Prop()\n  popoverPosition?: PopoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  private menuTrigger: HTMLZButtonElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Emitted when the value of the `colspan` changes.\n   */\n  @Event({\n    bubbles: true,\n    cancelable: false,\n  })\n  colspanChange: EventEmitter<number>;\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n\n    this.colspanChange.emit(this.colspan || 1);\n  }\n\n  private onMenuButtonClick(ev: MouseEvent): void {\n    ev.stopPropagation();\n    this.popoverEl.open = !this.popoverEl.open;\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZTdElement {\n    return (\n      <Host\n        role=\"cell\"\n        menu-open={this.isMenuOpen}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showMenu && (\n            <div class=\"cell--menu-container prevent-expand\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLZButtonElement)}\n                onClick={this.onMenuButtonClick.bind(this)}\n              />\n              <z-popover\n                class=\"cell-popover\"\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger as HTMLElement}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-tfoot.cjs.entry.js

@@ -15,7 +15,7 @@ const ZTfoot = class {
         this.sticky = false;
     }
     render() {
-        return (index.h(index.Host, { key: '0fcde5bee7935573e01260c97561df41a7867e3e', role: "rowgroup", tabIndex: -1 }, index.h("slot", { key: '42d7a054d3ec73269cc57a44775a41a2d7584170' })));
+        return (index.h(index.Host, { key: 'a5e96868b6f2f28cd25fe134b8346f0f9d800de1', role: "rowgroup", tabIndex: -1 }, index.h("slot", { key: 'bbb1478d0fdd700bf4e9601eb7d008f54ff02cb3' })));
     }
 };
 ZTfoot.style = stylesCss$1() + stylesCss();

package/dist/cjs/z-tfoot.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"z-tfoot.cjs.entry.js","mappings":";;;;AAAA,MAAMA,WAAS,GAAG,MAAM,CAAC,qJAAqJ,CAAC;;ACA/K,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCWvtD,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAYf;IAVC,MAAM,GAAA;AACJ,QAAA,QACEC,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,EAAE,EAAA,EAEZD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR;;;;;;;","names":["stylesCss","h","Host"],"sources":["src/components/table/z-tfoot/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/table/z-tfoot/index.tsx"],"sourcesContent":[":host {\n  display: block;\n  box-sizing: border-box;\n  margin-top: -1px;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  bottom: 0;\n  background-color: var(--color-surface01);\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Host, Prop, h} from \"@stencil/core\";\n\n/**\n * ZTFoot component.\n * @slot - ZTFoot content (`z-tr`).\n */\n@Component({\n  tag: \"z-tfoot\",\n  styleUrls: [\"styles.css\", \"../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTfoot implements ComponentInterface {\n  /**\n   * If true, the footer will be stuck to the bottom of the table.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  render(): void {\n    return (\n      <Host\n        role=\"rowgroup\"\n        tabIndex={-1}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-tfoot.cjs.entry.js","mappings":";;;;AAAA,MAAMA,WAAS,GAAG,MAAM,CAAC,qJAAqJ,CAAC;;ACA/K,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCWvtD,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAYf;IAVC,MAAM,GAAA;AACJ,QAAA,QACEC,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,EAAE,EAAA,EAEZD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR;;;;;;;","names":["stylesCss","h","Host"],"sources":["src/components/deprecated/table/z-tfoot/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/deprecated/table/z-tfoot/index.tsx"],"sourcesContent":[":host {\n  display: block;\n  box-sizing: border-box;\n  margin-top: -1px;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  bottom: 0;\n  background-color: var(--color-surface01);\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Host, Prop, h} from \"@stencil/core\";\n\n/**\n * ZTFoot component.\n * @slot - ZTFoot content (`z-tr`).\n */\n@Component({\n  tag: \"z-tfoot\",\n  styleUrls: [\"styles.css\", \"../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTfoot implements ComponentInterface {\n  /**\n   * If true, the footer will be stuck to the bottom of the table.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  render(): void {\n    return (\n      <Host\n        role=\"rowgroup\"\n        tabIndex={-1}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-th.cjs.entry.js

@@ -76,7 +76,7 @@ const ZTh = class {
         this.updateColspan();
     }
     render() {
-        return (index.h(index.Host, { key: '8e83039c2100fa4df3e205d6a4819cdc32b4789e', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection, sortable: this.showSorting }, index.h("div", { key: '18c67051c7eed356980c97b08bd4981b5d8c9b18', class: "cell--content" }, index.h("slot", { key: '05c6564192e37a01c6f79c81db4b7732dcc30451' }), this.showSorting && (index.h("button", { key: '45f0e2087f6050567bf7978f8421a146912e2cfd', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, index.h("z-icon", { key: 'e53ad878d055d82b518212c99385b4d394503bf9', name: this.sortDirection === index$1.SortDirection.DESC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (index.h("div", { key: '660f2abf11cc879c3a5855149fbbfc7b57578b6a', class: "cell--menu-container" }, index.h("z-button", { key: '37905939b31eeb5051ce5824787309629a935f14', variant: index$1.ButtonVariant.TERTIARY, icon: "contextual-menu", size: index$1.ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: () => (this.popoverEl.open = !this.popoverEl.open) }), index.h("z-popover", { key: '369c0918f021e0699c2178b2b023126fce518073', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, index.h("slot", { key: 'b3364b3d95e4cd92fefce41bfcbb995b2b5eef70', name: "contextual-menu" })))))));
+        return (index.h(index.Host, { key: 'd677564cf6d2351a9188098d58b98e4bf9ffbf9e', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection, sortable: this.showSorting }, index.h("div", { key: '267fd4a41682a6a1475ba74739ff148957dc6626', class: "cell--content" }, index.h("slot", { key: 'a77588e6dd5645f6b384a7564a06cffae72bed4e' }), this.showSorting && (index.h("button", { key: '8a565667e7bdbd223d38efe7be5128c69947577c', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, index.h("z-icon", { key: 'a527e6e217f5cbabf1baac1c292111ab406aa792', name: this.sortDirection === index$1.SortDirection.DESC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (index.h("div", { key: '396eb46a6aa10d47419cd437412ce69d797f2047', class: "cell--menu-container" }, index.h("z-button", { key: '6e014d9922c15041950772ee0c377b9f31d4d743', variant: index$1.ButtonVariant.TERTIARY, icon: "contextual-menu", size: index$1.ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: () => (this.popoverEl.open = !this.popoverEl.open) }), index.h("z-popover", { key: '11a7861d3151f616c9d9761709611bac37a02ec6', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, index.h("slot", { key: '99545a1fb846906941ce882d6f21676de1fa7fb2', name: "contextual-menu" })))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/z-th.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"z-th.cjs.entry.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,MAAM,CAAC,k9BAAk9B,CAAC;;ACAj/B,MAAMA,WAAS,GAAG,MAAM,CAAC,mnCAAmnC,CAAC;;ACA7oC,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCavtD,GAAG,GAAA,MAAA;AALhB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAcE;;;;AAIG;AAEH,QAAA,IAAA,CAAA,QAAQ,GAAwB,IAAI;AAEpC;;;;AAIG;AAEH,QAAA,IAAA,CAAA,WAAW,GAAwB,IAAI;AAEvC;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAQd;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAmB,KAAK;AAE9B;;AAEG;AAEH,QAAA,IAAA,CAAA,eAAe,GAAGC,uBAAe,CAAC,IAAI;AAEtC;;AAEG;AAEH,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK;AAqGnB;AAvFC;;AAEG;AACH,IAAA,IAAY,iBAAiB,GAAA;AAC3B,QAAA,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AACvB,YAAA,OAAO,IAAI;;AAGb,QAAA,OAAO,IAAI,CAAC,aAAa,KAAKC,qBAAa,CAAC,GAAG,GAAG,WAAW,GAAG,YAAY;;AAG9E;;;AAGG;IACK,UAAU,GAAA;AAChB,QAAA,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AACvB,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;YAEnB;;QAGF,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,KAAKA,qBAAa,CAAC,GAAG,GAAGA,qBAAa,CAAC,IAAI,GAAGA,qBAAa,CAAC,GAAG;AACtG,QAAA,IAAI,CAAC,MAAM,GAAG,IAAI;AAElB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAC,aAAa,EAAE,IAAI,CAAC,aAAa,EAAC,CAAC;;IAI3C,aAAa,GAAA;AACrB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAA,KAAA,EAAQ,IAAI,CAAC,OAAO,CAAA,CAAE;;aAC9C;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;;;IAIjD,iBAAiB,GAAA;QACf,IAAI,CAAC,aAAa,EAAE;;IAGtB,MAAM,GAAA;AACJ,QAAA,QACEC,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,cAAc,eACR,IAAI,CAAC,UAAU,EAAA,WAAA,EACf,IAAI,CAAC,iBAAiB,EACjC,QAAQ,EAAE,IAAI,CAAC,WAAW,EAAA,EAE1BD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,EACZ,IAAI,CAAC,WAAW,KACfA,qEACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,EAEnCA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAE,IAAI,CAAC,aAAa,KAAKD,qBAAa,CAAC,IAAI,GAAG,iBAAiB,GAAG,mBAAmB,EACzF,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EAAA,CACV,CACK,CACV,EACA,IAAI,CAAC,QAAQ,KACZC,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,sBAAsB,EAAA,EAC/BA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAEE,qBAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAEC,mBAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,EACnD,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAA,CAC3D,EACFH,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAA,EAE9BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,iBAAiB,EAAA,CAAQ,CAC1B,CACR,CACP,CACG,CACD;;;;;;;;;;;;;","names":["stylesCss","PopoverPosition","SortDirection","h","Host","ButtonVariant","ControlSize"],"sources":["src/components/table/cells/z-table-cells.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  max-width: 100%;\n  align-items: center;\n  background-color: var(--color-surface01);\n  gap: calc(var(--space-unit) * 2) var(--space-unit);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  box-shadow: 8px 0 16px -8px var(--shadow-color-base);\n}\n\n:host([menu-open]) {\n  z-index: 2;\n}\n\n.cell--content {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  align-items: center;\n}\n\n:host([show-menu]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.cell--menu-container {\n  margin-left: auto;\n}\n\n:host(:not([show-menu])) .cell--menu-container {\n  opacity: 0;\n  pointer-events: none;\n}\n\n:host(:is([show-menu], [menu-open])) .cell--menu-container,\n:host([show-menu]) .cell--menu-container:focus-within {\n  z-index: 1;\n  opacity: 1;\n  pointer-events: all;\n}\n\n:host .cell-popover {\n  z-index: 100;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-menu=\"hover\"]) .cell--menu-container {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-menu=\"hover\"]:hover) .cell--menu-container {\n    z-index: 1;\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n",":host {\n  z-index: 1;\n  padding: 0;\n  background-color: var(--color-background);\n  font-weight: var(--font-sb);\n}\n\n:host([show-sorting]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n  position: relative;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  outline: none;\n}\n\n.z-th--sort-button:focus,\n.z-th--sort-button:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  opacity: 1;\n  outline: none;\n  pointer-events: all;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-sorting=\"hover\"]) .z-th--sort-button {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n  :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n  :host([show-sorting=\"always\"]) .z-th--sort-button,\n  :host([sorted]) .z-th--sort-button {\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n  position: absolute;\n  top: 6px;\n  left: 6px;\n  width: calc(100% - 12px);\n  height: calc(100% - 10px);\n  background-color: transparent;\n  content: \"\";\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrls: [\"../z-table-cells.css\", \"styles.css\", \"../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTh implements ComponentInterface {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Enables the sorting button.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the sort button.\n   */\n  @Prop({reflect: true})\n  showSorting: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Sorted state of the column.\n   */\n  @Prop({reflect: true, mutable: true})\n  sorted: boolean | null = false;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      this.sorted = false;\n\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sorted = true;\n\n    this.sort.emit({sortDirection: this.sortDirection});\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n        sortable={this.showSorting}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showSorting && (\n            <button\n              class=\"z-th--sort-button\"\n              type=\"button\"\n              onClick={this.handleSort.bind(this)}\n            >\n              <z-icon\n                name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n                width={14}\n                height={14}\n              />\n            </button>\n          )}\n          {this.showMenu && (\n            <div class=\"cell--menu-container\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLElement)}\n                onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n              />\n              <z-popover\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-th.cjs.entry.js","mappings":"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","names":["stylesCss","PopoverPosition","SortDirection","h","Host","ButtonVariant","ControlSize"],"sources":["src/components/deprecated/table/cells/z-table-cells.css?tag=z-th&encapsulation=shadow","src/components/deprecated/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-th&encapsulation=shadow","src/components/deprecated/table/cells/z-th/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  max-width: 100%;\n  align-items: center;\n  background-color: var(--color-surface01);\n  gap: calc(var(--space-unit) * 2) var(--space-unit);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  box-shadow: 8px 0 16px -8px var(--shadow-color-base);\n}\n\n:host([menu-open]) {\n  z-index: 2;\n}\n\n.cell--content {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  align-items: center;\n}\n\n:host([show-menu]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.cell--menu-container {\n  margin-left: auto;\n}\n\n:host(:not([show-menu])) .cell--menu-container {\n  opacity: 0;\n  pointer-events: none;\n}\n\n:host(:is([show-menu], [menu-open])) .cell--menu-container,\n:host([show-menu]) .cell--menu-container:focus-within {\n  z-index: 1;\n  opacity: 1;\n  pointer-events: all;\n}\n\n:host .cell-popover {\n  z-index: 100;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-menu=\"hover\"]) .cell--menu-container {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-menu=\"hover\"]:hover) .cell--menu-container {\n    z-index: 1;\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n",":host {\n  z-index: 1;\n  padding: 0;\n  background-color: var(--color-background);\n  font-weight: var(--font-sb);\n}\n\n:host([show-sorting]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n  position: relative;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  outline: none;\n}\n\n.z-th--sort-button:focus,\n.z-th--sort-button:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  opacity: 1;\n  outline: none;\n  pointer-events: all;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-sorting=\"hover\"]) .z-th--sort-button {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n  :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n  :host([show-sorting=\"always\"]) .z-th--sort-button,\n  :host([sorted]) .z-th--sort-button {\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n  position: absolute;\n  top: 6px;\n  left: 6px;\n  width: calc(100% - 12px);\n  height: calc(100% - 10px);\n  background-color: transparent;\n  content: \"\";\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrls: [\"../z-table-cells.css\", \"styles.css\", \"../../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTh implements ComponentInterface {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Enables the sorting button.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the sort button.\n   */\n  @Prop({reflect: true})\n  showSorting: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Sorted state of the column.\n   */\n  @Prop({reflect: true, mutable: true})\n  sorted: boolean | null = false;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      this.sorted = false;\n\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sorted = true;\n\n    this.sort.emit({sortDirection: this.sortDirection});\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n        sortable={this.showSorting}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showSorting && (\n            <button\n              class=\"z-th--sort-button\"\n              type=\"button\"\n              onClick={this.handleSort.bind(this)}\n            >\n              <z-icon\n                name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n                width={14}\n                height={14}\n              />\n            </button>\n          )}\n          {this.showMenu && (\n            <div class=\"cell--menu-container\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLElement)}\n                onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n              />\n              <z-popover\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-thead.cjs.entry.js

@@ -19,7 +19,7 @@ const ZThead = class {
         this.isFocusable = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'd7fa2e798c78f08c9ead7330d1b0d0893e197d56', role: "rowgroup", tabIndex: this.isFocusable ? 0 : -1 }, index.h("slot", { key: '57ced6d7b8cf3859959f80d1af3eb72b17d69eb0' })));
+        return (index.h(index.Host, { key: '7344ed54861bf06e14d98898db49edb576668e9b', role: "rowgroup", tabIndex: this.isFocusable ? 0 : -1 }, index.h("slot", { key: '72be057fd58c9da5280dee692324cb5192865dba' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/z-thead.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"z-thead.cjs.entry.js","mappings":";;;;AAAA,MAAMA,WAAS,GAAG,MAAM,CAAC,4PAA4P,CAAC;;ACAtR,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCWvtD,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK;AAYpB;IAVC,MAAM,GAAA;AACJ,QAAA,QACEC,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,EAAE,EAAA,EAEnCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR;;;;;;;;","names":["stylesCss","h","Host"],"sources":["src/components/table/z-thead/styles.css?tag=z-thead&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-thead&encapsulation=shadow","src/components/table/z-thead/index.tsx"],"sourcesContent":[":host {\n  --z-table--cells-background: var(\n    --color-background\n  ); /* Needed to handle the background-color of the expand button cell */\n\n  display: block;\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 2;\n  top: 0;\n  box-shadow: 0 2px 4px -2px var(--shadow-color-base);\n}\n\n:host(:focus-visible) {\n  box-shadow: none;\n  outline: none;\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Host, Prop, h} from \"@stencil/core\";\n\n/**\n * ZThead component.\n * @slot - ZThead content (`z-tr`).\n */\n@Component({\n  tag: \"z-thead\",\n  styleUrls: [\"styles.css\", \"../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZThead implements ComponentInterface {\n  @Element() host: HTMLZTheadElement;\n\n  /**\n   * If true, the header will be stuck to the top of the table.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * The element is focusable\n   */\n  @Prop({reflect: true})\n  isFocusable = false;\n\n  render(): HTMLZTheadElement {\n    return (\n      <Host\n        role=\"rowgroup\"\n        tabIndex={this.isFocusable ? 0 : -1}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-thead.cjs.entry.js","mappings":";;;;AAAA,MAAMA,WAAS,GAAG,MAAM,CAAC,4PAA4P,CAAC;;ACAtR,MAAM,SAAS,GAAG,MAAM,CAAC,0sDAA0sD,CAAC;;MCWvtD,MAAM,GAAA,MAAA;AALnB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AAEH,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK;AAYpB;IAVC,MAAM,GAAA;AACJ,QAAA,QACEC,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,EAAE,EAAA,EAEnCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR;;;;;;;;","names":["stylesCss","h","Host"],"sources":["src/components/deprecated/table/z-thead/styles.css?tag=z-thead&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-thead&encapsulation=shadow","src/components/deprecated/table/z-thead/index.tsx"],"sourcesContent":[":host {\n  --z-table--cells-background: var(\n    --color-background\n  ); /* Needed to handle the background-color of the expand button cell */\n\n  display: block;\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 2;\n  top: 0;\n  box-shadow: 0 2px 4px -2px var(--shadow-color-base);\n}\n\n:host(:focus-visible) {\n  box-shadow: none;\n  outline: none;\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {Component, ComponentInterface, Element, Host, Prop, h} from \"@stencil/core\";\n\n/**\n * ZThead component.\n * @slot - ZThead content (`z-tr`).\n */\n@Component({\n  tag: \"z-thead\",\n  styleUrls: [\"styles.css\", \"../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZThead implements ComponentInterface {\n  @Element() host: HTMLZTheadElement;\n\n  /**\n   * If true, the header will be stuck to the top of the table.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * The element is focusable\n   */\n  @Prop({reflect: true})\n  isFocusable = false;\n\n  render(): HTMLZTheadElement {\n    return (\n      <Host\n        role=\"rowgroup\"\n        tabIndex={this.isFocusable ? 0 : -1}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-toast-notification-list.cjs.entry.js

@@ -45,7 +45,7 @@ const ZToastNotificationList = class {
         }
     }
     render() {
-        return index.h("slot", { key: '1b22ad1308d152ae0a89b6e0d711765fc400458b', name: "toasts" });
+        return index.h("slot", { key: '124469b727158c7221ff11aa3b0614bd28591a50', name: "toasts" });
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/z-toast-notification.cjs.entry.js

@@ -4200,19 +4200,19 @@ const ZToastNotification = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '203e3a531f9a178cb4a87598b7916d9313faefe6', style: { "--percentuale": `${this.percentage}%` }, class: { [this.transition]: !!this.transition, [this.type]: !!this.type }, onAnimationEnd: (e) => {
+        return (index.h(index.Host, { key: '129c4628c3809f638a02596bff82f4a5700ae566', style: { "--percentuale": `${this.percentage}%` }, class: { [this.transition]: !!this.transition, [this.type]: !!this.type }, onAnimationEnd: (e) => {
                 if (this.autoclose && e.animationName.includes("slidein")) {
                     this.startClosingTimeout(this.autoclose);
                 }
                 if (e.animationName.includes("slideout")) {
                     this.hostElement.parentNode.removeChild(this.hostElement);
                 }
-            } }, index.h("div", { key: 'f1aa2db8b0e25347d79f64bd99d3fa5ed0cdebbc', class: "toast-notification-container" }, index.h("div", { key: 'a9d16a63c9007b3dbe1f245d9063c3510f1518b8', class: "toast-notification-content" }, index.h("div", { key: '4ab0c13ca3f0bd80d95e0cb3199e3045e60c9a60', class: "toast-notification-text" }, this.heading && index.h("span", { key: 'b7dab9b4238d7e0f5d0db2184a2c9ca9bc0c8234', class: "title" }, this.heading), index.h("span", { key: '6afb9e5be183e6b040e6219940b00c48ea702fb1', class: "message" }, index.h("slot", { key: 'ee7feb8ab40d6e81dec9998a2ae13b4c03cf0327', name: "message" }, this.message && index.h("span", { key: '4adfbad2e2647b31a165e0a2d5164de7b283a3b7', innerHTML: purify.sanitize(this.message) })))), index.h("div", { key: 'ed3b21c702a6e4cadc10dd21b8a685c0b9c7a5cc', class: "button-container", hidden: !this.hasSlottedButton }, index.h("slot", { key: '0ece97a1a9773fc44347c64d5d413e35403212c9', name: "button", onSlotchange: () => this.checkSlottedButton() }))), this.closebutton && (index.h("button", { key: 'fd8e0a5fc8a6f59567f9938b53356ca545fd5eb0', class: "close-button", "aria-label": "Chiudi notifica", onClick: () => this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], true), onKeyDown: (e) => {
+            } }, index.h("div", { key: '39360c2661ac44f4e3e8ae25aceccaea8179a03e', class: "toast-notification-container" }, index.h("div", { key: '6778d83e83590f5981ff9dfb5fbb8fbe92143404', class: "toast-notification-content" }, index.h("div", { key: '896d9bb0c412381f9ad81c799666dd54503a50b0', class: "toast-notification-text" }, this.heading && index.h("span", { key: 'a431608d859dede1cc17e840ebf2e01b872a1d48', class: "title" }, this.heading), index.h("span", { key: '23f29016f7eb04790a6adf136b0e064f5f2d87d9', class: "message" }, index.h("slot", { key: 'a793b4e4fee43ad139f0eef51ec1ed1a6cd5c31f', name: "message" }, this.message && index.h("span", { key: 'fc84e8b14208ff6d150dfea28924387f845cb371', innerHTML: purify.sanitize(this.message) })))), index.h("div", { key: '475e54939682a3b7bba6032a92bd04b8a21772b3', class: "button-container", hidden: !this.hasSlottedButton }, index.h("slot", { key: 'e9bd0b4e65504476b59a97dcf82b233b5259bc00', name: "button", onSlotchange: () => this.checkSlottedButton() }))), this.closebutton && (index.h("button", { key: '14b143ec8e4d8e02b039d01464532ba25bcc2bea', class: "close-button", "aria-label": "Chiudi notifica", onClick: () => this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], true), onKeyDown: (e) => {
                 if (e.code == index$1.KeyboardCode.SPACE || e.code == index$1.KeyboardCode.ENTER) {
                     e.preventDefault();
                     this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], true);
                 }
-            } }, index.h("z-icon", { key: '778c9689d5b1b6286c08c58c50ad93cc8fc35358', name: "multiply-circled" }))))));
+            } }, index.h("z-icon", { key: '4870673eb2e49f6dbd06788a3b279daaa8236ab6', name: "multiply-circled" }))))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -34,14 +34,14 @@ const ZToggleSwitch = class {
         this.emitToggleClick();
     }
     render() {
-        return (index.h(index.Host, { key: '0370a36488a57e5ac92c296ce0fcc140cc8c56eb' }, index.h("input", { key: '3364210d02cebfd7d2ad14407a557c52aa82686a', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), index.h("label", { key: '07519e6cbe8f44d131909d1023b602e74b6cdf80', htmlFor: this.htmlid, class: {
+        return (index.h(index.Host, { key: 'c682159ebad808a9e448a1a200fcc9ce49e3a2ad' }, index.h("input", { key: '5a22ee912aeb8a212820d8d3f7b41a6029bfa530', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), index.h("label", { key: '6c36dd15bc8fa1fcd1443cb01fe442644de8d87d', htmlFor: this.htmlid, class: {
                 [this.labelPosition]: true,
                 disabled: this.disabled,
-            } }, index.h("span", { key: '3d460ac03c1788fdf99f116e8792f2b0f95f1857' }, index.h("slot", { key: '0eb371292202e3eefd737ed79f3acefeda2fab91' })), index.h("span", { key: '5912b4da7abed8f994dd7224a09872d5c173160a', class: {
+            } }, index.h("span", { key: 'b9cbb73e0de30c219443c2430fb7cb09a03ffa32' }, index.h("slot", { key: '6b73da88f943d4c304ff3cd22c99145b2393541e' })), index.h("span", { key: 'd7ecff8d30e2f6a43c3f010c53a6fb5fd00f7a78', class: {
                 container: true,
                 disabled: this.disabled,
                 checked: this.checked,
-            } }, index.h("span", { key: '893ebce8124fdbcd00fbaf0976757a15b59a5b6e', class: "circle" }, this.checked && (index.h("z-icon", { key: 'f6d826da0f8c46f1e64fc0efa2a55fda64685f55', width: 12, height: 12, name: "checkmark" })))))));
+            } }, index.h("span", { key: '5d4c5aba273711d3f06b6622e119bd6e81137e3d', class: "circle" }, this.checked && (index.h("z-icon", { key: 'c6dfea8a74fc0ef446588ac7c36bf06e3549f814', width: 12, height: 12, name: "checkmark" })))))));
     }
 };
 ZToggleSwitch.style = stylesCss();

package/dist/cjs/z-tool.cjs.entry.js

@@ -189,10 +189,10 @@ const ZTool = class {
         (_a = this.mql) === null || _a === void 0 ? void 0 : _a.removeEventListener("change", this.onMobileViewChange);
     }
     render() {
-        return (index.h(index.Host, { key: '6d82ae454718b00d21e6193325bc223de3409f7a', class: { "z-tool-tooltip-open": this.tooltipOpen } }, index.h("button", { key: '79735e5831762281fef55e7033c6660a8b97de74', class: "z-tool", type: "button", ref: (el) => (this.buttonRef = el), "aria-pressed": this.hasSlottedContent ? undefined : this.active ? "true" : "false", "aria-expanded": this.hasSlottedContent ? (this.open ? "true" : "false") : undefined, "aria-haspopup": this.hasSlottedContent ? "true" : undefined, "aria-label": this.htmlAriaLabel || this.tooltip || undefined, disabled: this.disabled, onClick: this.handleClick, onMouseEnter: this.handleTooltipOpen, onMouseLeave: this.handleTooltipClose, onFocus: this.handleTooltipOpen, onBlur: this.handleTooltipClose }, index.h("z-icon", { key: '79be05619def07fd8a73812a8905f15f719fce83', ref: (el) => (this.iconRef = el), name: this.icon, indicatorColor: this.indicatorColor })), this.tooltip && (index.h("z-tooltip", { key: '9b5aa9d7f06b1ff6408f485c910a905c4c62d3e4', class: "z-tool-tooltip", ref: (el) => (this.tooltipRef = el), bindTo: this.iconRef, open: this.tooltipOpen && !this.open, position: this.isNested ? index$1.PopoverPosition.BOTTOM : this.tooltipPosition, dark: true, onMouseLeave: this.handleTooltipClose, onBlur: this.handleTooltipClose, onOpenChange: this.onTooltipOpenChange }, index.h("span", { key: '82c6f40fc3a4d4932ea9ef8e05f02c2c8d5eaddf', class: "body-4" }, this.tooltip))), this.hasSlottedContent && (index.h("z-popover", { key: '33dcbe345ca34c79720ed7a17eda2f5ab0561e90', class: "z-tool-submenu", open: this.open, bindTo: this.isMobile && this.mainToolbar ? this.mainToolbar : this.hostElement, center: true,
+        return (index.h(index.Host, { key: 'a48fb610a0a937e39e8c18d38bcb816796f5d6b4', class: { "z-tool-tooltip-open": this.tooltipOpen } }, index.h("button", { key: 'd5dbd5053a068c67ed97ddc5a7f63d093972b5cb', class: "z-tool", type: "button", ref: (el) => (this.buttonRef = el), "aria-pressed": this.hasSlottedContent ? undefined : this.active ? "true" : "false", "aria-expanded": this.hasSlottedContent ? (this.open ? "true" : "false") : undefined, "aria-haspopup": this.hasSlottedContent ? "true" : undefined, "aria-label": this.htmlAriaLabel || this.tooltip || undefined, disabled: this.disabled, onClick: this.handleClick, onMouseEnter: this.handleTooltipOpen, onMouseLeave: this.handleTooltipClose, onFocus: this.handleTooltipOpen, onBlur: this.handleTooltipClose }, index.h("z-icon", { key: '32fead7901041cc31e29ec21afdd4e23db4d3db8', ref: (el) => (this.iconRef = el), name: this.icon, indicatorColor: this.indicatorColor })), this.tooltip && (index.h("z-tooltip", { key: '5b50cd97749c97edd199be309bb0b5aadd59116b', class: "z-tool-tooltip", ref: (el) => (this.tooltipRef = el), bindTo: this.iconRef, open: this.tooltipOpen && !this.open, position: this.isNested ? index$1.PopoverPosition.BOTTOM : this.tooltipPosition, dark: true, onMouseLeave: this.handleTooltipClose, onBlur: this.handleTooltipClose, onOpenChange: this.onTooltipOpenChange }, index.h("span", { key: '768a80f59017ef7e459913f9c449673789b81c00', class: "body-4" }, this.tooltip))), this.hasSlottedContent && (index.h("z-popover", { key: 'f7a3ffa96e971fa793643944391e296ce7ce12b8', class: "z-tool-submenu", open: this.open, bindTo: this.isMobile && this.mainToolbar ? this.mainToolbar : this.hostElement, center: true,
             /* disable auto-close to prevent unwanted close behaviors on mobile,
             when the bound element is the main toolbar */
-            closable: false, position: this.isMobile ? index$1.PopoverPosition.TOP : index$1.PopoverPosition.BOTTOM }, index.h("slot", { key: '1a42cca4cd67850cff48043819e144fc2b6ea47e' })))));
+            closable: false, position: this.isMobile ? index$1.PopoverPosition.TOP : index$1.PopoverPosition.BOTTOM }, index.h("slot", { key: 'e4b9dd50dd26e958241db7df82ccd8a14c6a4c86' })))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/z-toolbar.cjs.entry.js

@@ -131,7 +131,7 @@ const ZToolbar = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'c4ccefdf38a239462ed209be1f5982fc4d805493', role: "toolbar", "aria-label": this.htmlAriaLabel }, index.h("slot", { key: '97f941c2bb8862f5bcb78bbad6fba1f729d497a5', onSlotchange: () => {
+        return (index.h(index.Host, { key: 'f4a79655dc3f8e4423b20683c6b3860e5007f0ee', role: "toolbar", "aria-label": this.htmlAriaLabel }, index.h("slot", { key: 'd044d14607037c8e6c9977faf383c16ee6bddb8a', onSlotchange: () => {
                 this.collectToolItems();
                 this.updateTabIndexes();
             } })));

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

@@ -28,7 +28,7 @@ const ZTooltip = class {
         this.open = this.popoverEl.open;
     }
     render() {
-        return (index.h("z-popover", { key: 'fc20f5c5d66fb5b9dabd41dfb986b28fbedfad9d', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true, onOpenChange: (event) => this.openChange.emit(event.detail) }, index.h("slot", { key: '5c5a2e8be7183824b50fa87d18b6f26e4bb2c0f7' })));
+        return (index.h("z-popover", { key: '09052c0c35b449590b0abfcd7e2816253814cc57', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true, onOpenChange: (event) => this.openChange.emit(event.detail) }, index.h("slot", { key: '1d4e6d0108724f8bc77bb6faf17b3938aa77d519' })));
     }
 };
 ZTooltip.style = stylesCss();

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

@@ -70,7 +70,7 @@ const ZTr = class {
         this.updateColumns();
     }
     render() {
-        return (index.h(index.Host, { key: '75b2709b15c266ccbdef64b1b610775271d8578e', role: "row", tabIndex: this.expandable ? 0 : undefined, expanded: this.expanded, onClick: this.onRowClick.bind(this), onKeyDown: this.onKeyDown.bind(this) }, index.h("div", { key: '5952a68ab36814d24e490cb183ed36ef476f3174', class: "z-tr--focus-overlay", "aria-hidden": "true" }), index.h("div", { key: '80c7b7130eb34822abbb6804d1d613f87bf0dc35', class: "z-tr--expand-button-container" }, this.expandable && (index.h("button", { key: '037ae6901e951599464a876b8c6f5c779f5f070e', tabIndex: -1, "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, index.h("z-icon", { key: 'bc0e8dc8b429911c1e958005c4447bad6d25a504', name: this.expanded ? "minus-circled" : "plus-circled" })))), index.h("slot", { key: '2f9a60636fa6f29279a82eb99ba3ed8034708db4', onSlotchange: this.updateColumns.bind(this) })));
+        return (index.h(index.Host, { key: '158f25d1746e340981e4facebe0f7dfd2106222a', role: "row", tabIndex: this.expandable ? 0 : undefined, expanded: this.expanded, onClick: this.onRowClick.bind(this), onKeyDown: this.onKeyDown.bind(this) }, index.h("div", { key: '140ddc0aac009e9e254b5ee281e292dc19326527', class: "z-tr--focus-overlay", "aria-hidden": "true" }), index.h("div", { key: '8e5b3d3e72cfe09c1ee4f54ffab8805e0e83021c', class: "z-tr--expand-button-container" }, this.expandable && (index.h("button", { key: 'bd724740ff19d508d33527dbc657b932f73f4421', tabIndex: -1, "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, index.h("z-icon", { key: 'd88a988e00c240b85806e9d0ea8d090cb404fab4', name: this.expanded ? "minus-circled" : "plus-circled" })))), index.h("slot", { key: '83cada789cfd416d9c2062ede5c10b49ac56ae56', onSlotchange: this.updateColumns.bind(this) })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/z-tr.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"z-tr.cjs.entry.js","mappings":"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","names":["stylesCss","randomId","h","Host"],"sources":["src/components/table/z-tr/styles.css?tag=z-tr&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-tr&encapsulation=shadow","src/components/table/z-tr/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: grid;\n  width: 100%;\n  box-sizing: border-box;\n  grid-auto-flow: column;\n  grid-template-columns: var(--z-table--expand-button-size, 0) repeat(var(--columns), minmax(128px, 1fr));\n\n  --columns: 1;\n}\n\n* {\n  box-sizing: border-box;\n}\n\n:host([expandable]) {\n  --show-expandable-button: visible;\n\n  cursor: pointer;\n}\n\n:host([expandable]) ::slotted(*) {\n  grid-row: 1;\n}\n\n:host([expandable]) ::slotted(:nth-last-child(2)) {\n  border-right: none;\n}\n\n:host([expandable]) ::slotted(*:last-child) {\n  border-top: var(--border-size-small) solid var(--color-surface03);\n  border-left: 0;\n  grid-column: 1 / span calc(var(--columns) + 1);\n  grid-row: 2;\n}\n\n:host([expandable]:not([expanded])) ::slotted(*:last-child) {\n  display: none;\n}\n\n:host([expanded]) {\n  margin-bottom: 4px; /* prevents shadow to be cut by the next element */\n  box-shadow: 0 4px 4px -2px var(--shadow-color-base);\n}\n\n:host([expanded]) .z-tr--expand-button-container,\n:host([expanded]) ::slotted(*) {\n  border-left: 0 !important;\n  background-color: var(--color-background);\n}\n\n:host([tabIndex]:hover) ::slotted(z-td),\n:host([tabIndex]:hover) ::slotted(z-th),\n:host([tabIndex]:hover) .z-tr--expand-button-container {\n  background-color: var(--color-surface02);\n}\n\n:host([tabIndex]:hover) .z-tr--focus-overlay {\n  border-top: var(--border-size-small) solid var(--color-surface04);\n  border-bottom: var(--border-size-small) solid var(--color-surface04);\n}\n\n:host(:focus) {\n  position: relative;\n  z-index: 20;\n  border: none !important;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-tr--expand-button-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--z-table--cells-background, var(--color-surface01));\n}\n\n.z-tr--expand-button-container button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  margin: auto;\n  appearance: none;\n  background: transparent;\n  cursor: pointer;\n  visibility: var(--show-expandable-button, hidden);\n}\n\n.z-tr--expand-button-container button z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n.z-tr--focus-overlay {\n  position: absolute;\n  z-index: 30;\n  top: calc(var(--border-size-small) * -1);\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: calc(100% + (var(--border-size-small) * 2));\n  box-shadow: none;\n  outline: none;\n  pointer-events: none;\n  transition: box-shadow 0.2s;\n}\n\n:host(:focus) .z-tr--focus-overlay {\n  box-shadow:\n    0 0 0 2px var(--shadow-focus-primary),\n    var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host(:focus) ::slotted(*) {\n  border-bottom: none;\n}\n\n:host(:focus) .z-tr--expand-button-container {\n  border-bottom: none;\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {randomId} from \"../../../utils/utils\";\nimport \"../cells/z-td/index\";\nimport \"../cells/z-th/index\";\n\n/**\n * ZTr component.\n * When the row is `expandable`, you can set the `prevent-expand` css class on an interactive element inside the row\n * to prevent the row from expanding.\n * @slot - ZTr content (`z-td` or `z-th`).\n */\n@Component({\n  tag: \"z-tr\",\n  styleUrls: [\"styles.css\", \"../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTr implements ComponentInterface {\n  @Element() host: HTMLZTrElement;\n\n  /**\n   * Whether the row is expandable.\n   * Use a `z-td` as the last cell of the row for the additional content.\n   * It will show a button to expand/collapse the row.\n   * The last cell will be hidden until the button or row is clicked.\n   *\n   * If some element inside the expandable row contains the `prevent-expand` css class,\n   * the row will not expand by clicking that element.\n   */\n  @Prop({reflect: true})\n  expandable = false;\n\n  /**\n   * Whether the row is currently expanded.\n   */\n  @State()\n  expanded = false;\n\n  /**\n   * HTML Id of the expandable content.\n   * It is used to link the button to the content through the `aria-controls` attribute.\n   */\n  @State()\n  expandableContentId: string;\n\n  /** Row has been expanded */\n  @Event()\n  expand: EventEmitter;\n\n  @Watch(\"expandable\")\n  @Listen(\"colspanchange\")\n  protected updateColumns(): void {\n    const cells = Array.from(this.host.querySelectorAll<HTMLZTdElement | HTMLZThElement>(\"z-td, z-th\"));\n\n    if (this.expandable) {\n      const expandableContent = cells.pop();\n      expandableContent.id = expandableContent.id || `z-tr-expandable-content-${randomId()}`;\n      this.expandableContentId = expandableContent.id;\n    }\n\n    const columns = cells.map((cell) => cell.colspan || 1).reduce((a, b) => a + b, 0);\n    this.host.style.setProperty(\"--columns\", `${columns}`);\n  }\n\n  /**\n   * Handle click on row.\n   * Skip expansion if the click is on a element with `prevent-expand` css class.\n   */\n  private onRowClick(event: MouseEvent): void {\n    const preventExpand = (event.target as HTMLElement).closest(\".prevent-expand\");\n    if (!this.expandable || preventExpand) {\n      return;\n    }\n\n    this.expanded = !this.expanded;\n    this.expand.emit({expanded: this.expanded});\n  }\n\n  private onKeyDown(event: KeyboardEvent): void {\n    if (!this.expandable) {\n      return;\n    }\n\n    const active = document.activeElement;\n    if (active !== this.host) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      this.expanded = !this.expanded;\n      this.expand.emit({expanded: this.expanded});\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColumns();\n  }\n\n  render(): HTMLZTrElement {\n    return (\n      <Host\n        role=\"row\"\n        tabIndex={this.expandable ? 0 : undefined}\n        expanded={this.expanded}\n        onClick={this.onRowClick.bind(this)}\n        onKeyDown={this.onKeyDown.bind(this)}\n      >\n        <div\n          class=\"z-tr--focus-overlay\"\n          aria-hidden=\"true\"\n        ></div>\n        <div class=\"z-tr--expand-button-container\">\n          {this.expandable && (\n            <button\n              tabIndex={-1}\n              aria-expanded={this.expanded ? \"true\" : \"false\"}\n              aria-label={this.expanded ? \"Comprimi riga\" : \"Espandi riga\"}\n              aria-controls={this.expandableContentId}\n              type=\"button\"\n            >\n              <z-icon name={this.expanded ? \"minus-circled\" : \"plus-circled\"}></z-icon>\n            </button>\n          )}\n        </div>\n        <slot onSlotchange={this.updateColumns.bind(this)}></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-tr.cjs.entry.js","mappings":"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","names":["stylesCss","randomId","h","Host"],"sources":["src/components/deprecated/table/z-tr/styles.css?tag=z-tr&encapsulation=shadow","src/components/css-components/z-table/styles.css?tag=z-tr&encapsulation=shadow","src/components/deprecated/table/z-tr/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: grid;\n  width: 100%;\n  box-sizing: border-box;\n  grid-auto-flow: column;\n  grid-template-columns: var(--z-table--expand-button-size, 0) repeat(var(--columns), minmax(128px, 1fr));\n\n  --columns: 1;\n}\n\n* {\n  box-sizing: border-box;\n}\n\n:host([expandable]) {\n  --show-expandable-button: visible;\n\n  cursor: pointer;\n}\n\n:host([expandable]) ::slotted(*) {\n  grid-row: 1;\n}\n\n:host([expandable]) ::slotted(:nth-last-child(2)) {\n  border-right: none;\n}\n\n:host([expandable]) ::slotted(*:last-child) {\n  border-top: var(--border-size-small) solid var(--color-surface03);\n  border-left: 0;\n  grid-column: 1 / span calc(var(--columns) + 1);\n  grid-row: 2;\n}\n\n:host([expandable]:not([expanded])) ::slotted(*:last-child) {\n  display: none;\n}\n\n:host([expanded]) {\n  margin-bottom: 4px; /* prevents shadow to be cut by the next element */\n  box-shadow: 0 4px 4px -2px var(--shadow-color-base);\n}\n\n:host([expanded]) .z-tr--expand-button-container,\n:host([expanded]) ::slotted(*) {\n  border-left: 0 !important;\n  background-color: var(--color-background);\n}\n\n:host([tabIndex]:hover) ::slotted(z-td),\n:host([tabIndex]:hover) ::slotted(z-th),\n:host([tabIndex]:hover) .z-tr--expand-button-container {\n  background-color: var(--color-surface02);\n}\n\n:host([tabIndex]:hover) .z-tr--focus-overlay {\n  border-top: var(--border-size-small) solid var(--color-surface04);\n  border-bottom: var(--border-size-small) solid var(--color-surface04);\n}\n\n:host(:focus) {\n  position: relative;\n  z-index: 20;\n  border: none !important;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-tr--expand-button-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--z-table--cells-background, var(--color-surface01));\n}\n\n.z-tr--expand-button-container button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  margin: auto;\n  appearance: none;\n  background: transparent;\n  cursor: pointer;\n  visibility: var(--show-expandable-button, hidden);\n}\n\n.z-tr--expand-button-container button z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n.z-tr--focus-overlay {\n  position: absolute;\n  z-index: 30;\n  top: calc(var(--border-size-small) * -1);\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: calc(100% + (var(--border-size-small) * 2));\n  box-shadow: none;\n  outline: none;\n  pointer-events: none;\n  transition: box-shadow 0.2s;\n}\n\n:host(:focus) .z-tr--focus-overlay {\n  box-shadow:\n    0 0 0 2px var(--shadow-focus-primary),\n    var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host(:focus) ::slotted(*) {\n  border-bottom: none;\n}\n\n:host(:focus) .z-tr--expand-button-container {\n  border-bottom: none;\n}\n","z-table,\ntable.z-table {\n  background-color: var(--color-surface01);\n\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n}\n\ntable.z-table {\n  border-collapse: collapse;\n}\n\nz-thead,\ntable.z-table thead {\n  background-color: var(--color-background);\n\n  --z-table--cells-bottom-border-size: var(--border-size-medium);\n}\n\nz-tfoot,\ntable.z-table tfoot {\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\nz-tfoot z-tr,\ntable.z-table tfoot tr {\n  border-bottom: calc(var(--z-table--cells-bottom-border-size)) solid var(--color-surface03) !important;\n}\n\nz-tr,\ntable.z-table tr {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\nz-td,\nz-th,\ntable.z-table td,\ntable.z-table th {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n  text-align: left;\n}\n\nz-th:not(:first-child),\nz-td:not(:first-child),\ntable.z-table th:not(:first-child),\ntable.z-table td:not(:first-child) {\n  border-left: var(--z-table--cell-left-border, none);\n}\n\nz-table[bordered],\ntable.z-table.z-table-bordered {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\ntable.z-table-hover > tbody > tr:hover > td,\ntable.z-table-hover > tfoot > tr:hover > td {\n  position: relative;\n  background-color: var(--color-surface02);\n}\n\ntable.z-table-hover > tbody > tr:hover > td::after,\ntable.z-table-hover > tfoot > tr:hover > td::after {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: -1px;\n  box-shadow:\n    inset 0 var(--border-size-small) 0 var(--color-surface04),\n    inset 0 calc(var(--border-size-small) * -1) 0 var(--color-surface04);\n  content: \"\";\n}\n\ntable.z-table-hover > tbody > tr:hover > td:first-child::after,\ntable.z-table-hover > thead > tr:hover > th:first-child::after,\ntable.z-table-hover > tfoot > tr:hover > td:first-child::after {\n  left: 0;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {randomId} from \"../../../../utils/utils\";\nimport \"../cells/z-td/index\";\nimport \"../cells/z-th/index\";\n\n/**\n * ZTr component.\n * When the row is `expandable`, you can set the `prevent-expand` css class on an interactive element inside the row\n * to prevent the row from expanding.\n * @slot - ZTr content (`z-td` or `z-th`).\n */\n@Component({\n  tag: \"z-tr\",\n  styleUrls: [\"styles.css\", \"../../../css-components/z-table/styles.css\"],\n  shadow: true,\n})\nexport class ZTr implements ComponentInterface {\n  @Element() host: HTMLZTrElement;\n\n  /**\n   * Whether the row is expandable.\n   * Use a `z-td` as the last cell of the row for the additional content.\n   * It will show a button to expand/collapse the row.\n   * The last cell will be hidden until the button or row is clicked.\n   *\n   * If some element inside the expandable row contains the `prevent-expand` css class,\n   * the row will not expand by clicking that element.\n   */\n  @Prop({reflect: true})\n  expandable = false;\n\n  /**\n   * Whether the row is currently expanded.\n   */\n  @State()\n  expanded = false;\n\n  /**\n   * HTML Id of the expandable content.\n   * It is used to link the button to the content through the `aria-controls` attribute.\n   */\n  @State()\n  expandableContentId: string;\n\n  /** Row has been expanded */\n  @Event()\n  expand: EventEmitter;\n\n  @Watch(\"expandable\")\n  @Listen(\"colspanchange\")\n  protected updateColumns(): void {\n    const cells = Array.from(this.host.querySelectorAll<HTMLZTdElement | HTMLZThElement>(\"z-td, z-th\"));\n\n    if (this.expandable) {\n      const expandableContent = cells.pop();\n      expandableContent.id = expandableContent.id || `z-tr-expandable-content-${randomId()}`;\n      this.expandableContentId = expandableContent.id;\n    }\n\n    const columns = cells.map((cell) => cell.colspan || 1).reduce((a, b) => a + b, 0);\n    this.host.style.setProperty(\"--columns\", `${columns}`);\n  }\n\n  /**\n   * Handle click on row.\n   * Skip expansion if the click is on a element with `prevent-expand` css class.\n   */\n  private onRowClick(event: MouseEvent): void {\n    const preventExpand = (event.target as HTMLElement).closest(\".prevent-expand\");\n    if (!this.expandable || preventExpand) {\n      return;\n    }\n\n    this.expanded = !this.expanded;\n    this.expand.emit({expanded: this.expanded});\n  }\n\n  private onKeyDown(event: KeyboardEvent): void {\n    if (!this.expandable) {\n      return;\n    }\n\n    const active = document.activeElement;\n    if (active !== this.host) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      this.expanded = !this.expanded;\n      this.expand.emit({expanded: this.expanded});\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColumns();\n  }\n\n  render(): HTMLZTrElement {\n    return (\n      <Host\n        role=\"row\"\n        tabIndex={this.expandable ? 0 : undefined}\n        expanded={this.expanded}\n        onClick={this.onRowClick.bind(this)}\n        onKeyDown={this.onKeyDown.bind(this)}\n      >\n        <div\n          class=\"z-tr--focus-overlay\"\n          aria-hidden=\"true\"\n        ></div>\n        <div class=\"z-tr--expand-button-container\">\n          {this.expandable && (\n            <button\n              tabIndex={-1}\n              aria-expanded={this.expanded ? \"true\" : \"false\"}\n              aria-label={this.expanded ? \"Comprimi riga\" : \"Espandi riga\"}\n              aria-controls={this.expandableContentId}\n              type=\"button\"\n            >\n              <z-icon name={this.expanded ? \"minus-circled\" : \"plus-circled\"}></z-icon>\n            </button>\n          )}\n        </div>\n        <slot onSlotchange={this.updateColumns.bind(this)}></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/z-tree-list.cjs.entry.js

@@ -100,7 +100,7 @@ const ZTreeList = class {
     }
     render() {
         const hasClickableItems = this.parsedItems.some((item) => !!item.url);
-        return (index.h(index.Host, { key: '266f20dbd53ba5e756e0fec544179e6bb319bd18', class: "tree-list", role: hasClickableItems ? "navigation" : "none", "aria-hidden": hasClickableItems ? undefined : "true", "aria-labelledby": this.htmlAriaLabelledby }, index.h("div", { key: '349d5a894c529036329f17c79b319e64e2c86731', tabIndex: -1, role: hasClickableItems ? "tree" : "none", "aria-hidden": hasClickableItems ? undefined : "true", "aria-label": this.htmlSectionTitle }, this.parsedItems.map((item, key) => this.renderTreeList(item, `${key}`)))));
+        return (index.h(index.Host, { key: 'd4f93f20f84ac193c4b291b0cc16d4a0e6838d49', class: "tree-list", role: hasClickableItems ? "navigation" : "none", "aria-hidden": hasClickableItems ? undefined : "true", "aria-labelledby": this.htmlAriaLabelledby }, index.h("div", { key: '4d0f11bb82855843beabb2eb0ddaa30ca39d8524', tabIndex: -1, role: hasClickableItems ? "tree" : "none", "aria-hidden": hasClickableItems ? undefined : "true", "aria-label": this.htmlSectionTitle }, this.parsedItems.map((item, key) => this.renderTreeList(item, `${key}`)))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -9,7 +9,7 @@ const ZVisuallyHidden = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return index.h("slot", { key: '7223868f33657302203a2a24df8b3250d81c42cc' });
+        return index.h("slot", { key: '3378671bfdbab0bf278c0e8aeb3f8ea9bd555422' });
     }
 };
 ZVisuallyHidden.style = stylesCss();

package/dist/collection/collection-manifest.json

@@ -5,19 +5,19 @@
     "components/book-card/z-book-card-app/index.js",
     "components/date-picker/z-date-picker/index.js",
     "components/date-picker/z-range-picker/index.js",
+    "components/deprecated/table/cells/z-td/index.js",
+    "components/deprecated/table/cells/z-th/index.js",
+    "components/deprecated/table/z-tbody/index.js",
+    "components/deprecated/table/z-tfoot/index.js",
+    "components/deprecated/table/z-thead/index.js",
+    "components/deprecated/table/z-tr/index.js",
+    "components/deprecated/table/z-table/index.js",
     "components/file-upload/z-dragdrop-area/index.js",
     "components/file-upload/z-file/index.js",
     "components/list/z-list-element/index.js",
     "components/list/z-list/index.js",
     "components/list/z-list-group/index.js",
     "components/list/z-tree-list/index.js",
-    "components/table/cells/z-td/index.js",
-    "components/table/cells/z-th/index.js",
-    "components/table/z-tbody/index.js",
-    "components/table/z-tfoot/index.js",
-    "components/table/z-thead/index.js",
-    "components/table/z-tr/index.js",
-    "components/table/z-table/index.js",
     "components/z-accordion/index.js",
     "components/z-anchor-navigation/index.js",
     "components/z-app-header/index.js",

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

@@ -16,7 +16,11 @@ export class ZBookCard {
         this.isbnLabel = "";
         /** [optional] Value for the `target` attribute of the links created by `ebookUrl` prop. */
         this.linkTarget = "_blank";
-        /** Whether to show a stack of covers to represent multiple books (only for `portrait` variant). */
+        /**
+         * Whether to show a stack of covers to represent multiple books.
+         * Only takes effect when `variant` is `portrait`: in `landscape` it is silently ignored and no
+         * cover stack is rendered, regardless of its value.
+         */
         this.hasMultipleCovers = false;
     }
     emitEbookClick() {
@@ -71,13 +75,16 @@ export class ZBookCard {
         return (h("div", { class: "isbn ellipsis body-4-sb", "aria-description": `isbn ${this.isbnLabel}` }, this.isbn, " ", this.isbnLabel ? h("span", { class: "body-4" }, this.isbnLabel) : null));
     }
     renderEbook() {
+        if (!this.ebookUrl) {
+            return null;
+        }
         return (h("div", { class: "ebook" }, h("div", { class: "app-name" }, h("img", { class: "ebook-logo", "aria-hidden": "true" }), h("div", { class: "body-4-sb" }, "laZ Ebook")), h("z-button", { size: ControlSize.X_SMALL, href: this.ebookUrl, target: this.linkTarget, onClick: () => this.emitEbookClick(), htmlRole: "link", "aria-description": `leggi l'ebook ${this.operaTitle} su laZ Ebook` }, "leggi ebook")));
     }
     renderCtaSlot() {
         return h("slot", { name: "cta" });
     }
     render() {
-        return (h(Host, { key: '51452a17d92d9cf92a12134fff963165748519e3' }, h("div", { key: 'f5ac7d525b4b25fda20b1772d5508d8e2e528cfd', class: "main-content" }, this.renderCover(), h("div", { key: 'ea9ef02b1f7acc53a442d5aa03e320a92fe4b57d', class: "card-info" }, h("div", { key: '194da8efc4f1f3e9e3a1549a86be1474f68873da', class: "top" }, h("div", { key: '522ae3f38eba5d95f1e8fc1239ec59fe7df32935' }, this.renderYear(), this.renderAuthors(), this.renderOperaTitle(), this.renderVolumeTitle(), this.renderIsbn()), h("slot", { key: '62869a3e3965c0f7611cc93e16c8c660b369ca17', name: "tags" }), h("slot", { key: '15c733e6644af2de263b0184f4c395ce967d773b', name: "data" })), h("slot", { key: 'eab8052dc791068b689e5d3cb95c0031fac19a9e', name: "ebook" }, !!this.ebookUrl && h("div", { key: '688bf22e1da5a8cd330aaccdb8d4fb7974f368bb', class: "bottom" }, this.renderEbook())))), h("slot", { key: '50d18fb8b88035ecb1d896eb199e7907c08872f1', name: "apps" })));
+        return (h(Host, { key: '5573698f16b8cbaa66e384f15295d3cf002691ad' }, h("div", { key: '9a4feacc4096179f39a28ba9ceeae0b8b70abfd9', class: "main-content" }, this.renderCover(), h("div", { key: '4a1717324377feae50f008f9d3e223a52924b0c2', class: "card-info" }, h("div", { key: '9fad9cdd4bca79ba03391cde396f3a9d635b65cc', class: "top" }, h("div", { key: 'dc4a9d24505230b467a4ffac482d118ec2e796e2' }, this.renderYear(), this.renderAuthors(), this.renderOperaTitle(), this.renderVolumeTitle(), this.renderIsbn()), h("slot", { key: 'd94d220dc51d3b89b3284f8f100d6fd32d82a7b6', name: "tags" }), h("slot", { key: '5b7f9e2e1aadb10dbc97b16aa2dd4501b1007e16', name: "data" })), h("slot", { key: 'a5619600c90bfb3fba040674a280ec4f5395437a', name: "ebook" }, this.renderEbook()))), h("slot", { key: '9a70dad88fa621eec9b3902f5893cdc0ac8fcd1a', name: "apps" })));
     }
     static get is() { return "z-book-card"; }
     static get encapsulation() { return "shadow"; }
@@ -324,7 +331,7 @@ export class ZBookCard {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Whether to show a stack of covers to represent multiple books (only for `portrait` variant)."
+                    "text": "Whether to show a stack of covers to represent multiple books.\nOnly takes effect when `variant` is `portrait`: in `landscape` it is silently ignored and no\ncover stack is rendered, regardless of its value."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/book-card/z-book-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/**\n * @slot cta - Top right cta (e.g. bookmark icon)\n * @slot ebook - As default, it shows laZ ebook link\n * @slot tags - Tags section, default empty\n * @slot data - External link and pill, default empty\n * @slot apps - List of card-related apps, default empty\n * @slot coverOverlay - Content to be displayed in the `z-book-cover` component slot\n */\n@Component({\n  tag: \"z-book-card\",\n  styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n  shadow: true,\n})\nexport class ZBookCard implements ComponentInterface {\n  @Element() hostElement: HTMLZBookCardElement;\n\n  /** Card variant: landscape, portrait */\n  @Prop({reflect: true})\n  variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n  /** Cover URL */\n  @Prop()\n  cover: string;\n\n  /** Opera title (card title) */\n  @Prop()\n  operaTitle: string;\n\n  /** [optional] Volume title (card subvolume) */\n  @Prop()\n  volumeTitle?: string;\n\n  /** [optional] Authors */\n  @Prop()\n  authors?: string;\n\n  /** [optional] Main ISBN */\n  @Prop()\n  isbn?: string;\n\n  /** [optional] ISBN label */\n  @Prop()\n  isbnLabel = \"\";\n\n  /** [optional] year */\n  @Prop()\n  year?: string;\n\n  /** [optional] Link to the ebook resource. Creates a link also around the cover and title. */\n  @Prop()\n  ebookUrl?: string;\n\n  /** [optional] Value for the `target` attribute of the links created by `ebookUrl` prop. */\n  @Prop()\n  linkTarget = \"_blank\";\n\n  /** [optional] Fallback cover URL. */\n  @Prop()\n  fallbackCover?: string;\n\n  /** Whether to show a stack of covers to represent multiple books (only for `portrait` variant). */\n  @Prop()\n  hasMultipleCovers = false;\n\n  /** [optional] Set a specific heading level as html tag for the title. */\n  @Prop()\n  titleHtmlTag?: string;\n\n  /** click on ebook link */\n  @Event()\n  ebookClick: EventEmitter;\n\n  /** click on cover link */\n  @Event()\n  coverClick: EventEmitter;\n\n  /** click on title link */\n  @Event()\n  titleClick: EventEmitter;\n\n  private emitEbookClick(): void {\n    this.ebookClick.emit();\n  }\n\n  private emitCoverClick(): void {\n    this.coverClick.emit();\n  }\n\n  private emitTitleClick(): void {\n    this.titleClick.emit();\n  }\n\n  private renderCover(): HTMLDivElement {\n    const CoverTag = this.ebookUrl ? \"a\" : \"div\";\n    const coverAttrs = this.ebookUrl\n      ? {\n          href: this.ebookUrl,\n          onClick: () => this.emitCoverClick(),\n          target: this.linkTarget,\n        }\n      : {};\n\n    return (\n      <CoverTag\n        class=\"cover\"\n        {...coverAttrs}\n      >\n        <z-book-cover\n          cover={this.cover}\n          fallbackCover={this.fallbackCover}\n          multiple={this.hasMultipleCovers && this.variant === BookCardVariant.PORTRAIT}\n        >\n          <slot\n            name=\"coverOverlay\"\n            slot=\"coverOverlay\"\n          ></slot>\n        </z-book-cover>\n      </CoverTag>\n    );\n  }\n\n  private renderYear(): null | HTMLDivElement {\n    if (!this.year) {\n      return null;\n    }\n\n    return (\n      <div\n        class=\"year ellipsis body-4\"\n        aria-description=\"anno\"\n      >\n        {this.year}\n      </div>\n    );\n  }\n\n  private renderAuthors(): null | HTMLDivElement {\n    if (!this.authors) {\n      return null;\n    }\n\n    return (\n      <div class=\"cta-wrapper\">\n        <div\n          class=\"authors ellipsis body-4\"\n          aria-description=\"autori\"\n        >\n          {this.authors}\n        </div>\n        {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n      </div>\n    );\n  }\n\n  private renderOperaTitle(): HTMLDivElement {\n    const title = this.titleHtmlTag\n      ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n      : this.operaTitle;\n\n    const operaTitle = (\n      <div\n        class=\"opera-title ellipsis body-2-sb\"\n        innerHTML={title}\n      />\n    );\n\n    return (\n      <div class=\"cta-wrapper\">\n        {this.ebookUrl ? (\n          <a\n            class=\"z-link\"\n            href={this.ebookUrl}\n            onClick={() => this.emitTitleClick()}\n            target={this.linkTarget}\n          >\n            {operaTitle}\n          </a>\n        ) : (\n          operaTitle\n        )}\n        {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n      </div>\n    );\n  }\n\n  private renderVolumeTitle(): null | HTMLDivElement {\n    if (!this.volumeTitle) {\n      return null;\n    }\n\n    return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n  }\n\n  private renderIsbn(): null | HTMLDivElement {\n    if (!this.isbn) {\n      return null;\n    }\n\n    return (\n      <div\n        class=\"isbn ellipsis body-4-sb\"\n        aria-description={`isbn ${this.isbnLabel}`}\n      >\n        {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n      </div>\n    );\n  }\n\n  private renderEbook(): HTMLDivElement {\n    return (\n      <div class=\"ebook\">\n        <div class=\"app-name\">\n          <img\n            class=\"ebook-logo\"\n            aria-hidden=\"true\"\n          />\n          <div class=\"body-4-sb\">laZ Ebook</div>\n        </div>\n        <z-button\n          size={ControlSize.X_SMALL}\n          href={this.ebookUrl}\n          target={this.linkTarget}\n          onClick={() => this.emitEbookClick()}\n          htmlRole=\"link\"\n          aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n        >\n          leggi ebook\n        </z-button>\n      </div>\n    );\n  }\n\n  private renderCtaSlot(): HTMLSlotElement {\n    return <slot name=\"cta\"></slot>;\n  }\n\n  render(): HTMLZBookCardElement {\n    return (\n      <Host>\n        <div class=\"main-content\">\n          {this.renderCover()}\n          <div class=\"card-info\">\n            <div class=\"top\">\n              <div>\n                {this.renderYear()}\n                {this.renderAuthors()}\n                {this.renderOperaTitle()}\n                {this.renderVolumeTitle()}\n                {this.renderIsbn()}\n              </div>\n              <slot name=\"tags\"></slot>\n              <slot name=\"data\"></slot>\n            </div>\n            <slot name=\"ebook\">{!!this.ebookUrl && <div class=\"bottom\">{this.renderEbook()}</div>}</slot>\n          </div>\n        </div>\n        <slot name=\"apps\"></slot>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/book-card/z-book-card/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/**\n * @slot cta - Top right cta (e.g. bookmark icon)\n * @slot ebook - As default, it shows laZ ebook link\n * @slot tags - Tags section, default empty\n * @slot data - External link and pill, default empty\n * @slot apps - List of card-related apps, default empty\n * @slot coverOverlay - Content to be displayed in the `z-book-cover` component slot\n */\n@Component({\n  tag: \"z-book-card\",\n  styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n  shadow: true,\n})\nexport class ZBookCard implements ComponentInterface {\n  @Element() hostElement: HTMLZBookCardElement;\n\n  /** Card variant: landscape, portrait */\n  @Prop({reflect: true})\n  variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n  /** Cover URL */\n  @Prop()\n  cover: string;\n\n  /** Opera title (card title) */\n  @Prop()\n  operaTitle: string;\n\n  /** [optional] Volume title (card subvolume) */\n  @Prop()\n  volumeTitle?: string;\n\n  /** [optional] Authors */\n  @Prop()\n  authors?: string;\n\n  /** [optional] Main ISBN */\n  @Prop()\n  isbn?: string;\n\n  /** [optional] ISBN label */\n  @Prop()\n  isbnLabel = \"\";\n\n  /** [optional] year */\n  @Prop()\n  year?: string;\n\n  /** [optional] Link to the ebook resource. Creates a link also around the cover and title. */\n  @Prop()\n  ebookUrl?: string;\n\n  /** [optional] Value for the `target` attribute of the links created by `ebookUrl` prop. */\n  @Prop()\n  linkTarget = \"_blank\";\n\n  /** [optional] Fallback cover URL. */\n  @Prop()\n  fallbackCover?: string;\n\n  /**\n   * Whether to show a stack of covers to represent multiple books.\n   * Only takes effect when `variant` is `portrait`: in `landscape` it is silently ignored and no\n   * cover stack is rendered, regardless of its value.\n   */\n  @Prop()\n  hasMultipleCovers = false;\n\n  /** [optional] Set a specific heading level as html tag for the title. */\n  @Prop()\n  titleHtmlTag?: string;\n\n  /** click on ebook link */\n  @Event()\n  ebookClick: EventEmitter;\n\n  /** click on cover link */\n  @Event()\n  coverClick: EventEmitter;\n\n  /** click on title link */\n  @Event()\n  titleClick: EventEmitter;\n\n  private emitEbookClick(): void {\n    this.ebookClick.emit();\n  }\n\n  private emitCoverClick(): void {\n    this.coverClick.emit();\n  }\n\n  private emitTitleClick(): void {\n    this.titleClick.emit();\n  }\n\n  private renderCover(): HTMLDivElement {\n    const CoverTag = this.ebookUrl ? \"a\" : \"div\";\n    const coverAttrs = this.ebookUrl\n      ? {\n          href: this.ebookUrl,\n          onClick: () => this.emitCoverClick(),\n          target: this.linkTarget,\n        }\n      : {};\n\n    return (\n      <CoverTag\n        class=\"cover\"\n        {...coverAttrs}\n      >\n        <z-book-cover\n          cover={this.cover}\n          fallbackCover={this.fallbackCover}\n          multiple={this.hasMultipleCovers && this.variant === BookCardVariant.PORTRAIT}\n        >\n          <slot\n            name=\"coverOverlay\"\n            slot=\"coverOverlay\"\n          ></slot>\n        </z-book-cover>\n      </CoverTag>\n    );\n  }\n\n  private renderYear(): null | HTMLDivElement {\n    if (!this.year) {\n      return null;\n    }\n\n    return (\n      <div\n        class=\"year ellipsis body-4\"\n        aria-description=\"anno\"\n      >\n        {this.year}\n      </div>\n    );\n  }\n\n  private renderAuthors(): null | HTMLDivElement {\n    if (!this.authors) {\n      return null;\n    }\n\n    return (\n      <div class=\"cta-wrapper\">\n        <div\n          class=\"authors ellipsis body-4\"\n          aria-description=\"autori\"\n        >\n          {this.authors}\n        </div>\n        {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n      </div>\n    );\n  }\n\n  private renderOperaTitle(): HTMLDivElement {\n    const title = this.titleHtmlTag\n      ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n      : this.operaTitle;\n\n    const operaTitle = (\n      <div\n        class=\"opera-title ellipsis body-2-sb\"\n        innerHTML={title}\n      />\n    );\n\n    return (\n      <div class=\"cta-wrapper\">\n        {this.ebookUrl ? (\n          <a\n            class=\"z-link\"\n            href={this.ebookUrl}\n            onClick={() => this.emitTitleClick()}\n            target={this.linkTarget}\n          >\n            {operaTitle}\n          </a>\n        ) : (\n          operaTitle\n        )}\n        {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n      </div>\n    );\n  }\n\n  private renderVolumeTitle(): null | HTMLDivElement {\n    if (!this.volumeTitle) {\n      return null;\n    }\n\n    return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n  }\n\n  private renderIsbn(): null | HTMLDivElement {\n    if (!this.isbn) {\n      return null;\n    }\n\n    return (\n      <div\n        class=\"isbn ellipsis body-4-sb\"\n        aria-description={`isbn ${this.isbnLabel}`}\n      >\n        {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n      </div>\n    );\n  }\n\n  private renderEbook(): null | HTMLDivElement {\n    if (!this.ebookUrl) {\n      return null;\n    }\n\n    return (\n      <div class=\"ebook\">\n        <div class=\"app-name\">\n          <img\n            class=\"ebook-logo\"\n            aria-hidden=\"true\"\n          />\n          <div class=\"body-4-sb\">laZ Ebook</div>\n        </div>\n        <z-button\n          size={ControlSize.X_SMALL}\n          href={this.ebookUrl}\n          target={this.linkTarget}\n          onClick={() => this.emitEbookClick()}\n          htmlRole=\"link\"\n          aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n        >\n          leggi ebook\n        </z-button>\n      </div>\n    );\n  }\n\n  private renderCtaSlot(): HTMLSlotElement {\n    return <slot name=\"cta\"></slot>;\n  }\n\n  render(): HTMLZBookCardElement {\n    return (\n      <Host>\n        <div class=\"main-content\">\n          {this.renderCover()}\n          <div class=\"card-info\">\n            <div class=\"top\">\n              <div>\n                {this.renderYear()}\n                {this.renderAuthors()}\n                {this.renderOperaTitle()}\n                {this.renderVolumeTitle()}\n                {this.renderIsbn()}\n              </div>\n              <slot name=\"tags\"></slot>\n              <slot name=\"data\"></slot>\n            </div>\n            <slot name=\"ebook\">{this.renderEbook()}</slot>\n          </div>\n        </div>\n        <slot name=\"apps\"></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/book-card/z-book-card/styles.css

@@ -137,26 +137,22 @@
   justify-content: space-between;
 }
 
-.main-content .card-info .bottom .ebook {
+.main-content .card-info .ebook {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
-  padding: var(--space-unit);
-  background-color: var(--color-primary02);
-  border-radius: var(--border-radius);
   gap: var(--space-unit);
 }
 
-.main-content .card-info .bottom .ebook .app-name {
+.main-content .card-info .ebook .app-name {
   display: flex;
   align-items: center;
-  padding: calc(var(--space-unit) / 2) 0;
   font-family: var(--font-family-serif);
   gap: calc(var(--space-unit) / 2);
 }
 
-.main-content .card-info .bottom .ebook .app-name .ebook-logo {
+.main-content .card-info .ebook .app-name .ebook-logo {
   width: 1.5rem;
   height: 1.5rem;
   content: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22 fill=%22none%22 aria-hidden=%22true%22%3E%3Cg clip-path=%22url(%23clip0_11996_224)%22%3E%3Cpath d=%22M14.6644 0.469604H5.00141C2.33305 0.469604 0.169922 2.63274 0.169922 5.3011V14.9641C0.169922 17.6324 2.33305 19.7956 5.00141 19.7956H14.6644C17.3328 19.7956 19.4959 17.6324 19.4959 14.9641V5.3011C19.4959 2.63274 17.3328 0.469604 14.6644 0.469604Z%22 fill=%22%23E2011A%22/%3E%3Cpath d=%22M15.9523 13.3536H12.7313C11.6861 13.3536 10.6683 13.6934 9.83241 14.3199C8.99657 13.6934 7.97873 13.3536 6.93352 13.3536H3.71252V5.30115H6.93352C7.97873 5.30115 8.99657 5.64096 9.83241 6.26745C10.6683 5.64096 11.6861 5.30115 12.7313 5.30115H15.9523V13.3536Z%22 fill=%22white%22/%3E%3Cpath d=%22M15.9523 14.3201H3.71252V14.9643H15.9523V14.3201Z%22 fill=%22black%22/%3E%3Cpath d=%22M8.22229 10.732V8.24543C8.22229 7.97165 8.51057 7.79449 8.75375 7.91689L11.2404 9.16019C11.5109 9.29548 11.5109 9.682 11.2404 9.81728L8.75375 11.0606C8.50896 11.183 8.22229 11.0058 8.22229 10.732Z%22 fill=%22black%22/%3E%3Cpath d=%22M4.35704 7.87826C5.42438 7.87826 6.28963 7.013 6.28963 5.94566C6.28963 4.87831 5.42438 4.01306 4.35704 4.01306C3.28969 4.01306 2.42444 4.87831 2.42444 5.94566C2.42444 7.013 3.28969 7.87826 4.35704 7.87826Z%22 fill=%22black%22/%3E%3Cpath d=%22M5.6454 5.62354H3.0686V6.26773H5.6454V5.62354Z%22 fill=%22white%22/%3E%3Cpath d=%22M4.67917 4.65723H4.03497V7.23402H4.67917V4.65723Z%22 fill=%22white%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_11996_224%22%3E%3Crect width=%2219.326%22 height=%2219.326%22 fill=%22white%22 transform=%22translate(0.169922 0.469604)%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");

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

@@ -20,7 +20,7 @@ export class ZBookCardApp {
         return null;
     }
     render() {
-        return (h("div", { key: '1d1b2f0e55e862d339781bcc5569643b4600c1ac' }, h("a", { key: 'ce545fd451b0508cd5242ac5fe78a53f05bcd470', class: "app z-link", href: this.link, "aria-label": `vai a ${this.laz ? "laz" : ""} ${this.name}`, onClick: () => this.emitAppClick(), target: "_blank" }, this.logo && (h("img", { key: 'e6f70c907d4536ff79efb82d52520b250abe41ed', src: this.logo, alt: "" })), h("div", { key: '7159aca193bad1acab23f66074b07a8d37e82f4f', class: "name body-4-sb" }, this.renderLaz(), this.name)), this.info && (h("z-info-reveal", { key: '354d150ea3ca2c1f5b21466da28f267548e0ee9c', icon: "info", size: ControlSize.X_SMALL, position: InfoRevealPosition.TOP_RIGHT, class: "info body-5" }, h("div", { key: '361e85815010eba5863e1a49cb190150413f48f1' }, this.info))), h("a", { key: '52713f456a71c32de4d300c0411a8874364d7cf1', class: "z-link z-link-icon", href: this.link, "aria-label": `vai a ${this.laz ? "laz" : ""} ${this.name}`, onClick: () => this.emitAppClick(), target: "_blank" }, h("z-icon", { key: '746e103053881320ed6840fecca10baf23b0a80a', name: "chevron-right", fill: "color-primary01-icon" }))));
+        return (h("div", { key: 'fce744f158319d3fb1564c75410098d042490579' }, h("a", { key: '9120ac9d00ffb3e4a638511ceb4ab4548ffeb556', class: "app z-link", href: this.link, "aria-label": `vai a ${this.laz ? "laz" : ""} ${this.name}`, onClick: () => this.emitAppClick(), target: "_blank" }, this.logo && (h("img", { key: '9040bf4ba19a5f7627b7e5a317c814487bde3680', src: this.logo, alt: "" })), h("div", { key: 'aca3d44fb28ac31619357bcea89b36622f83cfc7', class: "name body-4-sb" }, this.renderLaz(), this.name)), this.info && (h("z-info-reveal", { key: 'b2f680fa53efcf6d2c44c4e4c273fb1f5bcffbec', icon: "info", size: ControlSize.X_SMALL, position: InfoRevealPosition.TOP_RIGHT, class: "info body-5" }, h("div", { key: '3171a9a277d1e7c09940f7dcb07e6ff3780a8071' }, this.info))), h("a", { key: '2b8b5e66b9184a075c7e6184ef48d63fe52f487c', class: "z-link z-link-icon", href: this.link, "aria-label": `vai a ${this.laz ? "laz" : ""} ${this.name}`, onClick: () => this.emitAppClick(), target: "_blank" }, h("z-icon", { key: '19ee937a556f68ad1276eab43e4a35c46f4e87bd', name: "chevron-right", fill: "color-primary01-icon" }))));
     }
     static get is() { return "z-book-card-app"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/date-picker/z-date-picker/index.js

@@ -170,7 +170,7 @@ export class ZDatePicker {
             } })));
     }
     render() {
-        return (h("div", { key: '278c660a423c35c76dbc8144ccf20a724fde93b2', class: {
+        return (h("div", { key: 'a9e009476e255e0b7d08713e13f05f344d38b82b', class: {
                 "flatpickr-toggle-container": true,
                 [this.flatpickrPosition]: true,
                 [this.mode]: true,