@ethlete/cdk 4.16.1 → 4.16.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8882,13 +8882,13 @@ class ScrollableComponent {
8882
8882
  'sticky-buttons': this.stickyButtons,
8883
8883
  });
8884
8884
  this.hostClassBindings = signalHostClasses({
8885
- 'et-scrollable--can-scroll': this.canScroll,
8885
+ 'et-scrollable--can-scroll': computed(() => this.canScroll() && !this.isAtStart() && !this.isAtEnd()),
8886
8886
  'et-scrollable--is-at-start': this.isAtStart,
8887
8887
  'et-scrollable--is-at-end': this.isAtEnd,
8888
8888
  'et-scrollable--enable-overlay-animations': this.enableOverlayAnimations,
8889
8889
  });
8890
8890
  this.hostStyleBindings = signalHostStyles({
8891
- '--actual-item-size': computed(() => (this._actualItemSize() !== null ? `${this._actualItemSize()}px` : null)),
8891
+ '--actual-item-size': computed(() => (this._actualItemSize() !== null ? `${this._actualItemSize()}px` : undefined)),
8892
8892
  });
8893
8893
  effect(() => {
8894
8894
  const scrollable = this.scrollable()?.nativeElement;
@@ -9213,7 +9213,7 @@ class ScrollableComponent {
9213
9213
  this._disableSnapping$.next();
9214
9214
  }
9215
9215
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ScrollableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9216
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: ScrollableComponent, isStandalone: true, selector: "et-scrollable", inputs: { _itemSize: ["itemSize", "_itemSize"], _direction: ["direction", "_direction"], _scrollableRole: ["scrollableRole", "_scrollableRole"], _scrollableClass: ["scrollableClass", "_scrollableClass"], _renderNavigation: ["renderNavigation", "_renderNavigation", booleanAttribute], _renderMasks: ["renderMasks", "_renderMasks", booleanAttribute], _renderButtons: ["renderButtons", "_renderButtons", booleanAttribute], _renderScrollbars: ["renderScrollbars", "_renderScrollbars", booleanAttribute], _stickyButtons: ["stickyButtons", "_stickyButtons", booleanAttribute], _cursorDragScroll: ["cursorDragScroll", "_cursorDragScroll", booleanAttribute], _disableActiveElementScrolling: ["disableActiveElementScrolling", "_disableActiveElementScrolling", booleanAttribute], _scrollMode: ["scrollMode", "_scrollMode"], _snap: ["snap", "_snap", booleanAttribute], _scrollMargin: ["scrollMargin", "_scrollMargin", numberAttribute] }, outputs: { scrollStateChange: "scrollStateChange", intersectionChange: "intersectionChange" }, host: { classAttribute: "et-scrollable" }, queries: [{ propertyName: "_activeElementList", predicate: SCROLLABLE_IS_ACTIVE_CHILD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ["scrollable"], descendants: true, static: true }, { propertyName: "_scrollableContainer", first: true, predicate: ["scrollableContainer"], descendants: true, static: true }, { propertyName: "_firstElement", first: true, predicate: ["firstElement"], descendants: true, static: true }, { propertyName: "_lastElement", first: true, predicate: ["lastElement"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"et-scrollable-wrapper\">\n <div\n #scrollable\n [attr.role]=\"scrollableRole() ?? undefined\"\n [etCursorDragScroll]=\"cursorDragScroll()\"\n [allowedDirection]=\"direction()\"\n (cursorDragStart)=\"setIsCursorDragging(true)\"\n (cursorDragEnd)=\"setIsCursorDragging(false)\"\n class=\"et-scrollable-container-outer\"\n >\n <div #scrollableContainer [ngClass]=\"scrollableClass()\" class=\"et-scrollable-container\">\n <div #firstElement class=\"et-scroll-observer-first-element\" etScrollableIgnoreChild></div>\n <ng-content />\n <div #lastElement class=\"et-scroll-observer-last-element\" etScrollableIgnoreChild></div>\n </div>\n </div>\n\n @if (renderMasks()) {\n <div class=\"et-scrollable-masks\">\n <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n </div>\n }\n\n @if (renderButtons()) {\n <div class=\"et-scrollable-buttons\">\n <button\n (click)=\"scrollToStartDirection()\"\n class=\"et-scrollable-button et-scrollable-button--start\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n <button\n (click)=\"scrollToEndDirection()\"\n class=\"et-scrollable-button et-scrollable-button--end\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n </div>\n }\n</div>\n\n@if (renderNavigation() && scrollableNavigation().length > 1) {\n <div class=\"et-scrollable-navigation\" aria-hidden=\"true\">\n @for (item of scrollableNavigation(); track i; let i = $index) {\n <button\n [class.et-scrollable-navigation-item--active]=\"item.isActive\"\n (click)=\"scrollToElementViaNavigation(i, item.element)\"\n class=\"et-scrollable-navigation-item\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n ></button>\n }\n </div>\n}\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:block}.et-scrollable .et-scrollable-wrapper{display:grid;position:relative}.et-scrollable[item-size=same]{--_auto-size: 1fr}.et-scrollable[item-size=full]{--_auto-size: var(--actual-item-size)}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container-outer{overflow-x:auto;overflow-y:hidden}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element,.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{block-size:100%;inline-size:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element{inset-inline-start:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{inset-inline-end:1px}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container-outer{overflow-x:hidden;overflow-y:auto}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-inline-start:calc(50% - 20px);transform:rotate(0)}.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-inline-start:calc(50% - 20px);transform:rotate(180deg)}.et-scrollable[direction=vertical] .et-scroll-observer-first-element,.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inline-size:100%;block-size:1px}.et-scrollable[direction=vertical] .et-scroll-observer-first-element{inset-block-start:1px}.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inset-block-end:1px}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container-outer{overflow:auto;display:grid;position:relative;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scroll-observer-first-element,.et-scrollable .et-scroll-observer-last-element{position:absolute;pointer-events:none}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);position:relative}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0}.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-mask,.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-button{transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true]{--_sticky-margin: 10%}.et-scrollable[sticky-buttons=true] .et-scrollable-button{position:sticky}.et-scrollable[sticky-buttons=true][direction=horizontal] .et-scrollable-buttons{margin-block:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons{margin-inline:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons .et-scrollable-button--end{inset-block-start:100%}.et-scrollable .et-scrollable-navigation{display:flex;justify-content:center;gap:10px;margin-block-start:10px}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item{all:unset;inline-size:10px;block-size:10px;display:block;background-color:#4b4b4b;border-radius:50%;cursor:pointer}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item.et-scrollable-navigation-item--active{background-color:#c6c6c6}\n"], dependencies: [{ kind: "directive", type: CursorDragScrollDirective, selector: "[etCursorDragScroll]", inputs: ["etCursorDragScroll", "allowedDirection"], outputs: ["cursorDragStart", "cursorDragMove", "cursorDragEnd"], exportAs: ["etCursorDragScroll"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: ScrollableIgnoreChildDirective, selector: "[etScrollableIgnoreChild]", inputs: ["etScrollableIgnoreChild"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
9216
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: ScrollableComponent, isStandalone: true, selector: "et-scrollable", inputs: { _itemSize: ["itemSize", "_itemSize"], _direction: ["direction", "_direction"], _scrollableRole: ["scrollableRole", "_scrollableRole"], _scrollableClass: ["scrollableClass", "_scrollableClass"], _renderNavigation: ["renderNavigation", "_renderNavigation", booleanAttribute], _renderMasks: ["renderMasks", "_renderMasks", booleanAttribute], _renderButtons: ["renderButtons", "_renderButtons", booleanAttribute], _renderScrollbars: ["renderScrollbars", "_renderScrollbars", booleanAttribute], _stickyButtons: ["stickyButtons", "_stickyButtons", booleanAttribute], _cursorDragScroll: ["cursorDragScroll", "_cursorDragScroll", booleanAttribute], _disableActiveElementScrolling: ["disableActiveElementScrolling", "_disableActiveElementScrolling", booleanAttribute], _scrollMode: ["scrollMode", "_scrollMode"], _snap: ["snap", "_snap", booleanAttribute], _scrollMargin: ["scrollMargin", "_scrollMargin", numberAttribute] }, outputs: { scrollStateChange: "scrollStateChange", intersectionChange: "intersectionChange" }, host: { classAttribute: "et-scrollable" }, queries: [{ propertyName: "_activeElementList", predicate: SCROLLABLE_IS_ACTIVE_CHILD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "_scrollable", first: true, predicate: ["scrollable"], descendants: true, static: true }, { propertyName: "_scrollableContainer", first: true, predicate: ["scrollableContainer"], descendants: true, static: true }, { propertyName: "_firstElement", first: true, predicate: ["firstElement"], descendants: true, static: true }, { propertyName: "_lastElement", first: true, predicate: ["lastElement"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"et-scrollable-wrapper\">\n <div\n #scrollable\n [attr.role]=\"scrollableRole() ?? undefined\"\n [etCursorDragScroll]=\"cursorDragScroll() && (!isAtStart() || !isAtEnd())\"\n [allowedDirection]=\"direction()\"\n (cursorDragStart)=\"setIsCursorDragging(true)\"\n (cursorDragEnd)=\"setIsCursorDragging(false)\"\n class=\"et-scrollable-container-outer\"\n >\n <div #scrollableContainer [ngClass]=\"scrollableClass()\" class=\"et-scrollable-container\">\n <div #firstElement class=\"et-scroll-observer-first-element\" etScrollableIgnoreChild></div>\n <ng-content />\n <div #lastElement class=\"et-scroll-observer-last-element\" etScrollableIgnoreChild></div>\n </div>\n </div>\n\n @if (renderMasks()) {\n <div class=\"et-scrollable-masks\">\n <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n </div>\n }\n\n @if (renderButtons()) {\n <div class=\"et-scrollable-buttons\">\n <button\n (click)=\"scrollToStartDirection()\"\n class=\"et-scrollable-button et-scrollable-button--start\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n <button\n (click)=\"scrollToEndDirection()\"\n class=\"et-scrollable-button et-scrollable-button--end\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n </div>\n }\n</div>\n\n@if (renderNavigation() && scrollableNavigation().length > 1) {\n <div class=\"et-scrollable-navigation\" aria-hidden=\"true\">\n @for (item of scrollableNavigation(); track i; let i = $index) {\n <button\n [class.et-scrollable-navigation-item--active]=\"item.isActive\"\n (click)=\"scrollToElementViaNavigation(i, item.element)\"\n class=\"et-scrollable-navigation-item\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n ></button>\n }\n </div>\n}\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:block}.et-scrollable .et-scrollable-wrapper{display:grid;position:relative}.et-scrollable[item-size=same]{--_auto-size: 1fr}.et-scrollable[item-size=full]{--_auto-size: var(--actual-item-size)}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container-outer{overflow-x:auto;overflow-y:hidden}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element,.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{block-size:100%;inline-size:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element{inset-inline-start:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{inset-inline-end:1px}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container-outer{overflow-x:hidden;overflow-y:auto}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-inline-start:calc(50% - 20px);transform:rotate(0)}.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-inline-start:calc(50% - 20px);transform:rotate(180deg)}.et-scrollable[direction=vertical] .et-scroll-observer-first-element,.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inline-size:100%;block-size:1px}.et-scrollable[direction=vertical] .et-scroll-observer-first-element{inset-block-start:1px}.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inset-block-end:1px}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container-outer{overflow:auto;display:grid;position:relative;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scroll-observer-first-element,.et-scrollable .et-scroll-observer-last-element{position:absolute;pointer-events:none}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);position:relative}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0}.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-mask,.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-button{transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true]{--_sticky-margin: 10%}.et-scrollable[sticky-buttons=true] .et-scrollable-button{position:sticky}.et-scrollable[sticky-buttons=true][direction=horizontal] .et-scrollable-buttons{margin-block:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons{margin-inline:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons .et-scrollable-button--end{inset-block-start:100%}.et-scrollable .et-scrollable-navigation{display:flex;justify-content:center;gap:10px;margin-block-start:10px}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item{all:unset;inline-size:10px;block-size:10px;display:block;background-color:#4b4b4b;border-radius:50%;cursor:pointer}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item.et-scrollable-navigation-item--active{background-color:#c6c6c6}\n"], dependencies: [{ kind: "directive", type: CursorDragScrollDirective, selector: "[etCursorDragScroll]", inputs: ["etCursorDragScroll", "allowedDirection"], outputs: ["cursorDragStart", "cursorDragMove", "cursorDragEnd"], exportAs: ["etCursorDragScroll"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChevronIconComponent, selector: "et-chevron-icon" }, { kind: "directive", type: ScrollableIgnoreChildDirective, selector: "[etScrollableIgnoreChild]", inputs: ["etScrollableIgnoreChild"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
9217
9217
  }
9218
9218
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: ScrollableComponent, decorators: [{
9219
9219
  type: Component,
@@ -9227,7 +9227,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImpor
9227
9227
  ScrollableIgnoreChildDirective,
9228
9228
  ], host: {
9229
9229
  class: 'et-scrollable',
9230
- }, template: "<div class=\"et-scrollable-wrapper\">\n <div\n #scrollable\n [attr.role]=\"scrollableRole() ?? undefined\"\n [etCursorDragScroll]=\"cursorDragScroll()\"\n [allowedDirection]=\"direction()\"\n (cursorDragStart)=\"setIsCursorDragging(true)\"\n (cursorDragEnd)=\"setIsCursorDragging(false)\"\n class=\"et-scrollable-container-outer\"\n >\n <div #scrollableContainer [ngClass]=\"scrollableClass()\" class=\"et-scrollable-container\">\n <div #firstElement class=\"et-scroll-observer-first-element\" etScrollableIgnoreChild></div>\n <ng-content />\n <div #lastElement class=\"et-scroll-observer-last-element\" etScrollableIgnoreChild></div>\n </div>\n </div>\n\n @if (renderMasks()) {\n <div class=\"et-scrollable-masks\">\n <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n </div>\n }\n\n @if (renderButtons()) {\n <div class=\"et-scrollable-buttons\">\n <button\n (click)=\"scrollToStartDirection()\"\n class=\"et-scrollable-button et-scrollable-button--start\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n <button\n (click)=\"scrollToEndDirection()\"\n class=\"et-scrollable-button et-scrollable-button--end\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n </div>\n }\n</div>\n\n@if (renderNavigation() && scrollableNavigation().length > 1) {\n <div class=\"et-scrollable-navigation\" aria-hidden=\"true\">\n @for (item of scrollableNavigation(); track i; let i = $index) {\n <button\n [class.et-scrollable-navigation-item--active]=\"item.isActive\"\n (click)=\"scrollToElementViaNavigation(i, item.element)\"\n class=\"et-scrollable-navigation-item\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n ></button>\n }\n </div>\n}\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:block}.et-scrollable .et-scrollable-wrapper{display:grid;position:relative}.et-scrollable[item-size=same]{--_auto-size: 1fr}.et-scrollable[item-size=full]{--_auto-size: var(--actual-item-size)}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container-outer{overflow-x:auto;overflow-y:hidden}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element,.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{block-size:100%;inline-size:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element{inset-inline-start:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{inset-inline-end:1px}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container-outer{overflow-x:hidden;overflow-y:auto}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-inline-start:calc(50% - 20px);transform:rotate(0)}.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-inline-start:calc(50% - 20px);transform:rotate(180deg)}.et-scrollable[direction=vertical] .et-scroll-observer-first-element,.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inline-size:100%;block-size:1px}.et-scrollable[direction=vertical] .et-scroll-observer-first-element{inset-block-start:1px}.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inset-block-end:1px}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container-outer{overflow:auto;display:grid;position:relative;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scroll-observer-first-element,.et-scrollable .et-scroll-observer-last-element{position:absolute;pointer-events:none}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);position:relative}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0}.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-mask,.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-button{transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true]{--_sticky-margin: 10%}.et-scrollable[sticky-buttons=true] .et-scrollable-button{position:sticky}.et-scrollable[sticky-buttons=true][direction=horizontal] .et-scrollable-buttons{margin-block:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons{margin-inline:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons .et-scrollable-button--end{inset-block-start:100%}.et-scrollable .et-scrollable-navigation{display:flex;justify-content:center;gap:10px;margin-block-start:10px}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item{all:unset;inline-size:10px;block-size:10px;display:block;background-color:#4b4b4b;border-radius:50%;cursor:pointer}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item.et-scrollable-navigation-item--active{background-color:#c6c6c6}\n"] }]
9230
+ }, template: "<div class=\"et-scrollable-wrapper\">\n <div\n #scrollable\n [attr.role]=\"scrollableRole() ?? undefined\"\n [etCursorDragScroll]=\"cursorDragScroll() && (!isAtStart() || !isAtEnd())\"\n [allowedDirection]=\"direction()\"\n (cursorDragStart)=\"setIsCursorDragging(true)\"\n (cursorDragEnd)=\"setIsCursorDragging(false)\"\n class=\"et-scrollable-container-outer\"\n >\n <div #scrollableContainer [ngClass]=\"scrollableClass()\" class=\"et-scrollable-container\">\n <div #firstElement class=\"et-scroll-observer-first-element\" etScrollableIgnoreChild></div>\n <ng-content />\n <div #lastElement class=\"et-scroll-observer-last-element\" etScrollableIgnoreChild></div>\n </div>\n </div>\n\n @if (renderMasks()) {\n <div class=\"et-scrollable-masks\">\n <div class=\"et-scrollable-mask et-scrollable-mask--start\"></div>\n <div class=\"et-scrollable-mask et-scrollable-mask--end\"></div>\n </div>\n }\n\n @if (renderButtons()) {\n <div class=\"et-scrollable-buttons\">\n <button\n (click)=\"scrollToStartDirection()\"\n class=\"et-scrollable-button et-scrollable-button--start\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n <button\n (click)=\"scrollToEndDirection()\"\n class=\"et-scrollable-button et-scrollable-button--end\"\n aria-hidden=\"true\"\n type=\"button\"\n tabindex=\"-1\"\n >\n <et-chevron-icon />\n </button>\n </div>\n }\n</div>\n\n@if (renderNavigation() && scrollableNavigation().length > 1) {\n <div class=\"et-scrollable-navigation\" aria-hidden=\"true\">\n @for (item of scrollableNavigation(); track i; let i = $index) {\n <button\n [class.et-scrollable-navigation-item--active]=\"item.isActive\"\n (click)=\"scrollToElementViaNavigation(i, item.element)\"\n class=\"et-scrollable-navigation-item\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n ></button>\n }\n </div>\n}\n", styles: [".et-scrollable{--mask: #121212 0, transparent 100%;--mask-size: 25px;--_auto-size: min-content;--_flow: column;display:block}.et-scrollable .et-scrollable-wrapper{display:grid;position:relative}.et-scrollable[item-size=same]{--_auto-size: 1fr}.et-scrollable[item-size=full]{--_auto-size: var(--actual-item-size)}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer{scrollbar-width:none}.et-scrollable[render-scrollbars=false] .et-scrollable-container-outer::-webkit-scrollbar{display:none}.et-scrollable[direction=horizontal] .et-scrollable-container-outer{overflow-x:auto;overflow-y:hidden}.et-scrollable[direction=horizontal] .et-scrollable-container{grid-auto-columns:var(--_auto-size)}.et-scrollable[direction=horizontal] .et-scrollable-mask,.et-scrollable[direction=horizontal] .et-scrollable-button{inline-size:var(--mask-size);block-size:100%}.et-scrollable[direction=horizontal] .et-scrollable-mask--start,.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:0;inset-inline:0 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--end,.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:0;inset-inline:calc(100% - 40px) 0}.et-scrollable[direction=horizontal] .et-scrollable-mask--start{background:linear-gradient(to right,var(--mask))}.et-scrollable[direction=horizontal] .et-scrollable-mask--end{background:linear-gradient(to left,var(--mask));inset-inline:calc(100% - var(--mask-size)) 100%}.et-scrollable[direction=horizontal] .et-scrollable-button--start{inset-block-start:calc(50% - 20px);transform:rotate(-90deg)}.et-scrollable[direction=horizontal] .et-scrollable-button--end{inset-block-start:calc(50% - 20px);transform:rotate(90deg)}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element,.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{block-size:100%;inline-size:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-first-element{inset-inline-start:1px}.et-scrollable[direction=horizontal] .et-scroll-observer-last-element{inset-inline-end:1px}.et-scrollable[direction=vertical]{--_flow: row}.et-scrollable[direction=vertical] .et-scrollable-container-outer{overflow-x:hidden;overflow-y:auto}.et-scrollable[direction=vertical] .et-scrollable-container{grid-auto-rows:var(--_auto-size)}.et-scrollable[direction=vertical] .et-scrollable-mask,.et-scrollable[direction=vertical] .et-scrollable-button{block-size:var(--mask-size);inline-size:100%}.et-scrollable[direction=vertical] .et-scrollable-mask--start,.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-block-start:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--end,.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-block-end:0;inset-inline-start:0}.et-scrollable[direction=vertical] .et-scrollable-mask--start{background:linear-gradient(to bottom,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-mask--end{background:linear-gradient(to top,var(--mask))}.et-scrollable[direction=vertical] .et-scrollable-button--start{inset-inline-start:calc(50% - 20px);transform:rotate(0)}.et-scrollable[direction=vertical] .et-scrollable-button--end{inset-inline-start:calc(50% - 20px);transform:rotate(180deg)}.et-scrollable[direction=vertical] .et-scroll-observer-first-element,.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inline-size:100%;block-size:1px}.et-scrollable[direction=vertical] .et-scroll-observer-first-element{inset-block-start:1px}.et-scrollable[direction=vertical] .et-scroll-observer-last-element{inset-block-end:1px}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-masks .et-scrollable-mask--start,.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{opacity:1}.et-scrollable:not(.et-scrollable--is-at-start) .et-scrollable-buttons .et-scrollable-button--start{pointer-events:all}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-masks .et-scrollable-mask--end,.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{opacity:1}.et-scrollable:not(.et-scrollable--is-at-end) .et-scrollable-buttons .et-scrollable-button--end{pointer-events:all}.et-scrollable .et-scrollable-container-outer{overflow:auto;display:grid;position:relative;grid-row:1/1;grid-column:1/1}.et-scrollable .et-scroll-observer-first-element,.et-scrollable .et-scroll-observer-last-element{position:absolute;pointer-events:none}.et-scrollable .et-scrollable-container{display:grid;grid-auto-flow:var(--_flow);position:relative}.et-scrollable .et-scrollable-masks,.et-scrollable .et-scrollable-buttons{grid-row:1/1;grid-column:1/1;pointer-events:none}.et-scrollable .et-scrollable-masks .et-scrollable-mask,.et-scrollable .et-scrollable-masks .et-scrollable-button,.et-scrollable .et-scrollable-buttons .et-scrollable-mask,.et-scrollable .et-scrollable-buttons .et-scrollable-button{position:absolute;opacity:0}.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-mask,.et-scrollable.et-scrollable--can-scroll.et-scrollable--enable-overlay-animations .et-scrollable-button{transition:opacity .3s var(--ease-5)}.et-scrollable .et-scrollable-buttons .et-scrollable-button{background:transparent;border:none;padding:12px;inline-size:40px;block-size:40px;border-radius:4px;cursor:pointer}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-chevron-icon{pointer-events:none}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--start{inset-inline:0 0}.et-scrollable .et-scrollable-buttons .et-scrollable-button .et-scrollable-button--end{inset-inline:calc(100% - 40px) 0}.et-scrollable[sticky-buttons=true]{--_sticky-margin: 10%}.et-scrollable[sticky-buttons=true] .et-scrollable-button{position:sticky}.et-scrollable[sticky-buttons=true][direction=horizontal] .et-scrollable-buttons{margin-block:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons{margin-inline:var(--_sticky-margin)}.et-scrollable[sticky-buttons=true][direction=vertical] .et-scrollable-buttons .et-scrollable-button--end{inset-block-start:100%}.et-scrollable .et-scrollable-navigation{display:flex;justify-content:center;gap:10px;margin-block-start:10px}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item{all:unset;inline-size:10px;block-size:10px;display:block;background-color:#4b4b4b;border-radius:50%;cursor:pointer}.et-scrollable .et-scrollable-navigation .et-scrollable-navigation-item.et-scrollable-navigation-item--active{background-color:#c6c6c6}\n"] }]
9231
9231
  }], ctorParameters: () => [], propDecorators: { _itemSize: [{
9232
9232
  type: Input,
9233
9233
  args: [{ alias: 'itemSize' }]
@@ -14276,13 +14276,13 @@ class PictureComponent {
14276
14276
  };
14277
14277
  }
14278
14278
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PictureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
14279
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-picture" }, ngImport: i0, template: "<figure [ngClass]=\"figureClass\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
14279
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: PictureComponent, isStandalone: true, selector: "et-picture", inputs: { sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: false, transformFunction: null }, hasPriority: { classPropertyName: "hasPriority", publicName: "hasPriority", isSignal: true, isRequired: false, transformFunction: null }, imgClass: { classPropertyName: "imgClass", publicName: "imgClass", isSignal: true, isRequired: false, transformFunction: null }, figureClass: { classPropertyName: "figureClass", publicName: "figureClass", isSignal: true, isRequired: false, transformFunction: null }, figcaptionClass: { classPropertyName: "figcaptionClass", publicName: "figcaptionClass", isSignal: true, isRequired: false, transformFunction: null }, pictureClass: { classPropertyName: "pictureClass", publicName: "pictureClass", isSignal: true, isRequired: false, transformFunction: null }, defaultSrc: { classPropertyName: "defaultSrc", publicName: "defaultSrc", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, figcaption: { classPropertyName: "figcaption", publicName: "figcaption", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "et-picture" }, ngImport: i0, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
14280
14280
  }
14281
14281
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PictureComponent, decorators: [{
14282
14282
  type: Component,
14283
14283
  args: [{ selector: 'et-picture', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass], host: {
14284
14284
  class: 'et-picture',
14285
- }, template: "<figure [ngClass]=\"figureClass\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
14285
+ }, template: "<figure [ngClass]=\"figureClass()\" class=\"et-picture-figure\">\n <picture [ngClass]=\"pictureClass()\" class=\"et-picture-picture\">\n @for (source of sourcesWithConfig(); track source.srcset) {\n <source [type]=\"source.type\" [attr.srcset]=\"source.srcset\" [attr.sizes]=\"sizes()\" />\n }\n\n @if (defaultSourceWithConfig(); as source) {\n <img\n [attr.loading]=\"hasPriority() ? 'eager' : 'lazy'\"\n [attr.fetchpriority]=\"hasPriority() ? 'high' : 'auto'\"\n [ngClass]=\"imgClass()\"\n [attr.srcset]=\"source.srcset\"\n [attr.type]=\"source.type\"\n [attr.alt]=\"alt()\"\n [attr.width]=\"width()\"\n [attr.height]=\"height()\"\n [attr.sizes]=\"sizes()\"\n class=\"et-picture-img\"\n />\n }\n </picture>\n\n @if (figcaption()) {\n <figcaption [ngClass]=\"figcaptionClass()\" class=\"et-picture-figcaption\">\n {{ figcaption() }}\n </figcaption>\n }\n</figure>\n" }]
14286
14286
  }] });
14287
14287
 
14288
14288
  const PROGRESS_SPINNER_DEFAULT_OPTIONS = new InjectionToken('PROGRESS_SPINNER_DEFAULT_OPTIONS', {
@@ -17089,13 +17089,13 @@ class NavTabsOutletComponent {
17089
17089
  return this.id;
17090
17090
  }
17091
17091
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: NavTabsOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
17092
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: NavTabsOutletComponent, isStandalone: true, selector: "et-nav-tabs-outlet", inputs: { id: "id" }, host: { properties: { "attr.aria-labelledby": "this._attrAriaLabelledBy", "attr.role": "this._attrRole", "attr.id": "this._attrId" }, classAttribute: "et-nav-tabs-outlet" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
17092
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: NavTabsOutletComponent, isStandalone: true, selector: "et-nav-tabs-outlet", inputs: { id: "id" }, host: { properties: { "attr.aria-labelledby": "this._attrAriaLabelledBy", "attr.role": "this._attrRole", "attr.id": "this._attrId" }, classAttribute: "et-nav-tabs-outlet" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}.et-nav-tabs-outlet{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}.et-nav-tabs-outlet router-outlet{display:none}.et-nav-tabs-outlet router-outlet+*{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
17093
17093
  }
17094
17094
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: NavTabsOutletComponent, decorators: [{
17095
17095
  type: Component,
17096
17096
  args: [{ selector: 'et-nav-tabs-outlet', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
17097
17097
  class: 'et-nav-tabs-outlet',
17098
- }, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}\n"] }]
17098
+ }, styles: [".et-nav-tabs{display:block}.et-nav-tabs .et-nav-tab-link{white-space:nowrap}.et-nav-tabs .et-nav-tab-link:not([aria-disabled=true]){cursor:pointer}.et-nav-tabs .et-scrollable-container{position:relative}.et-nav-tabs-outlet{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}.et-nav-tabs-outlet router-outlet{display:none}.et-nav-tabs-outlet router-outlet+*{display:block}\n"] }]
17099
17099
  }], propDecorators: { id: [{
17100
17100
  type: Input
17101
17101
  }], _attrAriaLabelledBy: [{