@rolatech/angular-property 20.1.6-beta.1 → 20.1.6-beta.11

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.
@@ -11,14 +11,14 @@ import { MatTableModule } from '@angular/material/table';
11
11
  import * as i1$1 from '@angular/router';
12
12
  import { RouterLink, RouterModule, ActivatedRoute, Router, RouterLinkActive, RouterOutlet } from '@angular/router';
13
13
  import { ThumbnailComponent, ImagePlaceholderComponent, ToolbarComponent, SpinnerComponent, ImagePreviewDialogComponent, BaseComponent, AcceptDialogComponent, RejectDialogComponent, RichLabelComponent, AngularComponentsModule, ConfirmationDialogComponent, TabsComponent, TabComponent, EmptyComponent, ListComponent, ContainerComponent, SearchBar, MediaListComponent, MediaListItemComponent, InputComponent } from '@rolatech/angular-components';
14
- import { PropertyService, FeatureService, InvoiceService, PropertyHighlightsService, TimeZoneService, PropertySearchService, DialogService } from '@rolatech/angular-services';
14
+ import { PropertyService, FeatureService, InvoiceService, FloorplanService, PropertyHighlightsService, TimeZoneService, PaymentService, PropertySearchService, DialogService } from '@rolatech/angular-services';
15
15
  import * as i1 from '@angular/common';
16
16
  import { CommonModule, NgClass, isPlatformBrowser, ViewportScroller, KeyValuePipe, Location } from '@angular/common';
17
+ import { PricePipe, APP_CONFIG, AngularCommonModule, OptionsFormatPipe, DecimalDirective, DurationPipe, SafeUrlPipe } from '@rolatech/angular-common';
17
18
  import * as i2 from '@angular/material/icon';
18
19
  import { MatIconModule, MatIcon } from '@angular/material/icon';
19
20
  import { MatDialog } from '@angular/material/dialog';
20
21
  import { AuthUserService, AuthService, AuthGuard } from '@rolatech/angular-auth';
21
- import { APP_CONFIG, AngularCommonModule, OptionsFormatPipe, DecimalDirective, DurationPipe } from '@rolatech/angular-common';
22
22
  import * as i1$3 from '@angular/forms';
23
23
  import { FormsModule, FormControl, ReactiveFormsModule } from '@angular/forms';
24
24
  import * as i1$2 from '@angular/material/form-field';
@@ -29,7 +29,7 @@ import * as i5 from '@angular/material/select';
29
29
  import { MatSelectModule } from '@angular/material/select';
30
30
  import * as i1$5 from '@angular/material/chips';
31
31
  import { MatChipsModule } from '@angular/material/chips';
32
- import { startWith, map, distinctUntilChanged, switchMap, finalize, forkJoin, from, concatMap, take, Observable } from 'rxjs';
32
+ import { startWith, map, switchMap, distinctUntilChanged, finalize, forkJoin, from, concatMap, take, Observable } from 'rxjs';
33
33
  import { ENTER, COMMA } from '@angular/cdk/keycodes';
34
34
  import * as i4$2 from '@angular/material/autocomplete';
35
35
  import { MatAutocompleteModule } from '@angular/material/autocomplete';
@@ -103,14 +103,19 @@ var PropertyStatus;
103
103
  })(PropertyStatus || (PropertyStatus = {}));
104
104
  var PropertyType;
105
105
  (function (PropertyType) {
106
+ PropertyType["NOT_SPECIFIED"] = "Not specified";
107
+ PropertyType["HOUSE"] = "House";
106
108
  PropertyType["APARTMENT"] = "Apartment";
107
- PropertyType["CONDO"] = "Condo";
108
- PropertyType["HOUSE"] = "Hourse";
109
- PropertyType["TOWNHOUSE"] = "Townhourse";
110
- PropertyType["LAND"] = "Land";
111
- PropertyType["COMMERCIAL"] = "Commercial";
112
- PropertyType["INDUSTRIAL"] = "Industrial";
109
+ PropertyType["ROOM"] = "Room";
110
+ PropertyType["HOUSE_DETACHED"] = "House detached";
111
+ PropertyType["HOUSE_TERRACED"] = "House terraced";
112
+ PropertyType["HOUSE_SEMI_DETACHED"] = "House semi detached";
113
113
  PropertyType["FLAT"] = "Flat";
114
+ PropertyType["STUDIO"] = "Studio";
115
+ PropertyType["MAISONETTE"] = "Maisonette";
116
+ PropertyType["BUNGALOW"] = "Bungalow";
117
+ PropertyType["PENTHOUSE"] = "Penthouse";
118
+ PropertyType["TOWNHOUSE"] = "Townhourse";
114
119
  PropertyType["OTHER"] = "Other";
115
120
  })(PropertyType || (PropertyType = {}));
116
121
  var PropertyInventoryStatus;
@@ -163,6 +168,7 @@ var PropertyOfferType;
163
168
  })(PropertyOfferType || (PropertyOfferType = {}));
164
169
  var PropertyOfferStatus;
165
170
  (function (PropertyOfferStatus) {
171
+ PropertyOfferStatus["CREATED"] = "Created";
166
172
  PropertyOfferStatus["PENDING"] = "Pending";
167
173
  PropertyOfferStatus["ACCEPTED"] = "Accepted";
168
174
  PropertyOfferStatus["REJECTED"] = "Rejected";
@@ -381,16 +387,16 @@ class PropertyManageItemComponent {
381
387
  publish() { }
382
388
  archived() { }
383
389
  delete() { }
384
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
385
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageItemComponent, isStandalone: true, selector: "rolatech-property-manage-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ property().price.toFixed(2) }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
390
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
391
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageItemComponent, isStandalone: true, selector: "rolatech-property-manage-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">{{ property().price | price }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
386
392
  }
387
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageItemComponent, decorators: [{
393
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageItemComponent, decorators: [{
388
394
  type: Component,
389
- args: [{ selector: 'rolatech-property-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ property().price.toFixed(2) }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"] }]
395
+ args: [{ selector: 'rolatech-property-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (property().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media ? property().media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">\n {{ property().title }}\n </div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">{{ property().price | price }}</div>\n</div>\n", styles: ["rolatech-property-manage-item{--rt-property-view-item-margin: 16px;width:calc(100% / var(--rt-property-view-items-per-row) - var(--rt-property-view-item-margin) - .01px)}rolatech-property-manage-item[list]{--rt-property-view-items-per-row: 1}\n"] }]
390
396
  }], ctorParameters: () => [], propDecorators: { hasClass: [{
391
397
  type: HostBinding,
392
398
  args: ['class.rolatech-property-manage-item']
393
- }] } });
399
+ }], property: [{ type: i0.Input, args: [{ isSignal: true, alias: "property", required: true }] }], thumbnail: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbnail", required: false }] }], list: [{ type: i0.Input, args: [{ isSignal: true, alias: "list", required: false }] }] } });
394
400
 
395
401
  class PropertyReviewIndexComponent {
396
402
  hasClass = true;
@@ -411,10 +417,10 @@ class PropertyReviewIndexComponent {
411
417
  },
412
418
  });
413
419
  }
414
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyReviewIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
415
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyReviewIndexComponent, isStandalone: true, selector: "rolatech-property-review-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\"> </rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n list\n [property]=\"item\"\n routerLink=\"./properties/{{ item.id }}\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n\n <!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }], encapsulation: i0.ViewEncapsulation.None });
420
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyReviewIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
421
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyReviewIndexComponent, isStandalone: true, selector: "rolatech-property-review-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\"> </rolatech-toolbar>\n@if (isLoading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties; track $index) {\n <rolatech-property-manage-item\n list\n [property]=\"item\"\n routerLink=\"./properties/{{ item.id }}\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n\n <!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }], encapsulation: i0.ViewEncapsulation.None });
416
422
  }
417
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyReviewIndexComponent, decorators: [{
423
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyReviewIndexComponent, decorators: [{
418
424
  type: Component,
419
425
  args: [{ selector: 'rolatech-property-review-index', imports: [
420
426
  MatButtonModule,
@@ -430,13 +436,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
430
436
  }], propDecorators: { hasClass: [{
431
437
  type: HostBinding,
432
438
  args: ['class.rolatech-property-manage-index']
433
- }] } });
439
+ }], paginator: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatPaginator), { isSignal: true }] }] } });
434
440
 
435
441
  class PropertyMediaComponent {
436
442
  hasClass = true;
437
443
  disableScrollbar = true;
438
444
  dialog = inject(MatDialog);
439
- media = input([], ...(ngDevMode ? [{ debugName: "media" }] : []));
445
+ media = input(...(ngDevMode ? [undefined, { debugName: "media" }] : []));
440
446
  min = input(false, ...(ngDevMode ? [{ debugName: "min" }] : []));
441
447
  mediaIndex = 0;
442
448
  onImageClick(i) {
@@ -453,29 +459,29 @@ class PropertyMediaComponent {
453
459
  });
454
460
  dialogRef.afterClosed().subscribe((result) => { });
455
461
  }
456
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
457
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyMediaComponent, isStandalone: true, selector: "rolatech-property-media", inputs: { media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-medi": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, ngImport: i0, template: "<div>\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media() ? media()[mediaIndex].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"flex overflow-y-hidden overflow-x-scroll scrollbar-hide pb-4\">\n @for (media of media(); track media; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"media.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
462
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
463
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyMediaComponent, isStandalone: true, selector: "rolatech-property-media", inputs: { media: { classPropertyName: "media", publicName: "media", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-property-medi": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, ngImport: i0, template: "<div>\n @if (media()?.length) {\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media()![mediaIndex]?.url ?? ''\" size=\"small\"> </rolatech-thumbnail>\n </div>\n\n <div class=\"flex overflow-y-hidden overflow-x-scroll scrollbar-hide pb-4\">\n @for (m of media()!; track m; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"m.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n } @else {\n <div class=\"aspect-video bg-[--rt-raised-background] flex items-center justify-center text-gray-400\">\n No media available\n </div>\n }\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
458
464
  }
459
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyMediaComponent, decorators: [{
465
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyMediaComponent, decorators: [{
460
466
  type: Component,
461
- args: [{ selector: 'rolatech-property-media', imports: [NgClass, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div>\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media() ? media()[mediaIndex].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"flex overflow-y-hidden overflow-x-scroll scrollbar-hide pb-4\">\n @for (media of media(); track media; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"media.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
467
+ args: [{ selector: 'rolatech-property-media', imports: [NgClass, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<div>\n @if (media()?.length) {\n <div class=\"object-cover aspect-video bg-[--rt-raised-background]\">\n <rolatech-thumbnail [src]=\"media()![mediaIndex]?.url ?? ''\" size=\"small\"> </rolatech-thumbnail>\n </div>\n\n <div class=\"flex overflow-y-hidden overflow-x-scroll scrollbar-hide pb-4\">\n @for (m of media()!; track m; let index = $index) {\n <div\n class=\"flex flex-row mt-3 mr-3 cursor-pointer rounded-md min-w-32\"\n (click)=\"mediaIndex = index\"\n [ngClass]=\"mediaIndex === index ? '' : 'opacity-30'\"\n >\n <rolatech-thumbnail [src]=\"m.url\" size=\"small\"></rolatech-thumbnail>\n </div>\n }\n </div>\n } @else {\n <div class=\"aspect-video bg-[--rt-raised-background] flex items-center justify-center text-gray-400\">\n No media available\n </div>\n }\n</div>\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}rolatech-rich-item{display:flex;position:relative;cursor:pointer;flex-direction:column}#details.rolatech-rich-item{display:flex;flex-direction:column;justify-content:space-between}\n"] }]
462
468
  }], propDecorators: { hasClass: [{
463
469
  type: HostBinding,
464
470
  args: ['class.rolatech-property-medi']
465
471
  }], disableScrollbar: [{
466
472
  type: HostBinding,
467
473
  args: ['class.scrollbar-hide']
468
- }] } });
474
+ }], media: [{ type: i0.Input, args: [{ isSignal: true, alias: "media", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }] } });
469
475
 
470
476
  class PropertyFeaturesComponent {
471
477
  features = input.required(...(ngDevMode ? [{ debugName: "features" }] : []));
472
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyFeaturesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
473
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyFeaturesComponent, isStandalone: true, selector: "rolatech-property-features", inputs: { features: { classPropertyName: "features", publicName: "features", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Features</div>\n <div class=\"flex flex-row flex-wrap items-center\">\n @for (feature of features(); track feature) {\n <div class=\"flex items-center mr-2\">\n <mat-icon>check</mat-icon>\n <span>{{ feature.label }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
478
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFeaturesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
479
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyFeaturesComponent, isStandalone: true, selector: "rolatech-property-features", inputs: { features: { classPropertyName: "features", publicName: "features", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Features</div>\n <div class=\"flex flex-row flex-wrap items-center\">\n @for (feature of features(); track feature) {\n <div class=\"flex items-center mr-2\">\n <mat-icon>check</mat-icon>\n <span>{{ feature.label }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
474
480
  }
475
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyFeaturesComponent, decorators: [{
481
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFeaturesComponent, decorators: [{
476
482
  type: Component,
477
483
  args: [{ selector: 'rolatech-property-features', imports: [CommonModule, MatIconModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Features</div>\n <div class=\"flex flex-row flex-wrap items-center\">\n @for (feature of features(); track feature) {\n <div class=\"flex items-center mr-2\">\n <mat-icon>check</mat-icon>\n <span>{{ feature.label }}</span>\n </div>\n }\n </div>\n</div>\n" }]
478
- }] });
484
+ }], propDecorators: { features: [{ type: i0.Input, args: [{ isSignal: true, alias: "features", required: true }] }] } });
479
485
 
480
486
  // src/app/utils/load-google-maps.ts
481
487
  let mapsLoadingPromise = null;
@@ -550,26 +556,26 @@ class PropertyLocationComponent {
550
556
  const map = new Map(this.mapElementRef().nativeElement, options);
551
557
  new AdvancedMarkerElement({ map, position: map.getCenter() });
552
558
  }
553
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
554
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.4", type: PropertyLocationComponent, isStandalone: true, selector: "rolatech-property-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "mapElementRef", first: true, predicate: ["mapElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Location</div>\n <div class=\"bg-[--rt-raised-background]\">\n <div class=\"map-container\">\n <div #mapElement id=\"map\"></div>\n </div>\n </div>\n</div>\n", styles: [".aspect-ratio-16-9{position:relative;width:100%;padding-bottom:56.25%;height:0}.map-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#map{position:absolute;top:0;left:0;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
559
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyLocationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
560
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.12", type: PropertyLocationComponent, isStandalone: true, selector: "rolatech-property-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "mapElementRef", first: true, predicate: ["mapElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Location</div>\n <div class=\"bg-[--rt-raised-background]\">\n <div class=\"map-container\">\n <div #mapElement id=\"map\"></div>\n </div>\n </div>\n</div>\n", styles: [".aspect-ratio-16-9{position:relative;width:100%;padding-bottom:56.25%;height:0}.map-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#map{position:absolute;top:0;left:0;width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
555
561
  }
556
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyLocationComponent, decorators: [{
562
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyLocationComponent, decorators: [{
557
563
  type: Component,
558
564
  args: [{ selector: 'rolatech-property-location', imports: [CommonModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Location</div>\n <div class=\"bg-[--rt-raised-background]\">\n <div class=\"map-container\">\n <div #mapElement id=\"map\"></div>\n </div>\n </div>\n</div>\n", styles: [".aspect-ratio-16-9{position:relative;width:100%;padding-bottom:56.25%;height:0}.map-container{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#map{position:absolute;top:0;left:0;width:100%;height:100%}\n"] }]
559
- }] });
565
+ }], propDecorators: { location: [{ type: i0.Input, args: [{ isSignal: true, alias: "location", required: true }] }], mapElementRef: [{ type: i0.ViewChild, args: ['mapElement', { isSignal: true }] }] } });
560
566
 
561
567
  class PropertyOwnerRendererComponent {
562
568
  name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
563
569
  avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
564
570
  username = input(...(ngDevMode ? [undefined, { debugName: "username" }] : []));
565
571
  subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
566
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOwnerRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
567
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyOwnerRendererComponent, isStandalone: true, selector: "rolatech-property-owner-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
572
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOwnerRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
573
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyOwnerRendererComponent, isStandalone: true, selector: "rolatech-property-owner-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
568
574
  }
569
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOwnerRendererComponent, decorators: [{
575
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOwnerRendererComponent, decorators: [{
570
576
  type: Component,
571
577
  args: [{ selector: 'rolatech-property-owner-renderer', imports: [AngularCommonModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-icon{transform:scale(.8);color:var(--rt-brand-color)}\n"] }]
572
- }] });
578
+ }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], avatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatar", required: false }] }], username: [{ type: i0.Input, args: [{ isSignal: true, alias: "username", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }] } });
573
579
 
574
580
  class PropertyAgentUpdate {
575
581
  authUserService = inject(AuthUserService);
@@ -591,10 +597,10 @@ class PropertyAgentUpdate {
591
597
  ngDoCheck() {
592
598
  this.output.emit(this.selectedAgentId);
593
599
  }
594
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentUpdate, deps: [], target: i0.ɵɵFactoryTarget.Component });
595
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentUpdate, isStandalone: true, selector: "rolatech-property-agent-update", outputs: { output: "output" }, ngImport: i0, template: "@if (!loading) {\n<mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"selectedAgentId\">\n @for (item of agents; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] });
600
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentUpdate, deps: [], target: i0.ɵɵFactoryTarget.Component });
601
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentUpdate, isStandalone: true, selector: "rolatech-property-agent-update", outputs: { output: "output" }, ngImport: i0, template: "@if (!loading) {\n<mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"selectedAgentId\">\n @for (item of agents; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }] });
596
602
  }
597
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentUpdate, decorators: [{
603
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentUpdate, decorators: [{
598
604
  type: Component,
599
605
  args: [{ selector: 'rolatech-property-agent-update', imports: [
600
606
  CommonModule,
@@ -603,7 +609,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
603
609
  MatInputModule,
604
610
  MatSelectModule,
605
611
  ], template: "@if (!loading) {\n<mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"selectedAgentId\">\n @for (item of agents; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n\n}\n", styles: ["mat-form-field{width:100%}\n"] }]
606
- }] });
612
+ }], propDecorators: { output: [{ type: i0.Output, args: ["output"] }] } });
607
613
 
608
614
  class PropertyReviewDetailComponent extends BaseComponent {
609
615
  propertyService = inject(PropertyService);
@@ -711,10 +717,10 @@ class PropertyReviewDetailComponent extends BaseComponent {
711
717
  },
712
718
  });
713
719
  }
714
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyReviewDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
715
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyReviewDetailComponent, isStandalone: true, selector: "rolatech-property-review-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: PropertyOwnerRendererComponent, selector: "rolatech-property-owner-renderer", inputs: ["name", "avatar", "username", "subtitle"] }] });
720
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyReviewDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
721
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyReviewDetailComponent, isStandalone: true, selector: "rolatech-property-review-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: PropertyOwnerRendererComponent, selector: "rolatech-property-owner-renderer", inputs: ["name", "avatar", "username", "subtitle"] }, { kind: "pipe", type: PricePipe, name: "price" }] });
716
722
  }
717
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyReviewDetailComponent, decorators: [{
723
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyReviewDetailComponent, decorators: [{
718
724
  type: Component,
719
725
  args: [{ selector: 'rolatech-property-review-detail', imports: [
720
726
  CommonModule,
@@ -725,7 +731,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
725
731
  PropertyLocationComponent,
726
732
  MatButtonModule,
727
733
  PropertyOwnerRendererComponent,
728
- ], template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n" }]
734
+ PricePipe,
735
+ ], template: "@if (property) {\n <rolatech-toolbar [title]=\"status[property.status]\" large link=\"../../\">\n <button mat-flat-button (click)=\"approve()\" i18n>Approve</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div class=\"flex flex-col md:flex-row mb-32\">\n <div class=\"w-full md:w-2/3 p-3\">\n <div class=\"text-lg font-bold py-2\">{{ property.title }}</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"inline-flex gap-1\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n <rolatech-property-owner-renderer\n [name]=\"userFullName\"\n [avatar]=\"user?.avatar\"\n [username]=\"user?.username\"\n ></rolatech-property-owner-renderer>\n <rolatech-property-features [features]=\"property.features\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n </div>\n <div class=\"w-full md:w-1/3 p-3\">\n <div class=\"flex items-center justify-between h-14\">\n <div class=\"text-lg font-bold py-2\" i18n>Agent</div>\n <button mat-flat-button (click)=\"updateAgent()\" i18n>Update Agent</button>\n </div>\n @if (agent) {\n <div class=\"flex flex-col gap-1 mt-3\">\n <rolatech-rich-label label=\"First Name\" [title]=\"agent.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"agent.lastName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n } @else {\n <div>Agent not set</div>\n }\n </div>\n </div>\n </div>\n}\n" }]
729
736
  }] });
730
737
 
731
738
  const propertyReviewRoutes = [
@@ -754,10 +761,10 @@ class FeatureManageItemComponent {
754
761
  onEdit() {
755
762
  this.edit.emit(this.feature());
756
763
  }
757
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
758
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.4", type: FeatureManageItemComponent, isStandalone: true, selector: "rolatech-feature-manage-item", inputs: { feature: { classPropertyName: "feature", publicName: "feature", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { delete: "delete", save: "save", edit: "edit" }, ngImport: i0, template: "<div class=\"group flex justify-between items-center h-14 hover:bg-[--rt-raised-background] cursor-pointer px-2\">\n <div class=\"flex\">\n <div class=\"min-w-[150px] mr-3\">{{ feature().name }}</div>\n <div class=\"overflow-hidden line-clamp-1\">\n {{ feature().values! | options }}\n </div>\n </div>\n <div class=\"flex justify-end max-w-24 w-24 invisible group-hover:visible\">\n <button mat-icon-button (click)=\"onEdit()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete()\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n</div>\n<mat-divider></mat-divider>\n", styles: ["mat-icon{scale:.9}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "pipe", type: OptionsFormatPipe, name: "options" }] });
764
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
765
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: FeatureManageItemComponent, isStandalone: true, selector: "rolatech-feature-manage-item", inputs: { feature: { classPropertyName: "feature", publicName: "feature", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { delete: "delete", save: "save", edit: "edit" }, ngImport: i0, template: "<div class=\"group flex justify-between items-center h-14 hover:bg-[--rt-raised-background] cursor-pointer px-2\">\n <div class=\"flex\">\n <div class=\"min-w-[150px] mr-3\">{{ feature().name }}</div>\n <div class=\"overflow-hidden line-clamp-1\">\n {{ feature().values! | options }}\n </div>\n </div>\n <div class=\"flex justify-end max-w-24 w-24 invisible group-hover:visible\">\n <button mat-icon-button (click)=\"onEdit()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete()\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n</div>\n<mat-divider></mat-divider>\n", styles: ["mat-icon{scale:.9}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "pipe", type: OptionsFormatPipe, name: "options" }] });
759
766
  }
760
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageItemComponent, decorators: [{
767
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageItemComponent, decorators: [{
761
768
  type: Component,
762
769
  args: [{ selector: 'rolatech-feature-manage-item', imports: [
763
770
  MatChipsModule,
@@ -768,7 +775,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
768
775
  MatIconModule,
769
776
  OptionsFormatPipe,
770
777
  ], template: "<div class=\"group flex justify-between items-center h-14 hover:bg-[--rt-raised-background] cursor-pointer px-2\">\n <div class=\"flex\">\n <div class=\"min-w-[150px] mr-3\">{{ feature().name }}</div>\n <div class=\"overflow-hidden line-clamp-1\">\n {{ feature().values! | options }}\n </div>\n </div>\n <div class=\"flex justify-end max-w-24 w-24 invisible group-hover:visible\">\n <button mat-icon-button (click)=\"onEdit()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete()\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n</div>\n<mat-divider></mat-divider>\n", styles: ["mat-icon{scale:.9}\n"] }]
771
- }] });
778
+ }], propDecorators: { feature: [{ type: i0.Input, args: [{ isSignal: true, alias: "feature", required: true }] }], delete: [{ type: i0.Output, args: ["delete"] }], save: [{ type: i0.Output, args: ["save"] }], edit: [{ type: i0.Output, args: ["edit"] }] } });
772
779
 
773
780
  class FeatureManageItemAddComponent {
774
781
  feature = {
@@ -805,13 +812,13 @@ class FeatureManageItemAddComponent {
805
812
  ngDoCheck() {
806
813
  this.output.emit(this.feature);
807
814
  }
808
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageItemAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
809
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: FeatureManageItemAddComponent, isStandalone: true, selector: "rolatech-feature-manage-item-add", outputs: { cancel: "cancel", save: "save", output: "output" }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"p-1\" i18n>Feature</div>\n <form>\n <mat-form-field appearance=\"fill\">\n <input matInput placeholder=\"Name\" type=\"text\" [(ngModel)]=\"feature.name\" [ngModelOptions]=\"{ standalone: true }\" i18n />\n </mat-form-field>\n <mat-form-field>\n <mat-chip-grid #chipGrid aria-label=\"Enter values\">\n @for (value of feature.values; track value) {\n <mat-chip-row\n (removed)=\"removeValue(value)\"\n [editable]=\"true\"\n [aria-description]=\"'press enter to edit ' + value.name\"\n >\n {{ value.name }}\n <button matChipRemove [attr.aria-label]=\"'remove ' + value.name\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n <input\n placeholder=\"Value\"\n [matChipInputFor]=\"chipGrid\"\n [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n [matChipInputAddOnBlur]=\"addOnBlur\"\n (matChipInputTokenEnd)=\"addFeatureValues($event)\"\n i18n\n />\n </mat-chip-grid>\n </mat-form-field>\n </form>\n</div>\n@if (action) {\n <div class=\"flex items-center justify-end\">\n <button mat-button (click)=\"onCancel()\" i18n>Cancel</button>\n <button mat-flat-button (click)=\"onSave()\" i18n>Save</button>\n </div>\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$5.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$5.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$5.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$5.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }] });
815
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageItemAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
816
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: FeatureManageItemAddComponent, isStandalone: true, selector: "rolatech-feature-manage-item-add", outputs: { cancel: "cancel", save: "save", output: "output" }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"p-1\" i18n>Feature</div>\n <form>\n <mat-form-field appearance=\"fill\">\n <input matInput placeholder=\"Name\" type=\"text\" [(ngModel)]=\"feature.name\" [ngModelOptions]=\"{ standalone: true }\" i18n />\n </mat-form-field>\n <mat-form-field>\n <mat-chip-grid #chipGrid aria-label=\"Enter values\">\n @for (value of feature.values; track value) {\n <mat-chip-row\n (removed)=\"removeValue(value)\"\n [editable]=\"true\"\n [aria-description]=\"'press enter to edit ' + value.name\"\n >\n {{ value.name }}\n <button matChipRemove [attr.aria-label]=\"'remove ' + value.name\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n <input\n placeholder=\"Value\"\n [matChipInputFor]=\"chipGrid\"\n [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n [matChipInputAddOnBlur]=\"addOnBlur\"\n (matChipInputTokenEnd)=\"addFeatureValues($event)\"\n i18n\n />\n </mat-chip-grid>\n </mat-form-field>\n </form>\n</div>\n@if (action) {\n <div class=\"flex items-center justify-end\">\n <button mat-button (click)=\"onCancel()\" i18n>Cancel</button>\n <button mat-flat-button (click)=\"onSave()\" i18n>Save</button>\n </div>\n}\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$5.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$5.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$5.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$5.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }] });
810
817
  }
811
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageItemAddComponent, decorators: [{
818
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageItemAddComponent, decorators: [{
812
819
  type: Component,
813
820
  args: [{ selector: 'rolatech-feature-manage-item-add', imports: [MatChipsModule, MatButtonModule, MatFormFieldModule, AngularCommonModule, AngularComponentsModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"p-1\" i18n>Feature</div>\n <form>\n <mat-form-field appearance=\"fill\">\n <input matInput placeholder=\"Name\" type=\"text\" [(ngModel)]=\"feature.name\" [ngModelOptions]=\"{ standalone: true }\" i18n />\n </mat-form-field>\n <mat-form-field>\n <mat-chip-grid #chipGrid aria-label=\"Enter values\">\n @for (value of feature.values; track value) {\n <mat-chip-row\n (removed)=\"removeValue(value)\"\n [editable]=\"true\"\n [aria-description]=\"'press enter to edit ' + value.name\"\n >\n {{ value.name }}\n <button matChipRemove [attr.aria-label]=\"'remove ' + value.name\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip-row>\n }\n <input\n placeholder=\"Value\"\n [matChipInputFor]=\"chipGrid\"\n [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n [matChipInputAddOnBlur]=\"addOnBlur\"\n (matChipInputTokenEnd)=\"addFeatureValues($event)\"\n i18n\n />\n </mat-chip-grid>\n </mat-form-field>\n </form>\n</div>\n@if (action) {\n <div class=\"flex items-center justify-end\">\n <button mat-button (click)=\"onCancel()\" i18n>Cancel</button>\n <button mat-flat-button (click)=\"onSave()\" i18n>Save</button>\n </div>\n}\n", styles: ["mat-form-field{width:100%}\n"] }]
814
- }] });
821
+ }], propDecorators: { cancel: [{ type: i0.Output, args: ["cancel"] }], save: [{ type: i0.Output, args: ["save"] }], output: [{ type: i0.Output, args: ["output"] }] } });
815
822
 
816
823
  class FeatureManageIndexComponent extends BaseComponent {
817
824
  featureService = inject(FeatureService);
@@ -935,10 +942,10 @@ class FeatureManageIndexComponent extends BaseComponent {
935
942
  this.featureInput().nativeElement.value = '';
936
943
  this.featureControl.setValue(null);
937
944
  }
938
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
939
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: FeatureManageIndexComponent, isStandalone: true, selector: "rolatech-feature-manage-index", viewQueries: [{ propertyName: "featureInput", first: true, predicate: ["featureInput"], descendants: true, isSignal: true }, { propertyName: "matAutocomplete", first: true, predicate: ["auto"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Features\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add Feature</span>\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-3\">\n @for (item of features; track $index) {\n <rolatech-feature-manage-item\n [feature]=\"item\"\n (delete)=\"onDeleteFeature($event)\"\n (edit)=\"onUpdateFeature($event)\"\n ></rolatech-feature-manage-item>\n }\n <div class=\"mt-3\">\n @if (add) {\n <rolatech-feature-manage-item-add (save)=\"saveFeature($event)\" (cancel)=\"add = false\"></rolatech-feature-manage-item-add>\n } @else {\n <button mat-stroked-button (click)=\"add = true\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n }\n </div>\n</div>\n", styles: [".features-chip-list{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: FeatureManageItemComponent, selector: "rolatech-feature-manage-item", inputs: ["feature"], outputs: ["delete", "save", "edit"] }, { kind: "component", type: FeatureManageItemAddComponent, selector: "rolatech-feature-manage-item-add", outputs: ["cancel", "save", "output"] }] });
945
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
946
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: FeatureManageIndexComponent, isStandalone: true, selector: "rolatech-feature-manage-index", viewQueries: [{ propertyName: "featureInput", first: true, predicate: ["featureInput"], descendants: true, isSignal: true }, { propertyName: "matAutocomplete", first: true, predicate: ["auto"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Features\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add Feature</span>\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-3\">\n @for (item of features; track $index) {\n <rolatech-feature-manage-item\n [feature]=\"item\"\n (delete)=\"onDeleteFeature($event)\"\n (edit)=\"onUpdateFeature($event)\"\n ></rolatech-feature-manage-item>\n }\n <div class=\"mt-3\">\n @if (add) {\n <rolatech-feature-manage-item-add (save)=\"saveFeature($event)\" (cancel)=\"add = false\"></rolatech-feature-manage-item-add>\n } @else {\n <button mat-stroked-button (click)=\"add = true\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n }\n </div>\n</div>\n", styles: [".features-chip-list{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: FeatureManageItemComponent, selector: "rolatech-feature-manage-item", inputs: ["feature"], outputs: ["delete", "save", "edit"] }, { kind: "component", type: FeatureManageItemAddComponent, selector: "rolatech-feature-manage-item-add", outputs: ["cancel", "save", "output"] }] });
940
947
  }
941
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageIndexComponent, decorators: [{
948
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageIndexComponent, decorators: [{
942
949
  type: Component,
943
950
  args: [{ selector: 'rolatech-feature-manage-index', imports: [
944
951
  MatDividerModule,
@@ -954,13 +961,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
954
961
  FeatureManageItemComponent,
955
962
  FeatureManageItemAddComponent,
956
963
  ], template: "<rolatech-toolbar title=\"Features\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add Feature</span>\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-3\">\n @for (item of features; track $index) {\n <rolatech-feature-manage-item\n [feature]=\"item\"\n (delete)=\"onDeleteFeature($event)\"\n (edit)=\"onUpdateFeature($event)\"\n ></rolatech-feature-manage-item>\n }\n <div class=\"mt-3\">\n @if (add) {\n <rolatech-feature-manage-item-add (save)=\"saveFeature($event)\" (cancel)=\"add = false\"></rolatech-feature-manage-item-add>\n } @else {\n <button mat-stroked-button (click)=\"add = true\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n }\n </div>\n</div>\n", styles: [".features-chip-list{width:100%}\n"] }]
957
- }] });
964
+ }], propDecorators: { featureInput: [{ type: i0.ViewChild, args: ['featureInput', { isSignal: true }] }], matAutocomplete: [{ type: i0.ViewChild, args: ['auto', { isSignal: true }] }] } });
958
965
 
959
966
  class FeatureManageDetailComponent {
960
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
961
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: FeatureManageDetailComponent, isStandalone: true, selector: "rolatech-feature-manage-detail", ngImport: i0, template: "<p>feature-manage-detail works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
967
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
968
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: FeatureManageDetailComponent, isStandalone: true, selector: "rolatech-feature-manage-detail", ngImport: i0, template: "<p>feature-manage-detail works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
962
969
  }
963
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FeatureManageDetailComponent, decorators: [{
970
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FeatureManageDetailComponent, decorators: [{
964
971
  type: Component,
965
972
  args: [{ selector: 'rolatech-feature-manage-detail', imports: [CommonModule], template: "<p>feature-manage-detail works!</p>\n" }]
966
973
  }] });
@@ -982,13 +989,13 @@ class PropertyOfferItemComponent {
982
989
  total = computed(() => {
983
990
  return this.offer().amount.toFixed(2);
984
991
  }, ...(ngDevMode ? [{ debugName: "total" }] : []));
985
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
986
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyOfferItemComponent, isStandalone: true, selector: "rolatech-property-offer-item", inputs: { offer: { classPropertyName: "offer", publicName: "offer", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n @if (offer().item) {\n <div class=\"flex flex-row py-2\">\n @if (offer().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().item.media ? offer().item.media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"font-bold\">{{ offer().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer().item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
992
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
993
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyOfferItemComponent, isStandalone: true, selector: "rolatech-property-offer-item", inputs: { offer: { classPropertyName: "offer", publicName: "offer", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n @if (offer().item) {\n <div class=\"flex flex-row py-2\">\n @if (offer().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().item.media ? offer().item.media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"font-bold\">{{ offer().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer().item.amount | price }}</div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
987
994
  }
988
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferItemComponent, decorators: [{
995
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferItemComponent, decorators: [{
989
996
  type: Component,
990
- args: [{ selector: 'rolatech-property-offer-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n @if (offer().item) {\n <div class=\"flex flex-row py-2\">\n @if (offer().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().item.media ? offer().item.media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"font-bold\">{{ offer().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer().item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n" }]
991
- }] });
997
+ args: [{ selector: 'rolatech-property-offer-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, PricePipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Offer ID: {{ offer().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[offer().status] }}</span>\n </div>\n @if (offer().item) {\n <div class=\"flex flex-row py-2\">\n @if (offer().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer().item.media ? offer().item.media[0].url : ''\" size=\"medium\" mode=\"clip\">\n </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div class=\"font-bold\">{{ offer().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer().item.amount | price }}</div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n" }]
998
+ }], propDecorators: { offer: [{ type: i0.Input, args: [{ isSignal: true, alias: "offer", required: true }] }] } });
992
999
 
993
1000
  class PropertyManageOfferIndexComponent extends BaseComponent {
994
1001
  propertyService = inject(PropertyService);
@@ -1058,10 +1065,10 @@ class PropertyManageOfferIndexComponent extends BaseComponent {
1058
1065
  })
1059
1066
  .join(',');
1060
1067
  }
1061
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1062
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageOfferIndexComponent, isStandalone: true, selector: "rolatech-property-manage-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Offers\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n</rolatech-tabs>\n<rolatech-list>\n @if (offers) {\n @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n</rolatech-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: ListComponent, selector: "rolatech-list" }] });
1068
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1069
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageOfferIndexComponent, isStandalone: true, selector: "rolatech-property-manage-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Offers\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n</rolatech-tabs>\n<rolatech-list>\n @if (offers) {\n @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n</rolatech-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: ListComponent, selector: "rolatech-list" }] });
1063
1070
  }
1064
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageOfferIndexComponent, decorators: [{
1071
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageOfferIndexComponent, decorators: [{
1065
1072
  type: Component,
1066
1073
  args: [{ selector: 'rolatech-property-manage-offer-index', imports: [
1067
1074
  CommonModule,
@@ -1199,12 +1206,12 @@ class PropertyManageOfferDetailComponent extends BaseComponent {
1199
1206
  }
1200
1207
  });
1201
1208
  }
1202
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1203
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageOfferDetailComponent, isStandalone: true, selector: "rolatech-property-manage-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
1209
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1210
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageOfferDetailComponent, isStandalone: true, selector: "rolatech-property-manage-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'HOLDING_DEPOSIT_PAID') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
1204
1211
  }
1205
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageOfferDetailComponent, decorators: [{
1212
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageOfferDetailComponent, decorators: [{
1206
1213
  type: Component,
1207
- args: [{ selector: 'rolatech-property-manage-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule], template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
1214
+ args: [{ selector: 'rolatech-property-manage-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule, PricePipe], template: "@if (offer) {\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'HOLDING_DEPOSIT_PAID') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n </rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"offer.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"offer.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
1208
1215
  }] });
1209
1216
 
1210
1217
  const propertyManageOffersRoutes = [
@@ -1225,10 +1232,10 @@ var PropertyViewType;
1225
1232
  })(PropertyViewType || (PropertyViewType = {}));
1226
1233
  class PropertyUtil {
1227
1234
  viewEvent = new EventEmitter();
1228
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyUtil, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1229
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyUtil, providedIn: 'root' });
1235
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyUtil, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1236
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyUtil, providedIn: 'root' });
1230
1237
  }
1231
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyUtil, decorators: [{
1238
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyUtil, decorators: [{
1232
1239
  type: Injectable,
1233
1240
  args: [{
1234
1241
  providedIn: 'root',
@@ -1268,9 +1275,11 @@ class PropertyFilterBar {
1268
1275
  }, ...(ngDevMode ? [{ debugName: "maxBedRoom" }] : []));
1269
1276
  towns = ['London'];
1270
1277
  market = ['Sales', 'Lettings'];
1278
+ types = PropertyType;
1271
1279
  options = model({
1272
1280
  market: '',
1273
1281
  town: '',
1282
+ type: '',
1274
1283
  availableFrom: '',
1275
1284
  minBedrooms: '',
1276
1285
  maxBedrooms: '',
@@ -1288,6 +1297,7 @@ class PropertyFilterBar {
1288
1297
  queryParams: {
1289
1298
  market: opts.market || null,
1290
1299
  town: opts.town || null,
1300
+ type: opts.type || null,
1291
1301
  minBedrooms: opts.minBedrooms || null,
1292
1302
  maxBedrooms: opts.maxBedrooms || null,
1293
1303
  minPrice: opts.minPrice || null,
@@ -1302,6 +1312,7 @@ class PropertyFilterBar {
1302
1312
  this.options.set({
1303
1313
  market: params['market'] || '',
1304
1314
  town: params['town'] || '',
1315
+ type: params['type'] || '',
1305
1316
  availableFrom: params['availableFrom'] || '',
1306
1317
  minBedrooms: params['minBedrooms'] || '',
1307
1318
  maxBedrooms: params['maxBedrooms'] || '',
@@ -1319,6 +1330,7 @@ class PropertyFilterBar {
1319
1330
  return {
1320
1331
  market: '',
1321
1332
  town: '',
1333
+ type: '',
1322
1334
  availableFrom: '',
1323
1335
  minBedrooms: '',
1324
1336
  maxBedrooms: '',
@@ -1339,17 +1351,17 @@ class PropertyFilterBar {
1339
1351
  queryParamsHandling: 'merge', // keep other params like sort, etc.
1340
1352
  });
1341
1353
  }
1342
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyFilterBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
1343
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyFilterBar, isStandalone: true, selector: "rolatech-property-filter-bar", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { search: "search", reset: "reset", show: "showChange", options: "optionsChange" }, providers: [
1354
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFilterBar, deps: [], target: i0.ɵɵFactoryTarget.Component });
1355
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyFilterBar, isStandalone: true, selector: "rolatech-property-filter-bar", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { search: "search", reset: "reset", show: "showChange", options: "optionsChange" }, providers: [
1344
1356
  {
1345
1357
  provide: DateAdapter,
1346
1358
  useClass: MomentDateAdapter,
1347
1359
  deps: [MAT_DATE_LOCALE],
1348
1360
  },
1349
1361
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$6 },
1350
- ], ngImport: i0, template: "<div class=\"px-2 mb-3 close\" [class.open]=\"show()\">\n <div class=\"flex flex-col h-min justify-center items-center gap-3\">\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Market</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Market\" [(ngModel)]=\"options().market\">\n @for (m of market; track m) {\n <mat-option [value]=\"m\"> {{ m }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Town</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" [(ngModel)]=\"options().town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\"> {{ town }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Available date</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\" class=\"z-[1000]\">\n <input\n matInput\n placeholder=\"Available\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"available\"\n [(ngModel)]=\"options().availableFrom\"\n (dateInput)=\"options().availableFrom = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker panelClass=\"datepicker-on-top\" #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3 overflow-hidden\">\n <div class=\"py-1\">Price range (\u00A3)</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().minPrice\">\n @for (opt of minOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().maxPrice\">\n @for (opt of maxOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">No. of bedrooms</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min</mat-label>\n <mat-select [(ngModel)]=\"options().minBedrooms\">\n @for (opt of minBedroom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max</mat-label>\n <mat-select [(ngModel)]=\"options().maxBedrooms\">\n @for (opt of maxBedRoom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"h-14 md:w-1/3 self-end w-full\">\n <button mat-flat-button (click)=\"onSearch()\" class=\"w-full min-h-14\">\n <a i18n>Search</a>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}.close{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.open{max-height:1000px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }], encapsulation: i0.ViewEncapsulation.None });
1362
+ ], ngImport: i0, template: "<div class=\"px-2 mb-3 close\" [class.open]=\"show()\">\n <div class=\"flex flex-col h-min justify-center items-center gap-3\">\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Market</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Market\" [(ngModel)]=\"options().market\">\n @for (m of market; track m) {\n <mat-option [value]=\"m\"> {{ m }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Type</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Type\" [(ngModel)]=\"options().type\">\n @for (type of types | keyvalue; track type) {\n <mat-option [value]=\"type.key\"> {{ type.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Town</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" [(ngModel)]=\"options().town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\"> {{ town }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Available date</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\" class=\"z-[1000]\">\n <input\n matInput\n placeholder=\"Available\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"available\"\n [(ngModel)]=\"options().availableFrom\"\n (dateInput)=\"options().availableFrom = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker panelClass=\"datepicker-on-top\" #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3 overflow-hidden\">\n <div class=\"py-1\">Price range (\u00A3)</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().minPrice\">\n @for (opt of minOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().maxPrice\">\n @for (opt of maxOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">No. of bedrooms</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min</mat-label>\n <mat-select [(ngModel)]=\"options().minBedrooms\">\n @for (opt of minBedroom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max</mat-label>\n <mat-select [(ngModel)]=\"options().maxBedrooms\">\n @for (opt of maxBedRoom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"h-14 md:w-1/3 self-end w-full\">\n <button mat-flat-button (click)=\"onSearch()\" class=\"w-full min-h-14\">\n <a i18n>Search</a>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}.close{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.open{max-height:1000px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }], encapsulation: i0.ViewEncapsulation.None });
1351
1363
  }
1352
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyFilterBar, decorators: [{
1364
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFilterBar, decorators: [{
1353
1365
  type: Component,
1354
1366
  args: [{ selector: 'rolatech-property-filter-bar', imports: [
1355
1367
  CommonModule,
@@ -1367,8 +1379,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
1367
1379
  deps: [MAT_DATE_LOCALE],
1368
1380
  },
1369
1381
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$6 },
1370
- ], encapsulation: ViewEncapsulation.None, template: "<div class=\"px-2 mb-3 close\" [class.open]=\"show()\">\n <div class=\"flex flex-col h-min justify-center items-center gap-3\">\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Market</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Market\" [(ngModel)]=\"options().market\">\n @for (m of market; track m) {\n <mat-option [value]=\"m\"> {{ m }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Town</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" [(ngModel)]=\"options().town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\"> {{ town }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">Available date</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\" class=\"z-[1000]\">\n <input\n matInput\n placeholder=\"Available\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"available\"\n [(ngModel)]=\"options().availableFrom\"\n (dateInput)=\"options().availableFrom = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker panelClass=\"datepicker-on-top\" #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3 overflow-hidden\">\n <div class=\"py-1\">Price range (\u00A3)</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().minPrice\">\n @for (opt of minOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().maxPrice\">\n @for (opt of maxOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">No. of bedrooms</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min</mat-label>\n <mat-select [(ngModel)]=\"options().minBedrooms\">\n @for (opt of minBedroom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max</mat-label>\n <mat-select [(ngModel)]=\"options().maxBedrooms\">\n @for (opt of maxBedRoom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"h-14 md:w-1/3 self-end w-full\">\n <button mat-flat-button (click)=\"onSearch()\" class=\"w-full min-h-14\">\n <a i18n>Search</a>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}.close{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.open{max-height:1000px}\n"] }]
1371
- }], ctorParameters: () => [] });
1382
+ ], encapsulation: ViewEncapsulation.None, template: "<div class=\"px-2 mb-3 close\" [class.open]=\"show()\">\n <div class=\"flex flex-col h-min justify-center items-center gap-3\">\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Market</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Market\" [(ngModel)]=\"options().market\">\n @for (m of market; track m) {\n <mat-option [value]=\"m\"> {{ m }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Type</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Type\" [(ngModel)]=\"options().type\">\n @for (type of types | keyvalue; track type) {\n <mat-option [value]=\"type.key\"> {{ type.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Town</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-select #select=\"matSelect\" placeholder=\"Town\" [(ngModel)]=\"options().town\">\n @for (town of towns; track town) {\n <mat-option [value]=\"town\"> {{ town }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/4\">\n <div class=\"py-1\">Available date</div>\n <div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\" class=\"z-[1000]\">\n <input\n matInput\n placeholder=\"Available\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"available\"\n [(ngModel)]=\"options().availableFrom\"\n (dateInput)=\"options().availableFrom = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker panelClass=\"datepicker-on-top\" #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n </div>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full items-center\">\n <div class=\"flex flex-col w-full md:w-1/3 overflow-hidden\">\n <div class=\"py-1\">Price range (\u00A3)</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().minPrice\">\n @for (opt of minOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max (PCM)</mat-label>\n <mat-select [(ngModel)]=\"options().maxPrice\">\n @for (opt of maxOptions(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex flex-col w-full md:w-1/3\">\n <div class=\"py-1\">No. of bedrooms</div>\n <div class=\"flex flex-row items-center\">\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Min</mat-label>\n <mat-select [(ngModel)]=\"options().minBedrooms\">\n @for (opt of minBedroom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n <div class=\"px-2\">-</div>\n <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n <mat-label>Max</mat-label>\n <mat-select [(ngModel)]=\"options().maxBedrooms\">\n @for (opt of maxBedRoom(); track opt.value) {\n <mat-option [value]=\"opt.value\">{{ opt.label }}</mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n </div>\n <div class=\"h-14 md:w-1/3 self-end w-full\">\n <button mat-flat-button (click)=\"onSearch()\" class=\"w-full min-h-14\">\n <a i18n>Search</a>\n </button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}.close{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.open{max-height:1000px}\n"] }]
1383
+ }], ctorParameters: () => [], propDecorators: { search: [{ type: i0.Output, args: ["search"] }], reset: [{ type: i0.Output, args: ["reset"] }], show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }, { type: i0.Output, args: ["optionsChange"] }] } });
1372
1384
 
1373
1385
  class PropertyLayoutComponent extends BaseComponent {
1374
1386
  propertyService = inject(PropertyService);
@@ -1383,6 +1395,7 @@ class PropertyLayoutComponent extends BaseComponent {
1383
1395
  options = signal({
1384
1396
  market: '',
1385
1397
  town: '',
1398
+ type: '',
1386
1399
  availableFrom: '',
1387
1400
  minBedrooms: '',
1388
1401
  maxBedrooms: '',
@@ -1432,13 +1445,13 @@ class PropertyLayoutComponent extends BaseComponent {
1432
1445
  // omit queryParamsHandling so it REPLACES (not merges) → clears everything
1433
1446
  });
1434
1447
  }
1435
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1436
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.4", type: PropertyLayoutComponent, isStandalone: true, selector: "rolatech-property-layout", viewQueries: [{ propertyName: "searchBar", first: true, predicate: ["searchBar"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col min-w-[320px] max-w-[1280px] m-auto\">\n <div class=\"flex justify-between items-center h-16\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"p-3 text-2xl font-medium cursor-pointer\" routerLink=\"/properties\" i18n>Properties</div>\n <div class=\"flex flex-row\">\n <button mat-icon-button (click)=\"toggleSearch()\">\n <mat-icon>search</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleView()\">\n <mat-icon>{{ gridView ? 'view_list' : 'grid_on' }}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleFilter()\">\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <rolatech-property-filter-bar\n [(show)]=\"showFilter\"\n (search)=\"onSearch($event)\"\n [(options)]=\"options\"\n ></rolatech-property-filter-bar>\n <rolatech-search-bar\n [(show)]=\"open\"\n #searchBar\n (search)=\"searchByText($event)\"\n (close)=\"onCloseSearch()\"\n ></rolatech-search-bar>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n </div>\n</rolatech-container>\n", styles: [".property-layout-active{border-radius:var(--rt-rounded-base, 8px);background-color:var(-rt-base-background, #fff);color:var(--rt-brand-color, #000)}@media (max-width: 768px){.property-layout-active{background-color:var(--rt-text-primary, #000);color:var(--rt-text-primary-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: SearchBar, selector: "rolatech-search-bar", inputs: ["show"], outputs: ["showChange", "search", "close"] }, { kind: "component", type: PropertyFilterBar, selector: "rolatech-property-filter-bar", inputs: ["show", "options"], outputs: ["search", "reset", "showChange", "optionsChange"] }] });
1448
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1449
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.12", type: PropertyLayoutComponent, isStandalone: true, selector: "rolatech-property-layout", viewQueries: [{ propertyName: "searchBar", first: true, predicate: ["searchBar"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col min-w-[320px] max-w-[1280px] m-auto\">\n <div class=\"flex justify-between items-center h-16\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"p-3 text-2xl font-medium cursor-pointer\" routerLink=\"/properties\" i18n>Properties</div>\n <div class=\"flex flex-row\">\n <button mat-icon-button (click)=\"toggleSearch()\">\n <mat-icon>search</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleView()\">\n <mat-icon>{{ gridView ? 'view_list' : 'grid_on' }}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleFilter()\">\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <rolatech-property-filter-bar\n [(show)]=\"showFilter\"\n (search)=\"onSearch($event)\"\n [(options)]=\"options\"\n ></rolatech-property-filter-bar>\n <rolatech-search-bar\n [(show)]=\"open\"\n #searchBar\n (search)=\"searchByText($event)\"\n (close)=\"onCloseSearch()\"\n ></rolatech-search-bar>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n </div>\n</rolatech-container>\n", styles: [".property-layout-active{border-radius:var(--rt-rounded-base, 8px);background-color:var(-rt-base-background, #fff);color:var(--rt-brand-color, #000)}@media (max-width: 768px){.property-layout-active{background-color:var(--rt-text-primary, #000);color:var(--rt-text-primary-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: SearchBar, selector: "rolatech-search-bar", inputs: ["show"], outputs: ["showChange", "search", "close"] }, { kind: "component", type: PropertyFilterBar, selector: "rolatech-property-filter-bar", inputs: ["show", "options"], outputs: ["search", "reset", "showChange", "optionsChange"] }] });
1437
1450
  }
1438
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyLayoutComponent, decorators: [{
1451
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyLayoutComponent, decorators: [{
1439
1452
  type: Component,
1440
1453
  args: [{ selector: 'rolatech-property-layout', imports: [AngularCommonModule, AngularComponentsModule, ContainerComponent, SearchBar, PropertyFilterBar], template: "<rolatech-container>\n <div class=\"flex flex-col min-w-[320px] max-w-[1280px] m-auto\">\n <div class=\"flex justify-between items-center h-16\">\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"p-3 text-2xl font-medium cursor-pointer\" routerLink=\"/properties\" i18n>Properties</div>\n <div class=\"flex flex-row\">\n <button mat-icon-button (click)=\"toggleSearch()\">\n <mat-icon>search</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleView()\">\n <mat-icon>{{ gridView ? 'view_list' : 'grid_on' }}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"toggleFilter()\">\n <mat-icon>tune</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <rolatech-property-filter-bar\n [(show)]=\"showFilter\"\n (search)=\"onSearch($event)\"\n [(options)]=\"options\"\n ></rolatech-property-filter-bar>\n <rolatech-search-bar\n [(show)]=\"open\"\n #searchBar\n (search)=\"searchByText($event)\"\n (close)=\"onCloseSearch()\"\n ></rolatech-search-bar>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n </div>\n</rolatech-container>\n", styles: [".property-layout-active{border-radius:var(--rt-rounded-base, 8px);background-color:var(-rt-base-background, #fff);color:var(--rt-brand-color, #000)}@media (max-width: 768px){.property-layout-active{background-color:var(--rt-text-primary, #000);color:var(--rt-text-primary-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
1441
- }] });
1454
+ }], propDecorators: { searchBar: [{ type: i0.ViewChild, args: ['searchBar', { isSignal: true }] }] } });
1442
1455
 
1443
1456
  class PropertyActionsComponent {
1444
1457
  property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
@@ -1457,23 +1470,23 @@ class PropertyActionsComponent {
1457
1470
  onDeposit(property) {
1458
1471
  this.deposit.emit(property);
1459
1472
  }
1460
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1461
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyActionsComponent, isStandalone: true, selector: "rolatech-property-actions", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
1473
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1474
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyActionsComponent, isStandalone: true, selector: "rolatech-property-actions", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit {{ displayDeposit() | price }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None });
1462
1475
  }
1463
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyActionsComponent, decorators: [{
1476
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyActionsComponent, decorators: [{
1464
1477
  type: Component,
1465
- args: [{ selector: 'rolatech-property-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n" }]
1466
- }] });
1478
+ args: [{ selector: 'rolatech-property-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(property())\" i18n>Request viewing</a>\n @if (property().priceType && property().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(property())\" i18n>Pay deposit {{ displayDeposit() | price }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(property())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-property-action-contact\"></ng-content>\n</div>\n" }]
1479
+ }], propDecorators: { property: [{ type: i0.Input, args: [{ isSignal: true, alias: "property", required: true }] }], requestViewing: [{ type: i0.Output, args: ["requestViewing"] }], offer: [{ type: i0.Output, args: ["offer"] }], deposit: [{ type: i0.Output, args: ["deposit"] }] } });
1467
1480
 
1468
1481
  class PropertyItemComponent {
1469
1482
  property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
1470
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1471
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyItemComponent, isStandalone: true, selector: "rolatech-property-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property().price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
1483
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1484
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyItemComponent, isStandalone: true, selector: "rolatech-property-item", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property().price | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
1472
1485
  }
1473
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyItemComponent, decorators: [{
1486
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyItemComponent, decorators: [{
1474
1487
  type: Component,
1475
- args: [{ selector: 'rolatech-property-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property().price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
1476
- }] });
1488
+ args: [{ selector: 'rolatech-property-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, PricePipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>ID: {{ property().id }}</span>\n </a>\n </div>\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (property().media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property().media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property().title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property().bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property().receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property().price | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
1489
+ }], propDecorators: { property: [{ type: i0.Input, args: [{ isSignal: true, alias: "property", required: true }] }] } });
1477
1490
 
1478
1491
  // property-available.pipe.ts
1479
1492
  class AvailableDatePipe {
@@ -1494,10 +1507,10 @@ class AvailableDatePipe {
1494
1507
  day: 'numeric',
1495
1508
  }).format(date);
1496
1509
  }
1497
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AvailableDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1498
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: AvailableDatePipe, isStandalone: true, name: "availableDate" });
1510
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AvailableDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1511
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: AvailableDatePipe, isStandalone: true, name: "availableDate" });
1499
1512
  }
1500
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AvailableDatePipe, decorators: [{
1513
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: AvailableDatePipe, decorators: [{
1501
1514
  type: Pipe,
1502
1515
  args: [{
1503
1516
  name: 'availableDate',
@@ -1533,13 +1546,13 @@ class PropertyPricingComponent {
1533
1546
  this.securityDeposit = (price * 5).toFixed(2);
1534
1547
  }
1535
1548
  }
1536
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyPricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1537
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyPricingComponent, isStandalone: true, selector: "rolatech-property-pricing", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"py-3 flex flex-col gap-3\">\n <div class=\"flex justify-between items-center\">\n @if (market() === 'LETTINGS' && rentFrequency() === 'MONTHLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'WEEKLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per week</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'NOT_SPECIFIED') {\n <div class=\"text-lg font-bold\" i18n>Rent price</div>\n }\n @if (market() === 'SALES') {\n <div class=\"text-lg font-bold\" i18n>Price</div>\n }\n <div class=\"text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n <div class=\"flex justify-between items-center\">\n <div>Available</div>\n <div>{{ property().availableDate | availableDate }}</div>\n </div>\n @if (market() === 'LETTINGS') {\n <div class=\"flex justify-between items-center\">\n <span i18n>Holding Deposit</span>\n <span>\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex justify-between items-center font-bold\">\n <span i18n>Security Deposit</span>\n <span>\u00A3{{ securityDeposit }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }], encapsulation: i0.ViewEncapsulation.None });
1549
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyPricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1550
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyPricingComponent, isStandalone: true, selector: "rolatech-property-pricing", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"py-3 flex flex-col gap-3\">\n <div class=\"flex justify-between items-center\">\n @if (market() === 'LETTINGS' && rentFrequency() === 'MONTHLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'WEEKLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per week</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'NOT_SPECIFIED') {\n <div class=\"text-lg font-bold\" i18n>Rent price</div>\n }\n @if (market() === 'SALES') {\n <div class=\"text-lg font-bold\" i18n>Price</div>\n }\n <div class=\"text-xl font-bold\">{{ displayPrice() | price }}</div>\n </div>\n <div class=\"flex justify-between items-center\">\n <div>Available</div>\n <div>{{ property().availableDate | availableDate }}</div>\n </div>\n @if (market() === 'LETTINGS') {\n <div class=\"flex justify-between items-center\">\n <span i18n>Holding Deposit</span>\n <span>{{ holdingDeposit | price }}</span>\n </div>\n <div class=\"flex justify-between items-center font-bold\">\n <span i18n>Security Deposit</span>\n <span>{{ securityDeposit | price }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None });
1538
1551
  }
1539
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyPricingComponent, decorators: [{
1552
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyPricingComponent, decorators: [{
1540
1553
  type: Component,
1541
- args: [{ selector: 'rolatech-property-pricing', imports: [CommonModule, MatButtonModule, AvailableDatePipe], encapsulation: ViewEncapsulation.None, template: "<div class=\"py-3 flex flex-col gap-3\">\n <div class=\"flex justify-between items-center\">\n @if (market() === 'LETTINGS' && rentFrequency() === 'MONTHLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'WEEKLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per week</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'NOT_SPECIFIED') {\n <div class=\"text-lg font-bold\" i18n>Rent price</div>\n }\n @if (market() === 'SALES') {\n <div class=\"text-lg font-bold\" i18n>Price</div>\n }\n <div class=\"text-xl font-bold\">\u00A3{{ displayPrice() }}</div>\n </div>\n <div class=\"flex justify-between items-center\">\n <div>Available</div>\n <div>{{ property().availableDate | availableDate }}</div>\n </div>\n @if (market() === 'LETTINGS') {\n <div class=\"flex justify-between items-center\">\n <span i18n>Holding Deposit</span>\n <span>\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex justify-between items-center font-bold\">\n <span i18n>Security Deposit</span>\n <span>\u00A3{{ securityDeposit }}</span>\n </div>\n }\n</div>\n" }]
1542
- }] });
1554
+ args: [{ selector: 'rolatech-property-pricing', imports: [CommonModule, MatButtonModule, AvailableDatePipe, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div class=\"py-3 flex flex-col gap-3\">\n <div class=\"flex justify-between items-center\">\n @if (market() === 'LETTINGS' && rentFrequency() === 'MONTHLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per month</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'WEEKLY') {\n <div class=\"text-lg font-bold\" i18n>Rent per week</div>\n }\n @if (market() === 'LETTINGS' && rentFrequency() === 'NOT_SPECIFIED') {\n <div class=\"text-lg font-bold\" i18n>Rent price</div>\n }\n @if (market() === 'SALES') {\n <div class=\"text-lg font-bold\" i18n>Price</div>\n }\n <div class=\"text-xl font-bold\">{{ displayPrice() | price }}</div>\n </div>\n <div class=\"flex justify-between items-center\">\n <div>Available</div>\n <div>{{ property().availableDate | availableDate }}</div>\n </div>\n @if (market() === 'LETTINGS') {\n <div class=\"flex justify-between items-center\">\n <span i18n>Holding Deposit</span>\n <span>{{ holdingDeposit | price }}</span>\n </div>\n <div class=\"flex justify-between items-center font-bold\">\n <span i18n>Security Deposit</span>\n <span>{{ securityDeposit | price }}</span>\n </div>\n }\n</div>\n" }]
1555
+ }], propDecorators: { property: [{ type: i0.Input, args: [{ isSignal: true, alias: "property", required: true }] }], price: [{ type: i0.Input, args: [{ isSignal: true, alias: "price", required: false }] }] } });
1543
1556
 
1544
1557
  class PropertyInfoComponent {
1545
1558
  property = input.required(...(ngDevMode ? [{ debugName: "property" }] : []));
@@ -1550,15 +1563,15 @@ class PropertyInfoComponent {
1550
1563
  }
1551
1564
  onShare() { }
1552
1565
  onMore() { }
1553
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1554
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyInfoComponent, isStandalone: true, selector: "rolatech-property-info", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, inWishList: { classPropertyName: "inWishList", publicName: "inWishList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { wish: "wish" }, host: { attributes: { "id": "rolatech-property-info" } }, ngImport: i0, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: RouterModule }], encapsulation: i0.ViewEncapsulation.None });
1566
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1567
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyInfoComponent, isStandalone: true, selector: "rolatech-property-info", inputs: { property: { classPropertyName: "property", publicName: "property", isSignal: true, isRequired: true, transformFunction: null }, inWishList: { classPropertyName: "inWishList", publicName: "inWishList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { wish: "wish" }, host: { attributes: { "id": "rolatech-property-info" } }, ngImport: i0, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"font-bold py-2\">\n {{ property().size }} sq ft \u00B7 {{ property().bedrooms }} beds \u00B7 {{ property().bathrooms }} bathrooms \u00B7\n {{ property().receptions }} receptions\n </div>\n </div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <!-- <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button> -->\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: RouterModule }], encapsulation: i0.ViewEncapsulation.None });
1555
1568
  }
1556
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyInfoComponent, decorators: [{
1569
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyInfoComponent, decorators: [{
1557
1570
  type: Component,
1558
1571
  args: [{ selector: 'rolatech-property-info', imports: [MatButtonModule, MatIconModule, RouterModule], encapsulation: ViewEncapsulation.None, host: {
1559
1572
  id: 'rolatech-property-info',
1560
- }, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button>\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n" }]
1561
- }] });
1573
+ }, template: "<div>\n <div class=\"flex justify-between items-center\">\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-medium\">{{ property().title }}</div>\n <div class=\"font-bold py-2\">\n {{ property().size }} sq ft \u00B7 {{ property().bedrooms }} beds \u00B7 {{ property().bathrooms }} bathrooms \u00B7\n {{ property().receptions }} receptions\n </div>\n </div>\n <div class=\"flex items-center px-3\">\n <button mat-icon-button (click)=\"onWish(property())\">\n @if (inWishList()) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m293-203.08 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08Z\"\n />\n </svg>\n } @else {\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#5f6368\">\n <path\n d=\"m354-287 126-76 126 77-33-144 111-96-146-13-58-136-58 135-146 13 111 97-33 143Zm-61 83.92 49.62-212.54-164.93-142.84 217.23-18.85L480-777.69l85.08 200.38 217.23 18.85-164.93 142.84L667-203.08 480-315.92 293-203.08ZM480-470Z\"\n />\n </svg>\n }\n </button>\n <!-- <button mat-icon-button (click)=\"onShare()\">\n <mat-icon>share</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onMore()\">\n <mat-icon>more_vert</mat-icon>\n </button> -->\n </div>\n </div>\n <div [innerHTML]=\"property().description\">\n <!-- {{ property().description }} -->\n </div>\n</div>\n" }]
1574
+ }], propDecorators: { property: [{ type: i0.Input, args: [{ isSignal: true, alias: "property", required: true }] }], wish: [{ type: i0.Output, args: ["wish"] }], inWishList: [{ type: i0.Input, args: [{ isSignal: true, alias: "inWishList", required: false }] }] } });
1562
1575
 
1563
1576
  class PropertySectionComponent {
1564
1577
  section = input.required(...(ngDevMode ? [{ debugName: "section" }] : []));
@@ -1568,13 +1581,13 @@ class PropertySectionComponent {
1568
1581
  onClickScroller(id) {
1569
1582
  this.viewportScroller.scrollToAnchor(id);
1570
1583
  }
1571
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertySectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1572
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertySectionComponent, isStandalone: true, selector: "rolatech-property-section", inputs: { section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (section(); as section) {\n <div>\n @if (section.title) {\n <div class=\"py-3 flex items-center gap-3\">\n <span class=\"h-4 w-1 bg-[--rt-brand-color] inline-block\"></span>\n <span class=\"text-lg font-medium py-1\"> {{ section.title }}</span>\n </div>\n }\n @if (section.description) {\n <div>\n {{ section.description }}\n </div>\n }\n @if (section.media) {\n <div class=\"w-80%\">\n @for (item of section.media; track item) {\n <div class=\"py-3\">\n <rolatech-thumbnail\n [src]=\"item.url\"\n size=\"small\"\n mode=\"clip\"\n [width]=\"item.width\"\n [height]=\"item.height\"\n ></rolatech-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
1584
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertySectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1585
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertySectionComponent, isStandalone: true, selector: "rolatech-property-section", inputs: { section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (section(); as section) {\n <div>\n @if (section.title) {\n <div class=\"py-3 flex items-center gap-3\">\n <span class=\"h-4 w-1 bg-[--rt-brand-color] inline-block\"></span>\n <span class=\"text-lg font-medium py-1\"> {{ section.title }}</span>\n </div>\n }\n @if (section.description) {\n <div>\n {{ section.description }}\n </div>\n }\n @if (section.media) {\n <div class=\"w-80%\">\n @for (item of section.media; track item) {\n <div class=\"py-3\">\n <rolatech-thumbnail\n [src]=\"item.url\"\n size=\"small\"\n mode=\"clip\"\n [width]=\"item.width\"\n [height]=\"item.height\"\n ></rolatech-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }], encapsulation: i0.ViewEncapsulation.None });
1573
1586
  }
1574
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertySectionComponent, decorators: [{
1587
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertySectionComponent, decorators: [{
1575
1588
  type: Component,
1576
1589
  args: [{ selector: 'rolatech-property-section', imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "@if (section(); as section) {\n <div>\n @if (section.title) {\n <div class=\"py-3 flex items-center gap-3\">\n <span class=\"h-4 w-1 bg-[--rt-brand-color] inline-block\"></span>\n <span class=\"text-lg font-medium py-1\"> {{ section.title }}</span>\n </div>\n }\n @if (section.description) {\n <div>\n {{ section.description }}\n </div>\n }\n @if (section.media) {\n <div class=\"w-80%\">\n @for (item of section.media; track item) {\n <div class=\"py-3\">\n <rolatech-thumbnail\n [src]=\"item.url\"\n size=\"small\"\n mode=\"clip\"\n [width]=\"item.width\"\n [height]=\"item.height\"\n ></rolatech-thumbnail>\n </div>\n }\n </div>\n }\n </div>\n}\n" }]
1577
- }] });
1590
+ }], propDecorators: { section: [{ type: i0.Input, args: [{ isSignal: true, alias: "section", required: true }] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], username: [{ type: i0.Input, args: [{ isSignal: true, alias: "username", required: false }] }] } });
1578
1591
 
1579
1592
  class PropertyVideoComponent {
1580
1593
  sanitizer = inject(DomSanitizer);
@@ -1591,13 +1604,13 @@ class PropertyVideoComponent {
1591
1604
  youtube = computed(() => {
1592
1605
  return this.video().provider === PropertyVideoProvider.YOUTUBE;
1593
1606
  }, ...(ngDevMode ? [{ debugName: "youtube" }] : []));
1594
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1595
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyVideoComponent, isStandalone: true, selector: "rolatech-property-video", inputs: { video: { classPropertyName: "video", publicName: "video", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Videos</div>\n @if (youtube()) {\n <iframe [src]=\"videoUrl()\" frameborder=\"0\" allowfullscreen class=\"w-full aspect-video\"></iframe>\n } @else {\n <video controls #videoContainer [src]=\"video().url\" class=\"w-full aspect-video\" [poster]=\"video().thumbnail\">\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1607
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1608
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyVideoComponent, isStandalone: true, selector: "rolatech-property-video", inputs: { video: { classPropertyName: "video", publicName: "video", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Videos</div>\n @if (youtube()) {\n <iframe [src]=\"videoUrl()\" frameborder=\"0\" allowfullscreen class=\"w-full aspect-video\"></iframe>\n } @else {\n <video controls #videoContainer [src]=\"video().url\" class=\"w-full aspect-video\" [poster]=\"video().thumbnail\">\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1596
1609
  }
1597
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoComponent, decorators: [{
1610
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoComponent, decorators: [{
1598
1611
  type: Component,
1599
1612
  args: [{ selector: 'rolatech-property-video', imports: [CommonModule], template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-4\" i18n>Videos</div>\n @if (youtube()) {\n <iframe [src]=\"videoUrl()\" frameborder=\"0\" allowfullscreen class=\"w-full aspect-video\"></iframe>\n } @else {\n <video controls #videoContainer [src]=\"video().url\" class=\"w-full aspect-video\" [poster]=\"video().thumbnail\">\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n }\n</div>\n" }]
1600
- }] });
1613
+ }], propDecorators: { video: [{ type: i0.Input, args: [{ isSignal: true, alias: "video", required: true }] }] } });
1601
1614
 
1602
1615
  class PropertyActionContactComponent {
1603
1616
  btnRef = viewChild('btnEl', ...(ngDevMode ? [{ debugName: "btnRef", read: ElementRef }] : [{ read: ElementRef }]));
@@ -1609,36 +1622,36 @@ class PropertyActionContactComponent {
1609
1622
  onEmailAgent(property) {
1610
1623
  this.emailAgent.emit(property);
1611
1624
  }
1612
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyActionContactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1613
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.4", type: PropertyActionContactComponent, isStandalone: true, selector: "rolatech-property-action-contact", inputs: { email: { classPropertyName: "email", publicName: "email", isSignal: true, isRequired: false, transformFunction: null }, phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, viewQueries: [{ propertyName: "btnRef", first: true, predicate: ["btnEl"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<a\n mat-stroked-button\n class=\"w-full\"\n #btnEl\n [matMenuTriggerFor]=\"callMenu\"\n [matMenuTriggerData]=\"{ width: btnRef()?.nativeElement.offsetWidth }\"\n (click)=\"onCallAgent()\"\n>\n <span i18n>Ask a question</span>\n</a>\n<mat-menu #callMenu=\"matMenu\" [overlapTrigger]=\"false\" class=\"custom-menu-panel\">\n <ng-template matMenuContent let-width=\"width\">\n <div class=\"menu-content\" [ngStyle]=\"{ width: width + 'px' }\">\n <a mat-menu-item href=\"mailto:hello@gmail.com\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">email</mat-icon>\n </span>\n <span i18n>Email</span>\n </span>\n <span class=\"pl-9\" i18n>{{ email() }}</span>\n </a>\n <hr />\n <a mat-menu-item [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">call</mat-icon>\n </span>\n <span i18n>WhatsApp</span>\n </span>\n <span class=\"pl-9\" i18n>{{ phone() }}</span>\n </a>\n </div>\n </ng-template>\n</mat-menu>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], encapsulation: i0.ViewEncapsulation.None });
1625
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyActionContactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1626
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.12", type: PropertyActionContactComponent, isStandalone: true, selector: "rolatech-property-action-contact", inputs: { email: { classPropertyName: "email", publicName: "email", isSignal: true, isRequired: false, transformFunction: null }, phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, viewQueries: [{ propertyName: "btnRef", first: true, predicate: ["btnEl"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<a\n mat-stroked-button\n class=\"w-full\"\n #btnEl\n [matMenuTriggerFor]=\"callMenu\"\n [matMenuTriggerData]=\"{ width: btnRef()?.nativeElement.offsetWidth }\"\n (click)=\"onCallAgent()\"\n>\n <span i18n>Ask a question</span>\n</a>\n<mat-menu #callMenu=\"matMenu\" [overlapTrigger]=\"false\" class=\"custom-menu-panel\">\n <ng-template matMenuContent let-width=\"width\">\n <div class=\"menu-content\" [ngStyle]=\"{ width: width + 'px' }\">\n <a mat-menu-item href=\"mailto:hello@gmail.com\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">email</mat-icon>\n </span>\n <span i18n>Email</span>\n </span>\n <span class=\"pl-9\" i18n>{{ email() }}</span>\n </a>\n <hr />\n <a mat-menu-item [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">call</mat-icon>\n </span>\n <span i18n>WhatsApp</span>\n </span>\n <span class=\"pl-9\" i18n>{{ phone() }}</span>\n </a>\n </div>\n </ng-template>\n</mat-menu>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], encapsulation: i0.ViewEncapsulation.None });
1614
1627
  }
1615
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyActionContactComponent, decorators: [{
1628
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyActionContactComponent, decorators: [{
1616
1629
  type: Component,
1617
1630
  args: [{ selector: 'rolatech-property-action-contact', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<a\n mat-stroked-button\n class=\"w-full\"\n #btnEl\n [matMenuTriggerFor]=\"callMenu\"\n [matMenuTriggerData]=\"{ width: btnRef()?.nativeElement.offsetWidth }\"\n (click)=\"onCallAgent()\"\n>\n <span i18n>Ask a question</span>\n</a>\n<mat-menu #callMenu=\"matMenu\" [overlapTrigger]=\"false\" class=\"custom-menu-panel\">\n <ng-template matMenuContent let-width=\"width\">\n <div class=\"menu-content\" [ngStyle]=\"{ width: width + 'px' }\">\n <a mat-menu-item href=\"mailto:hello@gmail.com\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">email</mat-icon>\n </span>\n <span i18n>Email</span>\n </span>\n <span class=\"pl-9\" i18n>{{ email() }}</span>\n </a>\n <hr />\n <a mat-menu-item [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span class=\"flex items-center\">\n <span class=\"flex items-center\">\n <mat-icon class=\"mr-3\">call</mat-icon>\n </span>\n <span i18n>WhatsApp</span>\n </span>\n <span class=\"pl-9\" i18n>{{ phone() }}</span>\n </a>\n </div>\n </ng-template>\n</mat-menu>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"] }]
1618
- }] });
1631
+ }], propDecorators: { btnRef: [{ type: i0.ViewChild, args: ['btnEl', { ...{ read: ElementRef }, isSignal: true }] }], email: [{ type: i0.Input, args: [{ isSignal: true, alias: "email", required: false }] }], phone: [{ type: i0.Input, args: [{ isSignal: true, alias: "phone", required: false }] }], callAgent: [{ type: i0.Output, args: ["callAgent"] }], emailAgent: [{ type: i0.Output, args: ["emailAgent"] }] } });
1619
1632
 
1620
1633
  class PropertyAgentRenderer {
1621
1634
  name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
1622
1635
  avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
1623
1636
  username = input(...(ngDevMode ? [undefined, { debugName: "username" }] : []));
1624
1637
  subtitle = input(...(ngDevMode ? [undefined, { debugName: "subtitle" }] : []));
1625
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
1626
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentRenderer, isStandalone: true, selector: "rolatech-property-agent-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n <div class=\"text-sm opacity-70\">This listing is verified and managed by an Primecase agent</div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
1638
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component });
1639
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentRenderer, isStandalone: true, selector: "rolatech-property-agent-renderer", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n <div class=\"text-sm opacity-70\">This listing is verified and managed by an Primecase agent</div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
1627
1640
  }
1628
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentRenderer, decorators: [{
1641
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentRenderer, decorators: [{
1629
1642
  type: Component,
1630
1643
  args: [{ selector: 'rolatech-property-agent-renderer', imports: [AngularCommonModule, MatIconModule], template: "<div class=\"flex flex-col\">\n <div class=\"flex flex-row items-center py-3\">\n <div class=\"flex mr-3 gap-2 items-center\">\n @if (avatar()) {\n <div class=\"cursor-pointer\" [routerLink]=\"['/', '@' + username()]\">\n <img [src]=\"avatar()\" class=\"w-14 h-14 rounded-full\" alt />\n </div>\n } @else {\n <div class=\"w-14 h-14 rounded-full bg-[--rt-brand-color]\"></div>\n }\n <div class=\"flex flex-col\">\n <div class=\"flex items-center text-lg font-bold cursor-pointer\">\n <a [routerLink]=\"['/', '@' + username()]\">\n <span>{{ name() }}</span>\n </a>\n <mat-icon class=\"verified-icon\">verified</mat-icon>\n </div>\n <div class=\"text-lg font-bold text-[--rt-brand-color]\">{{ subtitle() }}</div>\n </div>\n </div>\n </div>\n <div class=\"text-sm opacity-70\">This listing is verified and managed by an Primecase agent</div>\n</div>\n" }]
1631
- }] });
1644
+ }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], avatar: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatar", required: false }] }], username: [{ type: i0.Input, args: [{ isSignal: true, alias: "username", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }] } });
1632
1645
 
1633
1646
  class PropertyHighlights {
1634
1647
  highlights = input.required(...(ngDevMode ? [{ debugName: "highlights" }] : []));
1635
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyHighlights, deps: [], target: i0.ɵɵFactoryTarget.Component });
1636
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyHighlights, isStandalone: true, selector: "rolatech-property-highlights", inputs: { highlights: { classPropertyName: "highlights", publicName: "highlights", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Highlights</div>\n <div class=\"flex flex-col flex-wrap\">\n @for (item of highlights(); track $index) {\n <div class=\"flex items-center py-1\">\n <!-- <mat-icon>check</mat-icon> -->\n <span>{{ item }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [""] });
1648
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyHighlights, deps: [], target: i0.ɵɵFactoryTarget.Component });
1649
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyHighlights, isStandalone: true, selector: "rolatech-property-highlights", inputs: { highlights: { classPropertyName: "highlights", publicName: "highlights", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Highlights</div>\n <div class=\"flex flex-col flex-wrap\">\n @for (item of highlights(); track $index) {\n <div class=\"flex items-center py-1\">\n <!-- <mat-icon>check</mat-icon> -->\n <span>{{ item }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [""] });
1637
1650
  }
1638
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyHighlights, decorators: [{
1651
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyHighlights, decorators: [{
1639
1652
  type: Component,
1640
1653
  args: [{ selector: 'rolatech-property-highlights', template: "<div class=\"\">\n <div class=\"text-2xl font-bold py-3\" i18n>Highlights</div>\n <div class=\"flex flex-col flex-wrap\">\n @for (item of highlights(); track $index) {\n <div class=\"flex items-center py-1\">\n <!-- <mat-icon>check</mat-icon> -->\n <span>{{ item }}</span>\n </div>\n }\n </div>\n</div>\n" }]
1641
- }] });
1654
+ }], propDecorators: { highlights: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlights", required: true }] }] } });
1642
1655
 
1643
1656
  const BANDS = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
1644
1657
  const RANGES = {
@@ -1782,32 +1795,43 @@ class EpcChart {
1782
1795
  textColorForScore(s) {
1783
1796
  return this.textColorForBand(bandFromScore(s));
1784
1797
  }
1785
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: EpcChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
1786
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: EpcChart, isStandalone: true, selector: "rolatech-epc-chart", inputs: { currentScore: { classPropertyName: "currentScore", publicName: "currentScore", isSignal: true, isRequired: false, transformFunction: null }, potentialScore: { classPropertyName: "potentialScore", publicName: "potentialScore", isSignal: true, isRequired: false, transformFunction: null }, showCaptions: { classPropertyName: "showCaptions", publicName: "showCaptions", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "w-full" }, ngImport: i0, template: "<svg [attr.viewBox]=\"'0 0 ' + width + ' ' + height\" class=\"w-full h-auto\">\n <!-- outer border -->\n <rect x=\"0\" y=\"0\" [attr.width]=\"width\" [attr.height]=\"height\" fill=\"none\" stroke=\"var(--rt-text-primary)\" stroke-width=\"2\" />\n\n <!-- header row -->\n <text [attr.x]=\"leftPadding\" [attr.y]=\"headerY\" font-weight=\"700\" font-size=\"16\" fill=\"var(--rt-text-primary)\">\n Energy Rating\n </text>\n <text\n [attr.x]=\"currentColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Current\n </text>\n <text\n [attr.x]=\"potentialColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Potential\n </text>\n <line\n x1=\"0\"\n [attr.y1]=\"headerY+10\"\n [attr.x2]=\"width - 16\"\n [attr.y2]=\"headerY+10\"\n stroke=\"var(--rt-text-primary)\"\n stroke-width=\"2\"\n />\n\n <!-- top/bottom captions -->\n @if (showCaptions()) {\n <text [attr.x]=\"leftPadding\" [attr.y]=\"topCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n very energy efficient - lower running costs\n </text>\n <text [attr.x]=\"leftPadding\" [attr.y]=\"bottomCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n not energy efficient - higher running costs\n </text>\n }\n\n <!-- Wedges (A..G) -->\n @for (b of bands; track b; let i = $index) {\n <!-- range text column -->\n <text [attr.x]=\"rangeX\" [attr.y]=\"rowY(i) + rowH/2 + 5\" fill=\"#6B7280\" font-size=\"16\">{{ RANGES[b] }}</text>\n\n <!-- colored wedge -->\n <polygon [attr.points]=\"wedgePoints(i)\" [attr.fill]=\"COLORS[b]\" stroke=\"none\" />\n\n <!-- band letter -->\n <text\n [attr.x]=\"wedgeLetterX(i)\"\n [attr.y]=\"rowY(i) + rowH/2 + 8\"\n fill=\"white\"\n font-size=\"28\"\n font-weight=\"700\"\n text-anchor=\"end\"\n >\n {{ b }}\n </text>\n }\n\n <!-- Current arrow badge -->\n @if (currentScore() !== null) {\n <g [attr.transform]=\"'translate(' + currentColX + ',' + arrowY(currentScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(currentScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n >\n {{ clampScore(currentScore()!) }}\n </text>\n <!-- underline (optional) -->\n <rect\n [attr.x]=\"arrowW/2 - 12\"\n [attr.y]=\"arrowH/2 + 12\"\n width=\"36\"\n height=\"3\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n opacity=\"0.8\"\n />\n </g>\n }\n\n <!-- Potential arrow badge -->\n @if (potentialScore() !== null) {\n <g [attr.transform]=\"'translate(' + potentialColX + ',' + arrowY(potentialScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(potentialScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(potentialScore()!)\"\n >\n {{ clampScore(potentialScore()!) }}\n </text>\n </g>\n }\n</svg>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1798
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: EpcChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
1799
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: EpcChart, isStandalone: true, selector: "rolatech-epc-chart", inputs: { currentScore: { classPropertyName: "currentScore", publicName: "currentScore", isSignal: true, isRequired: false, transformFunction: null }, potentialScore: { classPropertyName: "potentialScore", publicName: "potentialScore", isSignal: true, isRequired: false, transformFunction: null }, showCaptions: { classPropertyName: "showCaptions", publicName: "showCaptions", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "w-full" }, ngImport: i0, template: "<svg [attr.viewBox]=\"'0 0 ' + width + ' ' + height\" class=\"w-full h-auto\">\n <!-- outer border -->\n <rect x=\"0\" y=\"0\" [attr.width]=\"width\" [attr.height]=\"height\" fill=\"none\" stroke=\"var(--rt-text-primary)\" stroke-width=\"2\" />\n\n <!-- header row -->\n <text [attr.x]=\"leftPadding\" [attr.y]=\"headerY\" font-weight=\"700\" font-size=\"16\" fill=\"var(--rt-text-primary)\">\n Energy Rating\n </text>\n <text\n [attr.x]=\"currentColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Current\n </text>\n <text\n [attr.x]=\"potentialColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Potential\n </text>\n <line\n x1=\"0\"\n [attr.y1]=\"headerY+10\"\n [attr.x2]=\"width - 16\"\n [attr.y2]=\"headerY+10\"\n stroke=\"var(--rt-text-primary)\"\n stroke-width=\"2\"\n />\n\n <!-- top/bottom captions -->\n @if (showCaptions()) {\n <text [attr.x]=\"leftPadding\" [attr.y]=\"topCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n very energy efficient - lower running costs\n </text>\n <text [attr.x]=\"leftPadding\" [attr.y]=\"bottomCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n not energy efficient - higher running costs\n </text>\n }\n\n <!-- Wedges (A..G) -->\n @for (b of bands; track b; let i = $index) {\n <!-- range text column -->\n <text [attr.x]=\"rangeX\" [attr.y]=\"rowY(i) + rowH/2 + 5\" fill=\"#6B7280\" font-size=\"16\">{{ RANGES[b] }}</text>\n\n <!-- colored wedge -->\n <polygon [attr.points]=\"wedgePoints(i)\" [attr.fill]=\"COLORS[b]\" stroke=\"none\" />\n\n <!-- band letter -->\n <text\n [attr.x]=\"wedgeLetterX(i)\"\n [attr.y]=\"rowY(i) + rowH/2 + 8\"\n fill=\"white\"\n font-size=\"28\"\n font-weight=\"700\"\n text-anchor=\"end\"\n >\n {{ b }}\n </text>\n }\n\n <!-- Current arrow badge -->\n @if (currentScore() !== null) {\n <g [attr.transform]=\"'translate(' + currentColX + ',' + arrowY(currentScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(currentScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n >\n {{ clampScore(currentScore()!) }}\n </text>\n <!-- underline (optional) -->\n <rect\n [attr.x]=\"arrowW/2 - 12\"\n [attr.y]=\"arrowH/2 + 12\"\n width=\"36\"\n height=\"3\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n opacity=\"0.8\"\n />\n </g>\n }\n\n <!-- Potential arrow badge -->\n @if (potentialScore() !== null) {\n <g [attr.transform]=\"'translate(' + potentialColX + ',' + arrowY(potentialScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(potentialScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(potentialScore()!)\"\n >\n {{ clampScore(potentialScore()!) }}\n </text>\n </g>\n }\n</svg>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
1787
1800
  }
1788
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: EpcChart, decorators: [{
1801
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: EpcChart, decorators: [{
1789
1802
  type: Component,
1790
1803
  args: [{ selector: 'rolatech-epc-chart', imports: [CommonModule], host: { class: 'w-full' }, template: "<svg [attr.viewBox]=\"'0 0 ' + width + ' ' + height\" class=\"w-full h-auto\">\n <!-- outer border -->\n <rect x=\"0\" y=\"0\" [attr.width]=\"width\" [attr.height]=\"height\" fill=\"none\" stroke=\"var(--rt-text-primary)\" stroke-width=\"2\" />\n\n <!-- header row -->\n <text [attr.x]=\"leftPadding\" [attr.y]=\"headerY\" font-weight=\"700\" font-size=\"16\" fill=\"var(--rt-text-primary)\">\n Energy Rating\n </text>\n <text\n [attr.x]=\"currentColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Current\n </text>\n <text\n [attr.x]=\"potentialColX + arrowW/2\"\n [attr.y]=\"headerY\"\n text-anchor=\"middle\"\n font-weight=\"700\"\n font-size=\"16\"\n fill=\"var(--rt-text-primary)\"\n >\n Potential\n </text>\n <line\n x1=\"0\"\n [attr.y1]=\"headerY+10\"\n [attr.x2]=\"width - 16\"\n [attr.y2]=\"headerY+10\"\n stroke=\"var(--rt-text-primary)\"\n stroke-width=\"2\"\n />\n\n <!-- top/bottom captions -->\n @if (showCaptions()) {\n <text [attr.x]=\"leftPadding\" [attr.y]=\"topCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n very energy efficient - lower running costs\n </text>\n <text [attr.x]=\"leftPadding\" [attr.y]=\"bottomCaptionY\" fill=\"#9CA3AF\" font-size=\"20\">\n not energy efficient - higher running costs\n </text>\n }\n\n <!-- Wedges (A..G) -->\n @for (b of bands; track b; let i = $index) {\n <!-- range text column -->\n <text [attr.x]=\"rangeX\" [attr.y]=\"rowY(i) + rowH/2 + 5\" fill=\"#6B7280\" font-size=\"16\">{{ RANGES[b] }}</text>\n\n <!-- colored wedge -->\n <polygon [attr.points]=\"wedgePoints(i)\" [attr.fill]=\"COLORS[b]\" stroke=\"none\" />\n\n <!-- band letter -->\n <text\n [attr.x]=\"wedgeLetterX(i)\"\n [attr.y]=\"rowY(i) + rowH/2 + 8\"\n fill=\"white\"\n font-size=\"28\"\n font-weight=\"700\"\n text-anchor=\"end\"\n >\n {{ b }}\n </text>\n }\n\n <!-- Current arrow badge -->\n @if (currentScore() !== null) {\n <g [attr.transform]=\"'translate(' + currentColX + ',' + arrowY(currentScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(currentScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n >\n {{ clampScore(currentScore()!) }}\n </text>\n <!-- underline (optional) -->\n <rect\n [attr.x]=\"arrowW/2 - 12\"\n [attr.y]=\"arrowH/2 + 12\"\n width=\"36\"\n height=\"3\"\n [attr.fill]=\"textColorForScore(currentScore()!)\"\n opacity=\"0.8\"\n />\n </g>\n }\n\n <!-- Potential arrow badge -->\n @if (potentialScore() !== null) {\n <g [attr.transform]=\"'translate(' + potentialColX + ',' + arrowY(potentialScore()!) + ')'\">\n <polygon [attr.points]=\"arrowPoints()\" [attr.fill]=\"colorForScore(potentialScore()!)\"></polygon>\n <text\n [attr.x]=\"arrowW/2 + 6\"\n [attr.y]=\"arrowH/2 + 9\"\n text-anchor=\"middle\"\n font-size=\"24\"\n font-weight=\"800\"\n [attr.fill]=\"textColorForScore(potentialScore()!)\"\n >\n {{ clampScore(potentialScore()!) }}\n </text>\n </g>\n }\n</svg>\n" }]
1791
- }] });
1804
+ }], propDecorators: { currentScore: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentScore", required: false }] }], potentialScore: [{ type: i0.Input, args: [{ isSignal: true, alias: "potentialScore", required: false }] }], showCaptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCaptions", required: false }] }] } });
1792
1805
 
1793
1806
  class PropertyEpc {
1794
1807
  epc = input.required(...(ngDevMode ? [{ debugName: "epc" }] : []));
1795
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyEpc, deps: [], target: i0.ɵɵFactoryTarget.Component });
1796
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.4", type: PropertyEpc, isStandalone: true, selector: "rolatech-property-epc", inputs: { epc: { classPropertyName: "epc", publicName: "epc", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"w-full\">\n <div class=\"text-2xl font-bold py-3\" i18n>EPC</div>\n <div class=\"flex flex-row items-center font-thin text-sm\">\n <rolatech-epc-chart\n [currentScore]=\"epc().currentScore\"\n [potentialScore]=\"epc().potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: EpcChart, selector: "rolatech-epc-chart", inputs: ["currentScore", "potentialScore", "showCaptions"] }] });
1808
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyEpc, deps: [], target: i0.ɵɵFactoryTarget.Component });
1809
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: PropertyEpc, isStandalone: true, selector: "rolatech-property-epc", inputs: { epc: { classPropertyName: "epc", publicName: "epc", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"w-full\">\n <div class=\"text-2xl font-bold py-3\" i18n>EPC</div>\n <div class=\"flex flex-row items-center font-thin text-sm\">\n <rolatech-epc-chart\n [currentScore]=\"epc().currentScore\"\n [potentialScore]=\"epc().potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: EpcChart, selector: "rolatech-epc-chart", inputs: ["currentScore", "potentialScore", "showCaptions"] }] });
1797
1810
  }
1798
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyEpc, decorators: [{
1811
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyEpc, decorators: [{
1799
1812
  type: Component,
1800
1813
  args: [{ selector: 'rolatech-property-epc', imports: [EpcChart], template: "<div class=\"w-full\">\n <div class=\"text-2xl font-bold py-3\" i18n>EPC</div>\n <div class=\"flex flex-row items-center font-thin text-sm\">\n <rolatech-epc-chart\n [currentScore]=\"epc().currentScore\"\n [potentialScore]=\"epc().potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n</div>\n" }]
1801
- }] });
1814
+ }], propDecorators: { epc: [{ type: i0.Input, args: [{ isSignal: true, alias: "epc", required: true }] }] } });
1815
+
1816
+ class PropertyFloorplan {
1817
+ floorplans = input.required(...(ngDevMode ? [{ debugName: "floorplans" }] : []));
1818
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFloorplan, deps: [], target: i0.ɵɵFactoryTarget.Component });
1819
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyFloorplan, isStandalone: true, selector: "rolatech-property-floorplan", inputs: { floorplans: { classPropertyName: "floorplans", publicName: "floorplans", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"w-full\">\n <div class=\"text-2xl font-bold py-3\" i18n>Floorplans</div>\n <div class=\"flex flex-col flex-wrap\">\n @for (item of floorplans(); track $index) {\n <rolatech-thumbnail [src]=\"item.url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }] });
1820
+ }
1821
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyFloorplan, decorators: [{
1822
+ type: Component,
1823
+ args: [{ selector: 'rolatech-property-floorplan', imports: [ThumbnailComponent], template: "<div class=\"w-full\">\n <div class=\"text-2xl font-bold py-3\" i18n>Floorplans</div>\n <div class=\"flex flex-col flex-wrap\">\n @for (item of floorplans(); track $index) {\n <rolatech-thumbnail [src]=\"item.url\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n }\n </div>\n</div>\n" }]
1824
+ }], propDecorators: { floorplans: [{ type: i0.Input, args: [{ isSignal: true, alias: "floorplans", required: true }] }] } });
1802
1825
 
1803
1826
  class PropertyDetailsComponent extends BaseComponent {
1804
1827
  authService = inject(AuthService);
1805
1828
  authUserService = inject(AuthUserService);
1806
1829
  propertyService = inject(PropertyService);
1830
+ floorplanService = inject(FloorplanService);
1807
1831
  propertyHighlightsService = inject(PropertyHighlightsService);
1808
1832
  timezoneService = inject(TimeZoneService);
1809
1833
  authenticated = this.authService.authenticated;
1810
- property;
1834
+ property = signal(null, ...(ngDevMode ? [{ debugName: "property" }] : []));
1811
1835
  fullname = '';
1812
1836
  username = '';
1813
1837
  user;
@@ -1817,22 +1841,16 @@ class PropertyDetailsComponent extends BaseComponent {
1817
1841
  variants = [];
1818
1842
  features = [];
1819
1843
  highlights = [];
1844
+ floorplans = [];
1820
1845
  epc;
1821
1846
  timezone = signal('', ...(ngDevMode ? [{ debugName: "timezone" }] : []));
1822
- selectedVariant;
1823
- variantOption = signal(undefined, ...(ngDevMode ? [{ debugName: "variantOption" }] : []));
1824
- variantOptionChanged = computed(() => {
1825
- return this.variantOption();
1826
- }, ...(ngDevMode ? [{ debugName: "variantOptionChanged" }] : []));
1827
1847
  get videos() {
1828
- if (!this.property.videos)
1848
+ const p = this.property(); // read signal once
1849
+ if (!p || !p.videos)
1829
1850
  return [];
1830
- if (this.timezone() === 'Asia/Shanghai') {
1831
- return this.property.videos.filter((v) => v.provider === PropertyVideoProvider.COS);
1832
- }
1833
- else {
1834
- return this.property.videos.filter((v) => v.provider === PropertyVideoProvider.YOUTUBE);
1835
- }
1851
+ const tz = this.timezone();
1852
+ const provider = tz === 'Asia/Shanghai' ? PropertyVideoProvider.COS : PropertyVideoProvider.YOUTUBE;
1853
+ return p.videos.filter((v) => v.provider === provider);
1836
1854
  }
1837
1855
  // results: any[] = [];
1838
1856
  constructor() {
@@ -1847,6 +1865,7 @@ class PropertyDetailsComponent extends BaseComponent {
1847
1865
  this.getProperty();
1848
1866
  this.getFeatures();
1849
1867
  this.getHighlights();
1868
+ this.getFloorplans();
1850
1869
  this.getEpc();
1851
1870
  // this.timezoneService.getTimeZoneFromApi().subscribe({
1852
1871
  // next: res => {
@@ -1859,20 +1878,15 @@ class PropertyDetailsComponent extends BaseComponent {
1859
1878
  getProperty() {
1860
1879
  this.propertyService.get(this.id).subscribe({
1861
1880
  next: (res) => {
1862
- this.property = res.data;
1863
- const firstPart = this.property.description.split('<br/>')[0].trim();
1881
+ const p = res.data;
1882
+ this.property.set(p);
1883
+ const description = p?.description ?? '';
1884
+ const firstPart = description.split(/<br\s*\/?>/i)[0]?.trim() ?? '';
1864
1885
  const arr = firstPart.split('|').map((s) => s.trim());
1865
- if (this.property.variants) {
1866
- this.variants = this.property.variants;
1867
- this.selectedVariant = this.variants[0];
1868
- // this.selectedVariant.options.forEach((item) => {
1869
- // this.results.push([item.option.id, item.value.id]);
1870
- // });
1871
- }
1872
- if (this.property.agentId) {
1873
- this.findUserBaseInfo(this.property.agentId);
1886
+ if (p?.agentId) {
1887
+ this.findUserBaseInfo(p.agentId);
1874
1888
  }
1875
- this.titleService.setTitle(`${this.property.title}`);
1889
+ this.titleService.setTitle(`${p?.title}`);
1876
1890
  },
1877
1891
  });
1878
1892
  }
@@ -1908,6 +1922,13 @@ class PropertyDetailsComponent extends BaseComponent {
1908
1922
  },
1909
1923
  });
1910
1924
  }
1925
+ getFloorplans() {
1926
+ this.floorplanService.listFloorplans(this.id).subscribe({
1927
+ next: (res) => {
1928
+ this.floorplans = res.data || [];
1929
+ },
1930
+ });
1931
+ }
1911
1932
  getEpc() {
1912
1933
  this.propertyService.getEpc(this.id).subscribe({
1913
1934
  next: (res) => {
@@ -1962,40 +1983,10 @@ class PropertyDetailsComponent extends BaseComponent {
1962
1983
  this.snackBarService.open('Please sign in');
1963
1984
  }
1964
1985
  }
1965
- onOptionChange(e) {
1966
- const criteria = [];
1967
- this.selectedVariant.options.map((item) => {
1968
- criteria.push({
1969
- optionId: item.option.id === e.option.id ? e.option.id : item.option.id,
1970
- valueId: item.option.id === e.option.id ? e.value.id : item.value.id,
1971
- });
1972
- });
1973
- // const criteria = [
1974
- // { optionId: '249008855294545920', valueId: '249008855298740224' }, // color: red
1975
- // { optionId: '248661715955355648', valueId: '249001130061860865' }, // size: 256GB
1976
- // ];
1977
- // Function to check if a variant matches all the criteria
1978
- const matchesAllCriteria = (variant, criteria) => {
1979
- return _.every(criteria, (criterion) => {
1980
- return _.some(variant.options, (o) => o.option.id === criterion.optionId && o.value.id === criterion.valueId);
1981
- });
1982
- };
1983
- // Function to update the criteria based on a matching variant
1984
- const updateCriteriaFromVariant = (variant) => {
1985
- return _.map(variant.options, (o) => ({
1986
- optionId: o.option.id,
1987
- valueId: o.value.id,
1988
- }));
1989
- };
1990
- // Find the variant that matches all the criteria
1991
- const matchingVariant = _.find(this.variants, (variant) => matchesAllCriteria(variant, criteria));
1992
- this.selectedVariant = matchingVariant;
1993
- // const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
1994
- }
1995
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1996
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyDetailsComponent, isStandalone: true, selector: "rolatech-property-details", usesInheritance: true, ngImport: i0, template: "@if (property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n @if (features.length > 0) {\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n }\n @if (highlights.length > 0) {\n <rolatech-property-highlights [highlights]=\"highlights\"></rolatech-property-highlights>\n }\n @if (property.location) {\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n }\n @if (videos && videos.length > 0) {\n @for (item of videos; track $index) {\n <rolatech-property-video [video]=\"item\"></rolatech-property-video>\n }\n }\n @if (epc && epc.currentScore) {\n <rolatech-property-epc [epc]=\"epc\"></rolatech-property-epc>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: PropertyActionsComponent, selector: "rolatech-property-actions", inputs: ["property"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: CommentsComponent, selector: "rolatech-comments", inputs: ["itemId"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoComponent, selector: "rolatech-property-video", inputs: ["video"] }, { kind: "component", type: PropertyActionContactComponent, selector: "rolatech-property-action-contact", inputs: ["email", "phone"], outputs: ["callAgent", "emailAgent"] }, { kind: "component", type: PropertyHighlights, selector: "rolatech-property-highlights", inputs: ["highlights"] }, { kind: "component", type: PropertyEpc, selector: "rolatech-property-epc", inputs: ["epc"] }] });
1986
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1987
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyDetailsComponent, isStandalone: true, selector: "rolatech-property-details", usesInheritance: true, ngImport: i0, template: "@if (property(); as property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media ? property.media : []\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n @if (features.length > 0) {\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n }\n @if (highlights.length > 0) {\n <rolatech-property-highlights [highlights]=\"highlights\"></rolatech-property-highlights>\n }\n @if (highlights.length > 0) {\n <rolatech-property-floorplan [floorplans]=\"floorplans\"></rolatech-property-floorplan>\n }\n @if (property.location) {\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n }\n @if (videos && videos.length > 0) {\n @for (item of videos; track $index) {\n <rolatech-property-video [video]=\"item\"></rolatech-property-video>\n }\n }\n @if (epc && epc.currentScore) {\n <rolatech-property-epc [epc]=\"epc\"></rolatech-property-epc>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: PropertyActionsComponent, selector: "rolatech-property-actions", inputs: ["property"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: CommentsComponent, selector: "rolatech-comments", inputs: ["itemId"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoComponent, selector: "rolatech-property-video", inputs: ["video"] }, { kind: "component", type: PropertyActionContactComponent, selector: "rolatech-property-action-contact", inputs: ["email", "phone"], outputs: ["callAgent", "emailAgent"] }, { kind: "component", type: PropertyHighlights, selector: "rolatech-property-highlights", inputs: ["highlights"] }, { kind: "component", type: PropertyEpc, selector: "rolatech-property-epc", inputs: ["epc"] }, { kind: "component", type: PropertyFloorplan, selector: "rolatech-property-floorplan", inputs: ["floorplans"] }] });
1997
1988
  }
1998
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyDetailsComponent, decorators: [{
1989
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyDetailsComponent, decorators: [{
1999
1990
  type: Component,
2000
1991
  args: [{ selector: 'rolatech-property-details', imports: [
2001
1992
  AngularCommonModule,
@@ -2014,7 +2005,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2014
2005
  PropertyActionContactComponent,
2015
2006
  PropertyHighlights,
2016
2007
  PropertyEpc,
2017
- ], template: "@if (property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n @if (features.length > 0) {\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n }\n @if (highlights.length > 0) {\n <rolatech-property-highlights [highlights]=\"highlights\"></rolatech-property-highlights>\n }\n @if (property.location) {\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n }\n @if (videos && videos.length > 0) {\n @for (item of videos; track $index) {\n <rolatech-property-video [video]=\"item\"></rolatech-property-video>\n }\n }\n @if (epc && epc.currentScore) {\n <rolatech-property-epc [epc]=\"epc\"></rolatech-property-epc>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n" }]
2008
+ PropertyFloorplan,
2009
+ ], template: "@if (property(); as property) {\n <rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media ? property.media : []\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <!-- <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer> -->\n @if (features.length > 0) {\n <rolatech-property-features [features]=\"features\"></rolatech-property-features>\n }\n @if (highlights.length > 0) {\n <rolatech-property-highlights [highlights]=\"highlights\"></rolatech-property-highlights>\n }\n @if (highlights.length > 0) {\n <rolatech-property-floorplan [floorplans]=\"floorplans\"></rolatech-property-floorplan>\n }\n @if (property.location) {\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n }\n @if (videos && videos.length > 0) {\n @for (item of videos; track $index) {\n <rolatech-property-video [video]=\"item\"></rolatech-property-video>\n }\n }\n @if (epc && epc.currentScore) {\n <rolatech-property-epc [epc]=\"epc\"></rolatech-property-epc>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n <rolatech-comments [itemId]=\"property.id\"></rolatech-comments>\n </div>\n </div>\n <div class=\"w-full md:w-1/3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-property-actions\n [property]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-property-action-contact [email]=\"user.email\" [phone]=\"user.phone\"></rolatech-property-action-contact>\n }\n </rolatech-property-actions>\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n" }]
2018
2010
  }], ctorParameters: () => [] });
2019
2011
 
2020
2012
  const MY_FORMATS$5 = {
@@ -2040,22 +2032,22 @@ class PropertyViewingTimeComponent {
2040
2032
  time = ViewingTime;
2041
2033
  ngOnInit() {
2042
2034
  this.minDate.setDate(this.minDate.getDate() + 1);
2043
- this.maxDate.setDate(this.maxDate.getDate() + 4);
2035
+ this.maxDate.setDate(this.maxDate.getDate() + 7);
2044
2036
  }
2045
2037
  ngDoCheck() {
2046
2038
  this.output.emit(this.proposedTime());
2047
2039
  }
2048
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2049
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingTimeComponent, isStandalone: true, selector: "rolatech-property-viewing-time", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", select: "select" }, providers: [
2040
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2041
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingTimeComponent, isStandalone: true, selector: "rolatech-property-viewing-time", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", select: "select" }, providers: [
2050
2042
  {
2051
2043
  provide: DateAdapter,
2052
2044
  useClass: MomentDateAdapter,
2053
2045
  deps: [MAT_DATE_LOCALE],
2054
2046
  },
2055
2047
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$5 },
2056
- ], ngImport: i0, template: "<div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing Date</mat-label>\n <input\n matInput\n placeholder=\"Viewing date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"viewingDate\"\n [(ngModel)]=\"proposedTime()!.date\"\n (dateInput)=\"proposedTime()!.date = $event.value.format('YYYY-MM-DD')\"\n required\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing time</mat-label>\n <mat-icon matIconPrefix>schedule</mat-icon>\n <mat-select [(ngModel)]=\"proposedTime()!.time\" required readonly>\n @for (d of time; track d) {\n <mat-option [value]=\"d\">\n {{ d }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }] });
2048
+ ], ngImport: i0, template: "<div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing Date</mat-label>\n <!-- [max]=\"maxDate\" -->\n <input\n matInput\n placeholder=\"Viewing date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"viewingDate\"\n [(ngModel)]=\"proposedTime()!.date\"\n (dateInput)=\"proposedTime()!.date = $event.value.format('YYYY-MM-DD')\"\n required\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing time</mat-label>\n <mat-icon matIconPrefix>schedule</mat-icon>\n <mat-select [(ngModel)]=\"proposedTime()!.time\" required readonly>\n @for (d of time; track d) {\n <mat-option [value]=\"d\">\n {{ d }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }] });
2057
2049
  }
2058
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingTimeComponent, decorators: [{
2050
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingTimeComponent, decorators: [{
2059
2051
  type: Component,
2060
2052
  args: [{ selector: 'rolatech-property-viewing-time', imports: [
2061
2053
  MatFormFieldModule,
@@ -2073,8 +2065,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2073
2065
  deps: [MAT_DATE_LOCALE],
2074
2066
  },
2075
2067
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$5 },
2076
- ], template: "<div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing Date</mat-label>\n <input\n matInput\n placeholder=\"Viewing date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"viewingDate\"\n [(ngModel)]=\"proposedTime()!.date\"\n (dateInput)=\"proposedTime()!.date = $event.value.format('YYYY-MM-DD')\"\n required\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing time</mat-label>\n <mat-icon matIconPrefix>schedule</mat-icon>\n <mat-select [(ngModel)]=\"proposedTime()!.time\" required readonly>\n @for (d of time; track d) {\n <mat-option [value]=\"d\">\n {{ d }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
2077
- }] });
2068
+ ], template: "<div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing Date</mat-label>\n <!-- [max]=\"maxDate\" -->\n <input\n matInput\n placeholder=\"Viewing date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"viewingDate\"\n [(ngModel)]=\"proposedTime()!.date\"\n (dateInput)=\"proposedTime()!.date = $event.value.format('YYYY-MM-DD')\"\n required\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Viewing time</mat-label>\n <mat-icon matIconPrefix>schedule</mat-icon>\n <mat-select [(ngModel)]=\"proposedTime()!.time\" required readonly>\n @for (d of time; track d) {\n <mat-option [value]=\"d\">\n {{ d }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
2069
+ }], propDecorators: { output: [{ type: i0.Output, args: ["output"] }], select: [{ type: i0.Output, args: ["select"] }], proposedTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "proposedTime", required: false }] }] } });
2078
2070
 
2079
2071
  const MY_FORMATS$4 = {
2080
2072
  parse: {
@@ -2125,7 +2117,6 @@ class PropertyViewingRequestComponent extends BaseComponent {
2125
2117
  this.propertyService.get(this.id).subscribe({
2126
2118
  next: (res) => {
2127
2119
  this.property = res.data;
2128
- console.log(res.data);
2129
2120
  this.titleService.setTitle(`${this.property.title}`);
2130
2121
  },
2131
2122
  });
@@ -2140,23 +2131,24 @@ class PropertyViewingRequestComponent extends BaseComponent {
2140
2131
  this.propertyService.requestViewing(this.id, this.viewing).subscribe({
2141
2132
  next: (res) => {
2142
2133
  this.snackBarService.open('Request viewing successfully');
2134
+ this.router.navigate([`/properties/viewings/${res.data.id}`]);
2143
2135
  },
2144
2136
  error: (error) => {
2145
2137
  this.snackBarService.open(error.message);
2146
2138
  },
2147
2139
  });
2148
2140
  }
2149
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingRequestComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2150
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingRequestComponent, isStandalone: true, selector: "rolatech-property-viewing-request", providers: [
2141
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingRequestComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2142
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingRequestComponent, isStandalone: true, selector: "rolatech-property-viewing-request", providers: [
2151
2143
  {
2152
2144
  provide: DateAdapter,
2153
2145
  useClass: MomentDateAdapter,
2154
2146
  deps: [MAT_DATE_LOCALE],
2155
2147
  },
2156
2148
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$4 },
2157
- ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'Tenant') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property.title }}</div>\n <div class=\"\">Available: {{ property.availableDate | availableDate }}</div>\n @if (property.market.toString() === 'LETTINGS' && property.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property.price.toFixed(2) }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property.price.toFixed(2) }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }] });
2149
+ ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'Tenant') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property.title }}</div>\n <div class=\"\">Available: {{ property.availableDate | availableDate }}</div>\n @if (property.market.toString() === 'LETTINGS' && property.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">{{ property.price | price }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">{{ property.price | price }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }, { kind: "pipe", type: PricePipe, name: "price" }] });
2158
2150
  }
2159
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingRequestComponent, decorators: [{
2151
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingRequestComponent, decorators: [{
2160
2152
  type: Component,
2161
2153
  args: [{ selector: 'rolatech-property-viewing-request', imports: [
2162
2154
  CommonModule,
@@ -2172,6 +2164,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2172
2164
  MatRadioModule,
2173
2165
  PropertyViewingTimeComponent,
2174
2166
  AvailableDatePipe,
2167
+ PricePipe,
2175
2168
  ], providers: [
2176
2169
  {
2177
2170
  provide: DateAdapter,
@@ -2179,7 +2172,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2179
2172
  deps: [MAT_DATE_LOCALE],
2180
2173
  },
2181
2174
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$4 },
2182
- ], template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'Tenant') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property.title }}</div>\n <div class=\"\">Available: {{ property.availableDate | availableDate }}</div>\n @if (property.market.toString() === 'LETTINGS' && property.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property.price.toFixed(2) }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property.price.toFixed(2) }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"] }]
2175
+ ], template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <div class=\"mb-3\">\n <mat-radio-group\n aria-label=\"Select an option\"\n [(ngModel)]=\"viewing.viewerCategory\"\n (change)=\"onViewerSelectionChange($event)\"\n >\n <mat-radio-button [value]=\"viewerCategory.TENANT\" i18n>I'm a tenant</mat-radio-button>\n <mat-radio-button [value]=\"viewerCategory.AGENT\" i18n>I'm an agent</mat-radio-button>\n </mat-radio-group>\n </div>\n @if (selectedViewerCategory === 'Tenant') {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.firstName\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.lastName\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.phone\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant type</mat-label>\n <mat-select placeholder=\"Tenant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n } @else {\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Your email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"viewing.email\" />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number of tenants</mat-label>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.numberOfTenants\" />\n </mat-form-field>\n </div>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"viewing.applicantType\">\n @for (applicantType of applicantTypes | keyvalue; track applicantType) {\n <mat-option [value]=\"applicantType.key\">\n {{ applicantType.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"viewing.income\" />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"viewing.employmentStatus\">\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"viewing.adverseCreditStatus\">\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n }\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property.title }}</div>\n <div class=\"\">Available: {{ property.availableDate | availableDate }}</div>\n @if (property.market.toString() === 'LETTINGS' && property.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">{{ property.price | price }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">{{ property.price | price }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"] }]
2183
2176
  }] });
2184
2177
 
2185
2178
  const MY_FORMATS$3 = {
@@ -2280,17 +2273,17 @@ class PropertyOfferComponent extends BaseComponent {
2280
2273
  },
2281
2274
  });
2282
2275
  }
2283
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2284
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyOfferComponent, isStandalone: true, selector: "rolatech-property-offer", providers: [
2276
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2277
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyOfferComponent, isStandalone: true, selector: "rolatech-property-offer", providers: [
2285
2278
  {
2286
2279
  provide: DateAdapter,
2287
2280
  useClass: MomentDateAdapter,
2288
2281
  deps: [MAT_DATE_LOCALE],
2289
2282
  },
2290
2283
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$3 },
2291
- ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property()) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property()!.title }}</div>\n <div class=\"\">Available: {{ property()!.availableDate | availableDate }}</div>\n @if (property()!.market.toString() === 'LETTINGS' && property()!.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property()!.price.toFixed(2) }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property()!.price.toFixed(2) }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }] });
2284
+ ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property()) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property()!.title }}</div>\n <div class=\"\">Available: {{ property()!.availableDate | availableDate }}</div>\n @if (property()!.market.toString() === 'LETTINGS' && property()!.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">{{ property()!.price | price }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">{{ property()!.price | price }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: AvailableDatePipe, name: "availableDate" }, { kind: "pipe", type: PricePipe, name: "price" }] });
2292
2285
  }
2293
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferComponent, decorators: [{
2286
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferComponent, decorators: [{
2294
2287
  type: Component,
2295
2288
  args: [{ selector: 'rolatech-property-offer', imports: [
2296
2289
  CommonModule,
@@ -2306,6 +2299,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2306
2299
  MatDatepickerModule,
2307
2300
  MatProgressSpinner,
2308
2301
  AvailableDatePipe,
2302
+ PricePipe,
2309
2303
  ], providers: [
2310
2304
  {
2311
2305
  provide: DateAdapter,
@@ -2313,7 +2307,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2313
2307
  deps: [MAT_DATE_LOCALE],
2314
2308
  },
2315
2309
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$3 },
2316
- ], template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property()) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property()!.title }}</div>\n <div class=\"\">Available: {{ property()!.availableDate | availableDate }}</div>\n @if (property()!.market.toString() === 'LETTINGS' && property()!.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property()!.price.toFixed(2) }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">\u00A3{{ property()!.price.toFixed(2) }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"] }]
2310
+ ], template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n <span i18n=\"@@offerFor\">Offer for {{ property()?.title }}</span>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.lastName\" required />\n </mat-form-field>\n </div>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.phone\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.email\" required />\n </mat-form-field>\n\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Applicant type</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"offer.applicantType\" required>\n @for (key of applicantTypes; track key) {\n <mat-option [value]=\"key\">\n {{ PropertyApplicantType[key] }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- subscriptSizing=\"dynamic\" -->\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"offer.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\">\n {{ status.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"offer.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"offer.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\">\n {{ item.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n @if (property()) {\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"firstImageUrl()\" size=\"small\"></rolatech-thumbnail>\n </div>\n <div class=\"text-xl font-bold\">{{ property()!.title }}</div>\n <div class=\"\">Available: {{ property()!.availableDate | availableDate }}</div>\n @if (property()!.market.toString() === 'LETTINGS' && property()!.rentFrequency.toString() === 'MONTHLY') {\n <div class=\"py-3 text-xl font-bold\">{{ property()!.price | price }}pcm</div>\n } @else {\n <div class=\"py-3 text-xl font-bold\">{{ property()!.price | price }}</div>\n }\n }\n </div>\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"] }]
2317
2311
  }], ctorParameters: () => [] });
2318
2312
 
2319
2313
  class PropertyOfferIndexComponent extends BaseComponent {
@@ -2399,10 +2393,10 @@ class PropertyOfferIndexComponent extends BaseComponent {
2399
2393
  })
2400
2394
  .join(',');
2401
2395
  }
2402
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2403
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyOfferIndexComponent, isStandalone: true, selector: "rolatech-property-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Offers\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (offers) {\n @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }], encapsulation: i0.ViewEncapsulation.None });
2396
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2397
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyOfferIndexComponent, isStandalone: true, selector: "rolatech-property-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Offers\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (offers) {\n @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }], encapsulation: i0.ViewEncapsulation.None });
2404
2398
  }
2405
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferIndexComponent, decorators: [{
2399
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferIndexComponent, decorators: [{
2406
2400
  type: Component,
2407
2401
  args: [{ selector: 'rolatech-property-offer-index', imports: [
2408
2402
  CommonModule,
@@ -2429,13 +2423,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2429
2423
  class PropertyViewingItemComponent {
2430
2424
  viewing = input.required(...(ngDevMode ? [{ debugName: "viewing" }] : []));
2431
2425
  status = PropertyViewingStatus;
2432
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2433
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingItemComponent, isStandalone: true, selector: "rolatech-property-viewing-item", inputs: { viewing: { classPropertyName: "viewing", publicName: "viewing", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n @if (viewing().item) {\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ viewing().item.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2426
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2427
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingItemComponent, isStandalone: true, selector: "rolatech-property-viewing-item", inputs: { viewing: { classPropertyName: "viewing", publicName: "viewing", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n @if (viewing().item) {\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ viewing().item.price | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2434
2428
  }
2435
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingItemComponent, decorators: [{
2429
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingItemComponent, decorators: [{
2436
2430
  type: Component,
2437
- args: [{ selector: 'rolatech-property-viewing-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n @if (viewing().item) {\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ viewing().item.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n" }]
2438
- }] });
2431
+ args: [{ selector: 'rolatech-property-viewing-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, PricePipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n <div>\n <div class=\"flex justify-between w-full mb-2\">\n <a class=\"flex items-center gap-3\">\n <span>Viewing ID: {{ viewing().id }}</span>\n </a>\n <span class=\"font-medium text-sm\">{{ status[viewing().status] }}</span>\n </div>\n @if (viewing().item) {\n <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n <div class=\"flex flex-row py-2\">\n @if (viewing().item.media) {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"viewing().item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ viewing().item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ viewing().item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ viewing().item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ viewing().item.price | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n</div>\n" }]
2432
+ }], propDecorators: { viewing: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewing", required: true }] }] } });
2439
2433
 
2440
2434
  class PropertyViewingIndexComponent extends BaseComponent {
2441
2435
  propertyService = inject(PropertyService);
@@ -2511,10 +2505,10 @@ class PropertyViewingIndexComponent extends BaseComponent {
2511
2505
  })
2512
2506
  .join(',');
2513
2507
  }
2514
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2515
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingIndexComponent, isStandalone: true, selector: "rolatech-property-viewing-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Viewings\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (viewings) {\n @for (item of viewings; track item) {\n <rolatech-property-viewing-item [routerLink]=\"['./', item.id]\" [viewing]=\"item\"></rolatech-property-viewing-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyViewingItemComponent, selector: "rolatech-property-viewing-item", inputs: ["viewing"] }] });
2508
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingIndexComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2509
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingIndexComponent, isStandalone: true, selector: "rolatech-property-viewing-index", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Viewings\" large> </rolatech-toolbar>\n <rolatech-tabs [select]=\"select\">\n @for (item of links; track item) {\n @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n }\n }\n </rolatech-tabs>\n <rolatech-list>\n @if (viewings) {\n @for (item of viewings; track item) {\n <rolatech-property-viewing-item [routerLink]=\"['./', item.id]\" [viewing]=\"item\"></rolatech-property-viewing-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyViewingItemComponent, selector: "rolatech-property-viewing-item", inputs: ["viewing"] }] });
2516
2510
  }
2517
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingIndexComponent, decorators: [{
2511
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingIndexComponent, decorators: [{
2518
2512
  type: Component,
2519
2513
  args: [{ selector: 'rolatech-property-viewing-index', imports: [
2520
2514
  CommonModule,
@@ -2549,10 +2543,10 @@ class DuePipe {
2549
2543
  return '';
2550
2544
  }
2551
2545
  }
2552
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
2553
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: DuePipe, isStandalone: true, name: "due" });
2546
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
2547
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: DuePipe, isStandalone: true, name: "due" });
2554
2548
  }
2555
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DuePipe, decorators: [{
2549
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DuePipe, decorators: [{
2556
2550
  type: Pipe,
2557
2551
  args: [{
2558
2552
  name: 'due',
@@ -2562,6 +2556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2562
2556
  class PropertyOfferDetailComponent extends BaseComponent {
2563
2557
  propertyService = inject(PropertyService);
2564
2558
  authUserService = inject(AuthUserService);
2559
+ paymentService = inject(PaymentService);
2565
2560
  offer;
2566
2561
  info = false;
2567
2562
  loadingTimeline = false;
@@ -2657,12 +2652,29 @@ class PropertyOfferDetailComponent extends BaseComponent {
2657
2652
  holdingDepositCheckout() {
2658
2653
  this.checkouting = true;
2659
2654
  const data = {
2660
- successUrl: window.location.href + '?session_id={CHECKOUT_SESSION_ID}',
2661
- cancelUrl: window.location.href,
2655
+ businessType: 'OFFER',
2656
+ businessId: this.id,
2657
+ provider: 'STRIPE',
2658
+ method: 'STRIPE_CHECKOUT',
2659
+ purpose: 'HOLDING_DEPOSIT',
2662
2660
  };
2663
- this.propertyService.createHoldingDepositCheckout(this.id, data).subscribe({
2661
+ this.paymentService
2662
+ .createPaymentIntent(data)
2663
+ .pipe(switchMap((res) => {
2664
+ const intent = {
2665
+ intentId: res.data.id,
2666
+ provider: 'STRIPE',
2667
+ method: 'STRIPE_CHECKOUT',
2668
+ successUrl: window.location.href + '?session_id={CHECKOUT_SESSION_ID}',
2669
+ cancelUrl: window.location.href,
2670
+ };
2671
+ return this.paymentService.createPayment(intent);
2672
+ }))
2673
+ .subscribe({
2664
2674
  next: (res) => {
2665
- window.location.href = res.data.checkoutUrl;
2675
+ this.checkouting = false;
2676
+ const { checkoutUrl } = res.data;
2677
+ window.open(checkoutUrl, '_blank');
2666
2678
  },
2667
2679
  error: (error) => {
2668
2680
  this.checkouting = false;
@@ -2684,10 +2696,10 @@ class PropertyOfferDetailComponent extends BaseComponent {
2684
2696
  },
2685
2697
  });
2686
2698
  }
2687
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2688
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyOfferDetailComponent, isStandalone: true, selector: "rolatech-property-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full px-2\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>\u00A3{{ offer.amount.toFixed(2) }}</span>\n </div>\n @if (type() === 'LETTINGS') {\n @if (property) {\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">\u00A3{{ securityDeposit }}</span>\n </div>\n }\n }\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n <div id=\"payment-element\"></div>\n @if (offer.status.toString() === 'CREATED' || offer.status.toString() === 'PAID') {\n <div class=\"mt-6\">\n <div class=\"text-lg pb-3 font-medium\" i18n>Payment method</div>\n <div class=\"flex items-center\">\n <span class=\"ml-1\" i18n>Stripe</span>\n </div>\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'PENDING') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n }\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: DuePipe, name: "due" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2699
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2700
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyOfferDetailComponent, isStandalone: true, selector: "rolatech-property-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full px-2\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>{{ offer.amount | price }}</span>\n </div>\n @if (type() === 'LETTINGS') {\n @if (property) {\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">{{ holdingDeposit | price }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">{{ securityDeposit | price }}</span>\n </div>\n }\n }\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'CREATED') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n <!-- @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n } -->\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: DuePipe, name: "due" }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2689
2701
  }
2690
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyOfferDetailComponent, decorators: [{
2702
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyOfferDetailComponent, decorators: [{
2691
2703
  type: Component,
2692
2704
  args: [{ selector: 'rolatech-property-offer-detail', imports: [
2693
2705
  MatButtonModule,
@@ -2700,7 +2712,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2700
2712
  MatProgressSpinnerModule,
2701
2713
  RouterLink,
2702
2714
  DuePipe,
2703
- ], template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full px-2\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>\u00A3{{ offer.amount.toFixed(2) }}</span>\n </div>\n @if (type() === 'LETTINGS') {\n @if (property) {\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">\u00A3{{ holdingDeposit }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">\u00A3{{ securityDeposit }}</span>\n </div>\n }\n }\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n <div id=\"payment-element\"></div>\n @if (offer.status.toString() === 'CREATED' || offer.status.toString() === 'PAID') {\n <div class=\"mt-6\">\n <div class=\"text-lg pb-3 font-medium\" i18n>Payment method</div>\n <div class=\"flex items-center\">\n <span class=\"ml-1\" i18n>Stripe</span>\n </div>\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'PENDING') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'PENDING') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n }\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
2715
+ PricePipe,
2716
+ ], template: "@if (offer) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n <button mat-flat-button (click)=\"timeline()\">\n <mat-icon>history</mat-icon>\n <span i18n>Offer status</span>\n </button>\n </rolatech-toolbar>\n <div>\n <div class=\"flex justify-between items-center py-2\">\n <a class=\"text-xl font-bold\">Offer ID: {{ offer.id }}</a>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', offer.item.propertyId]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full px-2\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount | price }}</div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div>\n <div class=\"mt-3\">\n <div class=\"text-lg py-2 font-bold\" i18n>Offer info</div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Created at</span>\n <span class=\"text-sm\"> {{ offer.createdAt }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Start date</span>\n <span class=\"text-sm\"> {{ offer.startDate }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Asked price</span>\n <span class=\"text-sm\" i18n>{{ offer.amount | price }}</span>\n </div>\n @if (type() === 'LETTINGS') {\n @if (property) {\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Deposit due date</span>\n <span class=\"text-sm\"> {{ offer.startDate | due }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Holding deposit</span>\n <span class=\"text-sm\">{{ holdingDeposit | price }}</span>\n </div>\n <div class=\"flex items-center justify-between py-1\">\n <span class=\"font-medium\" i18n>Security deposit</span>\n <span class=\"text-sm\">{{ securityDeposit | price }}</span>\n </div>\n }\n }\n <div class=\"flex items-baseline justify-between py-1\">\n <span class=\"font-medium min-w-20\" i18n>Note</span>\n <!-- <span class=\"text-sm\">{{ offer.note || '' }}</span> -->\n </div>\n </div>\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (offer.status.toString() === 'CREATED') {\n <span\n class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n (click)=\"cancel()\"\n i18n\n >Cancel</span\n >\n }\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"holdingDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay holding deposit' }}\n </span>\n </button>\n }\n <!-- @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"securityDepositCheckout()\" [disabled]=\"checkouting\">\n <span style=\"display: flex; align-items: center\">\n @if (checkouting) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n }\n {{ checkouting ? 'Processing...' : 'Pay security deposit' }}\n </span>\n </button>\n } -->\n <!-- <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"securityDepositCheckout()\" i18n>Pay security deposit</button> -->\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n @if (loadingTimeline) {\n <div>\n <rolatech-spinner></rolatech-spinner>\n </div>\n } @else {\n <div class=\"mt-3 p-1 sm:p-4\">\n <ol class=\"relative boffer-l boffer-[--rt-boffer-color]\">\n @for (item of timelineData; track item) {\n <li class=\"mb-8 ml-4\">\n <div\n class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 boffer boffer-[--rt-raised-background] bg-[--rt-text-primary]\"\n ></div>\n <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n @if (item.status === 'OFFER_RETURN_REJECTED') {\n <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n }\n @if (item.status === 'OFFER_RETURN_REQUESTED') {\n <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n }\n <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n </li>\n }\n </ol>\n </div>\n }\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
2704
2717
  }] });
2705
2718
 
2706
2719
  class PropertyViewingDetailComponent extends BaseComponent {
@@ -2754,10 +2767,10 @@ class PropertyViewingDetailComponent extends BaseComponent {
2754
2767
  },
2755
2768
  });
2756
2769
  }
2757
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2758
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingDetailComponent, isStandalone: true, selector: "rolatech-property-viewing-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2770
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2771
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingDetailComponent, isStandalone: true, selector: "rolatech-property-viewing-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
2759
2772
  }
2760
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingDetailComponent, decorators: [{
2773
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingDetailComponent, decorators: [{
2761
2774
  type: Component,
2762
2775
  args: [{ selector: 'rolatech-property-viewing-detail', imports: [
2763
2776
  MatButtonModule,
@@ -2768,7 +2781,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
2768
2781
  ContainerComponent,
2769
2782
  ToolbarComponent,
2770
2783
  RouterLink,
2771
- ], template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
2784
+ PricePipe,
2785
+ ], template: "@if (viewing) {\n <rolatech-container>\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"> </rolatech-toolbar>\n <div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div\n class=\"flex items-center py-2 cursor-pointer hover:bg-[--rt-raised-background]\"\n [routerLink]=\"['../../', property.id]\"\n >\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n </div>\n }\n </div>\n <!-- safe area -->\n <div class=\"pb-16 sm:pb-3\"></div>\n <div class=\"\">\n <div class=\"flex items-center justify-end\">\n @if (viewing.status.toString() !== 'CANCELLED') {\n <button mat-flat-button class=\"min-h-11\" (click)=\"cancel()\" i18n>Cancel</button>\n }\n </div>\n </div>\n </div>\n </rolatech-container>\n}\n@if (info) {\n <div\n [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n >\n <div class=\"flex justify-between items-center sm:p-4\">\n <div class=\"text-xl font-bold\" i18n>Status</div>\n <button mat-icon-button (click)=\"info = !info\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n </div>\n}\n\n<div\n (click)=\"info = !info\"\n [ngClass]=\"info ? 'visible' : 'invisible'\"\n class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
2772
2786
  }] });
2773
2787
 
2774
2788
  class PropertyWishlistComponent extends BaseComponent {
@@ -2784,10 +2798,10 @@ class PropertyWishlistComponent extends BaseComponent {
2784
2798
  },
2785
2799
  });
2786
2800
  }
2787
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyWishlistComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2788
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyWishlistComponent, isStandalone: true, selector: "rolatech-property-wishlist", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Wishlist\" large> </rolatech-toolbar>\n <rolatech-list>\n @if (wishlist) {\n @for (item of wishlist; track item) {\n <rolatech-property-item [routerLink]=\"['../', item.id]\" [property]=\"item\"></rolatech-property-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyItemComponent, selector: "rolatech-property-item", inputs: ["property"] }] });
2801
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyWishlistComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2802
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyWishlistComponent, isStandalone: true, selector: "rolatech-property-wishlist", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <rolatech-toolbar title=\"Wishlist\" large> </rolatech-toolbar>\n <rolatech-list>\n @if (wishlist) {\n @for (item of wishlist; track item) {\n <rolatech-property-item [routerLink]=\"['../', item.id]\" [property]=\"item\"></rolatech-property-item>\n }\n } @else {\n <rolatech-empty></rolatech-empty>\n }\n </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: PropertyItemComponent, selector: "rolatech-property-item", inputs: ["property"] }] });
2789
2803
  }
2790
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyWishlistComponent, decorators: [{
2804
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyWishlistComponent, decorators: [{
2791
2805
  type: Component,
2792
2806
  args: [{ selector: 'rolatech-property-wishlist', imports: [
2793
2807
  CommonModule,
@@ -2816,7 +2830,7 @@ const propertyRoutes = [
2816
2830
  children: [
2817
2831
  {
2818
2832
  path: '',
2819
- loadComponent: () => import('./rolatech-angular-property-property-index.component-Ds8sfDlb.mjs').then((x) => x.PropertyIndexComponent),
2833
+ loadComponent: () => import('./rolatech-angular-property-property-index.component-SkgBKmOk.mjs').then((x) => x.PropertyIndexComponent),
2820
2834
  },
2821
2835
  ],
2822
2836
  },
@@ -2990,10 +3004,10 @@ class PropertyManageIndexComponent {
2990
3004
  replaceUrl: true, // optional: avoid stacking history on every page click
2991
3005
  });
2992
3006
  }
2993
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2994
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageIndexComponent, isStandalone: true, selector: "rolatech-property-manage-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\">\n <div class=\"flex items-center gap-2\">\n <button mat-icon-button (click)=\"toggleSearch()\">\n <mat-icon>search</mat-icon>\n </button>\n <!-- <button mat-icon-button (click)=\"toggleView()\">\n <mat-icon>{{ gridView ? 'view_list' : 'grid_on' }}</mat-icon>\n </button> -->\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add property</span>\n </button>\n <!-- <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\">\n <mat-icon>download</mat-icon>\n <span i18n>Export</span>\n </button> -->\n <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\" aria-label=\"Export CSV\">\n @if (!exporting) {\n Export CSV\n } @else {\n Exporting\u2026\n }\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-2\">\n <rolatech-search-bar\n [(show)]=\"open\"\n #searchBar\n (search)=\"searchByText($event)\"\n (close)=\"onCloseSearch()\"\n ></rolatech-search-bar>\n</div>\n@if (loading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <!-- <rolatech-property-manage-filter></rolatech-property-manage-filter> -->\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties(); track $index) {\n <rolatech-property-manage-item\n [property]=\"item\"\n routerLink=\"./{{ item.id }}/manage/info\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageIndex]=\"pageIndex()\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{display:flex;flex-direction:column;--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }, { kind: "component", type: SearchBar, selector: "rolatech-search-bar", inputs: ["show"], outputs: ["showChange", "search", "close"] }], encapsulation: i0.ViewEncapsulation.None });
3007
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3008
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageIndexComponent, isStandalone: true, selector: "rolatech-property-manage-index", host: { properties: { "class.rolatech-property-manage-index": "this.hasClass" } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: "<rolatech-toolbar title=\"Properties\">\n <div class=\"flex items-center gap-2\">\n <button mat-icon-button (click)=\"toggleSearch()\">\n <mat-icon>search</mat-icon>\n </button>\n <!-- <button mat-icon-button (click)=\"toggleView()\">\n <mat-icon>{{ gridView ? 'view_list' : 'grid_on' }}</mat-icon>\n </button> -->\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add property</span>\n </button>\n <!-- <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\">\n <mat-icon>download</mat-icon>\n <span i18n>Export</span>\n </button> -->\n <button mat-flat-button (click)=\"export()\" [disabled]=\"exporting\" aria-label=\"Export CSV\">\n @if (!exporting) {\n Export CSV\n } @else {\n Exporting\u2026\n }\n </button>\n </div>\n</rolatech-toolbar>\n<div class=\"p-2\">\n <rolatech-search-bar\n [(show)]=\"open\"\n #searchBar\n (search)=\"searchByText($event)\"\n (close)=\"onCloseSearch()\"\n ></rolatech-search-bar>\n</div>\n@if (loading) {\n <div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n </div>\n} @else {\n <div class=\"bg-[--rt-rasised-background] h-full\">\n <!-- <rolatech-property-manage-filter></rolatech-property-manage-filter> -->\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of properties(); track $index) {\n <rolatech-property-manage-item\n [property]=\"item\"\n routerLink=\"./{{ item.id }}/manage/info\"\n ></rolatech-property-manage-item>\n }\n </div>\n </div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageIndex]=\"pageIndex()\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}rolatech-property-manage-index{display:flex;flex-direction:column;--rt-property-view-items-per-row: 1}@media (min-width: 600px){rolatech-property-manage-index{--rt-property-view-items-per-row: 2}}@media (min-width: 768px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-property-manage-index{--rt-property-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-property-manage-index{--rt-property-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-property-manage-index{--rt-property-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: PropertyManageItemComponent, selector: "rolatech-property-manage-item", inputs: ["property", "thumbnail", "list"] }, { kind: "component", type: SearchBar, selector: "rolatech-search-bar", inputs: ["show"], outputs: ["showChange", "search", "close"] }], encapsulation: i0.ViewEncapsulation.None });
2995
3009
  }
2996
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageIndexComponent, decorators: [{
3010
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageIndexComponent, decorators: [{
2997
3011
  type: Component,
2998
3012
  args: [{ selector: 'rolatech-property-manage-index', imports: [
2999
3013
  MatButtonModule,
@@ -3010,7 +3024,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
3010
3024
  }], propDecorators: { hasClass: [{
3011
3025
  type: HostBinding,
3012
3026
  args: ['class.rolatech-property-manage-index']
3013
- }] } });
3027
+ }], paginator: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatPaginator), { isSignal: true }] }] } });
3014
3028
 
3015
3029
  class PropertyManageCreateComponent {
3016
3030
  propertyService = inject(PropertyService);
@@ -3033,10 +3047,10 @@ class PropertyManageCreateComponent {
3033
3047
  },
3034
3048
  });
3035
3049
  }
3036
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3037
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageCreateComponent, isStandalone: true, selector: "rolatech-property-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add property\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <section>\n <form #productForm=\"ngForm\">\n <div class=\"flex flex-col\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n </div>\n </form>\n </section>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Create</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
3050
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3051
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageCreateComponent, isStandalone: true, selector: "rolatech-property-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add property\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <section>\n <form #productForm=\"ngForm\">\n <div class=\"flex flex-col\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n </div>\n </form>\n </section>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Create</button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
3038
3052
  }
3039
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageCreateComponent, decorators: [{
3053
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageCreateComponent, decorators: [{
3040
3054
  type: Component,
3041
3055
  args: [{ selector: 'rolatech-property-manage-create', imports: [
3042
3056
  ToolbarComponent,
@@ -3095,19 +3109,19 @@ class PropertyManageLayoutComponent extends BaseComponent {
3095
3109
  },
3096
3110
  });
3097
3111
  }
3098
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3099
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageLayoutComponent, isStandalone: true, selector: "rolatech-property-manage-layout", usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./videos\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Videos</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./floorplan\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Floorplan</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <a routerLink=\"./keywords\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Keywords</a>\n <a routerLink=\"./highlights\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Highlights</a>\n <a routerLink=\"./epc\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>EPC</a>\n <a routerLink=\"./translation\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Translation</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], encapsulation: i0.ViewEncapsulation.None });
3112
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageLayoutComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3113
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageLayoutComponent, isStandalone: true, selector: "rolatech-property-manage-layout", usesInheritance: true, ngImport: i0, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./videos\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Videos</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./floorplans\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Floorplans</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <a routerLink=\"./keywords\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Keywords</a>\n <a routerLink=\"./highlights\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Highlights</a>\n <a routerLink=\"./epc\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>EPC</a>\n <a routerLink=\"./translation\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Translation</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], encapsulation: i0.ViewEncapsulation.None });
3100
3114
  }
3101
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageLayoutComponent, decorators: [{
3115
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageLayoutComponent, decorators: [{
3102
3116
  type: Component,
3103
- args: [{ selector: 'rolatech-property-manage-layout', imports: [RouterLink, RouterLinkActive, MatButtonModule, RouterOutlet], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./videos\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Videos</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./floorplan\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Floorplan</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <a routerLink=\"./keywords\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Keywords</a>\n <a routerLink=\"./highlights\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Highlights</a>\n <a routerLink=\"./epc\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>EPC</a>\n <a routerLink=\"./translation\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Translation</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
3117
+ args: [{ selector: 'rolatech-property-manage-layout', imports: [RouterLink, RouterLinkActive, MatButtonModule, RouterOutlet], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col md:flex-row m-auto\">\n <div\n class=\"min-w-[256px] px-3 md:px-0 flex flex-row md:flex-col md:h-full items-center md:items-start h-16 overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n >\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-1\" i18n>Property</div>\n <a routerLink=\"./info\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Basic info</a>\n <a routerLink=\"./media\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Media</a>\n <a routerLink=\"./videos\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Videos</a>\n <a routerLink=\"./sections\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Details</a>\n <a routerLink=\"./floorplans\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Floorplans</a>\n <a routerLink=\"./location\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Location</a>\n <a routerLink=\"./features\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Features</a>\n <a routerLink=\"./keywords\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Keywords</a>\n <a routerLink=\"./highlights\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Highlights</a>\n <a routerLink=\"./epc\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>EPC</a>\n <a routerLink=\"./translation\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Translation</a>\n <!-- <a routerLink=\"./amenities\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Amenities</a> -->\n <!-- <a routerLink=\"./tags\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Tags</a> -->\n <!-- <a routerLink=\"./options\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Options</a> -->\n </div>\n <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Settings</div>\n <!-- <a routerLink=\"./variants\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Variants</a> -->\n <a routerLink=\"./schedule\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Schedule</a>\n <a routerLink=\"./pricing\" routerLinkActive=\"manage-active\" class=\"p-2\" i18n>Pricing</a>\n </div>\n <!-- <div class=\"flex flex-row md:flex-col md:w-full\">\n <div class=\"hidden md:flex text-xl font-bold h-14 items-center px-2\" i18n>Others</div>\n </div> -->\n @if (property) {\n @if (property.status.toString() === 'DRAFT') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"submit()\" i18n>Submit for review</button>\n </div>\n }\n @if (property.status.toString() === 'PENDING') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button disabled i18n>Pending</button>\n </div>\n }\n @if (property.status.toString() === 'APPROVED') {\n <div class=\"md:mt-6 md:ml-2 flex items-center\">\n <button mat-flat-button (click)=\"publish()\" i18n>Publish</button>\n </div>\n }\n }\n </div>\n <div class=\"w-full\">\n <router-outlet></router-outlet>\n </div>\n</div>\n", styles: [".manage-active{background-color:var(--rt-10-percent-layer, rgba(0, 0, 0, .05));box-shadow:4px 0 var(--rt-base-background-inverse, #000) inset;font-weight:600}@media (max-width: 768px){.manage-active{box-shadow:inset 0 -4px 0 0 var(--rt-base-background-inverse, #000)}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
3104
3118
  }] });
3105
3119
 
3106
3120
  class PropertyManageContentComponent {
3107
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3108
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageContentComponent, isStandalone: true, selector: "rolatech-property-manage-content", ngImport: i0, template: "<ng-content select=\"rolatech-toolbar\"></ng-content>\n<div class=\"p-3\">\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3121
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3122
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageContentComponent, isStandalone: true, selector: "rolatech-property-manage-content", ngImport: i0, template: "<ng-content select=\"rolatech-toolbar\"></ng-content>\n<div class=\"p-3\">\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3109
3123
  }
3110
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageContentComponent, decorators: [{
3124
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageContentComponent, decorators: [{
3111
3125
  type: Component,
3112
3126
  args: [{ selector: 'rolatech-property-manage-content', imports: [CommonModule], template: "<ng-content select=\"rolatech-toolbar\"></ng-content>\n<div class=\"p-3\">\n <ng-content></ng-content>\n</div>\n" }]
3113
3127
  }] });
@@ -3194,8 +3208,8 @@ class PropertyManageInfoComponent extends BaseComponent {
3194
3208
  },
3195
3209
  });
3196
3210
  }
3197
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3198
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageInfoComponent, isStandalone: true, selector: "rolatech-property-manage-info", inputs: { price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, deposit: { classPropertyName: "deposit", publicName: "deposit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { price: "priceChange", deposit: "depositChange" }, providers: [
3211
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3212
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageInfoComponent, isStandalone: true, selector: "rolatech-property-manage-info", inputs: { price: { classPropertyName: "price", publicName: "price", isSignal: true, isRequired: false, transformFunction: null }, deposit: { classPropertyName: "deposit", publicName: "deposit", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { price: "priceChange", deposit: "depositChange" }, providers: [
3199
3213
  {
3200
3214
  provide: DateAdapter,
3201
3215
  useClass: MomentDateAdapter,
@@ -3204,7 +3218,7 @@ class PropertyManageInfoComponent extends BaseComponent {
3204
3218
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$2 },
3205
3219
  ], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Receptions </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.receptions\" name=\"receptions\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "directive", type: DecimalDirective, selector: "[rolatechDecimal]" }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }] });
3206
3220
  }
3207
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageInfoComponent, decorators: [{
3221
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageInfoComponent, decorators: [{
3208
3222
  type: Component,
3209
3223
  args: [{ selector: 'rolatech-property-manage-info', imports: [
3210
3224
  FormsModule,
@@ -3228,9 +3242,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
3228
3242
  },
3229
3243
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$2 },
3230
3244
  ], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Basic info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n @if (property) {\n <div class=\"flex flex-col\">\n <form #propertyForm=\"ngForm\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Title </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.title\" name=\"title\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Description </mat-label>\n <textarea\n matInput\n type=\"text\"\n [(ngModel)]=\"property.description\"\n name=\"description\"\n required\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n ></textarea>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bedrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bedrooms\" name=\"bedrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Bathrooms </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.bathrooms\" name=\"bathrooms\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Receptions </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.receptions\" name=\"receptions\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Floor </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.floor\" name=\"floor\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Size(sqft) </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"property.size\" name=\"size\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Type</mat-label>\n <mat-select\n name=\"type\"\n [compareWith]=\"typeCompareFn\"\n (selectionChange)=\"onTypeChange($event)\"\n [(ngModel)]=\"property.type\"\n >\n @for (type of propertyType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <!-- <mat-form-field appearance=\"fill\" required>\n <mat-label i18n>Price type</mat-label>\n <mat-select name=\"priceType\" [compareWith]=\"priceTypeCompareFn\" [(ngModel)]=\"property.priceType\">\n @for (type of priceType | keyvalue; track type) {\n <mat-option [value]=\"type.key\">\n {{ type.value }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field> -->\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Available date</mat-label>\n <input\n matInput\n placeholder=\"Available date\"\n [matDatepicker]=\"availableDatePicker\"\n [min]=\"minDate\"\n (focus)=\"availableDatePicker.open()\"\n name=\"availableDate\"\n [(ngModel)]=\"property.availableDate\"\n (dateInput)=\"property.availableDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"availableDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #availableDatePicker></mat-datepicker>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Price </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"price\" name=\"price\" required rolatechDecimal />\n </mat-form-field>\n @if (property.priceType && property.priceType.toString() === 'PARTIAL') {\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Deposit </mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"deposit\" name=\"deposit\" required rolatechDecimal />\n </mat-form-field>\n }\n </form>\n </div>\n <div>\n <button mat-flat-button (click)=\"update()\" i18n>Save</button>\n </div>\n }\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"] }]
3231
- }] });
3245
+ }], propDecorators: { price: [{ type: i0.Input, args: [{ isSignal: true, alias: "price", required: false }] }, { type: i0.Output, args: ["priceChange"] }], deposit: [{ type: i0.Input, args: [{ isSignal: true, alias: "deposit", required: false }] }, { type: i0.Output, args: ["depositChange"] }] } });
3232
3246
 
3233
- const SIZE = 10 * 1024 * 1024; // file slice size 10MB
3247
+ const SIZE$1 = 10 * 1024 * 1024; // file slice size 10MB
3234
3248
  class PropertyManageMediaComponent {
3235
3249
  route = inject(ActivatedRoute);
3236
3250
  propertyService = inject(PropertyService);
@@ -3268,7 +3282,7 @@ class PropertyManageMediaComponent {
3268
3282
  });
3269
3283
  dialogRef.afterClosed().subscribe((result) => { });
3270
3284
  }
3271
- createFileChunk(file, size = SIZE) {
3285
+ createFileChunk(file, size = SIZE$1) {
3272
3286
  const fileChunkList = [];
3273
3287
  let cur = 0;
3274
3288
  while (cur < file.size) {
@@ -3377,8 +3391,8 @@ class PropertyManageMediaComponent {
3377
3391
  const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
3378
3392
  width: '400px',
3379
3393
  data: {
3380
- title: '删除图片',
3381
- message: '确定删除这张商品图片吗?',
3394
+ title: 'Delete media',
3395
+ message: 'Are you sure to delete?',
3382
3396
  },
3383
3397
  });
3384
3398
  dialogRef.afterClosed().subscribe((result) => {
@@ -3395,10 +3409,10 @@ class PropertyManageMediaComponent {
3395
3409
  }
3396
3410
  });
3397
3411
  }
3398
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3399
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageMediaComponent, isStandalone: true, selector: "rolatech-property-manage-media", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Media info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"onMultipleFilesUpload($event)\">\n @for (item of media; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onImageClick(i)\"\n (deleteMedia)=\"onMediaDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: MediaListComponent, selector: "rolatech-media-list", inputs: ["isUploading", "media", "showAdd"], outputs: ["mediaItemClick", "upload"] }, { kind: "component", type: MediaListItemComponent, selector: "rolatech-media-list-item", inputs: ["media", "uploadProgress", "uploading"], outputs: ["mediaItemClick", "deleteMedia"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }] });
3412
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3413
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageMediaComponent, isStandalone: true, selector: "rolatech-property-manage-media", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Media info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"onMultipleFilesUpload($event)\">\n @for (item of media; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onImageClick(i)\"\n (deleteMedia)=\"onMediaDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: MediaListComponent, selector: "rolatech-media-list", inputs: ["isUploading", "media", "showAdd"], outputs: ["mediaItemClick", "upload"] }, { kind: "component", type: MediaListItemComponent, selector: "rolatech-media-list-item", inputs: ["media", "uploadProgress", "uploading"], outputs: ["mediaItemClick", "deleteMedia"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }] });
3400
3414
  }
3401
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageMediaComponent, decorators: [{
3415
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageMediaComponent, decorators: [{
3402
3416
  type: Component,
3403
3417
  args: [{ selector: 'rolatech-property-manage-media', imports: [MediaListComponent, MediaListItemComponent, ToolbarComponent, PropertyManageContentComponent], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Media info\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"onMultipleFilesUpload($event)\">\n @for (item of media; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onImageClick(i)\"\n (deleteMedia)=\"onMediaDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n" }]
3404
3418
  }], ctorParameters: () => [] });
@@ -3438,10 +3452,10 @@ class PropertyManageSectionItemComponent {
3438
3452
  this.deleteMedia.emit({ section: this.section(), media });
3439
3453
  this.selectedImg = this.section().media ? first(this.section().media) : null;
3440
3454
  }
3441
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageSectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3442
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageSectionItemComponent, isStandalone: true, selector: "rolatech-property-manage-section-item", inputs: { isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null }, section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, selectMedia: { classPropertyName: "selectMedia", publicName: "selectMedia", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { upload: "upload", delete: "delete", save: "save", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div class=\"px-3\">\n <div\n class=\"h-14 py-3 flex items-center justify-between cursor-pointer\"\n (click)=\"expanded = !expanded; $event.stopPropagation()\"\n >\n <div class=\"flex\">\n <div class=\"w-32 line-clamp-1\">{{ section().title }}</div>\n <div class=\"line-clamp-1\">{{ section().description }}</div>\n </div>\n <div>\n <button mat-icon-button aria-label=\"expand row\" (click)=\"expanded = !expanded; $event.stopPropagation()\">\n @if (expanded) {\n <mat-icon>keyboard_arrow_up</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_down</mat-icon>\n }\n </button>\n </div>\n </div>\n <div class=\"flex flex-col gap-3 w-full overflow-hidden collapsed\" [class.expanded]=\"expanded\">\n <div class=\"flex flex-col lg:flex-row\">\n <div class=\"flex flex-col grow\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Title</mat-label>\n <input matInput placeholder=\"Title\" i18n-placeholder [(ngModel)]=\"section().title\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" [hideRequiredMarker]=\"true\">\n <mat-label i18n>Description</mat-label>\n <textarea\n matInput\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n placeholder=\"Description\"\n [(ngModel)]=\"section().description\"\n i18n-placeholder\n ></textarea>\n </mat-form-field>\n </div>\n <!-- media -->\n <div class=\"lg:basis-1/2 px-0 lg:px-3\">\n @if (selectedImg) {\n <div class=\"flex flex-row justify-center relative aspect-video\">\n <img class=\"object-contain w-full\" [src]=\"selectedImg.url\" [alt]=\"selectedImg.alt\" />\n <div class=\"absolute z-30 right-0\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1\"\n >\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(selectedImg)\">\n <span i18n>Delete</span>\n </button>\n </mat-menu>\n </div>\n </div>\n }\n\n <!-- media -->\n <div>\n <div class=\"flex flex-row flex-wrap cursor-pointer relative box-border\" fxLayout=\"row\">\n <div class=\"progress-bar\">\n @if (section().isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n @for (media of section().media; track media) {\n <div class=\"media-list-item\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n }\n <input style=\"display: none\" type=\"file\" accept=\"image/*\" (change)=\"onUpload($event)\" #fileInput />\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n @if (actions()) {\n <div class=\"flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onDelete(section())\" i18n>Delete</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(section())\" i18n>Save</button>\n </div>\n }\n </div>\n</div>\n\n<mat-divider></mat-divider>\n", styles: [".media-list{flex-wrap:wrap;box-sizing:border-box}.progress-bar{display:block;min-height:6px;width:100%}.media-list-item{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:64px;width:64px;object-fit:contain;cursor:pointer;border:1px solid grey;position:relative;box-sizing:border-box;border-radius:8px}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
3455
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageSectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3456
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageSectionItemComponent, isStandalone: true, selector: "rolatech-property-manage-section-item", inputs: { isUploading: { classPropertyName: "isUploading", publicName: "isUploading", isSignal: true, isRequired: false, transformFunction: null }, section: { classPropertyName: "section", publicName: "section", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, selectMedia: { classPropertyName: "selectMedia", publicName: "selectMedia", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { upload: "upload", delete: "delete", save: "save", deleteMedia: "deleteMedia" }, ngImport: i0, template: "<div class=\"px-3\">\n <div\n class=\"h-14 py-3 flex items-center justify-between cursor-pointer\"\n (click)=\"expanded = !expanded; $event.stopPropagation()\"\n >\n <div class=\"flex\">\n <div class=\"w-32 line-clamp-1\">{{ section().title }}</div>\n <div class=\"line-clamp-1\">{{ section().description }}</div>\n </div>\n <div>\n <button mat-icon-button aria-label=\"expand row\" (click)=\"expanded = !expanded; $event.stopPropagation()\">\n @if (expanded) {\n <mat-icon>keyboard_arrow_up</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_down</mat-icon>\n }\n </button>\n </div>\n </div>\n <div class=\"flex flex-col gap-3 w-full overflow-hidden collapsed\" [class.expanded]=\"expanded\">\n <div class=\"flex flex-col lg:flex-row\">\n <div class=\"flex flex-col grow\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Title</mat-label>\n <input matInput placeholder=\"Title\" i18n-placeholder [(ngModel)]=\"section().title\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" [hideRequiredMarker]=\"true\">\n <mat-label i18n>Description</mat-label>\n <textarea\n matInput\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n placeholder=\"Description\"\n [(ngModel)]=\"section().description\"\n i18n-placeholder\n ></textarea>\n </mat-form-field>\n </div>\n <!-- media -->\n <div class=\"lg:basis-1/2 px-0 lg:px-3\">\n @if (selectedImg) {\n <div class=\"flex flex-row justify-center relative aspect-video\">\n <img class=\"object-contain w-full\" [src]=\"selectedImg.url\" [alt]=\"selectedImg.alt\" />\n <div class=\"absolute z-30 right-0\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1\"\n >\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(selectedImg)\">\n <span i18n>Delete</span>\n </button>\n </mat-menu>\n </div>\n </div>\n }\n\n <!-- media -->\n <div>\n <div class=\"flex flex-row flex-wrap cursor-pointer relative box-border\" fxLayout=\"row\">\n <div class=\"progress-bar\">\n @if (section().isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n @for (media of section().media; track media) {\n <div class=\"media-list-item\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n }\n <input style=\"display: none\" type=\"file\" accept=\"image/*\" (change)=\"onUpload($event)\" #fileInput />\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n @if (actions()) {\n <div class=\"flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onDelete(section())\" i18n>Delete</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(section())\" i18n>Save</button>\n </div>\n }\n </div>\n</div>\n\n<mat-divider></mat-divider>\n", styles: [".media-list{flex-wrap:wrap;box-sizing:border-box}.progress-bar{display:block;min-height:6px;width:100%}.media-list-item{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:64px;width:64px;object-fit:contain;cursor:pointer;border:1px solid grey;position:relative;box-sizing:border-box;border-radius:8px}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
3443
3457
  }
3444
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageSectionItemComponent, decorators: [{
3458
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageSectionItemComponent, decorators: [{
3445
3459
  type: Component,
3446
3460
  args: [{ selector: 'rolatech-property-manage-section-item', imports: [
3447
3461
  MatFormFieldModule,
@@ -3454,7 +3468,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
3454
3468
  MatProgressBarModule,
3455
3469
  MatDividerModule,
3456
3470
  ], template: "<div class=\"px-3\">\n <div\n class=\"h-14 py-3 flex items-center justify-between cursor-pointer\"\n (click)=\"expanded = !expanded; $event.stopPropagation()\"\n >\n <div class=\"flex\">\n <div class=\"w-32 line-clamp-1\">{{ section().title }}</div>\n <div class=\"line-clamp-1\">{{ section().description }}</div>\n </div>\n <div>\n <button mat-icon-button aria-label=\"expand row\" (click)=\"expanded = !expanded; $event.stopPropagation()\">\n @if (expanded) {\n <mat-icon>keyboard_arrow_up</mat-icon>\n } @else {\n <mat-icon>keyboard_arrow_down</mat-icon>\n }\n </button>\n </div>\n </div>\n <div class=\"flex flex-col gap-3 w-full overflow-hidden collapsed\" [class.expanded]=\"expanded\">\n <div class=\"flex flex-col lg:flex-row\">\n <div class=\"flex flex-col grow\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Title</mat-label>\n <input matInput placeholder=\"Title\" i18n-placeholder [(ngModel)]=\"section().title\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" [hideRequiredMarker]=\"true\">\n <mat-label i18n>Description</mat-label>\n <textarea\n matInput\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"3\"\n placeholder=\"Description\"\n [(ngModel)]=\"section().description\"\n i18n-placeholder\n ></textarea>\n </mat-form-field>\n </div>\n <!-- media -->\n <div class=\"lg:basis-1/2 px-0 lg:px-3\">\n @if (selectedImg) {\n <div class=\"flex flex-row justify-center relative aspect-video\">\n <img class=\"object-contain w-full\" [src]=\"selectedImg.url\" [alt]=\"selectedImg.alt\" />\n <div class=\"absolute z-30 right-0\">\n <button\n mat-icon-button\n [matMenuTriggerFor]=\"beforeMenu\"\n class=\"ml-auto focus:outline-none hover:bg-[--rt-base-background] p-1\"\n >\n <mat-icon>more_vert</mat-icon>\n </button>\n <mat-menu #beforeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item (click)=\"onDeleteMedia(selectedImg)\">\n <span i18n>Delete</span>\n </button>\n </mat-menu>\n </div>\n </div>\n }\n\n <!-- media -->\n <div>\n <div class=\"flex flex-row flex-wrap cursor-pointer relative box-border\" fxLayout=\"row\">\n <div class=\"progress-bar\">\n @if (section().isUploading) {\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n }\n </div>\n @for (media of section().media; track media) {\n <div class=\"media-list-item\">\n <img class=\"tile-media\" (click)=\"onMediaItemClick(media)\" [src]=\"media.url\" [alt]=\"media.alt\" />\n </div>\n }\n <input style=\"display: none\" type=\"file\" accept=\"image/*\" (change)=\"onUpload($event)\" #fileInput />\n <div class=\"add-button\">\n <div (click)=\"fileInput.click()\" class=\"tile-media flex justify-center items-center\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"48px\" viewBox=\"0 -960 960 960\" width=\"48px\" fill=\"#5f6368\">\n <path d=\"M444-444H240v-72h204v-204h72v204h204v72H516v204h-72v-204Z\" />\n </svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n @if (actions()) {\n <div class=\"flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onDelete(section())\" i18n>Delete</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(section())\" i18n>Save</button>\n </div>\n }\n </div>\n</div>\n\n<mat-divider></mat-divider>\n", styles: [".media-list{flex-wrap:wrap;box-sizing:border-box}.progress-bar{display:block;min-height:6px;width:100%}.media-list-item{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}.tile-media{height:64px;width:64px;object-fit:contain;cursor:pointer;border:1px solid grey;position:relative;box-sizing:border-box;border-radius:8px}.add-button{cursor:pointer;position:relative;box-sizing:border-box;padding:2px}\n"] }]
3457
- }], ctorParameters: () => [] });
3471
+ }], ctorParameters: () => [], propDecorators: { isUploading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isUploading", required: false }] }], section: [{ type: i0.Input, args: [{ isSignal: true, alias: "section", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], selectMedia: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMedia", required: false }] }], upload: [{ type: i0.Output, args: ["upload"] }], delete: [{ type: i0.Output, args: ["delete"] }], save: [{ type: i0.Output, args: ["save"] }], deleteMedia: [{ type: i0.Output, args: ["deleteMedia"] }] } });
3458
3472
 
3459
3473
  class PropertyManageSectionsComponent {
3460
3474
  route = inject(ActivatedRoute);
@@ -3606,10 +3620,10 @@ class PropertyManageSectionsComponent {
3606
3620
  }
3607
3621
  });
3608
3622
  }
3609
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3610
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageSectionsComponent, isStandalone: true, selector: "rolatech-property-manage-sections", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Details\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <div>\n <div>\n @for (section of sections; track section) {\n <rolatech-property-manage-section-item\n [section]=\"section\"\n (upload)=\"onUploadSectionMedia($event)\"\n (deleteMedia)=\"onDeleteSectionMedia($event)\"\n (save)=\"onSectionSave($event)\"\n (delete)=\"onSectionDelete($event)\"\n [actions]=\"true\"\n ></rolatech-property-manage-section-item>\n }\n </div>\n <button mat-stroked-button (click)=\"addSection()\" class=\"mt-3\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: PropertyManageSectionItemComponent, selector: "rolatech-property-manage-section-item", inputs: ["isUploading", "section", "actions", "selectMedia"], outputs: ["upload", "delete", "save", "deleteMedia"] }] });
3623
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3624
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageSectionsComponent, isStandalone: true, selector: "rolatech-property-manage-sections", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Details\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <div>\n <div>\n @for (section of sections; track section) {\n <rolatech-property-manage-section-item\n [section]=\"section\"\n (upload)=\"onUploadSectionMedia($event)\"\n (deleteMedia)=\"onDeleteSectionMedia($event)\"\n (save)=\"onSectionSave($event)\"\n (delete)=\"onSectionDelete($event)\"\n [actions]=\"true\"\n ></rolatech-property-manage-section-item>\n }\n </div>\n <button mat-stroked-button (click)=\"addSection()\" class=\"mt-3\">\n <mat-icon>add</mat-icon>\n <span i18n>Add</span>\n </button>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: PropertyManageSectionItemComponent, selector: "rolatech-property-manage-section-item", inputs: ["isUploading", "section", "actions", "selectMedia"], outputs: ["upload", "delete", "save", "deleteMedia"] }] });
3611
3625
  }
3612
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageSectionsComponent, decorators: [{
3626
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageSectionsComponent, decorators: [{
3613
3627
  type: Component,
3614
3628
  args: [{ selector: 'rolatech-property-manage-sections', imports: [
3615
3629
  MatButtonModule,
@@ -3621,19 +3635,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
3621
3635
  }], ctorParameters: () => [] });
3622
3636
 
3623
3637
  class PropertyManagePricingComponent {
3624
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManagePricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3625
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManagePricingComponent, isStandalone: true, selector: "rolatech-property-manage-pricing", ngImport: i0, template: "<p>property-manage-pricing works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3638
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManagePricingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3639
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManagePricingComponent, isStandalone: true, selector: "rolatech-property-manage-pricing", ngImport: i0, template: "<p>property-manage-pricing works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3626
3640
  }
3627
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManagePricingComponent, decorators: [{
3641
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManagePricingComponent, decorators: [{
3628
3642
  type: Component,
3629
3643
  args: [{ selector: 'rolatech-property-manage-pricing', imports: [CommonModule], template: "<p>property-manage-pricing works!</p>\n" }]
3630
3644
  }] });
3631
3645
 
3632
3646
  class PropertyManageScheduleComponent {
3633
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageScheduleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3634
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageScheduleComponent, isStandalone: true, selector: "rolatech-property-manage-schedule", ngImport: i0, template: "<p>property-manage-schedule works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3647
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageScheduleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3648
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageScheduleComponent, isStandalone: true, selector: "rolatech-property-manage-schedule", ngImport: i0, template: "<p>property-manage-schedule works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
3635
3649
  }
3636
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageScheduleComponent, decorators: [{
3650
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageScheduleComponent, decorators: [{
3637
3651
  type: Component,
3638
3652
  args: [{ selector: 'rolatech-property-manage-schedule', imports: [CommonModule], template: "<p>property-manage-schedule works!</p>\n" }]
3639
3653
  }] });
@@ -3720,10 +3734,10 @@ class PropertyManageFeaturesComponent extends BaseComponent {
3720
3734
  }
3721
3735
  return binding;
3722
3736
  }
3723
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageFeaturesComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3724
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageFeaturesComponent, isStandalone: true, selector: "rolatech-property-manage-features", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Features\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n @for (feature of features; track $index) {\n <div>\n <h4>{{ feature.name }}</h4>\n @for (value of feature.values; track $index) {\n <mat-checkbox\n [checked]=\"selected[feature.id] ? selected[feature.id].includes(value.id) : false\"\n (change)=\"toggleValue(feature.id, value.id, $event.checked)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n }\n </div>\n\n <!-- @for (item of features; track item) {\n <section class=\"example-section\">\n <span class=\"example-list-section\">\n <h4>{{ item.name }}</h4>\n <mat-checkbox\n class=\"example-margin\"\n [checked]=\"item.selected\"\n [indeterminate]=\"partiallyComplete(item)()\"\n (change)=\"sectionChange(item, $event.checked)\"\n >\n {{ item.name }}\n </mat-checkbox>\n </span>\n <div class=\"example-list-section\">\n <div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox [checked]=\"value.selected\" (change)=\"sectionChange(item, $event.checked, i)\">\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n </div>\n </section>\n } -->\n <!-- <div class=\"px-3 mb-3\">\n @for (item of features; track $index) {\n <div class=\"text-xl font-bold py-2\">{{ item.name }}</div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox\n class=\"text-lg font-medium\"\n (click)=\"$event.stopPropagation()\"\n [checked]=\"value.selected\"\n (change)=\"sectionChange($event.checked, i)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n }\n </div> -->\n <button mat-flat-button (click)=\"save()\" i18n>Save</button>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
3737
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageFeaturesComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3738
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageFeaturesComponent, isStandalone: true, selector: "rolatech-property-manage-features", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Features\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n @for (feature of features; track $index) {\n <div>\n <h4>{{ feature.name }}</h4>\n @for (value of feature.values; track $index) {\n <mat-checkbox\n [checked]=\"selected[feature.id] ? selected[feature.id].includes(value.id) : false\"\n (change)=\"toggleValue(feature.id, value.id, $event.checked)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n }\n </div>\n\n <!-- @for (item of features; track item) {\n <section class=\"example-section\">\n <span class=\"example-list-section\">\n <h4>{{ item.name }}</h4>\n <mat-checkbox\n class=\"example-margin\"\n [checked]=\"item.selected\"\n [indeterminate]=\"partiallyComplete(item)()\"\n (change)=\"sectionChange(item, $event.checked)\"\n >\n {{ item.name }}\n </mat-checkbox>\n </span>\n <div class=\"example-list-section\">\n <div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox [checked]=\"value.selected\" (change)=\"sectionChange(item, $event.checked, i)\">\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n </div>\n </section>\n } -->\n <!-- <div class=\"px-3 mb-3\">\n @for (item of features; track $index) {\n <div class=\"text-xl font-bold py-2\">{{ item.name }}</div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox\n class=\"text-lg font-medium\"\n (click)=\"$event.stopPropagation()\"\n [checked]=\"value.selected\"\n (change)=\"sectionChange($event.checked, i)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n }\n </div> -->\n <button mat-flat-button (click)=\"save()\" i18n>Save</button>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
3725
3739
  }
3726
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageFeaturesComponent, decorators: [{
3740
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageFeaturesComponent, decorators: [{
3727
3741
  type: Component,
3728
3742
  args: [{ selector: 'rolatech-property-manage-features', imports: [CommonModule, PropertyManageContentComponent, ToolbarComponent, MatCheckboxModule, MatButtonModule], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Features\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n @for (feature of features; track $index) {\n <div>\n <h4>{{ feature.name }}</h4>\n @for (value of feature.values; track $index) {\n <mat-checkbox\n [checked]=\"selected[feature.id] ? selected[feature.id].includes(value.id) : false\"\n (change)=\"toggleValue(feature.id, value.id, $event.checked)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n }\n </div>\n\n <!-- @for (item of features; track item) {\n <section class=\"example-section\">\n <span class=\"example-list-section\">\n <h4>{{ item.name }}</h4>\n <mat-checkbox\n class=\"example-margin\"\n [checked]=\"item.selected\"\n [indeterminate]=\"partiallyComplete(item)()\"\n (change)=\"sectionChange(item, $event.checked)\"\n >\n {{ item.name }}\n </mat-checkbox>\n </span>\n <div class=\"example-list-section\">\n <div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox [checked]=\"value.selected\" (change)=\"sectionChange(item, $event.checked, i)\">\n {{ value.name }}\n </mat-checkbox>\n }\n </div>\n </div>\n </section>\n } -->\n <!-- <div class=\"px-3 mb-3\">\n @for (item of features; track $index) {\n <div class=\"text-xl font-bold py-2\">{{ item.name }}</div>\n @for (value of item.values; track value; let i = $index) {\n <mat-checkbox\n class=\"text-lg font-medium\"\n (click)=\"$event.stopPropagation()\"\n [checked]=\"value.selected\"\n (change)=\"sectionChange($event.checked, i)\"\n >\n {{ value.name }}\n </mat-checkbox>\n }\n }\n </div> -->\n <button mat-flat-button (click)=\"save()\" i18n>Save</button>\n</rolatech-property-manage-content>\n" }]
3729
3743
  }] });
@@ -3876,10 +3890,10 @@ class PropertyManageLocationComponent extends BaseComponent {
3876
3890
  });
3877
3891
  }
3878
3892
  searchSchools(lat, lng, radius = 2000) { }
3879
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageLocationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3880
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageLocationComponent, isStandalone: true, selector: "rolatech-property-manage-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { location: "locationChange" }, viewQueries: [{ propertyName: "autocompleteInput", first: true, predicate: ["autocompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div class=\"collapsed\" [class.expanded]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().name\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street </mat-label>\n <input matInput [(ngModel)]=\"location().street\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Town </mat-label>\n <input matInput [(ngModel)]=\"location().town\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Postcode </mat-label>\n <input matInput [(ngModel)]=\"location().postCode\" required />\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex justify-end items-center p-3 gap-3\">\n <button mat-flat-button i18n (click)=\"save()\">Save</button>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}.collapsed{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.expanded{max-height:1000px}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
3893
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageLocationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3894
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageLocationComponent, isStandalone: true, selector: "rolatech-property-manage-location", inputs: { location: { classPropertyName: "location", publicName: "location", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { location: "locationChange" }, viewQueries: [{ propertyName: "autocompleteInput", first: true, predicate: ["autocompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div class=\"collapsed\" [class.expanded]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().name\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street </mat-label>\n <input matInput [(ngModel)]=\"location().street\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Town </mat-label>\n <input matInput [(ngModel)]=\"location().town\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Postcode </mat-label>\n <input matInput [(ngModel)]=\"location().postCode\" required />\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex justify-end items-center p-3 gap-3\">\n <button mat-flat-button i18n (click)=\"save()\">Save</button>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}.collapsed{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.expanded{max-height:1000px}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
3881
3895
  }
3882
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageLocationComponent, decorators: [{
3896
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageLocationComponent, decorators: [{
3883
3897
  type: Component,
3884
3898
  args: [{ selector: 'rolatech-property-manage-location', imports: [
3885
3899
  PropertyManageContentComponent,
@@ -3894,7 +3908,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
3894
3908
  MatButtonModule,
3895
3909
  MatIconModule,
3896
3910
  ], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Location\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <mat-form-field position=\"left\">\n <input\n type=\"text\"\n placeholder=\"Search for a location\"\n #searchInput\n (input)=\"onInputChange($event)\"\n matInput\n [matAutocomplete]=\"auto\"\n />\n <mat-autocomplete\n class=\"single-autocomplete\"\n #auto=\"matAutocomplete\"\n (optionSelected)=\"onOptionSelected($event)\"\n [displayWith]=\"displayFn\"\n >\n @for (prediction of predictions; track $index) {\n <mat-option [value]=\"prediction\">\n {{ prediction.description }}\n </mat-option>\n }\n </mat-autocomplete>\n </mat-form-field>\n <div class=\"border px-3 rounded-md\">\n <div class=\"flex justify-between items-center py-3 cursor-pointer select-none\" i18n (click)=\"expand = !expand\">\n <span> Enter the address manually </span>\n <mat-icon>{{ expand ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n <div class=\"collapsed\" [class.expanded]=\"!expand\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Flat number </mat-label>\n <input matInput [(ngModel)]=\"location().flatNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street number </mat-label>\n <input matInput [(ngModel)]=\"location().streetNumber\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Building name </mat-label>\n <input matInput [(ngModel)]=\"location().name\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Street </mat-label>\n <input matInput [(ngModel)]=\"location().street\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Town </mat-label>\n <input matInput [(ngModel)]=\"location().town\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n> Postcode </mat-label>\n <input matInput [(ngModel)]=\"location().postCode\" required />\n </mat-form-field>\n </div>\n </div>\n <div class=\"flex justify-end items-center p-3 gap-3\">\n <button mat-flat-button i18n (click)=\"save()\">Save</button>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}.collapsed{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.expanded{max-height:1000px}\n"] }]
3897
- }], propDecorators: { autocompleteInput: [{
3911
+ }], propDecorators: { location: [{ type: i0.Input, args: [{ isSignal: true, alias: "location", required: false }] }, { type: i0.Output, args: ["locationChange"] }], autocompleteInput: [{
3898
3912
  type: ViewChild,
3899
3913
  args: ['autocompleteInput', { static: false }]
3900
3914
  }] } });
@@ -3910,33 +3924,13 @@ class PropertyVideoYoutubeAddComponent {
3910
3924
  ngDoCheck() {
3911
3925
  this.output.emit(this.url);
3912
3926
  }
3913
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoYoutubeAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3914
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyVideoYoutubeAddComponent, isStandalone: true, selector: "rolatech-property-video-youtube-add", outputs: { output: "output" }, ngImport: i0, template: "<mat-form-field appearance=\"fill\">\n <mat-label>Youtube Video URL</mat-label>\n <input matInput placeholder=\"Youtube Video URL\" type=\"text\" [(ngModel)]=\"url\" i18n />\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
3927
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoYoutubeAddComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3928
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyVideoYoutubeAddComponent, isStandalone: true, selector: "rolatech-property-video-youtube-add", outputs: { output: "output" }, ngImport: i0, template: "<mat-form-field appearance=\"fill\">\n <mat-label>Youtube Video URL</mat-label>\n <input matInput placeholder=\"Youtube Video URL\" type=\"text\" [(ngModel)]=\"url\" i18n />\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
3915
3929
  }
3916
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoYoutubeAddComponent, decorators: [{
3930
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoYoutubeAddComponent, decorators: [{
3917
3931
  type: Component,
3918
3932
  args: [{ selector: 'rolatech-property-video-youtube-add', imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule], template: "<mat-form-field appearance=\"fill\">\n <mat-label>Youtube Video URL</mat-label>\n <input matInput placeholder=\"Youtube Video URL\" type=\"text\" [(ngModel)]=\"url\" i18n />\n</mat-form-field>\n", styles: ["mat-form-field{width:100%}\n"] }]
3919
- }] });
3920
-
3921
- class SafeUrlPipe {
3922
- sanitizer = inject(DomSanitizer);
3923
- transform(url) {
3924
- if (!url) {
3925
- return null;
3926
- }
3927
- // If you want to allow in [href], [src], [poster], [srcdoc], etc.
3928
- return this.sanitizer.bypassSecurityTrustResourceUrl(url);
3929
- }
3930
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SafeUrlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
3931
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: SafeUrlPipe, isStandalone: true, name: "safeUrl" });
3932
- }
3933
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SafeUrlPipe, decorators: [{
3934
- type: Pipe,
3935
- args: [{
3936
- name: 'safeUrl',
3937
- standalone: true
3938
- }]
3939
- }] });
3933
+ }], propDecorators: { output: [{ type: i0.Output, args: ["output"] }] } });
3940
3934
 
3941
3935
  class PropertyVideoItem {
3942
3936
  platformId = inject(PLATFORM_ID);
@@ -3988,10 +3982,10 @@ class PropertyVideoItem {
3988
3982
  const videoElement = event.target;
3989
3983
  this.video().duration = videoElement.duration;
3990
3984
  }
3991
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
3992
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyVideoItem, isStandalone: true, selector: "rolatech-property-video-item", inputs: { progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, video: { classPropertyName: "video", publicName: "video", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, hasUnsaved: { classPropertyName: "hasUnsaved", publicName: "hasUnsaved", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editId: "editIdChange", save: "save", cancel: "cancel", delete: "delete", edit: "edit", upload: "upload" }, viewQueries: [{ propertyName: "myVideo", first: true, predicate: ["video"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col grow p-2\">\n @if (!editTitle) {\n <div class=\"w-full flex gap-3 p-3 items-center\">\n <span>{{ video().title }}</span>\n <button mat-icon-button (click)=\"onEdit(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n } @else {\n <div class=\"flex flex-col justify-between items-center\">\n <rolatech-input [(title)]=\"video().title\" placeholder=\"Title\"></rolatech-input>\n <div class=\"w-full flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onCancel(video())\" i18n>Cancel</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(video())\" i18n>Save</button>\n </div>\n </div>\n }\n\n <div>\n @if (video().url) {\n <div class=\"flex flex-col p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n controls\n #videoContainer\n [src]=\"video().url\"\n class=\"w-full aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"video().thumbnail\"\n >\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n @if (video().uploading) {\n <div>\n <span> {{ video().progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <span>{{ video().duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (video().uploading) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"video().progress\"> </mat-progress-bar>\n </div>\n } } @else {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload(video().id, $event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n }\n </div>\n @if (!hasUnsaved()) {\n <ng-content></ng-content>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: InputComponent, selector: "rolatech-input", inputs: ["title", "placeholder"], outputs: ["titleChange"] }, { kind: "pipe", type: DurationPipe, name: "duration" }] });
3985
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
3986
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyVideoItem, isStandalone: true, selector: "rolatech-property-video-item", inputs: { progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, video: { classPropertyName: "video", publicName: "video", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, hasUnsaved: { classPropertyName: "hasUnsaved", publicName: "hasUnsaved", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editId: "editIdChange", save: "save", cancel: "cancel", delete: "delete", edit: "edit", upload: "upload" }, viewQueries: [{ propertyName: "myVideo", first: true, predicate: ["video"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col grow p-2\">\n @if (!editTitle) {\n <div class=\"w-full flex gap-3 p-3 items-center\">\n <span>{{ video().title }}</span>\n <button mat-icon-button (click)=\"onEdit(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n } @else {\n <div class=\"flex flex-col justify-between items-center\">\n <rolatech-input [(title)]=\"video().title\" placeholder=\"Title\"></rolatech-input>\n <div class=\"w-full flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onCancel(video())\" i18n>Cancel</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(video())\" i18n>Save</button>\n </div>\n </div>\n }\n\n <div>\n @if (video().url) {\n <div class=\"flex flex-col p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n controls\n #videoContainer\n [src]=\"video().url\"\n class=\"w-full aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"video().thumbnail\"\n >\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n @if (video().uploading) {\n <div>\n <span> {{ video().progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <span>{{ video().duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (video().uploading) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"video().progress\"> </mat-progress-bar>\n </div>\n } } @else {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload(video().id, $event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n }\n </div>\n @if (!hasUnsaved()) {\n <ng-content></ng-content>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: InputComponent, selector: "rolatech-input", inputs: ["title", "placeholder"], outputs: ["titleChange"] }, { kind: "pipe", type: DurationPipe, name: "duration" }] });
3993
3987
  }
3994
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyVideoItem, decorators: [{
3988
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyVideoItem, decorators: [{
3995
3989
  type: Component,
3996
3990
  args: [{ selector: 'rolatech-property-video-item', imports: [
3997
3991
  MatIconModule,
@@ -4003,7 +3997,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
4003
3997
  DurationPipe,
4004
3998
  InputComponent
4005
3999
  ], template: "<div class=\"flex flex-col grow p-2\">\n @if (!editTitle) {\n <div class=\"w-full flex gap-3 p-3 items-center\">\n <span>{{ video().title }}</span>\n <button mat-icon-button (click)=\"onEdit(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button (click)=\"onDelete(video()); $event.stopPropagation()\" class=\"max-w-8 max-h-8 !p-1\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n } @else {\n <div class=\"flex flex-col justify-between items-center\">\n <rolatech-input [(title)]=\"video().title\" placeholder=\"Title\"></rolatech-input>\n <div class=\"w-full flex flex-row justify-end p-3 gap-3\">\n <button mat-button class=\"max-h-8\" (click)=\"onCancel(video())\" i18n>Cancel</button>\n <button mat-flat-button class=\"max-h-8\" (click)=\"onSave(video())\" i18n>Save</button>\n </div>\n </div>\n }\n\n <div>\n @if (video().url) {\n <div class=\"flex flex-col p-2 gap-3\">\n <div class=\"bg-black h-fit\">\n <video\n controls\n #videoContainer\n [src]=\"video().url\"\n class=\"w-full aspect-video\"\n (loadedmetadata)=\"onLoadedMetadata($event)\"\n [poster]=\"video().thumbnail\"\n >\n <!-- <source [src]=\"video().url\" type=\"video/mp4\" /> -->\n </video>\n </div>\n <div class=\"flex flex-col justify-between w-full\">\n <div class=\"flex justify-between items-center w-full\">\n @if (video().uploading) {\n <div>\n <span> {{ video().progress }}%</span>\n </div>\n }\n </div>\n <div class=\"flex justify-between items-center\">\n <div>\n <span>{{ video().duration | duration }}</span>\n </div>\n </div>\n </div>\n </div>\n @if (video().uploading) {\n <div class=\"p-2\">\n <mat-progress-bar mode=\"determinate\" [value]=\"video().progress\"> </mat-progress-bar>\n </div>\n } } @else {\n <div class=\"px-3\">\n <input\n class=\"ud-sr-only\"\n type=\"file\"\n accept=\".avi,.mpg,.mpeg,.flv,.mov,.m2v,.m4v,.mp4,.rm,.ram,.vob,.ogv,.webm,.wmv\"\n (change)=\"onUpload(video().id, $event)\"\n #fileInput\n />\n <div class=\"flex justify-between items-center\">\n <div i18n>No videos</div>\n <button mat-flat-button class=\"max-h-8\" (click)=\"fileInput.click()\" i18n>Upload</button>\n </div>\n </div>\n }\n </div>\n @if (!hasUnsaved()) {\n <ng-content></ng-content>\n }\n</div>\n", styles: [".ud-sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}\n"] }]
4006
- }] });
4000
+ }], propDecorators: { myVideo: [{ type: i0.ViewChild, args: ['video', { isSignal: true }] }], progress: [{ type: i0.Input, args: [{ isSignal: true, alias: "progress", required: false }] }], video: [{ type: i0.Input, args: [{ isSignal: true, alias: "video", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], hasUnsaved: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasUnsaved", required: false }] }], editId: [{ type: i0.Input, args: [{ isSignal: true, alias: "editId", required: false }] }, { type: i0.Output, args: ["editIdChange"] }], save: [{ type: i0.Output, args: ["save"] }], cancel: [{ type: i0.Output, args: ["cancel"] }], delete: [{ type: i0.Output, args: ["delete"] }], edit: [{ type: i0.Output, args: ["edit"] }], upload: [{ type: i0.Output, args: ["upload"] }] } });
4007
4001
 
4008
4002
  class PropertyManageVideoComponent extends BaseComponent {
4009
4003
  propertyService = inject(PropertyService);
@@ -4018,10 +4012,10 @@ class PropertyManageVideoComponent extends BaseComponent {
4018
4012
  selectProvider = '';
4019
4013
  videoEditId = '';
4020
4014
  get youtubeVideos() {
4021
- return this.videos.filter(v => v.provider === PropertyVideoProvider.YOUTUBE);
4015
+ return this.videos.filter((v) => v.provider === PropertyVideoProvider.YOUTUBE);
4022
4016
  }
4023
4017
  get cosVideos() {
4024
- return this.videos.filter(v => v.provider === PropertyVideoProvider.COS);
4018
+ return this.videos.filter((v) => v.provider === PropertyVideoProvider.COS);
4025
4019
  }
4026
4020
  constructor() {
4027
4021
  super();
@@ -4069,7 +4063,7 @@ class PropertyManageVideoComponent extends BaseComponent {
4069
4063
  const data = {
4070
4064
  url: res,
4071
4065
  title: 'Youtube',
4072
- provider: PropertyVideoProvider.YOUTUBE
4066
+ provider: PropertyVideoProvider.YOUTUBE,
4073
4067
  };
4074
4068
  this.propertyService.addVideo(this.id, data).subscribe({
4075
4069
  next: (res) => {
@@ -4097,7 +4091,7 @@ class PropertyManageVideoComponent extends BaseComponent {
4097
4091
  if (res) {
4098
4092
  const data = {
4099
4093
  url: res,
4100
- title: video.title
4094
+ title: video.title,
4101
4095
  };
4102
4096
  this.propertyService.updateVideo(this.id, video.id, data).subscribe({
4103
4097
  next: (res) => {
@@ -4118,7 +4112,7 @@ class PropertyManageVideoComponent extends BaseComponent {
4118
4112
  }
4119
4113
  addCOSVideo() {
4120
4114
  const video = {
4121
- provider: PropertyVideoProvider.COS
4115
+ provider: PropertyVideoProvider.COS,
4122
4116
  };
4123
4117
  this.propertyService.addVideo(this.id, video).subscribe({
4124
4118
  next: (res) => {
@@ -4130,7 +4124,8 @@ class PropertyManageVideoComponent extends BaseComponent {
4130
4124
  onCOSVideoSave(event) {
4131
4125
  const { id, title, url } = event;
4132
4126
  const data = {
4133
- title, url
4127
+ title,
4128
+ url,
4134
4129
  };
4135
4130
  this.propertyService.updateVideo(this.id, id, data).subscribe({
4136
4131
  next: (res) => {
@@ -4153,9 +4148,9 @@ class PropertyManageVideoComponent extends BaseComponent {
4153
4148
  next: (res) => {
4154
4149
  if (res) {
4155
4150
  this.propertyService.deleteVideo(this.id, video.id).subscribe({
4156
- next: res => {
4157
- this.videos = this.videos.filter(v => v.id !== video.id);
4158
- this.snackBarService.open("Video deleted");
4151
+ next: (res) => {
4152
+ this.videos = this.videos.filter((v) => v.id !== video.id);
4153
+ this.snackBarService.open('Video deleted');
4159
4154
  },
4160
4155
  error: (error) => {
4161
4156
  this.snackBarService.open(error.message);
@@ -4263,12 +4258,22 @@ class PropertyManageVideoComponent extends BaseComponent {
4263
4258
  }
4264
4259
  return fileChunkList;
4265
4260
  }
4266
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4267
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageVideoComponent, isStandalone: true, selector: "rolatech-property-manage-video", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Videos\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <rolatech-tabs [(select)]=\"tabIndex\">\n <rolatech-tab label=\"Youtube\"></rolatech-tab>\n <rolatech-tab label=\"COS\"></rolatech-tab>\n </rolatech-tabs>\n <div class=\"py-2\">\n @if (tabIndex() === 0) {\n @if (youtubeVideos.length > 0 && youtubeVideos[0].url) {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10 border bg-white\">\n <span>Loading...</span>\n </div>\n }\n <iframe\n [src]=\"toYoutubeEmbed(youtubeVideos[0].url) | safeUrl\"\n frameborder=\"0\"\n allowfullscreen\n class=\"w-full h-full\"\n (load)=\"iframeLoaded = true\"\n ></iframe>\n </div>\n <button mat-flat-button (click)=\"updateYoutubeUrl(youtubeVideos[0])\" class=\"mt-3\">Update Youtube url</button>\n } @else {\n <button mat-flat-button (click)=\"addYoutubeUrl()\" class=\"mt-3\">Add Youtube url</button>\n }\n }\n @if (tabIndex() === 1) {\n @for (video of cosVideos; track $index) {\n <rolatech-property-video-item\n [video]=\"video\"\n (save)=\"onCOSVideoSave($event)\"\n (delete)=\"onCOSVideoDelete(video, $event)\"\n (edit)=\"onVideoEdit($event)\"\n (upload)=\"onCOSVideoUpload(video, $event)\"\n [editId]=\"videoEditId\"\n ></rolatech-property-video-item>\n }\n @if (cosVideos.length === 0) {\n <div class=\"p-3\">\n <button mat-flat-button class=\"max-h-8\" (click)=\"addCOSVideo()\">\n <mat-icon>add</mat-icon>\n <span>Add video</span>\n </button>\n </div>\n }\n <!-- <rolatech-video-upload (upload)=\"onMediaUploadInit($event)\"></rolatech-video-upload> -->\n }\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: PropertyVideoItem, selector: "rolatech-property-video-item", inputs: ["progress", "video", "actions", "hasUnsaved", "editId"], outputs: ["editIdChange", "save", "cancel", "delete", "edit", "upload"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: SafeUrlPipe, name: "safeUrl" }] });
4261
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4262
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageVideoComponent, isStandalone: true, selector: "rolatech-property-manage-video", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Videos\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <rolatech-tabs [(select)]=\"tabIndex\">\n <rolatech-tab label=\"Youtube\"></rolatech-tab>\n <rolatech-tab label=\"COS\"></rolatech-tab>\n </rolatech-tabs>\n <div class=\"py-2\">\n @if (tabIndex() === 0) {\n @if (youtubeVideos.length > 0 && youtubeVideos[0].url) {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10 border bg-white\">\n <span>Loading...</span>\n </div>\n }\n <iframe\n [src]=\"toYoutubeEmbed(youtubeVideos[0].url) | safeUrl\"\n frameborder=\"0\"\n allowfullscreen\n class=\"w-full h-full\"\n (load)=\"iframeLoaded = true\"\n ></iframe>\n </div>\n <button mat-flat-button (click)=\"updateYoutubeUrl(youtubeVideos[0])\" class=\"mt-3\">Update Youtube url</button>\n } @else {\n <button mat-flat-button (click)=\"addYoutubeUrl()\" class=\"mt-3\">Add Youtube url</button>\n }\n }\n @if (tabIndex() === 1) {\n @for (video of cosVideos; track $index) {\n <rolatech-property-video-item\n [video]=\"video\"\n (save)=\"onCOSVideoSave($event)\"\n (delete)=\"onCOSVideoDelete(video, $event)\"\n (edit)=\"onVideoEdit($event)\"\n (upload)=\"onCOSVideoUpload(video, $event)\"\n [editId]=\"videoEditId\"\n ></rolatech-property-video-item>\n }\n @if (cosVideos.length === 0) {\n <div class=\"p-3\">\n <button mat-flat-button class=\"max-h-8\" (click)=\"addCOSVideo()\">\n <mat-icon>add</mat-icon>\n <span>Add video</span>\n </button>\n </div>\n }\n <!-- <rolatech-video-upload (upload)=\"onMediaUploadInit($event)\"></rolatech-video-upload> -->\n }\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: PropertyVideoItem, selector: "rolatech-property-video-item", inputs: ["progress", "video", "actions", "hasUnsaved", "editId"], outputs: ["editIdChange", "save", "cancel", "delete", "edit", "upload"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: SafeUrlPipe, name: "safeUrl" }] });
4268
4263
  }
4269
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageVideoComponent, decorators: [{
4264
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageVideoComponent, decorators: [{
4270
4265
  type: Component,
4271
- args: [{ selector: 'rolatech-property-manage-video', imports: [CommonModule, ToolbarComponent, PropertyManageContentComponent, MatButtonModule, TabsComponent, TabComponent, SafeUrlPipe, PropertyVideoItem, MatIcon], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Videos\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <rolatech-tabs [(select)]=\"tabIndex\">\n <rolatech-tab label=\"Youtube\"></rolatech-tab>\n <rolatech-tab label=\"COS\"></rolatech-tab>\n </rolatech-tabs>\n <div class=\"py-2\">\n @if (tabIndex() === 0) {\n @if (youtubeVideos.length > 0 && youtubeVideos[0].url) {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10 border bg-white\">\n <span>Loading...</span>\n </div>\n }\n <iframe\n [src]=\"toYoutubeEmbed(youtubeVideos[0].url) | safeUrl\"\n frameborder=\"0\"\n allowfullscreen\n class=\"w-full h-full\"\n (load)=\"iframeLoaded = true\"\n ></iframe>\n </div>\n <button mat-flat-button (click)=\"updateYoutubeUrl(youtubeVideos[0])\" class=\"mt-3\">Update Youtube url</button>\n } @else {\n <button mat-flat-button (click)=\"addYoutubeUrl()\" class=\"mt-3\">Add Youtube url</button>\n }\n }\n @if (tabIndex() === 1) {\n @for (video of cosVideos; track $index) {\n <rolatech-property-video-item\n [video]=\"video\"\n (save)=\"onCOSVideoSave($event)\"\n (delete)=\"onCOSVideoDelete(video, $event)\"\n (edit)=\"onVideoEdit($event)\"\n (upload)=\"onCOSVideoUpload(video, $event)\"\n [editId]=\"videoEditId\"\n ></rolatech-property-video-item>\n }\n @if (cosVideos.length === 0) {\n <div class=\"p-3\">\n <button mat-flat-button class=\"max-h-8\" (click)=\"addCOSVideo()\">\n <mat-icon>add</mat-icon>\n <span>Add video</span>\n </button>\n </div>\n }\n <!-- <rolatech-video-upload (upload)=\"onMediaUploadInit($event)\"></rolatech-video-upload> -->\n }\n </div>\n</rolatech-property-manage-content>\n" }]
4266
+ args: [{ selector: 'rolatech-property-manage-video', imports: [
4267
+ CommonModule,
4268
+ ToolbarComponent,
4269
+ PropertyManageContentComponent,
4270
+ MatButtonModule,
4271
+ TabsComponent,
4272
+ TabComponent,
4273
+ SafeUrlPipe,
4274
+ PropertyVideoItem,
4275
+ MatIcon,
4276
+ ], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Videos\" class=\"hidden md:block\" divider> </rolatech-toolbar>\n <rolatech-tabs [(select)]=\"tabIndex\">\n <rolatech-tab label=\"Youtube\"></rolatech-tab>\n <rolatech-tab label=\"COS\"></rolatech-tab>\n </rolatech-tabs>\n <div class=\"py-2\">\n @if (tabIndex() === 0) {\n @if (youtubeVideos.length > 0 && youtubeVideos[0].url) {\n <div class=\"relative w-full aspect-video\">\n @if (!iframeLoaded) {\n <div class=\"absolute inset-0 flex items-center justify-center bg-black/10 border bg-white\">\n <span>Loading...</span>\n </div>\n }\n <iframe\n [src]=\"toYoutubeEmbed(youtubeVideos[0].url) | safeUrl\"\n frameborder=\"0\"\n allowfullscreen\n class=\"w-full h-full\"\n (load)=\"iframeLoaded = true\"\n ></iframe>\n </div>\n <button mat-flat-button (click)=\"updateYoutubeUrl(youtubeVideos[0])\" class=\"mt-3\">Update Youtube url</button>\n } @else {\n <button mat-flat-button (click)=\"addYoutubeUrl()\" class=\"mt-3\">Add Youtube url</button>\n }\n }\n @if (tabIndex() === 1) {\n @for (video of cosVideos; track $index) {\n <rolatech-property-video-item\n [video]=\"video\"\n (save)=\"onCOSVideoSave($event)\"\n (delete)=\"onCOSVideoDelete(video, $event)\"\n (edit)=\"onVideoEdit($event)\"\n (upload)=\"onCOSVideoUpload(video, $event)\"\n [editId]=\"videoEditId\"\n ></rolatech-property-video-item>\n }\n @if (cosVideos.length === 0) {\n <div class=\"p-3\">\n <button mat-flat-button class=\"max-h-8\" (click)=\"addCOSVideo()\">\n <mat-icon>add</mat-icon>\n <span>Add video</span>\n </button>\n </div>\n }\n <!-- <rolatech-video-upload (upload)=\"onMediaUploadInit($event)\"></rolatech-video-upload> -->\n }\n </div>\n</rolatech-property-manage-content>\n" }]
4272
4277
  }], ctorParameters: () => [] });
4273
4278
 
4274
4279
  class PropertyManageHighlights extends BaseComponent {
@@ -4384,10 +4389,10 @@ class PropertyManageHighlights extends BaseComponent {
4384
4389
  this.snackBarService.open(msg);
4385
4390
  // optionally log _e
4386
4391
  }
4387
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageHighlights, deps: null, target: i0.ɵɵFactoryTarget.Component });
4388
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageHighlights, isStandalone: true, selector: "rolatech-property-manage-highlights", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Highlights\" class=\"hidden md:block\" divider>\n <button mat-flat-button (click)=\"toggleEdit()\">\n <mat-icon>@if (editMode()) { done } @else { edit }</mat-icon>\n <span>@if (editMode()) { Done } @else { Edit }</span>\n </button>\n </rolatech-toolbar>\n @if (loading()) {\n <mat-progress-spinner mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner>\n }\n <div class=\"flex flex-col gap-2\" cdkDropList [cdkDropListDisabled]=\"!editMode()\" (cdkDropListDropped)=\"dropped($event)\">\n @for (h of highlights(); track $index) {\n <div class=\"item\" cdkDrag>\n @if (editMode()) {\n <div class=\"flex cursor-grab items-center\" cdkDragHandle aria-label=\"Drag to reorder\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n } @if (editIndex() === $index) {\n <mat-form-field appearance=\"fill\" class=\"grow\">\n <input matInput [(ngModel)]=\"editText\" name=\"edit-{{$index}}\" maxlength=\"200\" />\n <mat-hint align=\"end\">{{editText.length}} / 200</mat-hint>\n </mat-form-field>\n <button mat-icon-button color=\"primary\" (click)=\"saveEdit($index)\" [disabled]=\"!editText.trim()\">\n <mat-icon>check</mat-icon>\n </button>\n <button mat-icon-button (click)=\"cancelEdit()\">\n <mat-icon>close</mat-icon>\n </button>\n } @else {\n <div class=\"flex-1 select-text\" (dblclick)=\"startEdit($index, h)\">{{ h }}</div>\n @if (editMode()) {\n <button mat-icon-button color=\"primary\" (click)=\"startEdit($index, h)\" aria-label=\"Edit\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button color=\"warn\" (click)=\"remove($index)\" aria-label=\"Delete\">\n <mat-icon>delete</mat-icon>\n </button>\n } }\n </div>\n }\n </div>\n <form class=\"flex items-center gap-2 mt-2\" (ngSubmit)=\"create()\">\n <mat-form-field appearance=\"fill\" class=\"flex-1\" subscriptSizing=\"dynamic\">\n <mat-label>New highlight</mat-label>\n <input matInput [(ngModel)]=\"draft\" name=\"draft\" maxlength=\"200\" />\n <mat-hint align=\"end\">{{draft.length}} / 200</mat-hint>\n </mat-form-field>\n <button mat-flat-button type=\"submit\" [disabled]=\"!draft.trim()\">Add</button>\n </form>\n <div class=\"flex items-center\">\n <button mat-stroked-button color=\"primary\" (click)=\"saveAll()\" [disabled]=\"savingAll()\">Save All</button>\n @if (savingAll()) {\n <span class=\"ml-2\">Saving\u2026</span>\n }\n </div>\n</rolatech-property-manage-content>\n", styles: [".header{display:flex;align-items:center;gap:12px}.grow{flex:1 1 auto}.item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid rgba(0,0,0,.08);border-radius:12px;background:#fff}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i4$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
4392
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageHighlights, deps: null, target: i0.ɵɵFactoryTarget.Component });
4393
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageHighlights, isStandalone: true, selector: "rolatech-property-manage-highlights", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Highlights\" class=\"hidden md:block\" divider>\n <button mat-flat-button (click)=\"toggleEdit()\">\n <mat-icon>@if (editMode()) { done } @else { edit }</mat-icon>\n <span>@if (editMode()) { Done } @else { Edit }</span>\n </button>\n </rolatech-toolbar>\n @if (loading()) {\n <mat-progress-spinner mode=\"indeterminate\" diameter=\"20\"></mat-progress-spinner>\n }\n <div class=\"flex flex-col gap-2\" cdkDropList [cdkDropListDisabled]=\"!editMode()\" (cdkDropListDropped)=\"dropped($event)\">\n @for (h of highlights(); track $index) {\n <div class=\"item\" cdkDrag>\n @if (editMode()) {\n <div class=\"flex cursor-grab items-center\" cdkDragHandle aria-label=\"Drag to reorder\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n } @if (editIndex() === $index) {\n <mat-form-field appearance=\"fill\" class=\"grow\">\n <input matInput [(ngModel)]=\"editText\" name=\"edit-{{$index}}\" maxlength=\"200\" />\n <mat-hint align=\"end\">{{editText.length}} / 200</mat-hint>\n </mat-form-field>\n <button mat-icon-button color=\"primary\" (click)=\"saveEdit($index)\" [disabled]=\"!editText.trim()\">\n <mat-icon>check</mat-icon>\n </button>\n <button mat-icon-button (click)=\"cancelEdit()\">\n <mat-icon>close</mat-icon>\n </button>\n } @else {\n <div class=\"flex-1 select-text\" (dblclick)=\"startEdit($index, h)\">{{ h }}</div>\n @if (editMode()) {\n <button mat-icon-button color=\"primary\" (click)=\"startEdit($index, h)\" aria-label=\"Edit\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button color=\"warn\" (click)=\"remove($index)\" aria-label=\"Delete\">\n <mat-icon>delete</mat-icon>\n </button>\n } }\n </div>\n }\n </div>\n <form class=\"flex items-center gap-2 mt-2\" (ngSubmit)=\"create()\">\n <mat-form-field appearance=\"fill\" class=\"flex-1\" subscriptSizing=\"dynamic\">\n <mat-label>New highlight</mat-label>\n <input matInput [(ngModel)]=\"draft\" name=\"draft\" maxlength=\"200\" />\n <mat-hint align=\"end\">{{draft.length}} / 200</mat-hint>\n </mat-form-field>\n <button mat-flat-button type=\"submit\" [disabled]=\"!draft.trim()\">Add</button>\n </form>\n <div class=\"flex items-center\">\n <button mat-stroked-button color=\"primary\" (click)=\"saveAll()\" [disabled]=\"savingAll()\">Save All</button>\n @if (savingAll()) {\n <span class=\"ml-2\">Saving\u2026</span>\n }\n </div>\n</rolatech-property-manage-content>\n", styles: [".header{display:flex;align-items:center;gap:12px}.grow{flex:1 1 auto}.item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid rgba(0,0,0,.08);border-radius:12px;background:#fff}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i4$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatListModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i3$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
4389
4394
  }
4390
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageHighlights, decorators: [{
4395
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageHighlights, decorators: [{
4391
4396
  type: Component,
4392
4397
  args: [{ selector: 'rolatech-property-manage-highlights', imports: [
4393
4398
  PropertyManageContentComponent,
@@ -4444,39 +4449,137 @@ class PropertyManageEpc extends BaseComponent {
4444
4449
  }
4445
4450
  });
4446
4451
  }
4447
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageEpc, deps: null, target: i0.ɵɵFactoryTarget.Component });
4448
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageEpc, isStandalone: true, selector: "rolatech-property-manage-epc", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"EPC\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div class=\"w-full md:max-w-[70%]\">\n <div class=\"p-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label>Current Score</mat-label>\n <input matInput [(ngModel)]=\"currentScore\" placeholder=\"Current Score\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Potential Score</mat-label>\n <input matInput [(ngModel)]=\"potentialScore\" placeholder=\"Potential Score\" />\n </mat-form-field>\n <button mat-flat-button (click)=\"add()\">Save</button>\n </div>\n <div>\n <div class=\"font-bold text-lg p-2\">Domestic EPC</div>\n <rolatech-epc-chart\n [currentScore]=\"currentScore\"\n [potentialScore]=\"potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: EpcChart, selector: "rolatech-epc-chart", inputs: ["currentScore", "potentialScore", "showCaptions"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
4452
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageEpc, deps: null, target: i0.ɵɵFactoryTarget.Component });
4453
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageEpc, isStandalone: true, selector: "rolatech-property-manage-epc", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"EPC\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div class=\"w-full md:max-w-[70%]\">\n <div class=\"p-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label>Current Score</mat-label>\n <input matInput [(ngModel)]=\"currentScore\" placeholder=\"Current Score\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Potential Score</mat-label>\n <input matInput [(ngModel)]=\"potentialScore\" placeholder=\"Potential Score\" />\n </mat-form-field>\n <button mat-flat-button (click)=\"add()\">Save</button>\n </div>\n <div>\n <div class=\"font-bold text-lg p-2\">Domestic EPC</div>\n <rolatech-epc-chart\n [currentScore]=\"currentScore\"\n [potentialScore]=\"potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: EpcChart, selector: "rolatech-epc-chart", inputs: ["currentScore", "potentialScore", "showCaptions"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }] });
4449
4454
  }
4450
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageEpc, decorators: [{
4455
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageEpc, decorators: [{
4451
4456
  type: Component,
4452
4457
  args: [{ selector: 'rolatech-property-manage-epc', imports: [PropertyManageContentComponent, ToolbarComponent, EpcChart, MatFormFieldModule, FormsModule, MatInputModule, MatButtonModule], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"EPC\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div class=\"w-full md:max-w-[70%]\">\n <div class=\"p-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label>Current Score</mat-label>\n <input matInput [(ngModel)]=\"currentScore\" placeholder=\"Current Score\" />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Potential Score</mat-label>\n <input matInput [(ngModel)]=\"potentialScore\" placeholder=\"Potential Score\" />\n </mat-form-field>\n <button mat-flat-button (click)=\"add()\">Save</button>\n </div>\n <div>\n <div class=\"font-bold text-lg p-2\">Domestic EPC</div>\n <rolatech-epc-chart\n [currentScore]=\"currentScore\"\n [potentialScore]=\"potentialScore\"\n [showCaptions]=\"true\"\n ></rolatech-epc-chart>\n </div>\n </div>\n</rolatech-property-manage-content>\n", styles: ["mat-form-field{width:100%}\n"] }]
4453
4458
  }] });
4454
4459
 
4455
4460
  class PropertyManageTranslation {
4456
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageTranslation, deps: [], target: i0.ɵɵFactoryTarget.Component });
4457
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageTranslation, isStandalone: true, selector: "rolatech-property-manage-translation", ngImport: i0, template: "<p>property-manage-translation works!</p>\n", styles: [""] });
4461
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageTranslation, deps: [], target: i0.ɵɵFactoryTarget.Component });
4462
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageTranslation, isStandalone: true, selector: "rolatech-property-manage-translation", ngImport: i0, template: "<p>property-manage-translation works!</p>\n", styles: [""] });
4458
4463
  }
4459
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageTranslation, decorators: [{
4464
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageTranslation, decorators: [{
4460
4465
  type: Component,
4461
4466
  args: [{ selector: 'rolatech-property-manage-translation', imports: [], template: "<p>property-manage-translation works!</p>\n" }]
4462
4467
  }] });
4463
4468
 
4464
4469
  class PropertyManageKeywords {
4465
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageKeywords, deps: [], target: i0.ɵɵFactoryTarget.Component });
4466
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageKeywords, isStandalone: true, selector: "rolatech-property-manage-keywords", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Keywords\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div></div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }] });
4470
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageKeywords, deps: [], target: i0.ɵɵFactoryTarget.Component });
4471
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: PropertyManageKeywords, isStandalone: true, selector: "rolatech-property-manage-keywords", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Keywords\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div></div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }] });
4467
4472
  }
4468
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageKeywords, decorators: [{
4473
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageKeywords, decorators: [{
4469
4474
  type: Component,
4470
4475
  args: [{ selector: 'rolatech-property-manage-keywords', imports: [PropertyManageContentComponent, ToolbarComponent], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Keywords\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div></div>\n</rolatech-property-manage-content>\n" }]
4471
4476
  }] });
4472
4477
 
4473
- class PropertyManageFloorplan {
4474
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageFloorplan, deps: [], target: i0.ɵɵFactoryTarget.Component });
4475
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PropertyManageFloorplan, isStandalone: true, selector: "rolatech-property-manage-floorplan", ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Floorplan\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div></div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }] });
4478
+ const SIZE = 10 * 1024 * 1024; // file slice size 10MB
4479
+ class PropertyManageFloorplan extends BaseComponent {
4480
+ floorplanService = inject(FloorplanService);
4481
+ floorplans = [];
4482
+ ngOnInit() {
4483
+ this.id = this.route.parent?.snapshot.paramMap.get('id');
4484
+ this.listFloorplans();
4485
+ }
4486
+ listFloorplans() {
4487
+ this.floorplanService.listFloorplans(this.id).subscribe({
4488
+ next: (res) => {
4489
+ this.floorplans = res.data || [];
4490
+ },
4491
+ });
4492
+ }
4493
+ uploadFloorplan(event) {
4494
+ const input = event.target;
4495
+ if (input.files && input.files.length > 0) {
4496
+ const startIndex = this.floorplans.length; // Offset to preserve existing items
4497
+ Array.from(input.files).forEach((file, i) => {
4498
+ this.uploadFile(file, startIndex + i);
4499
+ });
4500
+ }
4501
+ }
4502
+ uploadFile(file, index) {
4503
+ const reader = new FileReader();
4504
+ const formData = new FormData();
4505
+ formData.append('file', file);
4506
+ this.floorplans.splice(index, 0, {
4507
+ url: '',
4508
+ alt: 'Uploading...',
4509
+ width: 0,
4510
+ height: 0,
4511
+ uploading: true,
4512
+ });
4513
+ reader.readAsDataURL(file);
4514
+ reader.onload = () => {
4515
+ const img = new Image();
4516
+ img.onload = () => {
4517
+ Object.assign(this.floorplans[index], {
4518
+ url: img.src,
4519
+ width: img.width,
4520
+ height: img.height,
4521
+ });
4522
+ };
4523
+ img.src = reader.result;
4524
+ };
4525
+ this.floorplanService.uploadFloorplan(this.id, formData).subscribe({
4526
+ next: (res) => {
4527
+ // Replace item at index using native splice
4528
+ // this.media.splice(index, 1, res.data);
4529
+ this.floorplans.splice(index, 1, {
4530
+ ...res.data,
4531
+ uploading: false,
4532
+ });
4533
+ },
4534
+ error: (e) => {
4535
+ this.snackBarService.open('Upload failed: ' + e.message);
4536
+ this.floorplans.splice(index, 1); // remove failed placeholder
4537
+ },
4538
+ });
4539
+ reader.onerror = (error) => { };
4540
+ }
4541
+ onClick(i) {
4542
+ const dialogRef = this.dialog.open(ImagePreviewDialogComponent, {
4543
+ maxWidth: '80vw',
4544
+ maxHeight: '80vh',
4545
+ height: '80%',
4546
+ width: '80%',
4547
+ panelClass: 'full-screen-modal',
4548
+ data: {
4549
+ media: this.floorplans,
4550
+ selected: i,
4551
+ },
4552
+ });
4553
+ dialogRef.afterClosed().subscribe((result) => { });
4554
+ }
4555
+ onDelete(item) {
4556
+ const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
4557
+ width: '400px',
4558
+ data: {
4559
+ title: 'Delete media',
4560
+ message: 'Are you sure to delete?',
4561
+ },
4562
+ });
4563
+ dialogRef.afterClosed().subscribe((result) => {
4564
+ if (result) {
4565
+ this.floorplanService.deleteFloorplan(this.id, item.id).subscribe({
4566
+ next: (res) => {
4567
+ this.floorplans = this.floorplans.filter((m) => m.id !== item.id);
4568
+ this.snackBarService.open('Delete successfully');
4569
+ },
4570
+ error: (e) => {
4571
+ this.snackBarService.open(e.message);
4572
+ },
4573
+ });
4574
+ }
4575
+ });
4576
+ }
4577
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageFloorplan, deps: null, target: i0.ɵɵFactoryTarget.Component });
4578
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageFloorplan, isStandalone: true, selector: "rolatech-property-manage-floorplan", usesInheritance: true, ngImport: i0, template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Floorplans\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"uploadFloorplan($event)\">\n @for (item of floorplans; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onClick(i)\"\n (deleteMedia)=\"onDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n", styles: [""], dependencies: [{ kind: "component", type: PropertyManageContentComponent, selector: "rolatech-property-manage-content" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: MediaListComponent, selector: "rolatech-media-list", inputs: ["isUploading", "media", "showAdd"], outputs: ["mediaItemClick", "upload"] }, { kind: "component", type: MediaListItemComponent, selector: "rolatech-media-list-item", inputs: ["media", "uploadProgress", "uploading"], outputs: ["mediaItemClick", "deleteMedia"] }] });
4476
4579
  }
4477
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageFloorplan, decorators: [{
4580
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageFloorplan, decorators: [{
4478
4581
  type: Component,
4479
- args: [{ selector: 'rolatech-property-manage-floorplan', imports: [PropertyManageContentComponent, ToolbarComponent], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Floorplan\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div></div>\n</rolatech-property-manage-content>\n" }]
4582
+ args: [{ selector: 'rolatech-property-manage-floorplan', imports: [PropertyManageContentComponent, ToolbarComponent, MediaListComponent, MediaListItemComponent], template: "<rolatech-property-manage-content>\n <rolatech-toolbar title=\"Floorplans\" class=\"hidden md:block\" divider></rolatech-toolbar>\n <div>\n <p i18n>*Limit 5MB per image*</p>\n <rolatech-media-list (upload)=\"uploadFloorplan($event)\">\n @for (item of floorplans; track item; let i = $index) {\n <rolatech-media-list-item\n [media]=\"item\"\n (mediaItemClick)=\"onClick(i)\"\n (deleteMedia)=\"onDelete(item)\"\n [uploading]=\"item.uploading\"\n ></rolatech-media-list-item>\n }\n </rolatech-media-list>\n </div>\n</rolatech-property-manage-content>\n" }]
4480
4583
  }] });
4481
4584
 
4482
4585
  const propertyManageRoutes = [
@@ -4509,7 +4612,7 @@ const propertyManageRoutes = [
4509
4612
  component: PropertyManageSectionsComponent,
4510
4613
  },
4511
4614
  {
4512
- path: 'floorplan',
4615
+ path: 'floorplans',
4513
4616
  component: PropertyManageFloorplan,
4514
4617
  },
4515
4618
  {
@@ -4563,13 +4666,13 @@ class PropertyViewingConfirmationComponent {
4563
4666
  ngDoCheck() {
4564
4667
  this.output.emit(true);
4565
4668
  }
4566
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4567
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyViewingConfirmationComponent, isStandalone: true, selector: "rolatech-property-viewing-confirmation", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null }, selectedTime: { classPropertyName: "selectedTime", publicName: "selectedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", proposedTime: "proposedTimeChange", selectedTime: "selectedTimeChange" }, ngImport: i0, template: "<div>\n @if (proposedTime()) {\n <div>\n <span> {{ proposedTime().date }} </span><span>{{ proposedTime().time }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
4669
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4670
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyViewingConfirmationComponent, isStandalone: true, selector: "rolatech-property-viewing-confirmation", inputs: { proposedTime: { classPropertyName: "proposedTime", publicName: "proposedTime", isSignal: true, isRequired: false, transformFunction: null }, selectedTime: { classPropertyName: "selectedTime", publicName: "selectedTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", proposedTime: "proposedTimeChange", selectedTime: "selectedTimeChange" }, ngImport: i0, template: "<div>\n @if (proposedTime()) {\n <div>\n <span> {{ proposedTime().date }} </span><span>{{ proposedTime().time }}</span>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
4568
4671
  }
4569
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyViewingConfirmationComponent, decorators: [{
4672
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyViewingConfirmationComponent, decorators: [{
4570
4673
  type: Component,
4571
4674
  args: [{ selector: 'rolatech-property-viewing-confirmation', imports: [CommonModule], template: "<div>\n @if (proposedTime()) {\n <div>\n <span> {{ proposedTime().date }} </span><span>{{ proposedTime().time }}</span>\n </div>\n }\n</div>\n" }]
4572
- }] });
4675
+ }], propDecorators: { output: [{ type: i0.Output, args: ["output"] }], proposedTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "proposedTime", required: false }] }, { type: i0.Output, args: ["proposedTimeChange"] }], selectedTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedTime", required: false }] }, { type: i0.Output, args: ["selectedTimeChange"] }] } });
4573
4676
 
4574
4677
  class PropertyManageViewingsDetailComponent extends BaseComponent {
4575
4678
  propertyService = inject(PropertyService);
@@ -4639,18 +4742,18 @@ class PropertyManageViewingsDetailComponent extends BaseComponent {
4639
4742
  },
4640
4743
  });
4641
4744
  }
4642
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageViewingsDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
4643
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyManageViewingsDetailComponent, isStandalone: true, selector: "rolatech-property-manage-viewings-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
4745
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageViewingsDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
4746
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyManageViewingsDetailComponent, isStandalone: true, selector: "rolatech-property-manage-viewings-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
4644
4747
  }
4645
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyManageViewingsDetailComponent, decorators: [{
4748
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyManageViewingsDetailComponent, decorators: [{
4646
4749
  type: Component,
4647
- args: [{ selector: 'rolatech-property-manage-viewings-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule], template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
4750
+ args: [{ selector: 'rolatech-property-manage-viewings-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule, PricePipe], template: "@if (viewing) {\n <rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n <div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"viewing.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"viewing.phone\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) {\n @if (item.date === viewing.viewingDate && item.time === viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n }\n }\n @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label\n label=\"Employment status\"\n [title]=\"employmentStatus[viewing.employmentStatus]\"\n ></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n </div>\n}\n" }]
4648
4751
  }] });
4649
4752
 
4650
4753
  const propertyManageViewingsRoutes = [
4651
4754
  {
4652
4755
  path: '',
4653
- loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-DIuEypO5.mjs').then((x) => x.PropertyManageViewingsIndexComponent),
4756
+ loadComponent: () => import('./rolatech-angular-property-property-manage-viewings-index.component-Cz1HbWli.mjs').then((x) => x.PropertyManageViewingsIndexComponent),
4654
4757
  },
4655
4758
  {
4656
4759
  path: ':id',
@@ -4675,16 +4778,16 @@ class LettingManageItem {
4675
4778
  }
4676
4779
  });
4677
4780
  }
4678
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
4679
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingManageItem, isStandalone: true, selector: "rolatech-letting-manage-item", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-letting-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ letting().price.toFixed(2) }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
4781
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
4782
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingManageItem, isStandalone: true, selector: "rolatech-letting-manage-item", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-letting-manage-item": "this.hasClass" } }, ngImport: i0, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">{{ letting().price | price }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder", inputs: ["ratio"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None, deferBlockDependencies: [() => [ThumbnailComponent]] });
4680
4783
  }
4681
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageItem, decorators: [{
4784
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageItem, decorators: [{
4682
4785
  type: Component,
4683
- args: [{ selector: 'rolatech-letting-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">\u00A3{{ letting().price.toFixed(2) }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"] }]
4786
+ args: [{ selector: 'rolatech-letting-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"flex p-3 bg-[--rt-raised-background] hover:bg-[--rt-raised-background] cursor-pointer rounded-md\"\n [ngClass]=\"list() ? 'w-full flex-row' : 'flex-col h-full'\"\n>\n <div>\n @if (letting().media) {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n @defer {\n <rolatech-thumbnail [src]=\"letting().media ? letting().media[0].url : ''\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n } @else {\n <div class=\"object-cover aspect-video rounded-lg\" [ngClass]=\"list() ? 'w-32 mr-3' : ''\">\n <rolatech-image-placeholder></rolatech-image-placeholder>\n </div>\n }\n </div>\n\n <div class=\"py-2\">\n <div class=\"text-lg font-bold\">{{ letting().title }}</div>\n </div>\n <div class=\"flex-1\"></div>\n <div class=\"\">{{ letting().price | price }}</div>\n</div>\n", styles: ["rolatech-letting-manage-item{--rt-letting-view-item-margin: 16px;width:calc(100% / var(--rt-letting-view-items-per-row) - var(--rt-letting-view-item-margin) - .01px)}rolatech-letting-manage-item[list]{--rt-letting-view-items-per-row: 1}\n"] }]
4684
4787
  }], ctorParameters: () => [], propDecorators: { hasClass: [{
4685
4788
  type: HostBinding,
4686
4789
  args: ['class.rolatech-letting-manage-item']
4687
- }] } });
4790
+ }], letting: [{ type: i0.Input, args: [{ isSignal: true, alias: "letting", required: true }] }], thumbnail: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbnail", required: false }] }], list: [{ type: i0.Input, args: [{ isSignal: true, alias: "list", required: false }] }] } });
4688
4791
 
4689
4792
  class LettingManageIndex {
4690
4793
  propertyService = inject(PropertyService);
@@ -4759,10 +4862,10 @@ class LettingManageIndex {
4759
4862
  replaceUrl: true, // optional: avoid stacking history on every page click
4760
4863
  });
4761
4864
  }
4762
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
4763
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingManageIndex, isStandalone: true, selector: "rolatech-letting-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Lettings\"> </rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of lettings(); track $index) {\n <rolatech-letting-manage-item [letting]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-letting-manage-item>\n }\n </div>\n</div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageIndex]=\"pageIndex()\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["rolatech-letting-manage-index{--rt-letting-view-items-per-row: 1}@media (min-width: 600px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 2}}@media (min-width: 768px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LettingManageItem, selector: "rolatech-letting-manage-item", inputs: ["letting", "thumbnail", "list"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], encapsulation: i0.ViewEncapsulation.None });
4865
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
4866
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingManageIndex, isStandalone: true, selector: "rolatech-letting-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Lettings\"> </rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-wrap p-3 gap-3\">\n @for (item of lettings(); track $index) {\n <rolatech-letting-manage-item [letting]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-letting-manage-item>\n }\n </div>\n</div>\n}\n<mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageIndex]=\"pageIndex()\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"onPage($event)\"\n hidePageSize\n showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["rolatech-letting-manage-index{--rt-letting-view-items-per-row: 1}@media (min-width: 600px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 2}}@media (min-width: 768px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1280px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-letting-manage-index{--rt-letting-view-items-per-row: 5}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LettingManageItem, selector: "rolatech-letting-manage-item", inputs: ["letting", "thumbnail", "list"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], encapsulation: i0.ViewEncapsulation.None });
4764
4867
  }
4765
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageIndex, decorators: [{
4868
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageIndex, decorators: [{
4766
4869
  type: Component,
4767
4870
  args: [{ selector: 'rolatech-letting-manage-index', imports: [
4768
4871
  CommonModule,
@@ -4792,13 +4895,13 @@ class LettingActions {
4792
4895
  onDeposit(letting) {
4793
4896
  this.deposit.emit(letting);
4794
4897
  }
4795
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
4796
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingActions, isStandalone: true, selector: "rolatech-letting-actions", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
4898
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
4899
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingActions, isStandalone: true, selector: "rolatech-letting-actions", inputs: { letting: { classPropertyName: "letting", publicName: "letting", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { requestViewing: "requestViewing", offer: "offer", deposit: "deposit" }, ngImport: i0, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit {{ displayDeposit() | price}}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "pipe", type: PricePipe, name: "price" }], encapsulation: i0.ViewEncapsulation.None });
4797
4900
  }
4798
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingActions, decorators: [{
4901
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingActions, decorators: [{
4799
4902
  type: Component,
4800
- args: [{ selector: 'rolatech-letting-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit \u00A3{{ displayDeposit() }}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n" }]
4801
- }] });
4903
+ args: [{ selector: 'rolatech-letting-actions', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule, PricePipe], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-col gap-3\">\n <a mat-stroked-button class=\"\" (click)=\"onRequestViewing(letting())\" i18n>Request viewing</a>\n @if (letting().priceType && letting().priceType.toString() === 'PARTIAL') {\n <a mat-flat-button class=\"\" (click)=\"onDeposit(letting())\" i18n>Pay deposit {{ displayDeposit() | price}}</a>\n } @else {\n <a mat-flat-button class=\"\" (click)=\"onOffer(letting())\" i18n>Make an offer</a>\n }\n <ng-content select=\"rolatech-letting-action-contact\"></ng-content>\n</div>\n" }]
4904
+ }], propDecorators: { letting: [{ type: i0.Input, args: [{ isSignal: true, alias: "letting", required: true }] }], requestViewing: [{ type: i0.Output, args: ["requestViewing"] }], offer: [{ type: i0.Output, args: ["offer"] }], deposit: [{ type: i0.Output, args: ["deposit"] }] } });
4802
4905
 
4803
4906
  class LettingActionContact {
4804
4907
  phone = input(...(ngDevMode ? [undefined, { debugName: "phone" }] : []));
@@ -4808,13 +4911,13 @@ class LettingActionContact {
4808
4911
  onEmailAgent(property) {
4809
4912
  this.emailAgent.emit(property);
4810
4913
  }
4811
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingActionContact, deps: [], target: i0.ɵɵFactoryTarget.Component });
4812
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.4", type: LettingActionContact, isStandalone: true, selector: "rolatech-letting-action-contact", inputs: { phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, ngImport: i0, template: "<a mat-stroked-button class=\"w-full\" [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span i18n>Chat With Agent</span>\n</a>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
4914
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingActionContact, deps: [], target: i0.ɵɵFactoryTarget.Component });
4915
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: LettingActionContact, isStandalone: true, selector: "rolatech-letting-action-contact", inputs: { phone: { classPropertyName: "phone", publicName: "phone", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { callAgent: "callAgent", emailAgent: "emailAgent" }, ngImport: i0, template: "<a mat-stroked-button class=\"w-full\" [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span i18n>Chat With Agent</span>\n</a>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatMenuModule }], encapsulation: i0.ViewEncapsulation.None });
4813
4916
  }
4814
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingActionContact, decorators: [{
4917
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingActionContact, decorators: [{
4815
4918
  type: Component,
4816
4919
  args: [{ selector: 'rolatech-letting-action-contact', imports: [CommonModule, MatButtonModule, MatIconModule, MatMenuModule], encapsulation: ViewEncapsulation.None, template: "<a mat-stroked-button class=\"w-full\" [href]=\"'https://wa.me/' + phone()\" target=\"_blank\">\n <span i18n>Chat With Agent</span>\n</a>\n", styles: [".mat-mdc-menu-panel,.custom-menu-panel{max-width:100%}\n"] }]
4817
- }] });
4920
+ }], propDecorators: { phone: [{ type: i0.Input, args: [{ isSignal: true, alias: "phone", required: false }] }], callAgent: [{ type: i0.Output, args: ["callAgent"] }], emailAgent: [{ type: i0.Output, args: ["emailAgent"] }] } });
4818
4921
 
4819
4922
  class LettingManageDetail extends BaseComponent {
4820
4923
  authService = inject(AuthService);
@@ -4957,10 +5060,10 @@ class LettingManageDetail extends BaseComponent {
4957
5060
  this.selectedVariant = matchingVariant;
4958
5061
  // const updatedCriteria = matchingVariant ? updateCriteriaFromVariant(matchingVariant) : [];
4959
5062
  }
4960
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageDetail, deps: [], target: i0.ɵɵFactoryTarget.Component });
4961
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingManageDetail, isStandalone: true, selector: "rolatech-letting-manage-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n<rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-features [features]=\"property.userFeatures\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videos) {\n <rolatech-property-video [video]=\"property.videos[0]\"></rolatech-property-video>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n </div>\n </div>\n <div class=\"w-full h-fit md:w-1/3 rounded-md border shadow p-3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n subtitle=\"PrimeCase Agent\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-letting-actions\n [letting]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-letting-action-contact [phone]=\"user.phone\"></rolatech-letting-action-contact>\n }\n </rolatech-letting-actions>\n </div>\n </div>\n </div>\n</rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: LettingActions, selector: "rolatech-letting-actions", inputs: ["letting"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: LettingActionContact, selector: "rolatech-letting-action-contact", inputs: ["phone"], outputs: ["callAgent", "emailAgent"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoComponent, selector: "rolatech-property-video", inputs: ["video"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }] });
5063
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageDetail, deps: [], target: i0.ɵɵFactoryTarget.Component });
5064
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingManageDetail, isStandalone: true, selector: "rolatech-letting-manage-detail", usesInheritance: true, ngImport: i0, template: "@if (property) {\n<rolatech-container>\n <div class=\"flex flex-col w-full\">\n <div class=\"py-3\">\n <rolatech-property-media [media]=\"property.media\"></rolatech-property-media>\n </div>\n <div class=\"flex flex-col md:flex-row gap-3 w-full\">\n <div class=\"w-full md:w-2/3\">\n <rolatech-property-info [property]=\"property\" (wish)=\"onWish($event)\" [inWishList]=\"inWishList\">\n </rolatech-property-info>\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-features [features]=\"property.userFeatures\"></rolatech-property-features>\n <rolatech-property-location [location]=\"property.location\"></rolatech-property-location>\n @if (property.videos) {\n <rolatech-property-video [video]=\"property.videos[0]\"></rolatech-property-video>\n }\n <div class=\"flex flex-col\">\n <div class=\"text-2xl font-bold pt-3\" i18n>Sections</div>\n @for (section of property.sections; track $index) {\n <rolatech-property-section [section]=\"section\"></rolatech-property-section>\n }\n </div>\n </div>\n <div class=\"w-full h-fit md:w-1/3 rounded-md border shadow p-3\">\n <rolatech-property-agent-renderer\n [name]=\"fullname\"\n [avatar]=\"user?.avatar\"\n [username]=\"username\"\n subtitle=\"PrimeCase Agent\"\n ></rolatech-property-agent-renderer>\n <rolatech-property-pricing (wish)=\"onWish($event)\" [property]=\"property\"></rolatech-property-pricing>\n <rolatech-letting-actions\n [letting]=\"property\"\n (offer)=\"onOffer($event)\"\n (deposit)=\"onOffer($event)\"\n (requestViewing)=\"onRequestViewing($event)\"\n >\n @if (user) {\n <rolatech-letting-action-contact [phone]=\"user.phone\"></rolatech-letting-action-contact>\n }\n </rolatech-letting-actions>\n </div>\n </div>\n </div>\n</rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: PropertyInfoComponent, selector: "rolatech-property-info", inputs: ["property", "inWishList"], outputs: ["wish"] }, { kind: "component", type: PropertyMediaComponent, selector: "rolatech-property-media", inputs: ["media", "min"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }, { kind: "component", type: PropertySectionComponent, selector: "rolatech-property-section", inputs: ["section", "user", "username"] }, { kind: "component", type: LettingActions, selector: "rolatech-letting-actions", inputs: ["letting"], outputs: ["requestViewing", "offer", "deposit"] }, { kind: "component", type: LettingActionContact, selector: "rolatech-letting-action-contact", inputs: ["phone"], outputs: ["callAgent", "emailAgent"] }, { kind: "component", type: PropertyLocationComponent, selector: "rolatech-property-location", inputs: ["location"] }, { kind: "component", type: PropertyFeaturesComponent, selector: "rolatech-property-features", inputs: ["features"] }, { kind: "component", type: PropertyVideoComponent, selector: "rolatech-property-video", inputs: ["video"] }, { kind: "component", type: PropertyAgentRenderer, selector: "rolatech-property-agent-renderer", inputs: ["name", "avatar", "username", "subtitle"] }] });
4962
5065
  }
4963
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageDetail, decorators: [{
5066
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageDetail, decorators: [{
4964
5067
  type: Component,
4965
5068
  args: [{ selector: 'rolatech-letting-manage-detail', imports: [
4966
5069
  AngularCommonModule,
@@ -5038,8 +5141,8 @@ class LettingManageViewingRequest extends BaseComponent {
5038
5141
  },
5039
5142
  });
5040
5143
  }
5041
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageViewingRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
5042
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingManageViewingRequest, isStandalone: true, selector: "rolatech-letting-viewing-request", providers: [
5144
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageViewingRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
5145
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingManageViewingRequest, isStandalone: true, selector: "rolatech-letting-viewing-request", providers: [
5043
5146
  {
5044
5147
  provide: DateAdapter,
5045
5148
  useClass: MomentDateAdapter,
@@ -5048,7 +5151,7 @@ class LettingManageViewingRequest extends BaseComponent {
5048
5151
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS$1 },
5049
5152
  ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Request a viewing</div>\n <mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"viewing.tenantId\">\n @for (item of tenants; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"viewing.startDate\"\n (dateInput)=\"viewing.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n <div class=\"flex flex-col md:flex-row gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy length</mat-label>\n <span matTextSuffix>months</span>\n <input matInput type=\"number\" [(ngModel)]=\"viewing.tenancyDuration\" />\n </mat-form-field>\n </div>\n\n <div>\n <div class=\"mb-3\">\n <div class=\"text-lg font-bold\" i18n>Viewing date</div>\n <div class=\"opacity-70\" i18n>\n Please choose 3 different times on at least 2 different days that would work for you.\n </div>\n </div>\n @for (item of viewing.proposedSlots; track $index) {\n <rolatech-property-viewing-time [proposedTime]=\"item\"></rolatech-property-viewing-time>\n }\n </div>\n </div>\n <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button>\n </div>\n @if (property) {\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <rolatech-property-pricing [property]=\"property\"></rolatech-property-pricing>\n </div>\n }\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "component", type: PropertyViewingTimeComponent, selector: "rolatech-property-viewing-time", inputs: ["proposedTime"], outputs: ["output", "select"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }] });
5050
5153
  }
5051
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageViewingRequest, decorators: [{
5154
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageViewingRequest, decorators: [{
5052
5155
  type: Component,
5053
5156
  args: [{ selector: 'rolatech-letting-viewing-request', imports: [
5054
5157
  CommonModule,
@@ -5147,8 +5250,8 @@ class LettingManageOfferRequest extends BaseComponent {
5147
5250
  },
5148
5251
  });
5149
5252
  }
5150
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageOfferRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
5151
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: LettingManageOfferRequest, isStandalone: true, selector: "rolatech-letting-manage-offer-request", providers: [
5253
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageOfferRequest, deps: null, target: i0.ɵɵFactoryTarget.Component });
5254
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: LettingManageOfferRequest, isStandalone: true, selector: "rolatech-letting-manage-offer-request", providers: [
5152
5255
  {
5153
5256
  provide: DateAdapter,
5154
5257
  useClass: MomentDateAdapter,
@@ -5157,7 +5260,7 @@ class LettingManageOfferRequest extends BaseComponent {
5157
5260
  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
5158
5261
  ], usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n <div class=\"flex flex-col-reverse md:flex-row w-full py-2 mb-3 gap-3\">\n <div class=\"w-full md:w-2/3\">\n <div>\n <div class=\"text-xl font-bold py-2 mb-3\">\n <!-- <span i18n>Offer for </span><span>{{ property()?.title : '' }}</span> -->\n @if (property) {\n <span i18n=\"@@offerFor\">Offer for {{ property.title }}</span>\n\n }\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label>Select tenant</mat-label>\n <mat-select [(ngModel)]=\"offer.tenantId\">\n @for (item of tenants; track $index) {\n <mat-option [value]=\"item.id\">\n <div class=\"flex justify-between items-center\">\n <span class=\"mr-3\">{{ item.firstName }}, {{item.lastName}}</span>\n <span>{{item.email}}</span>\n </div>\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Asking price</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"0.00\" [(ngModel)]=\"offer.amount\" required />\n <!-- <input\n matInput\n type=\"number\"\n placeholder=\"0.00\"\n [value]=\"formattedAmount\"\n (input)=\"onAmountChange($event)\"\n required\n /> -->\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Tenancy Length</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"offer.tenancyDuration\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label>Start date</mat-label>\n <input\n matInput\n placeholder=\"Start date\"\n [matDatepicker]=\"startDatePicker\"\n [min]=\"minDate\"\n (focus)=\"startDatePicker.open()\"\n name=\"startDate\"\n [(ngModel)]=\"offer.startDate\"\n (dateInput)=\"offer.startDate = $event.value.format('YYYY-MM-DD')\"\n readonly\n required\n />\n <mat-datepicker-toggle matIconPrefix [for]=\"startDatePicker\"></mat-datepicker-toggle>\n <mat-datepicker #startDatePicker></mat-datepicker>\n </mat-form-field>\n </div>\n <div>\n <div class=\"text-md py-2\" i18n>Your message(Optional)</div>\n <mat-form-field appearance=\"fill\">\n <textarea matInput type=\"text\" [(ngModel)]=\"offer.notes\" cdkTextareaAutosize cdkAutosizeMinRows=\"3\"></textarea>\n </mat-form-field>\n </div>\n <!-- <button mat-flat-button (click)=\"sendRequest()\" i18n>Send request</button> -->\n <button mat-flat-button (click)=\"sendRequest()\" [disabled]=\"sending\">\n <span style=\"display: flex; align-items: center\">\n @if (sending) {\n <mat-progress-spinner diameter=\"20\" mode=\"indeterminate\" [style.marginRight.px]=\"8\"></mat-progress-spinner>\n } {{ sending ? 'Requesting...' : 'Send request' }}\n </span>\n </button>\n </div>\n @if (property) {\n <div class=\"w-full md:w-1/2 py-2 mb-3\">\n <div class=\"text-xl font-bold py-2 mb-3\" i18n>Property info</div>\n <div>\n <rolatech-thumbnail [src]=\"property ? property.media[0].url : ''\" size=\"small\"></rolatech-thumbnail>\n </div>\n <rolatech-property-pricing [property]=\"property\"></rolatech-property-pricing>\n </div>\n }\n </div>\n</rolatech-container>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i4$1.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: ThumbnailComponent, selector: "rolatech-thumbnail", inputs: ["src", "size", "mode", "ratio", "width", "height"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: PropertyPricingComponent, selector: "rolatech-property-pricing", inputs: ["property", "price"] }] });
5159
5262
  }
5160
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: LettingManageOfferRequest, decorators: [{
5263
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LettingManageOfferRequest, decorators: [{
5161
5264
  type: Component,
5162
5265
  args: [{ selector: 'rolatech-letting-manage-offer-request', imports: [
5163
5266
  CommonModule,
@@ -5203,13 +5306,13 @@ const lettingManageRoutes = [
5203
5306
 
5204
5307
  class TenantItem {
5205
5308
  tenant = input.required(...(ngDevMode ? [{ debugName: "tenant" }] : []));
5206
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
5207
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.4", type: TenantItem, isStandalone: true, selector: "rolatech-tenant-item", inputs: { tenant: { classPropertyName: "tenant", publicName: "tenant", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex items-center justify-between px-2 h-11 cursor-pointer hover:bg-[--rt-raised-background]\">\n <div>{{tenant().firstName}}, {{tenant().lastName}}</div>\n <div class=\"flex flex-row items-center\">\n <div>{{tenant().email}}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
5309
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
5310
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: TenantItem, isStandalone: true, selector: "rolatech-tenant-item", inputs: { tenant: { classPropertyName: "tenant", publicName: "tenant", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex items-center justify-between px-2 h-11 cursor-pointer hover:bg-[--rt-raised-background]\">\n <div>{{tenant().firstName}}, {{tenant().lastName}}</div>\n <div class=\"flex flex-row items-center\">\n <div>{{tenant().email}}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
5208
5311
  }
5209
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantItem, decorators: [{
5312
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantItem, decorators: [{
5210
5313
  type: Component,
5211
5314
  args: [{ selector: 'rolatech-tenant-item', imports: [CommonModule], template: "<div class=\"flex items-center justify-between px-2 h-11 cursor-pointer hover:bg-[--rt-raised-background]\">\n <div>{{tenant().firstName}}, {{tenant().lastName}}</div>\n <div class=\"flex flex-row items-center\">\n <div>{{tenant().email}}</div>\n </div>\n</div>\n" }]
5212
- }] });
5315
+ }], propDecorators: { tenant: [{ type: i0.Input, args: [{ isSignal: true, alias: "tenant", required: true }] }] } });
5213
5316
 
5214
5317
  class TenantManageIndex {
5215
5318
  propertyService = inject(PropertyService);
@@ -5230,10 +5333,10 @@ class TenantManageIndex {
5230
5333
  }
5231
5334
  });
5232
5335
  }
5233
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
5234
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: TenantManageIndex, isStandalone: true, selector: "rolatech-tenant-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Tenants\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add tenant</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-col p-2\">\n <div class=\"flex px-2 h-11 items-center justify-between\">\n <div class=\"text-lg font-bold\">Name</div>\n <div class=\"text-lg font-bold\">Email</div>\n </div>\n @for (item of tenants; track $index) {\n <rolatech-tenant-item [tenant]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-tenant-item>\n <hr />\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TenantItem, selector: "rolatech-tenant-item", inputs: ["tenant"] }] });
5336
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageIndex, deps: [], target: i0.ɵɵFactoryTarget.Component });
5337
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TenantManageIndex, isStandalone: true, selector: "rolatech-tenant-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"Tenants\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add tenant</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-col p-2\">\n <div class=\"flex px-2 h-11 items-center justify-between\">\n <div class=\"text-lg font-bold\">Name</div>\n <div class=\"text-lg font-bold\">Email</div>\n </div>\n @for (item of tenants; track $index) {\n <rolatech-tenant-item [tenant]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-tenant-item>\n <hr />\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TenantItem, selector: "rolatech-tenant-item", inputs: ["tenant"] }] });
5235
5338
  }
5236
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageIndex, decorators: [{
5339
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageIndex, decorators: [{
5237
5340
  type: Component,
5238
5341
  args: [{ selector: 'rolatech-tenant-manage-index', imports: [CommonModule, ToolbarComponent, SpinnerComponent, MatButtonModule, MatIcon, RouterLink, TenantItem], template: "<rolatech-toolbar title=\"Tenants\">\n <div class=\"flex items-center gap-2\">\n <button mat-flat-button routerLink=\"./create\">\n <mat-icon>add</mat-icon>\n <span i18n>Add tenant</span>\n </button>\n </div>\n</rolatech-toolbar>\n@if (loading) {\n<div class=\"flex justify-center items-center\">\n <rolatech-spinner></rolatech-spinner>\n</div>\n} @else {\n<div class=\"bg-[--rt-rasised-background] h-full\">\n <div class=\"flex flex-col p-2\">\n <div class=\"flex px-2 h-11 items-center justify-between\">\n <div class=\"text-lg font-bold\">Name</div>\n <div class=\"text-lg font-bold\">Email</div>\n </div>\n @for (item of tenants; track $index) {\n <rolatech-tenant-item [tenant]=\"item\" routerLink=\"./{{ item.id }}\"></rolatech-tenant-item>\n <hr />\n }\n </div>\n</div>\n\n<!-- <mat-paginator\n #paginator\n [length]=\"length\"\n [pageSize]=\"pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (page)=\"pageEvent = find($event)\"\n hidePageSize\n showFirstLastButtons\n >\n </mat-paginator> -->\n}\n" }]
5239
5342
  }] });
@@ -5255,10 +5358,10 @@ class TenantManageDetail extends BaseComponent {
5255
5358
  }
5256
5359
  });
5257
5360
  }
5258
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5259
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: TenantManageDetail, isStandalone: true, selector: "rolatech-tenant-manage-detail", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Tenant details\" large link=\"../\"> </rolatech-toolbar>\n@if (tenant) {\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Tenant</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"First Name\" [title]=\"tenant.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"tenant.lastName\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Email\" [title]=\"tenant.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"tenant.phone\"></rolatech-rich-label>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <rolatech-rich-label label=\"Annual income\" [title]=\"tenant.income\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"tenant.numberOfTenants\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenant category\" [title]=\"tenantCategory[tenant.tenantCategory]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[tenant.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label\n label=\"AdverseCredit Status\"\n [title]=\"adverseCreditStatus[tenant.adverseCreditStatus]\"\n ></rolatech-rich-label>\n <rolatech-rich-label label=\"Residency status\" [title]=\"residencyStatus[tenant.residencyStatus]\"></rolatech-rich-label>\n </div>\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }] });
5361
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5362
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TenantManageDetail, isStandalone: true, selector: "rolatech-tenant-manage-detail", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Tenant details\" large link=\"../\"> </rolatech-toolbar>\n@if (tenant) {\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Tenant</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"First Name\" [title]=\"tenant.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"tenant.lastName\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Email\" [title]=\"tenant.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"tenant.phone\"></rolatech-rich-label>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <rolatech-rich-label label=\"Annual income\" [title]=\"tenant.income\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"tenant.numberOfTenants\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenant category\" [title]=\"tenantCategory[tenant.tenantCategory]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[tenant.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label\n label=\"AdverseCredit Status\"\n [title]=\"adverseCreditStatus[tenant.adverseCreditStatus]\"\n ></rolatech-rich-label>\n <rolatech-rich-label label=\"Residency status\" [title]=\"residencyStatus[tenant.residencyStatus]\"></rolatech-rich-label>\n </div>\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }] });
5260
5363
  }
5261
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageDetail, decorators: [{
5364
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageDetail, decorators: [{
5262
5365
  type: Component,
5263
5366
  args: [{ selector: 'rolatech-tenant-manage-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ToolbarComponent], template: "<rolatech-toolbar title=\"Tenant details\" large link=\"../\"> </rolatech-toolbar>\n@if (tenant) {\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Tenant</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"First Name\" [title]=\"tenant.firstName\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Last Name\" [title]=\"tenant.lastName\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Email\" [title]=\"tenant.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"tenant.phone\"></rolatech-rich-label>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <rolatech-rich-label label=\"Annual income\" [title]=\"tenant.income\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"tenant.numberOfTenants\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenant category\" [title]=\"tenantCategory[tenant.tenantCategory]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[tenant.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label\n label=\"AdverseCredit Status\"\n [title]=\"adverseCreditStatus[tenant.adverseCreditStatus]\"\n ></rolatech-rich-label>\n <rolatech-rich-label label=\"Residency status\" [title]=\"residencyStatus[tenant.residencyStatus]\"></rolatech-rich-label>\n </div>\n </div>\n</div>\n}\n" }]
5264
5367
  }] });
@@ -5288,10 +5391,10 @@ class TenantManageCreate {
5288
5391
  },
5289
5392
  });
5290
5393
  }
5291
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageCreate, deps: [], target: i0.ɵɵFactoryTarget.Component });
5292
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: TenantManageCreate, isStandalone: true, selector: "rolatech-tenant-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add tenant\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <div class=\"flex flex-col md:w-2/3\">\n <div class=\"flex w-full gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.lastName\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.email\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.phone\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"tenant.income\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant category</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"tenant.tenantCategory\" required>\n @for (tenantCategory of tenantCategory | keyvalue; track tenantCategory) {\n <mat-option [value]=\"tenantCategory.key\"> {{ tenantCategory.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"tenant.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"tenant.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"tenant.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\"> {{ status.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Save</button>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
5394
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageCreate, deps: [], target: i0.ɵɵFactoryTarget.Component });
5395
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TenantManageCreate, isStandalone: true, selector: "rolatech-tenant-manage-create", ngImport: i0, template: "<rolatech-toolbar title=\"Add tenant\" link=\"../\"> </rolatech-toolbar>\n<div class=\"p-3\">\n <div class=\"flex flex-col md:w-2/3\">\n <div class=\"flex w-full gap-2\">\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>First name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.firstName\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Last name</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.lastName\" required />\n </mat-form-field>\n </div>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Email</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.email\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Phone</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.phone\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\" floatLabel=\"always\">\n <mat-label i18n>Annual income(All tenants combined)</mat-label>\n <span matTextPrefix>\u00A3&nbsp;</span>\n <input matInput type=\"text\" placeholder=\"00.00\" [(ngModel)]=\"tenant.income\" required />\n </mat-form-field>\n <mat-form-field appearance=\"fill\">\n <mat-label i18n>Number Of Tenants</mat-label>\n <input matInput type=\"text\" [(ngModel)]=\"tenant.numberOfTenants\" required />\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Tenant category</mat-label>\n <mat-select placeholder=\"Applicant type\" [(ngModel)]=\"tenant.tenantCategory\" required>\n @for (tenantCategory of tenantCategory | keyvalue; track tenantCategory) {\n <mat-option [value]=\"tenantCategory.key\"> {{ tenantCategory.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Employment Status</mat-label>\n <mat-select placeholder=\"Employment Status\" [(ngModel)]=\"tenant.employmentStatus\" required>\n @for (item of employmentStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>AdverseCredit Status</mat-label>\n <mat-select placeholder=\"AdverseCredit Status\" [(ngModel)]=\"tenant.adverseCreditStatus\" required>\n @for (item of adverseCreditStatus | keyvalue; track item) {\n <mat-option [value]=\"item.key\"> {{ item.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Residency status</mat-label>\n <mat-select placeholder=\"Residency status\" [(ngModel)]=\"tenant.residencyStatus\" required>\n @for (status of residencyStatus | keyvalue; track status) {\n <mat-option [value]=\"status.key\"> {{ status.value }} </mat-option>\n }\n </mat-select>\n </mat-form-field>\n </div>\n <div i18n>* items are required</div>\n <div class=\"mt-3\">\n <button mat-flat-button class=\"w-28\" (click)=\"create()\" i18n>Save</button>\n </div>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
5293
5396
  }
5294
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: TenantManageCreate, decorators: [{
5397
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TenantManageCreate, decorators: [{
5295
5398
  type: Component,
5296
5399
  args: [{ selector: 'rolatech-tenant-manage-create', imports: [
5297
5400
  CommonModule,
@@ -5379,10 +5482,10 @@ class PropertyAgentViewingIndex extends BaseComponent {
5379
5482
  })
5380
5483
  .join(',');
5381
5484
  }
5382
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentViewingIndex, deps: null, target: i0.ɵɵFactoryTarget.Component });
5383
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentViewingIndex, isStandalone: true, selector: "rolatech-property-agent-viewing-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Viewings\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) { @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n } }\n</rolatech-tabs>\n<div>\n @if (viewings) { @for (item of viewings; track $index) {\n <rolatech-property-viewing-item [routerLink]=\"['./', item.id]\" [viewing]=\"item\"></rolatech-property-viewing-item>\n } } @else {\n <rolatech-empty></rolatech-empty>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: PropertyViewingItemComponent, selector: "rolatech-property-viewing-item", inputs: ["viewing"] }] });
5485
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentViewingIndex, deps: null, target: i0.ɵɵFactoryTarget.Component });
5486
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentViewingIndex, isStandalone: true, selector: "rolatech-property-agent-viewing-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Viewings\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) { @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n } }\n</rolatech-tabs>\n<div>\n @if (viewings) { @for (item of viewings; track $index) {\n <rolatech-property-viewing-item [routerLink]=\"['./', item.id]\" [viewing]=\"item\"></rolatech-property-viewing-item>\n } } @else {\n <rolatech-empty></rolatech-empty>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: PropertyViewingItemComponent, selector: "rolatech-property-viewing-item", inputs: ["viewing"] }] });
5384
5487
  }
5385
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentViewingIndex, decorators: [{
5488
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentViewingIndex, decorators: [{
5386
5489
  type: Component,
5387
5490
  args: [{ selector: 'rolatech-property-agent-viewing-index', imports: [
5388
5491
  CommonModule,
@@ -5464,12 +5567,12 @@ class PropertyAgentViewingDetail extends BaseComponent {
5464
5567
  },
5465
5568
  });
5466
5569
  }
5467
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentViewingDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5468
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentViewingDetail, isStandalone: true, selector: "rolatech-property-agent-viewing-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n<rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) { @if (item.date === viewing.viewingDate && item.time ===\n viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n } } @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[viewing.employmentStatus]\"></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
5570
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentViewingDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5571
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentViewingDetail, isStandalone: true, selector: "rolatech-property-agent-viewing-detail", usesInheritance: true, ngImport: i0, template: "@if (viewing) {\n<rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) { @if (item.date === viewing.viewingDate && item.time ===\n viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n } } @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[viewing.employmentStatus]\"></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
5469
5572
  }
5470
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentViewingDetail, decorators: [{
5573
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentViewingDetail, decorators: [{
5471
5574
  type: Component,
5472
- args: [{ selector: 'rolatech-property-agent-viewing-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule], template: "@if (viewing) {\n<rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) { @if (item.date === viewing.viewingDate && item.time ===\n viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n } } @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[viewing.employmentStatus]\"></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ property.price.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n" }]
5575
+ args: [{ selector: 'rolatech-property-agent-viewing-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule, PricePipe], template: "@if (viewing) {\n<rolatech-toolbar [title]=\"status[viewing.status]\" large link=\"../\"></rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Proposed times</div>\n <hr class=\"mb-2\" />\n @for (item of viewing.proposedSlots; track $index) {\n <div class=\"flex flex-row items-center gap-3 py-3\">\n <rolatech-rich-label label=\"Date\" [title]=\"item.date\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Time\" [title]=\"item.time\"></rolatech-rich-label>\n @if (viewing.viewingDate && viewing.viewingTime) { @if (item.date === viewing.viewingDate && item.time ===\n viewing.viewingTime) {\n <div class=\"ml-3\"><button mat-flat-button i18n disabled=\"\">Confirmed</button></div>\n } } @if (!viewingTimeConfirmed) {\n <div class=\"ml-3\"><button mat-flat-button (click)=\"confirmViewingTime(item)\" i18n>Confirm</button></div>\n }\n </div>\n }\n </div>\n <!-- Introducing agent -->\n @if (viewing.viewerCategory.toString() === 'AGENT') {\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <!-- <rolatech-rich-label label=\"Move-in date\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"viewing.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"viewing.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[viewing.employmentStatus]\"></rolatech-rich-label>\n <!-- <rolatech-rich-label label=\"Employer\" [title]=\"viewing.startDate\"></rolatech-rich-label> -->\n <rolatech-rich-label label=\"Annual income\" [title]=\"viewing.income\"></rolatech-rich-label>\n </div>\n </div>\n }\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Property details</div>\n <hr class=\"mb-2\" />\n @if (property) {\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"property.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ property.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ property.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ property.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ property.price | price }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n }\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\" i18n>Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-3\">\n <rolatech-rich-label label=\"Name\" [title]=\"agent.name\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Email\" [title]=\"agent.email\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n" }]
5473
5576
  }] });
5474
5577
 
5475
5578
  const propertyAgentViewingRoutes = [
@@ -5530,7 +5633,7 @@ class PropertyAgentOfferDetail extends BaseComponent {
5530
5633
  });
5531
5634
  dialogRef.afterClosed().subscribe((result) => {
5532
5635
  if (result) {
5533
- this.propertyService.referencesAccept(this.id).subscribe({
5636
+ this.propertyService.acceptOffer(this.id).subscribe({
5534
5637
  next: (res) => {
5535
5638
  this.offer.status = 'ACCEPTED';
5536
5639
  this.snackBarService.open('Accepted');
@@ -5551,7 +5654,7 @@ class PropertyAgentOfferDetail extends BaseComponent {
5551
5654
  });
5552
5655
  dialogRef.afterClosed().subscribe((result) => {
5553
5656
  if (result) {
5554
- this.propertyService.referencesReject(this.id, { notes: result.content }).subscribe({
5657
+ this.propertyService.rejectOffer(this.id, { notes: result.content }).subscribe({
5555
5658
  next: (res) => {
5556
5659
  this.offer.status = 'REJECTED';
5557
5660
  this.snackBarService.open('Rejected');
@@ -5574,7 +5677,7 @@ class PropertyAgentOfferDetail extends BaseComponent {
5574
5677
  });
5575
5678
  dialogRef.afterClosed().subscribe((result) => {
5576
5679
  if (result) {
5577
- this.propertyService.acceptOffer(this.id).subscribe({
5680
+ this.propertyService.referencesAccept(this.id).subscribe({
5578
5681
  next: (res) => {
5579
5682
  this.offer.status = 'REFERENCES_PASSED';
5580
5683
  this.snackBarService.open('Passed');
@@ -5595,7 +5698,7 @@ class PropertyAgentOfferDetail extends BaseComponent {
5595
5698
  });
5596
5699
  dialogRef.afterClosed().subscribe((result) => {
5597
5700
  if (result) {
5598
- this.propertyService.rejectOffer(this.id, { reason: result.content }).subscribe({
5701
+ this.propertyService.referencesReject(this.id, { reason: result.content }).subscribe({
5599
5702
  next: (res) => {
5600
5703
  this.offer.status = 'REFERENCES_FAILED';
5601
5704
  this.snackBarService.open('Failed');
@@ -5607,12 +5710,12 @@ class PropertyAgentOfferDetail extends BaseComponent {
5607
5710
  }
5608
5711
  });
5609
5712
  }
5610
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentOfferDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5611
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentOfferDetail, isStandalone: true, selector: "rolatech-property-agent-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n<rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n</rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], deferBlockDependencies: [() => [ThumbnailComponent]] });
5713
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentOfferDetail, deps: null, target: i0.ɵɵFactoryTarget.Component });
5714
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentOfferDetail, isStandalone: true, selector: "rolatech-property-agent-offer-detail", usesInheritance: true, ngImport: i0, template: "@if (offer) {\n<rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'HOLDING_DEPOSIT_PAID') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n</rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount.toFixed(2) | price}}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: RichLabelComponent, selector: "rolatech-rich-label", inputs: ["label", "title"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: PricePipe, name: "price" }], deferBlockDependencies: [() => [ThumbnailComponent]] });
5612
5715
  }
5613
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentOfferDetail, decorators: [{
5716
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentOfferDetail, decorators: [{
5614
5717
  type: Component,
5615
- args: [{ selector: 'rolatech-property-agent-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule], template: "@if (offer) {\n<rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'ACCEPTED') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n</rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">\u00A3{{ offer.item.amount.toFixed(2) }}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n" }]
5718
+ args: [{ selector: 'rolatech-property-agent-offer-detail', imports: [CommonModule, ToolbarComponent, RichLabelComponent, ThumbnailComponent, MatButtonModule, PricePipe], template: "@if (offer) {\n<rolatech-toolbar [title]=\"status[offer.status]\" large link=\"../\">\n @if (offer.status.toString() === 'CREATED') {\n <button mat-flat-button (click)=\"accept()\" i18n>Accept</button>\n <button mat-flat-button (click)=\"counter()\" i18n>Counter offer</button>\n <button mat-button (click)=\"reject()\" i18n>Reject</button>\n }\n <!-- References -->\n @if (offer.status.toString() === 'HOLDING_DEPOSIT_PAID') {\n <button mat-flat-button (click)=\"rfAccept()\" i18n>References passed</button>\n <button mat-flat-button (click)=\"rfReject()\" i18n>References failed</button>\n }\n</rolatech-toolbar>\n<div class=\"px-4\">\n <div>\n <div class=\"text-lg font-bold py-2\">Viewer</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Name\" [title]=\"name\"></rolatech-rich-label>\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Qualification</div>\n <hr class=\"mb-2\" />\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Number of tenants\" [title]=\"offer.numberOfTenants\"></rolatech-rich-label>\n </div>\n <div class=\"flex flex-col md:flex-row gap-1 md:gap-4\">\n <rolatech-rich-label label=\"Employment status\" [title]=\"employmentStatus[offer.employmentStatus]\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Employer\" [title]=\"offer.startDate\"></rolatech-rich-label>\n @if (offer.income) {\n <rolatech-rich-label label=\"Annual income\" [title]=\"offer.income\"></rolatech-rich-label>\n }\n </div>\n </div>\n <div>\n <div class=\"text-lg font-bold py-2\">Property details</div>\n <hr class=\"mb-2\" />\n <div class=\"flex items-center py-2\">\n <div class=\"min-w-24 w-24 object-cover aspect-video rounded-md mr-3\">\n @defer {\n <rolatech-thumbnail [src]=\"offer.item.media[0].url\" size=\"medium\" mode=\"clip\"> </rolatech-thumbnail>\n } @placeholder {\n <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n }\n </div>\n <div class=\"flex w-full justify-between\">\n <div class=\"flex justify-between w-full\">\n <div class=\"flex flex-col\">\n <div>{{ offer.item.title }}</div>\n <div class=\"inline-flex gap-1 mt-2\">\n <div>\n <span class=\"mr-1\">{{ offer.item.bedrooms }}</span>\n <span i18n>Bedrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.bathrooms }}</span>\n <span i18n>Bathrooms</span>\n </div>\n <div>\n <span class=\"mr-1\">{{ offer.item.receptions }}</span>\n <span i18n>Receptions</span>\n </div>\n </div>\n </div>\n <div class=\"text-right\">\n <div class=\"text-sm\">{{ offer.item.amount.toFixed(2) | price}}</div>\n </div>\n </div>\n </div>\n <div class=\"hidden md:flex flex-col px-3\"></div>\n </div>\n </div>\n\n <div>\n <div class=\"text-lg font-bold py-2\">Viewing agent</div>\n <hr class=\"mb-2\" />\n @if (agent) {\n <div>\n <rolatech-rich-label label=\"Move-in date\" [title]=\"offer.startDate\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Tenancy duration\" [title]=\"offer.tenancyDuration\"></rolatech-rich-label>\n <rolatech-rich-label label=\"Phone\" [title]=\"agent.phone\"></rolatech-rich-label>\n </div>\n }\n </div>\n</div>\n}\n" }]
5616
5719
  }] });
5617
5720
 
5618
5721
  class PropertyAgentOfferIndex extends BaseComponent {
@@ -5683,10 +5786,10 @@ class PropertyAgentOfferIndex extends BaseComponent {
5683
5786
  })
5684
5787
  .join(',');
5685
5788
  }
5686
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentOfferIndex, deps: null, target: i0.ɵɵFactoryTarget.Component });
5687
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: PropertyAgentOfferIndex, isStandalone: true, selector: "rolatech-property-agent-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Offers\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) { @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n } }\n</rolatech-tabs>\n<rolatech-list>\n @if (offers) { @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n } } @else {\n <rolatech-empty></rolatech-empty>\n }\n</rolatech-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: ListComponent, selector: "rolatech-list" }] });
5789
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentOfferIndex, deps: null, target: i0.ɵɵFactoryTarget.Component });
5790
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: PropertyAgentOfferIndex, isStandalone: true, selector: "rolatech-property-agent-offer-index", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar title=\"Offers\">\n <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n @for (item of links; track item) { @if (item.status) {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n } @else {\n <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n } }\n</rolatech-tabs>\n<rolatech-list>\n @if (offers) { @for (item of offers; track item) {\n <rolatech-property-offer-item [routerLink]=\"['./', item.id]\" [offer]=\"item\"></rolatech-property-offer-item>\n } } @else {\n <rolatech-empty></rolatech-empty>\n }\n</rolatech-list>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: PropertyOfferItemComponent, selector: "rolatech-property-offer-item", inputs: ["offer"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "component", type: ListComponent, selector: "rolatech-list" }] });
5688
5791
  }
5689
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PropertyAgentOfferIndex, decorators: [{
5792
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: PropertyAgentOfferIndex, decorators: [{
5690
5793
  type: Component,
5691
5794
  args: [{ selector: 'rolatech-property-agent-offer-index', imports: [
5692
5795
  CommonModule,
@@ -5716,4 +5819,4 @@ const propertyAgentOfferRoutes = [
5716
5819
  */
5717
5820
 
5718
5821
  export { ResidencyStatus as A, PropertyApplicantType as B, AdverseCreditStatus as C, BedroomRange as D, EmploymentStatus as E, PriceRange as F, Market as M, PropertyUtil as P, RentFrequency as R, ViewingTime as V, PropertyViewType as a, PropertyViewingItemComponent as b, propertyManageOffersRoutes as c, propertyRoutes as d, propertyManageRoutes as e, featureManageRoutes as f, propertyManageViewingsRoutes as g, propertyAgentViewingRoutes as h, propertyAgentOfferRoutes as i, PropertyActionsComponent as j, PropertyItemComponent as k, lettingManageRoutes as l, PropertyPricingComponent as m, PropertyPriceType as n, PropertyVideoProvider as o, propertyReviewRoutes as p, PropertyStatus as q, PropertyType as r, PropertyInventoryStatus as s, tenantManageRoutes as t, PropertyScope as u, PropertyViewingStatus as v, PropertyViewerCategory as w, PropertyOfferTimelineStatus as x, PropertyOfferType as y, PropertyOfferStatus as z };
5719
- //# sourceMappingURL=rolatech-angular-property-rolatech-angular-property-7gddEPVu.mjs.map
5822
+ //# sourceMappingURL=rolatech-angular-property-rolatech-angular-property-qlBxUdCQ.mjs.map