@ethlete/cdk 4.23.3 → 4.23.4
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.
- package/CHANGELOG.md +6 -0
- package/esm2022/lib/components/carousel/carousel.component.mjs +2 -2
- package/esm2022/lib/components/carousel/controls/carousel-item-nav.component.mjs +9 -9
- package/esm2022/lib/components/carousel/controls/carousel-item-nav.directive.mjs +3 -9
- package/fesm2022/ethlete-cdk.mjs +11 -17
- package/fesm2022/ethlete-cdk.mjs.map +1 -1
- package/lib/components/carousel/controls/carousel-item-nav.directive.d.ts +1 -4
- package/lib/components/scrollable/components/scrollable/scrollable.component.d.ts +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @ethlete/cdk
|
|
2
2
|
|
|
3
|
+
## 4.23.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`142b855`](https://github.com/ethlete-io/ethdk/commit/142b855bd19a219eb90d56999724001a8ce5e50b) Thanks [@TomTomB](https://github.com/TomTomB)! - Fix transitions between navigation dots inside carousel component. Before, the exiting dot would not animate out properly resulting in a layout shift. Now, the exiting dot will animate out properly at the same time as the entering dot animates in.
|
|
8
|
+
|
|
3
9
|
## 4.23.3
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -19,7 +19,7 @@ export class CarouselComponent {
|
|
|
19
19
|
|
|
20
20
|
<ng-content />
|
|
21
21
|
</div>
|
|
22
|
-
`, isInline: true, styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:
|
|
22
|
+
`, isInline: true, styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:10px;block-size:var(--et-carousel-dot-size);border-radius:var(--et-carousel-dot-radius);background-color:var(--et-carousel-dot-color);border:0;padding:0;overflow:hidden;transition:inline-size var(--_et-carousel-slide-duration) var(--et-carousel-slide-easing),background-color .1s linear;cursor:pointer}.et-carousel-item-nav .et-carousel-item-nav-button--progressing{inline-size:var(--et-carousel-progress-inline-size)}.et-carousel-item-nav .et-carousel-item-nav-button--progressing .et-carousel-item-nav-button-progress{transition:transform .1s linear}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):hover{background-color:var(--et-carousel-dot-color-hover)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):active{background-color:var(--et-carousel-dot-color-active)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing).et-carousel-item-nav-button--active-static{background-color:var(--et-carousel-dot-color-current)}.et-carousel-item-nav .et-carousel-item-nav-button-progress{inline-size:100%;block-size:100%;background-color:var(--et-carousel-dot-color-current);transform-origin:left;transform:scaleX(var(--_et-carousel-item-nav-button-progress, 0))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
23
23
|
}
|
|
24
24
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: CarouselComponent, decorators: [{
|
|
25
25
|
type: Component,
|
|
@@ -46,6 +46,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
46
46
|
'transitionDuration',
|
|
47
47
|
],
|
|
48
48
|
},
|
|
49
|
-
], styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:
|
|
49
|
+
], styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:10px;block-size:var(--et-carousel-dot-size);border-radius:var(--et-carousel-dot-radius);background-color:var(--et-carousel-dot-color);border:0;padding:0;overflow:hidden;transition:inline-size var(--_et-carousel-slide-duration) var(--et-carousel-slide-easing),background-color .1s linear;cursor:pointer}.et-carousel-item-nav .et-carousel-item-nav-button--progressing{inline-size:var(--et-carousel-progress-inline-size)}.et-carousel-item-nav .et-carousel-item-nav-button--progressing .et-carousel-item-nav-button-progress{transition:transform .1s linear}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):hover{background-color:var(--et-carousel-dot-color-hover)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):active{background-color:var(--et-carousel-dot-color-active)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing).et-carousel-item-nav-button--active-static{background-color:var(--et-carousel-dot-color-current)}.et-carousel-item-nav .et-carousel-item-nav-button-progress{inline-size:100%;block-size:100%;background-color:var(--et-carousel-dot-color-current);transform-origin:left;transform:scaleX(var(--_et-carousel-item-nav-button-progress, 0))}\n"] }]
|
|
50
50
|
}], ctorParameters: () => [] });
|
|
51
51
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2Fyb3VzZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jZGsvc3JjL2xpYi9jb21wb25lbnRzL2Nhcm91c2VsL2Nhcm91c2VsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFjLGlCQUFpQixFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDckgsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzQyxPQUFPLEVBQUUsY0FBYyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7OztBQW9DekUsTUFBTSxPQUFPLGlCQUFpQjtJQUk1QjtRQUhBLGFBQVEsR0FBRyxNQUFNLENBQUMsY0FBYyxDQUFDLENBQUM7UUFDbEMseUJBQW9CLEdBQUcsU0FBUyxDQUFDLFFBQVEsQ0FBMEIsc0JBQXNCLENBQUMsQ0FBQztRQUd6RixVQUFVLENBQUMsSUFBSSxDQUFDLG9CQUFvQixFQUFFLElBQUksQ0FBQyxRQUFRLENBQUMsb0JBQW9CLENBQUMsQ0FBQztJQUM1RSxDQUFDOzhHQU5VLGlCQUFpQjtrR0FBakIsaUJBQWlCLDRqQkFoQ2xCOzs7Ozs7OztHQVFUOzsyRkF3QlUsaUJBQWlCO2tCQWxDN0IsU0FBUzsrQkFDRSxhQUFhLFlBQ2I7Ozs7Ozs7O0dBUVQsY0FFVyxJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0saUJBQ2hDLGlCQUFpQixDQUFDLElBQUksUUFDL0I7d0JBQ0osS0FBSyxFQUFFLGtCQUFrQjtxQkFDMUIsV0FDUSxDQUFDLGdCQUFnQixDQUFDLGtCQUNYO3dCQUNkOzRCQUNFLFNBQVMsRUFBRSxpQkFBaUI7NEJBQzVCLE1BQU0sRUFBRTtnQ0FDTixNQUFNO2dDQUNOLFVBQVU7Z0NBQ1YsY0FBYztnQ0FDZCxzQkFBc0I7Z0NBQ3RCLHNCQUFzQjtnQ0FDdEIsZ0JBQWdCO2dDQUNoQixvQkFBb0I7NkJBQ3JCO3lCQUNGO3FCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdUZW1wbGF0ZU91dGxldCB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBWaWV3RW5jYXBzdWxhdGlvbiwgaW5qZWN0LCB2aWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IHN5bmNTaWduYWwgfSBmcm9tICdAZXRobGV0ZS9jb3JlJztcbmltcG9ydCB7IENBUk9VU0VMX1RPS0VOLCBDYXJvdXNlbERpcmVjdGl2ZSB9IGZyb20gJy4vY2Fyb3VzZWwuZGlyZWN0aXZlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZXQtY2Fyb3VzZWwnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgY2xhc3M9XCJldC1jYXJvdXNlbFwiPlxuICAgICAgPGRpdiAjY2Fyb3VzZWxJdGVtc1dyYXBwZXIgY2xhc3M9XCJldC1jYXJvdXNlbC1pdGVtc1wiPlxuICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJldC1jYXJvdXNlbC1pdGVtLCBbZXRDYXJvdXNlbEl0ZW1dXCIgLz5cbiAgICAgIDwvZGl2PlxuXG4gICAgICA8bmctY29udGVudCAvPlxuICAgIDwvZGl2PlxuICBgLFxuICBzdHlsZVVybDogJy4vY2Fyb3VzZWwuY29tcG9uZW50LnNjc3MnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnZXQtY2Fyb3VzZWwtaG9zdCcsXG4gIH0sXG4gIGltcG9ydHM6IFtOZ1RlbXBsYXRlT3V0bGV0XSxcbiAgaG9zdERpcmVjdGl2ZXM6IFtcbiAgICB7XG4gICAgICBkaXJlY3RpdmU6IENhcm91c2VsRGlyZWN0aXZlLFxuICAgICAgaW5wdXRzOiBbXG4gICAgICAgICdsb29wJyxcbiAgICAgICAgJ2F1dG9QbGF5JyxcbiAgICAgICAgJ2F1dG9QbGF5VGltZScsXG4gICAgICAgICdwYXVzZUF1dG9QbGF5T25Ib3ZlcicsXG4gICAgICAgICdwYXVzZUF1dG9QbGF5T25Gb2N1cycsXG4gICAgICAgICd0cmFuc2l0aW9uVHlwZScsXG4gICAgICAgICd0cmFuc2l0aW9uRHVyYXRpb24nLFxuICAgICAgXSxcbiAgICB9LFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBDYXJvdXNlbENvbXBvbmVudCB7XG4gIGNhcm91c2VsID0gaW5qZWN0KENBUk9VU0VMX1RPS0VOKTtcbiAgY2Fyb3VzZWxJdGVtc1dyYXBwZXIgPSB2aWV3Q2hpbGQucmVxdWlyZWQ8RWxlbWVudFJlZjxIVE1MRWxlbWVudD4+KCdjYXJvdXNlbEl0ZW1zV3JhcHBlcicpO1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHN5bmNTaWduYWwodGhpcy5jYXJvdXNlbEl0ZW1zV3JhcHBlciwgdGhpcy5jYXJvdXNlbC5jYXJvdXNlbEl0ZW1zV3JhcHBlcik7XG4gIH1cbn1cbiJdfQ==
|
|
@@ -9,17 +9,17 @@ export class CarouselItemNavComponent {
|
|
|
9
9
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: CarouselItemNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
10
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: CarouselItemNavComponent, isStandalone: true, selector: "et-carousel-item-nav", host: { classAttribute: "et-carousel-item-nav-host" }, hostDirectives: [{ directive: i1.CarouselItemNavDirective }], ngImport: i0, template: `
|
|
11
11
|
<ul class="et-carousel-item-nav">
|
|
12
|
-
@for (item of nav.items(); track $index) {
|
|
12
|
+
@for (item of nav.carousel.items(); track $index) {
|
|
13
13
|
<li class="et-carousel-item-nav-item">
|
|
14
14
|
<button
|
|
15
|
-
[class.et-carousel-item-nav-button--progressing]="item.isActive && nav.
|
|
16
|
-
[class.et-carousel-item-nav-button--active-static]="item.isActive && nav.
|
|
15
|
+
[class.et-carousel-item-nav-button--progressing]="item.isActive() && nav.autoPlayEnabled()"
|
|
16
|
+
[class.et-carousel-item-nav-button--active-static]="item.isActive() && !nav.autoPlayEnabled()"
|
|
17
17
|
(click)="nav.goTo($index)"
|
|
18
18
|
class="et-carousel-item-nav-button"
|
|
19
19
|
type="button"
|
|
20
20
|
>
|
|
21
21
|
<div
|
|
22
|
-
[style.--_et-carousel-item-nav-button-progress]="item.isActive ? nav.autoPlayProgress() : 0"
|
|
22
|
+
[style.--_et-carousel-item-nav-button-progress]="item.isActive() ? nav.autoPlayProgress() : 0"
|
|
23
23
|
class="et-carousel-item-nav-button-progress"
|
|
24
24
|
></div>
|
|
25
25
|
</button>
|
|
@@ -34,17 +34,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
34
34
|
selector: 'et-carousel-item-nav',
|
|
35
35
|
template: `
|
|
36
36
|
<ul class="et-carousel-item-nav">
|
|
37
|
-
@for (item of nav.items(); track $index) {
|
|
37
|
+
@for (item of nav.carousel.items(); track $index) {
|
|
38
38
|
<li class="et-carousel-item-nav-item">
|
|
39
39
|
<button
|
|
40
|
-
[class.et-carousel-item-nav-button--progressing]="item.isActive && nav.
|
|
41
|
-
[class.et-carousel-item-nav-button--active-static]="item.isActive && nav.
|
|
40
|
+
[class.et-carousel-item-nav-button--progressing]="item.isActive() && nav.autoPlayEnabled()"
|
|
41
|
+
[class.et-carousel-item-nav-button--active-static]="item.isActive() && !nav.autoPlayEnabled()"
|
|
42
42
|
(click)="nav.goTo($index)"
|
|
43
43
|
class="et-carousel-item-nav-button"
|
|
44
44
|
type="button"
|
|
45
45
|
>
|
|
46
46
|
<div
|
|
47
|
-
[style.--_et-carousel-item-nav-button-progress]="item.isActive ? nav.autoPlayProgress() : 0"
|
|
47
|
+
[style.--_et-carousel-item-nav-button-progress]="item.isActive() ? nav.autoPlayProgress() : 0"
|
|
48
48
|
class="et-carousel-item-nav-button-progress"
|
|
49
49
|
></div>
|
|
50
50
|
</button>
|
|
@@ -62,4 +62,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
62
62
|
hostDirectives: [{ directive: CarouselItemNavDirective }],
|
|
63
63
|
}]
|
|
64
64
|
}] });
|
|
65
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2Fyb3VzZWwtaXRlbS1uYXYuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jZGsvc3JjL2xpYi9jb21wb25lbnRzL2Nhcm91c2VsL2NvbnRyb2xzL2Nhcm91c2VsLWl0ZW0tbmF2LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUM5RixPQUFPLEVBQUUsdUJBQXVCLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQzs7O0FBaUNsRyxNQUFNLE9BQU8sd0JBQXdCO0lBL0JyQztRQWdDRSxRQUFHLEdBQUcsTUFBTSxDQUFDLHVCQUF1QixDQUFDLENBQUM7S0FDdkM7OEdBRlksd0JBQXdCO2tHQUF4Qix3QkFBd0IscU1BN0J6Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDs7MkZBVVUsd0JBQXdCO2tCQS9CcEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FtQlQ7b0JBQ0QsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtvQkFDckMsSUFBSSxFQUFFO3dCQUNKLEtBQUssRUFBRSwyQkFBMkI7cUJBQ25DO29CQUNELE9BQU8sRUFBRSxFQUFFO29CQUNYLGNBQWMsRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLHdCQUF3QixFQUFFLENBQUM7aUJBQzFEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgVmlld0VuY2Fwc3VsYXRpb24sIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ0FST1VTRUxfSVRFTV9OQVZfVE9LRU4sIENhcm91c2VsSXRlbU5hdkRpcmVjdGl2ZSB9IGZyb20gJy4vY2Fyb3VzZWwtaXRlbS1uYXYuZGlyZWN0aXZlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZXQtY2Fyb3VzZWwtaXRlbS1uYXYnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDx1bCBjbGFzcz1cImV0LWNhcm91c2VsLWl0ZW0tbmF2XCI+
|
|
65
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2Fyb3VzZWwtaXRlbS1uYXYuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jZGsvc3JjL2xpYi9jb21wb25lbnRzL2Nhcm91c2VsL2NvbnRyb2xzL2Nhcm91c2VsLWl0ZW0tbmF2LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUM5RixPQUFPLEVBQUUsdUJBQXVCLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQzs7O0FBaUNsRyxNQUFNLE9BQU8sd0JBQXdCO0lBL0JyQztRQWdDRSxRQUFHLEdBQUcsTUFBTSxDQUFDLHVCQUF1QixDQUFDLENBQUM7S0FDdkM7OEdBRlksd0JBQXdCO2tHQUF4Qix3QkFBd0IscU1BN0J6Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1CVDs7MkZBVVUsd0JBQXdCO2tCQS9CcEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FtQlQ7b0JBQ0QsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtvQkFDckMsSUFBSSxFQUFFO3dCQUNKLEtBQUssRUFBRSwyQkFBMkI7cUJBQ25DO29CQUNELE9BQU8sRUFBRSxFQUFFO29CQUNYLGNBQWMsRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLHdCQUF3QixFQUFFLENBQUM7aUJBQzFEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgVmlld0VuY2Fwc3VsYXRpb24sIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ0FST1VTRUxfSVRFTV9OQVZfVE9LRU4sIENhcm91c2VsSXRlbU5hdkRpcmVjdGl2ZSB9IGZyb20gJy4vY2Fyb3VzZWwtaXRlbS1uYXYuZGlyZWN0aXZlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZXQtY2Fyb3VzZWwtaXRlbS1uYXYnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDx1bCBjbGFzcz1cImV0LWNhcm91c2VsLWl0ZW0tbmF2XCI+XG4gICAgICBAZm9yIChpdGVtIG9mIG5hdi5jYXJvdXNlbC5pdGVtcygpOyB0cmFjayAkaW5kZXgpIHtcbiAgICAgICAgPGxpIGNsYXNzPVwiZXQtY2Fyb3VzZWwtaXRlbS1uYXYtaXRlbVwiPlxuICAgICAgICAgIDxidXR0b25cbiAgICAgICAgICAgIFtjbGFzcy5ldC1jYXJvdXNlbC1pdGVtLW5hdi1idXR0b24tLXByb2dyZXNzaW5nXT1cIml0ZW0uaXNBY3RpdmUoKSAmJiBuYXYuYXV0b1BsYXlFbmFibGVkKClcIlxuICAgICAgICAgICAgW2NsYXNzLmV0LWNhcm91c2VsLWl0ZW0tbmF2LWJ1dHRvbi0tYWN0aXZlLXN0YXRpY109XCJpdGVtLmlzQWN0aXZlKCkgJiYgIW5hdi5hdXRvUGxheUVuYWJsZWQoKVwiXG4gICAgICAgICAgICAoY2xpY2spPVwibmF2LmdvVG8oJGluZGV4KVwiXG4gICAgICAgICAgICBjbGFzcz1cImV0LWNhcm91c2VsLWl0ZW0tbmF2LWJ1dHRvblwiXG4gICAgICAgICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgICAgICA+XG4gICAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAgIFtzdHlsZS4tLV9ldC1jYXJvdXNlbC1pdGVtLW5hdi1idXR0b24tcHJvZ3Jlc3NdPVwiaXRlbS5pc0FjdGl2ZSgpID8gbmF2LmF1dG9QbGF5UHJvZ3Jlc3MoKSA6IDBcIlxuICAgICAgICAgICAgICBjbGFzcz1cImV0LWNhcm91c2VsLWl0ZW0tbmF2LWJ1dHRvbi1wcm9ncmVzc1wiXG4gICAgICAgICAgICA+PC9kaXY+XG4gICAgICAgICAgPC9idXR0b24+XG4gICAgICAgIDwvbGk+XG4gICAgICB9XG4gICAgPC91bD5cbiAgYCxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGhvc3Q6IHtcbiAgICBjbGFzczogJ2V0LWNhcm91c2VsLWl0ZW0tbmF2LWhvc3QnLFxuICB9LFxuICBpbXBvcnRzOiBbXSxcbiAgaG9zdERpcmVjdGl2ZXM6IFt7IGRpcmVjdGl2ZTogQ2Fyb3VzZWxJdGVtTmF2RGlyZWN0aXZlIH1dLFxufSlcbmV4cG9ydCBjbGFzcyBDYXJvdXNlbEl0ZW1OYXZDb21wb25lbnQge1xuICBuYXYgPSBpbmplY3QoQ0FST1VTRUxfSVRFTV9OQVZfVE9LRU4pO1xufVxuIl19
|
|
@@ -1,18 +1,12 @@
|
|
|
1
|
-
import { Directive, InjectionToken,
|
|
1
|
+
import { Directive, InjectionToken, inject } from '@angular/core';
|
|
2
2
|
import { CAROUSEL_TOKEN } from '../carousel.directive';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export const CAROUSEL_ITEM_NAV_TOKEN = new InjectionToken('CAROUSEL_ITEM_NAV_TOKEN');
|
|
5
5
|
export class CarouselItemNavDirective {
|
|
6
6
|
constructor() {
|
|
7
7
|
this.carousel = inject(CAROUSEL_TOKEN);
|
|
8
|
-
this.items = computed(() => {
|
|
9
|
-
const carouselItems = this.carousel.items();
|
|
10
|
-
return carouselItems.map((item, index) => ({
|
|
11
|
-
item,
|
|
12
|
-
isActive: this.carousel.activeIndex() === index,
|
|
13
|
-
}));
|
|
14
|
-
});
|
|
15
8
|
this.autoPlayProgress = this.carousel.activeItemAutoPlayProgress;
|
|
9
|
+
this.autoPlayEnabled = this.carousel.autoPlay;
|
|
16
10
|
}
|
|
17
11
|
goTo(index) {
|
|
18
12
|
this.carousel.goTo(index);
|
|
@@ -37,4 +31,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
37
31
|
],
|
|
38
32
|
}]
|
|
39
33
|
}] });
|
|
40
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
34
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2Fyb3VzZWwtaXRlbS1uYXYuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jZGsvc3JjL2xpYi9jb21wb25lbnRzL2Nhcm91c2VsL2NvbnRyb2xzL2Nhcm91c2VsLWl0ZW0tbmF2LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLGNBQWMsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbEUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHVCQUF1QixDQUFDOztBQUV2RCxNQUFNLENBQUMsTUFBTSx1QkFBdUIsR0FBRyxJQUFJLGNBQWMsQ0FBMkIseUJBQXlCLENBQUMsQ0FBQztBQVcvRyxNQUFNLE9BQU8sd0JBQXdCO0lBVHJDO1FBVUUsYUFBUSxHQUFHLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUVsQyxxQkFBZ0IsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLDBCQUEwQixDQUFDO1FBQzVELG9CQUFlLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUM7S0FLMUM7SUFIQyxJQUFJLENBQUMsS0FBYTtRQUNoQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM1QixDQUFDOzhHQVJVLHdCQUF3QjtrR0FBeEIsd0JBQXdCLGlDQVB4QjtZQUNUO2dCQUNFLE9BQU8sRUFBRSx1QkFBdUI7Z0JBQ2hDLFdBQVcsRUFBRSx3QkFBd0I7YUFDdEM7U0FDRjs7MkZBRVUsd0JBQXdCO2tCQVRwQyxTQUFTO21CQUFDO29CQUNULFVBQVUsRUFBRSxJQUFJO29CQUNoQixTQUFTLEVBQUU7d0JBQ1Q7NEJBQ0UsT0FBTyxFQUFFLHVCQUF1Qjs0QkFDaEMsV0FBVywwQkFBMEI7eUJBQ3RDO3FCQUNGO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBJbmplY3Rpb25Ub2tlbiwgaW5qZWN0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDQVJPVVNFTF9UT0tFTiB9IGZyb20gJy4uL2Nhcm91c2VsLmRpcmVjdGl2ZSc7XG5cbmV4cG9ydCBjb25zdCBDQVJPVVNFTF9JVEVNX05BVl9UT0tFTiA9IG5ldyBJbmplY3Rpb25Ub2tlbjxDYXJvdXNlbEl0ZW1OYXZEaXJlY3RpdmU+KCdDQVJPVVNFTF9JVEVNX05BVl9UT0tFTicpO1xuXG5ARGlyZWN0aXZlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogQ0FST1VTRUxfSVRFTV9OQVZfVE9LRU4sXG4gICAgICB1c2VFeGlzdGluZzogQ2Fyb3VzZWxJdGVtTmF2RGlyZWN0aXZlLFxuICAgIH0sXG4gIF0sXG59KVxuZXhwb3J0IGNsYXNzIENhcm91c2VsSXRlbU5hdkRpcmVjdGl2ZSB7XG4gIGNhcm91c2VsID0gaW5qZWN0KENBUk9VU0VMX1RPS0VOKTtcblxuICBhdXRvUGxheVByb2dyZXNzID0gdGhpcy5jYXJvdXNlbC5hY3RpdmVJdGVtQXV0b1BsYXlQcm9ncmVzcztcbiAgYXV0b1BsYXlFbmFibGVkID0gdGhpcy5jYXJvdXNlbC5hdXRvUGxheTtcblxuICBnb1RvKGluZGV4OiBudW1iZXIpIHtcbiAgICB0aGlzLmNhcm91c2VsLmdvVG8oaW5kZXgpO1xuICB9XG59XG4iXX0=
|
package/fesm2022/ethlete-cdk.mjs
CHANGED
|
@@ -1436,7 +1436,7 @@ class CarouselComponent {
|
|
|
1436
1436
|
|
|
1437
1437
|
<ng-content />
|
|
1438
1438
|
</div>
|
|
1439
|
-
`, isInline: true, styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:
|
|
1439
|
+
`, isInline: true, styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:10px;block-size:var(--et-carousel-dot-size);border-radius:var(--et-carousel-dot-radius);background-color:var(--et-carousel-dot-color);border:0;padding:0;overflow:hidden;transition:inline-size var(--_et-carousel-slide-duration) var(--et-carousel-slide-easing),background-color .1s linear;cursor:pointer}.et-carousel-item-nav .et-carousel-item-nav-button--progressing{inline-size:var(--et-carousel-progress-inline-size)}.et-carousel-item-nav .et-carousel-item-nav-button--progressing .et-carousel-item-nav-button-progress{transition:transform .1s linear}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):hover{background-color:var(--et-carousel-dot-color-hover)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):active{background-color:var(--et-carousel-dot-color-active)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing).et-carousel-item-nav-button--active-static{background-color:var(--et-carousel-dot-color-current)}.et-carousel-item-nav .et-carousel-item-nav-button-progress{inline-size:100%;block-size:100%;background-color:var(--et-carousel-dot-color-current);transform-origin:left;transform:scaleX(var(--_et-carousel-item-nav-button-progress, 0))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1440
1440
|
}
|
|
1441
1441
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: CarouselComponent, decorators: [{
|
|
1442
1442
|
type: Component,
|
|
@@ -1463,21 +1463,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
1463
1463
|
'transitionDuration',
|
|
1464
1464
|
],
|
|
1465
1465
|
},
|
|
1466
|
-
], styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:
|
|
1466
|
+
], styles: [".et-carousel-host{--et-carousel-slide-easing: cubic-bezier(.25, .64, .44, 1);--et-carousel-dot-size: 10px;--et-carousel-dot-gap: 10px;--et-carousel-dot-radius: 5px;--et-carousel-dot-color: rgb(var(--et-color-primary, 51 51 51));--et-carousel-dot-color-hover: rgb(var(--et-color-primary-hover, 197 197 197));--et-carousel-dot-color-focus: rgb(var(--et-color-primary-focus, 197 197 197));--et-carousel-dot-color-active: rgb(var(--et-color-primary-active, 147 147 147));--et-carousel-dot-color-current: rgb(var(--et-color-primary, 255 255 255));--et-carousel-progress-inline-size: 50px;--_et-carousel-slide-duration: .5s}.et-carousel-host[transition-type=mask-slide]{--et-carousel-slide-translate: 125px;--_et-carousel-slide-direction-inactive: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);--_et-carousel-slide-direction-active: polygon(0 0, 100% 0, 100% 100%, 0 100%);--_et-carousel-slide-transform: translateX(var(--et-carousel-slide-translate));--_et-carousel-slide-transform-inverse: translateX(calc(var(--et-carousel-slide-translate) * -1))}.et-carousel-host[transition-type=mask-slide].et-carousel--slide-left{--_et-carousel-slide-direction-inactive: polygon(0 0, 0 0, 0 100%, 0% 100%);--_et-carousel-slide-transform: translateX(calc(var(--et-carousel-slide-translate) * -1));--_et-carousel-slide-transform-inverse: translateX(var(--et-carousel-slide-translate))}.et-carousel-host[transition-type=mask-slide] .et-carousel-item{transform:var(--_et-carousel-slide-transform);clip-path:var(--_et-carousel-slide-direction-inactive);filter:brightness(.5)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active,.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transition-timing-function:var(--et-carousel-slide-easing);transition-duration:var(--_et-carousel-slide-duration);transition-property:clip-path,transform,filter;clip-path:var(--_et-carousel-slide-direction-active)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.active{z-index:1;transform:translate(0);pointer-events:auto;filter:brightness(1)}.et-carousel-host[transition-type=mask-slide] .et-carousel-item.previous-active{transform:var(--_et-carousel-slide-transform-inverse)}.et-carousel-items{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.et-carousel-item{grid-area:1/1/2/2;position:relative;pointer-events:none}.et-carousel-item-nav{list-style:none;padding:0;display:flex;gap:var(--et-carousel-dot-gap)}.et-carousel-item-nav .et-carousel-item-nav-button{inline-size:10px;block-size:var(--et-carousel-dot-size);border-radius:var(--et-carousel-dot-radius);background-color:var(--et-carousel-dot-color);border:0;padding:0;overflow:hidden;transition:inline-size var(--_et-carousel-slide-duration) var(--et-carousel-slide-easing),background-color .1s linear;cursor:pointer}.et-carousel-item-nav .et-carousel-item-nav-button--progressing{inline-size:var(--et-carousel-progress-inline-size)}.et-carousel-item-nav .et-carousel-item-nav-button--progressing .et-carousel-item-nav-button-progress{transition:transform .1s linear}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):hover{background-color:var(--et-carousel-dot-color-hover)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing):active{background-color:var(--et-carousel-dot-color-active)}.et-carousel-item-nav .et-carousel-item-nav-button:not(.et-carousel-item-nav .et-carousel-item-nav-button--progressing).et-carousel-item-nav-button--active-static{background-color:var(--et-carousel-dot-color-current)}.et-carousel-item-nav .et-carousel-item-nav-button-progress{inline-size:100%;block-size:100%;background-color:var(--et-carousel-dot-color-current);transform-origin:left;transform:scaleX(var(--_et-carousel-item-nav-button-progress, 0))}\n"] }]
|
|
1467
1467
|
}], ctorParameters: () => [] });
|
|
1468
1468
|
|
|
1469
1469
|
const CAROUSEL_ITEM_NAV_TOKEN = new InjectionToken('CAROUSEL_ITEM_NAV_TOKEN');
|
|
1470
1470
|
class CarouselItemNavDirective {
|
|
1471
1471
|
constructor() {
|
|
1472
1472
|
this.carousel = inject(CAROUSEL_TOKEN);
|
|
1473
|
-
this.items = computed(() => {
|
|
1474
|
-
const carouselItems = this.carousel.items();
|
|
1475
|
-
return carouselItems.map((item, index) => ({
|
|
1476
|
-
item,
|
|
1477
|
-
isActive: this.carousel.activeIndex() === index,
|
|
1478
|
-
}));
|
|
1479
|
-
});
|
|
1480
1473
|
this.autoPlayProgress = this.carousel.activeItemAutoPlayProgress;
|
|
1474
|
+
this.autoPlayEnabled = this.carousel.autoPlay;
|
|
1481
1475
|
}
|
|
1482
1476
|
goTo(index) {
|
|
1483
1477
|
this.carousel.goTo(index);
|
|
@@ -1510,17 +1504,17 @@ class CarouselItemNavComponent {
|
|
|
1510
1504
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: CarouselItemNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1511
1505
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: CarouselItemNavComponent, isStandalone: true, selector: "et-carousel-item-nav", host: { classAttribute: "et-carousel-item-nav-host" }, hostDirectives: [{ directive: CarouselItemNavDirective }], ngImport: i0, template: `
|
|
1512
1506
|
<ul class="et-carousel-item-nav">
|
|
1513
|
-
@for (item of nav.items(); track $index) {
|
|
1507
|
+
@for (item of nav.carousel.items(); track $index) {
|
|
1514
1508
|
<li class="et-carousel-item-nav-item">
|
|
1515
1509
|
<button
|
|
1516
|
-
[class.et-carousel-item-nav-button--progressing]="item.isActive && nav.
|
|
1517
|
-
[class.et-carousel-item-nav-button--active-static]="item.isActive && nav.
|
|
1510
|
+
[class.et-carousel-item-nav-button--progressing]="item.isActive() && nav.autoPlayEnabled()"
|
|
1511
|
+
[class.et-carousel-item-nav-button--active-static]="item.isActive() && !nav.autoPlayEnabled()"
|
|
1518
1512
|
(click)="nav.goTo($index)"
|
|
1519
1513
|
class="et-carousel-item-nav-button"
|
|
1520
1514
|
type="button"
|
|
1521
1515
|
>
|
|
1522
1516
|
<div
|
|
1523
|
-
[style.--_et-carousel-item-nav-button-progress]="item.isActive ? nav.autoPlayProgress() : 0"
|
|
1517
|
+
[style.--_et-carousel-item-nav-button-progress]="item.isActive() ? nav.autoPlayProgress() : 0"
|
|
1524
1518
|
class="et-carousel-item-nav-button-progress"
|
|
1525
1519
|
></div>
|
|
1526
1520
|
</button>
|
|
@@ -1535,17 +1529,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
|
|
|
1535
1529
|
selector: 'et-carousel-item-nav',
|
|
1536
1530
|
template: `
|
|
1537
1531
|
<ul class="et-carousel-item-nav">
|
|
1538
|
-
@for (item of nav.items(); track $index) {
|
|
1532
|
+
@for (item of nav.carousel.items(); track $index) {
|
|
1539
1533
|
<li class="et-carousel-item-nav-item">
|
|
1540
1534
|
<button
|
|
1541
|
-
[class.et-carousel-item-nav-button--progressing]="item.isActive && nav.
|
|
1542
|
-
[class.et-carousel-item-nav-button--active-static]="item.isActive && nav.
|
|
1535
|
+
[class.et-carousel-item-nav-button--progressing]="item.isActive() && nav.autoPlayEnabled()"
|
|
1536
|
+
[class.et-carousel-item-nav-button--active-static]="item.isActive() && !nav.autoPlayEnabled()"
|
|
1543
1537
|
(click)="nav.goTo($index)"
|
|
1544
1538
|
class="et-carousel-item-nav-button"
|
|
1545
1539
|
type="button"
|
|
1546
1540
|
>
|
|
1547
1541
|
<div
|
|
1548
|
-
[style.--_et-carousel-item-nav-button-progress]="item.isActive ? nav.autoPlayProgress() : 0"
|
|
1542
|
+
[style.--_et-carousel-item-nav-button-progress]="item.isActive() ? nav.autoPlayProgress() : 0"
|
|
1549
1543
|
class="et-carousel-item-nav-button-progress"
|
|
1550
1544
|
></div>
|
|
1551
1545
|
</button>
|