@rolatech/angular-components 17.7.0 → 17.7.1
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/esm2022/lib/rich-item/rich-item.component.mjs +4 -3
- package/esm2022/lib/thumbnail/thumbnail.component.mjs +2 -2
- package/fesm2022/rolatech-angular-components.mjs +4 -3
- package/fesm2022/rolatech-angular-components.mjs.map +1 -1
- package/lib/rich-item/rich-item.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -9,14 +9,15 @@ export class RichItemComponent {
|
|
|
9
9
|
title = input();
|
|
10
10
|
subtitle = input();
|
|
11
11
|
price = input(0);
|
|
12
|
+
thumbnailRatio = input('rectangle');
|
|
12
13
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.4", ngImport: i0, type: RichItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.4", type: RichItemComponent, isStandalone: true, selector: "rolatech-rich-item", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-item": "this.hasClass" } }, ngImport: i0, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" ratio=\"
|
|
14
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.4", type: RichItemComponent, isStandalone: true, selector: "rolatech-rich-item", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, thumbnailRatio: { classPropertyName: "thumbnailRatio", publicName: "thumbnailRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-item": "this.hasClass" } }, ngImport: i0, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">\u00A5{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [import("../thumbnail/thumbnail.component").then(m => m.ThumbnailComponent)]] });
|
|
14
15
|
}
|
|
15
16
|
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.4", ngImport: i0, type: RichItemComponent, resolveDeferredDeps: () => [import("../thumbnail/thumbnail.component").then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
16
17
|
type: Component,
|
|
17
|
-
args: [{ selector: 'rolatech-rich-item', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" ratio=\"
|
|
18
|
+
args: [{ selector: 'rolatech-rich-item', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">\u00A5{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
|
|
18
19
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
19
20
|
type: HostBinding,
|
|
20
21
|
args: ['class.rolatech-rich-item']
|
|
21
22
|
}] } }) });
|
|
22
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
23
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmljaC1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYW5ndWxhci1jb21wb25lbnRzL3NyYy9saWIvcmljaC1pdGVtL3JpY2gtaXRlbS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL3JpY2gtaXRlbS9yaWNoLWl0ZW0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsaUJBQWlCLEVBQUUsZ0JBQWdCLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ25HLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7QUFXL0MsTUFBTSxPQUFPLGlCQUFpQjtJQUNhLFFBQVEsR0FBRyxJQUFJLENBQUM7SUFDekQsSUFBSSxHQUFHLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO0lBQ3JELFNBQVMsR0FBRyxLQUFLLEVBQVUsQ0FBQztJQUM1QixNQUFNLEdBQUcsS0FBSyxFQUFVLENBQUM7SUFDekIsS0FBSyxHQUFHLEtBQUssRUFBVSxDQUFDO0lBQ3hCLFFBQVEsR0FBRyxLQUFLLEVBQVUsQ0FBQztJQUMzQixLQUFLLEdBQUcsS0FBSyxDQUFNLENBQUMsQ0FBQyxDQUFDO0lBQ3RCLGNBQWMsR0FBRyxLQUFLLENBQVMsV0FBVyxDQUFDLENBQUM7dUdBUmpDLGlCQUFpQjsyRkFBakIsaUJBQWlCLHloQ0NaOUIsaTFCQXVCQSw0ZERoQlksWUFBWTs7Z0dBS1gsaUJBQWlCO3NCQVI3QixTQUFTO21DQUNFLG9CQUFvQixjQUNsQixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsa0JBQWtCLENBQUMsaUJBRzVCLGlCQUFpQixDQUFDLElBQUk7d0RBR0ksUUFBUTswQkFBaEQsV0FBVzsyQkFBQywwQkFBMEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEhvc3RCaW5kaW5nLCBWaWV3RW5jYXBzdWxhdGlvbiwgYm9vbGVhbkF0dHJpYnV0ZSwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBUaHVtYm5haWxDb21wb25lbnQgfSBmcm9tICcuLi90aHVtYm5haWwvdGh1bWJuYWlsLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3JvbGF0ZWNoLXJpY2gtaXRlbScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIFRodW1ibmFpbENvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9yaWNoLWl0ZW0uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vcmljaC1pdGVtLmNvbXBvbmVudC5zY3NzJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgUmljaEl0ZW1Db21wb25lbnQge1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLnJvbGF0ZWNoLXJpY2gtaXRlbScpIGhhc0NsYXNzID0gdHJ1ZTtcbiAgbGlzdCA9IGlucHV0KGZhbHNlLCB7IHRyYW5zZm9ybTogYm9vbGVhbkF0dHJpYnV0ZSB9KTtcbiAgdGh1bWJuYWlsID0gaW5wdXQ8c3RyaW5nPigpO1xuICBhdmF0YXIgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIHRpdGxlID0gaW5wdXQ8c3RyaW5nPigpO1xuICBzdWJ0aXRsZSA9IGlucHV0PHN0cmluZz4oKTtcbiAgcHJpY2UgPSBpbnB1dDxhbnk+KDApO1xuICB0aHVtYm5haWxSYXRpbyA9IGlucHV0PHN0cmluZz4oJ3JlY3RhbmdsZScpO1xufVxuIiwiPGRpdiBpZD1cInRodW1ibmFpbFwiIGNsYXNzPVwicm9sYXRlY2gtcmljaC1pdGVtXCI+XG4gIEBkZWZlciAob24gdmlld3BvcnQoKSkge1xuICAgIDxyb2xhdGVjaC10aHVtYm5haWwgW3NyY109XCJ0aHVtYm5haWwoKVwiIHNpemU9XCJtZWRpdW1cIiBbcmF0aW9dPVwidGh1bWJuYWlsUmF0aW8oKVwiPjwvcm9sYXRlY2gtdGh1bWJuYWlsPlxuICB9IEBwbGFjZWhvbGRlciB7XG4gICAgPGRpdiBjbGFzcz1cImJnLVstLXJ0LTEwLXBlcmNlbnQtbGF5ZXJdIGgtZnVsbCB3LWZ1bGwgb2JqZWN0LWNvdmVyIGFzcGVjdC12aWRlbyByb3VuZGVkLWxnXCI+PC9kaXY+XG4gIH1cbjwvZGl2PlxuPGRpdiBpZD1cImRldGFpbHNcIiBjbGFzcz1cInJvbGF0ZWNoLXJpY2gtaXRlbVwiPlxuICA8ZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJweS0xXCI+XG4gICAgICA8YSBjbGFzcz1cIm1kOnRleHQteGwgZm9udC1ib2xkIGJyZWFrLXdvcmRzIGxpbmUtY2xhbXAtMSBtZDpsaW5lLWNsYW1wLTIgd2hpdGVzcGFjZS1ub3JtYWxcIj5cbiAgICAgICAge3sgdGl0bGUoKSB9fVxuICAgICAgPC9hPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJpbnZpc2libGUgaC0wIG1kOmgtYXV0byBtZDp2aXNpYmxlIGJyZWFrLXdvcmRzIGxpbmUtY2xhbXAtMSB3aGl0ZXNwYWNlLW5vcm1hbFwiPlxuICAgICAge3sgc3VidGl0bGUoKSB9fVxuICAgIDwvZGl2PlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9kaXY+XG4gIEBpZiAocHJpY2UoKSkge1xuICAgIDxkaXYgY2xhc3M9XCJtZDp0ZXh0LWxnIGZvbnQtYm9sZCBweS0xXCI+wqV7eyBwcmljZSgpIH19PC9kaXY+XG4gIH1cbjwvZGl2PlxuIl19
|
|
@@ -8,7 +8,7 @@ export class ThumbnailComponent {
|
|
|
8
8
|
src = input();
|
|
9
9
|
size = input();
|
|
10
10
|
mode = input('clip'); // full, clip
|
|
11
|
-
ratio = input('
|
|
11
|
+
ratio = input('rectangle'); // rectangle, square
|
|
12
12
|
img = viewChild.required('img');
|
|
13
13
|
width = input();
|
|
14
14
|
height = input();
|
|
@@ -43,4 +43,4 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.4", ng
|
|
|
43
43
|
type: HostBinding,
|
|
44
44
|
args: ['style.--rt-thumbnail-padding-top']
|
|
45
45
|
}] } }) });
|
|
46
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
46
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGh1bWJuYWlsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYW5ndWxhci1jb21wb25lbnRzL3NyYy9saWIvdGh1bWJuYWlsL3RodW1ibmFpbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL3RodW1ibmFpbC90aHVtYm5haWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsVUFBVSxFQUNWLFdBQVcsRUFDWCxTQUFTLEVBQ1QsaUJBQWlCLEVBQ2pCLE1BQU0sRUFDTixNQUFNLEVBQ04sS0FBSyxFQUNMLFNBQVMsR0FDVixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBWS9DLE1BQU0sT0FBTyxrQkFBa0I7SUFDWSxRQUFRLEdBQUcsSUFBSSxDQUFDO0lBQ1IsT0FBTyxHQUFHLFFBQVEsQ0FBQztJQUNwRSxFQUFFLEdBQUcsTUFBTSxDQUFDLENBQUEsVUFBdUIsQ0FBQSxDQUFDLENBQUM7SUFDckMsR0FBRyxHQUFHLEtBQUssRUFBVSxDQUFDO0lBQ3RCLElBQUksR0FBRyxLQUFLLEVBQVUsQ0FBQztJQUN2QixJQUFJLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsYUFBYTtJQUNuQyxLQUFLLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsb0JBQW9CO0lBQ2hELEdBQUcsR0FBRyxTQUFTLENBQUMsUUFBUSxDQUFhLEtBQUssQ0FBQyxDQUFDO0lBQzVDLEtBQUssR0FBRyxLQUFLLEVBQXNCLENBQUM7SUFDcEMsTUFBTSxHQUFHLEtBQUssRUFBc0IsQ0FBQztJQUNyQyxRQUFRLEdBQUcsTUFBTSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQzdCLEtBQUssR0FBRyxNQUFNLENBQUMsR0FBRyxFQUFFO1FBQ2xCLElBQUksQ0FBQyxRQUFRLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLE1BQU0sRUFBRSxJQUFJLENBQUMsSUFBSSxFQUFHLENBQUMsQ0FBQztJQUMxRSxDQUFDLENBQUMsQ0FBQztJQUNILElBQUksR0FBRyxNQUFNLENBQUMsR0FBRyxFQUFFO1FBQ2pCLElBQUksQ0FBQyxRQUFRLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLE1BQU0sRUFBRSxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQztRQUN2RSxJQUFJLElBQUksQ0FBQyxJQUFJLEVBQUUsS0FBSyxNQUFNLEVBQUUsQ0FBQztZQUMzQixJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQztnQkFDbEMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEVBQUUsY0FBYyxFQUFFLElBQUksQ0FBQyxLQUFLLEVBQUcsR0FBRyxJQUFJLENBQUMsTUFBTSxFQUFHLENBQUMsQ0FBQztZQUNoRyxDQUFDO2lCQUFNLENBQUM7Z0JBQ04sSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEVBQUUsY0FBYyxFQUFFLEVBQUUsR0FBRyxDQUFDLENBQUMsQ0FBQztZQUN4RSxDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0gsUUFBUSxHQUFHLE1BQU0sQ0FBQyxHQUFHLEVBQUU7UUFDckIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEVBQUUsT0FBTyxFQUFFLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxDQUFDO0lBQzNFLENBQUMsQ0FBQyxDQUFDO3VHQTNCUSxrQkFBa0I7MkZBQWxCLGtCQUFrQix3Z0NDeEIvQixxU0FRQSxnaUREVVksWUFBWTs7Z0dBTVgsa0JBQWtCO3NCQVQ5QixTQUFTO21DQUNFLG9CQUFvQixjQUNsQixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsY0FBYyxDQUFDLGlCQUd4QixpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNO3dEQUdOLFFBQVE7MEJBQWhELFdBQVc7MkJBQUMsMEJBQTBCO29CQUNVLE9BQU87MEJBQXZELFdBQVc7MkJBQUMsa0NBQWtDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgRWxlbWVudFJlZixcbiAgSG9zdEJpbmRpbmcsXG4gIFJlbmRlcmVyMixcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG4gIGVmZmVjdCxcbiAgaW5qZWN0LFxuICBpbnB1dCxcbiAgdmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBJbWFnZUNvbXBvbmVudCB9IGZyb20gJy4uL2ltYWdlL2ltYWdlLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3JvbGF0ZWNoLXRodW1ibmFpbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEltYWdlQ29tcG9uZW50XSxcbiAgdGVtcGxhdGVVcmw6ICcuL3RodW1ibmFpbC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi90aHVtYm5haWwuY29tcG9uZW50LnNjc3MnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgVGh1bWJuYWlsQ29tcG9uZW50IHtcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5ydC1yaWNoLWdyaWQtbWVkaWEnKSBoYXNDbGFzcyA9IHRydWU7XG4gIEBIb3N0QmluZGluZygnc3R5bGUuLS1ydC10aHVtYm5haWwtcGFkZGluZy10b3AnKSBteUNvbG9yID0gJzU2LjI1JSc7XG4gIGVsID0gaW5qZWN0KEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+KTtcbiAgc3JjID0gaW5wdXQ8c3RyaW5nPigpO1xuICBzaXplID0gaW5wdXQ8c3RyaW5nPigpO1xuICBtb2RlID0gaW5wdXQoJ2NsaXAnKTsgLy8gZnVsbCwgY2xpcFxuICByYXRpbyA9IGlucHV0KCdyZWN0YW5nbGUnKTsgLy8gcmVjdGFuZ2xlLCBzcXVhcmVcbiAgaW1nID0gdmlld0NoaWxkLnJlcXVpcmVkPEVsZW1lbnRSZWY+KCdpbWcnKTtcbiAgd2lkdGggPSBpbnB1dDxudW1iZXIgfCB1bmRlZmluZWQ+KCk7XG4gIGhlaWdodCA9IGlucHV0PG51bWJlciB8IHVuZGVmaW5lZD4oKTtcbiAgcmVuZGVyZXIgPSBpbmplY3QoUmVuZGVyZXIyKTtcbiAgc2l6ZWEgPSBlZmZlY3QoKCkgPT4ge1xuICAgIHRoaXMucmVuZGVyZXIuc2V0QXR0cmlidXRlKHRoaXMuZWwubmF0aXZlRWxlbWVudCwgJ3NpemUnLCB0aGlzLnNpemUoKSEpO1xuICB9KTtcbiAgZnVsbCA9IGVmZmVjdCgoKSA9PiB7XG4gICAgdGhpcy5yZW5kZXJlci5zZXRBdHRyaWJ1dGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCAnbW9kZScsIHRoaXMubW9kZSgpKTtcbiAgICBpZiAodGhpcy5tb2RlKCkgPT09ICdmdWxsJykge1xuICAgICAgaWYgKHRoaXMud2lkdGgoKSAmJiB0aGlzLmhlaWdodCgpKSB7XG4gICAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCAnYXNwZWN0LXJhdGlvJywgdGhpcy53aWR0aCgpISAvIHRoaXMuaGVpZ2h0KCkhKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCAnYXNwZWN0LXJhdGlvJywgMTYgLyA5KTtcbiAgICAgIH1cbiAgICB9XG4gIH0pO1xuICByYXRpb1NldCA9IGVmZmVjdCgoKSA9PiB7XG4gICAgdGhpcy5yZW5kZXJlci5zZXRBdHRyaWJ1dGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCAncmF0aW8nLCB0aGlzLnJhdGlvKCkpO1xuICB9KTtcbn1cbiIsIjxkaXYgI2VkZ2UgY2xhc3M9XCJhYnNvbHV0ZSB0b3AtMCBsZWZ0LTBcIj48L2Rpdj5cbkBkZWZlciAob24gdmlld3BvcnQoZWRnZSkpIHtcbiAgPGEgaWQ9XCJ0aHVtYm5haWxcIiBjbGFzcz1cInJ0LXRodW1ibmFpbFwiPlxuICAgIDxyb2xhdGVjaC1pbWFnZSBbc3JjXT1cInNyYygpXCI+IDwvcm9sYXRlY2gtaW1hZ2U+XG4gIDwvYT5cbn0gQHBsYWNlaG9sZGVyIHtcbiAgPGRpdiBjbGFzcz1cImJnLVstLXJ0LXJhaXNlZC1iYWNrZ3JvdW5kXSB3LWZ1bGwgaC1mdWxsIHJvdW5kZWQtbGdcIj48L2Rpdj5cbn1cbiJdfQ==
|
|
@@ -1259,7 +1259,7 @@ class ThumbnailComponent {
|
|
|
1259
1259
|
src = input();
|
|
1260
1260
|
size = input();
|
|
1261
1261
|
mode = input('clip'); // full, clip
|
|
1262
|
-
ratio = input('
|
|
1262
|
+
ratio = input('rectangle'); // rectangle, square
|
|
1263
1263
|
img = viewChild.required('img');
|
|
1264
1264
|
width = input();
|
|
1265
1265
|
height = input();
|
|
@@ -1642,12 +1642,13 @@ class RichItemComponent {
|
|
|
1642
1642
|
title = input();
|
|
1643
1643
|
subtitle = input();
|
|
1644
1644
|
price = input(0);
|
|
1645
|
+
thumbnailRatio = input('rectangle');
|
|
1645
1646
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.4", ngImport: i0, type: RichItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1646
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.4", type: RichItemComponent, isStandalone: true, selector: "rolatech-rich-item", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-item": "this.hasClass" } }, ngImport: i0, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" ratio=\"
|
|
1647
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.4", type: RichItemComponent, isStandalone: true, selector: "rolatech-rich-item", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, thumbnailRatio: { classPropertyName: "thumbnailRatio", publicName: "thumbnailRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-item": "this.hasClass" } }, ngImport: i0, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">\u00A5{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)]] });
|
|
1647
1648
|
}
|
|
1648
1649
|
i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.4", ngImport: i0, type: RichItemComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return thumbnail_component; }).then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
|
|
1649
1650
|
type: Component,
|
|
1650
|
-
args: [{ selector: 'rolatech-rich-item', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" ratio=\"
|
|
1651
|
+
args: [{ selector: 'rolatech-rich-item', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div id=\"thumbnail\" class=\"rolatech-rich-item\">\n @defer (on viewport()) {\n <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" [ratio]=\"thumbnailRatio()\"></rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-10-percent-layer] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n</div>\n<div id=\"details\" class=\"rolatech-rich-item\">\n <div>\n <div class=\"py-1\">\n <a class=\"md:text-xl font-bold break-words line-clamp-1 md:line-clamp-2 whitespace-normal\">\n {{ title() }}\n </a>\n </div>\n <div class=\"invisible h-0 md:h-auto md:visible break-words line-clamp-1 whitespace-normal\">\n {{ subtitle() }}\n </div>\n <ng-content></ng-content>\n </div>\n @if (price()) {\n <div class=\"md:text-lg font-bold py-1\">\u00A5{{ price() }}</div>\n }\n</div>\n", styles: ["rolatech-rich-item{--rt-rich-view-item-margin: 16px;display:flex;position:relative;cursor:pointer;flex-direction:column;margin-left:calc(var(--rt-rich-view-item-margin) / 2);margin-right:calc(var(--rt-rich-view-item-margin) / 2);width:calc(100% / var(--rt-rich-view-items-per-row) - var(--rt-rich-view-item-margin) - .01px)}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
|
|
1651
1652
|
}], ctorParameters: null, propDecorators: { hasClass: [{
|
|
1652
1653
|
type: HostBinding,
|
|
1653
1654
|
args: ['class.rolatech-rich-item']
|