@spartacus/storefront
Version:
Spartacus Storefront is a package that you can include in your application, which allows you to add default storefront features.
38 lines • 8.37 kB
JavaScript
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { filter, map } from 'rxjs/operators';
import * as i0 from "@angular/core";
import * as i1 from "../../../../cms-structure/page/model/cms-component-data";
import * as i2 from "@spartacus/core";
import * as i3 from "../../../../shared/components/carousel/carousel.component";
import * as i4 from "../../../../shared/components/media/media.component";
import * as i5 from "@angular/router";
import * as i6 from "@angular/common";
export class ProductCarouselComponent {
constructor(componentData, productService) {
this.componentData = componentData;
this.productService = productService;
this.PRODUCT_SCOPE = "list" /* LIST */;
this.componentData$ = this.componentData.data$.pipe(filter(Boolean));
/**
* returns an Observable string for the title.
*/
this.title$ = this.componentData$.pipe(map((data) => data.title));
/**
* Observable that holds an Array of Observables. This is done, so that
* the component UI could consider to lazy load the UI components when they're
* in the viewpoint.
*/
this.items$ = this.componentData$.pipe(map((data) => { var _a, _b; return (_b = (_a = data.productCodes) === null || _a === void 0 ? void 0 : _a.trim().split(' ')) !== null && _b !== void 0 ? _b : []; }), map((codes) => codes.map((code) => this.productService.get(code, [this.PRODUCT_SCOPE, "price" /* PRICE */]))));
}
}
ProductCarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ProductCarouselComponent, deps: [{ token: i1.CmsComponentData }, { token: i2.ProductService }], target: i0.ɵɵFactoryTarget.Component });
ProductCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ProductCarouselComponent, selector: "cx-product-carousel", ngImport: i0, template: "<cx-carousel\n [items]=\"items$ | async\"\n [title]=\"title$ | async\"\n [template]=\"carouselItem\"\n itemWidth=\"285px\"\n>\n</cx-carousel>\n\n<ng-template #carouselItem let-item=\"item\">\n <a tabindex=\"0\" [routerLink]=\"{ cxRoute: 'product', params: item } | cxUrl\">\n <cx-media\n [container]=\"item.images?.PRIMARY\"\n format=\"product\"\n [alt]=\"item.name\"\n ></cx-media>\n <h3>\n {{ item.name }}\n </h3>\n <div class=\"price\">\n {{ item.price?.formattedValue }}\n </div>\n </a>\n</ng-template>\n", components: [{ type: i3.CarouselComponent, selector: "cx-carousel", inputs: ["title", "items", "template", "itemWidth", "hideIndicators", "indicatorIcon", "previousIcon", "nextIcon"] }, { type: i4.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }], directives: [{ type: i5.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "async": i6.AsyncPipe, "cxUrl": i2.UrlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ProductCarouselComponent, decorators: [{
type: Component,
args: [{
selector: 'cx-product-carousel',
templateUrl: './product-carousel.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
}]
}], ctorParameters: function () { return [{ type: i1.CmsComponentData }, { type: i2.ProductService }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZHVjdC1jYXJvdXNlbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zdG9yZWZyb250bGliL2Ntcy1jb21wb25lbnRzL3Byb2R1Y3QvY2Fyb3VzZWwvcHJvZHVjdC1jYXJvdXNlbC9wcm9kdWN0LWNhcm91c2VsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3N0b3JlZnJvbnRsaWIvY21zLWNvbXBvbmVudHMvcHJvZHVjdC9jYXJvdXNlbC9wcm9kdWN0LWNhcm91c2VsL3Byb2R1Y3QtY2Fyb3VzZWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQVFuRSxPQUFPLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7OztBQVE3QyxNQUFNLE9BQU8sd0JBQXdCO0lBNEJuQyxZQUNZLGFBQXNDLEVBQ3RDLGNBQThCO1FBRDlCLGtCQUFhLEdBQWIsYUFBYSxDQUF5QjtRQUN0QyxtQkFBYyxHQUFkLGNBQWMsQ0FBZ0I7UUE3QnZCLGtCQUFhLHFCQUFxQjtRQUU3QyxtQkFBYyxHQUFzQixJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQ3ZFLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FDaEIsQ0FBQztRQUVGOztXQUVHO1FBQ0gsV0FBTSxHQUF1QixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FDbkQsR0FBRyxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQzFCLENBQUM7UUFFRjs7OztXQUlHO1FBQ0gsV0FBTSxHQUFzQyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FDbEUsR0FBRyxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUUsZUFBQyxPQUFBLE1BQUEsTUFBQSxJQUFJLENBQUMsWUFBWSwwQ0FBRSxJQUFJLEdBQUcsS0FBSyxDQUFDLEdBQUcsQ0FBQyxtQ0FBSSxFQUFFLENBQUEsRUFBQSxDQUFDLEVBQ3pELEdBQUcsQ0FBQyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQ1osS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFLENBQ2pCLElBQUksQ0FBQyxjQUFjLENBQUMsR0FBRyxDQUFDLElBQUksRUFBRSxDQUFDLElBQUksQ0FBQyxhQUFhLHNCQUFxQixDQUFDLENBQ3hFLENBQ0YsQ0FDRixDQUFDO0lBS0MsQ0FBQzs7cUhBL0JPLHdCQUF3Qjt5R0FBeEIsd0JBQXdCLDJEQ2hCckMsK2lCQXVCQTsyRkRQYSx3QkFBd0I7a0JBTHBDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHFCQUFxQjtvQkFDL0IsV0FBVyxFQUFFLG1DQUFtQztvQkFDaEQsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07aUJBQ2hEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgQ21zUHJvZHVjdENhcm91c2VsQ29tcG9uZW50IGFzIG1vZGVsLFxuICBQcm9kdWN0LFxuICBQcm9kdWN0U2NvcGUsXG4gIFByb2R1Y3RTZXJ2aWNlLFxufSBmcm9tICdAc3BhcnRhY3VzL2NvcmUnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgZmlsdGVyLCBtYXAgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5pbXBvcnQgeyBDbXNDb21wb25lbnREYXRhIH0gZnJvbSAnLi4vLi4vLi4vLi4vY21zLXN0cnVjdHVyZS9wYWdlL21vZGVsL2Ntcy1jb21wb25lbnQtZGF0YSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2N4LXByb2R1Y3QtY2Fyb3VzZWwnLFxuICB0ZW1wbGF0ZVVybDogJy4vcHJvZHVjdC1jYXJvdXNlbC5jb21wb25lbnQuaHRtbCcsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBQcm9kdWN0Q2Fyb3VzZWxDb21wb25lbnQge1xuICBwcm90ZWN0ZWQgcmVhZG9ubHkgUFJPRFVDVF9TQ09QRSA9IFByb2R1Y3RTY29wZS5MSVNUO1xuXG4gIHByaXZhdGUgY29tcG9uZW50RGF0YSQ6IE9ic2VydmFibGU8bW9kZWw+ID0gdGhpcy5jb21wb25lbnREYXRhLmRhdGEkLnBpcGUoXG4gICAgZmlsdGVyKEJvb2xlYW4pXG4gICk7XG5cbiAgLyoqXG4gICAqIHJldHVybnMgYW4gT2JzZXJ2YWJsZSBzdHJpbmcgZm9yIHRoZSB0aXRsZS5cbiAgICovXG4gIHRpdGxlJDogT2JzZXJ2YWJsZTxzdHJpbmc+ID0gdGhpcy5jb21wb25lbnREYXRhJC5waXBlKFxuICAgIG1hcCgoZGF0YSkgPT4gZGF0YS50aXRsZSlcbiAgKTtcblxuICAvKipcbiAgICogT2JzZXJ2YWJsZSB0aGF0IGhvbGRzIGFuIEFycmF5IG9mIE9ic2VydmFibGVzLiBUaGlzIGlzIGRvbmUsIHNvIHRoYXRcbiAgICogdGhlIGNvbXBvbmVudCBVSSBjb3VsZCBjb25zaWRlciB0byBsYXp5IGxvYWQgdGhlIFVJIGNvbXBvbmVudHMgd2hlbiB0aGV5J3JlXG4gICAqIGluIHRoZSB2aWV3cG9pbnQuXG4gICAqL1xuICBpdGVtcyQ6IE9ic2VydmFibGU8T2JzZXJ2YWJsZTxQcm9kdWN0PltdPiA9IHRoaXMuY29tcG9uZW50RGF0YSQucGlwZShcbiAgICBtYXAoKGRhdGEpID0+IGRhdGEucHJvZHVjdENvZGVzPy50cmltKCkuc3BsaXQoJyAnKSA/PyBbXSksXG4gICAgbWFwKChjb2RlcykgPT5cbiAgICAgIGNvZGVzLm1hcCgoY29kZSkgPT5cbiAgICAgICAgdGhpcy5wcm9kdWN0U2VydmljZS5nZXQoY29kZSwgW3RoaXMuUFJPRFVDVF9TQ09QRSwgUHJvZHVjdFNjb3BlLlBSSUNFXSlcbiAgICAgIClcbiAgICApXG4gICk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJvdGVjdGVkIGNvbXBvbmVudERhdGE6IENtc0NvbXBvbmVudERhdGE8bW9kZWw+LFxuICAgIHByb3RlY3RlZCBwcm9kdWN0U2VydmljZTogUHJvZHVjdFNlcnZpY2VcbiAgKSB7fVxufVxuIiwiPGN4LWNhcm91c2VsXG4gIFtpdGVtc109XCJpdGVtcyQgfCBhc3luY1wiXG4gIFt0aXRsZV09XCJ0aXRsZSQgfCBhc3luY1wiXG4gIFt0ZW1wbGF0ZV09XCJjYXJvdXNlbEl0ZW1cIlxuICBpdGVtV2lkdGg9XCIyODVweFwiXG4+XG48L2N4LWNhcm91c2VsPlxuXG48bmctdGVtcGxhdGUgI2Nhcm91c2VsSXRlbSBsZXQtaXRlbT1cIml0ZW1cIj5cbiAgPGEgdGFiaW5kZXg9XCIwXCIgW3JvdXRlckxpbmtdPVwieyBjeFJvdXRlOiAncHJvZHVjdCcsIHBhcmFtczogaXRlbSB9IHwgY3hVcmxcIj5cbiAgICA8Y3gtbWVkaWFcbiAgICAgIFtjb250YWluZXJdPVwiaXRlbS5pbWFnZXM/LlBSSU1BUllcIlxuICAgICAgZm9ybWF0PVwicHJvZHVjdFwiXG4gICAgICBbYWx0XT1cIml0ZW0ubmFtZVwiXG4gICAgPjwvY3gtbWVkaWE+XG4gICAgPGgzPlxuICAgICAge3sgaXRlbS5uYW1lIH19XG4gICAgPC9oMz5cbiAgICA8ZGl2IGNsYXNzPVwicHJpY2VcIj5cbiAgICAgIHt7IGl0ZW0ucHJpY2U/LmZvcm1hdHRlZFZhbHVlIH19XG4gICAgPC9kaXY+XG4gIDwvYT5cbjwvbmctdGVtcGxhdGU+XG4iXX0=